daily pastebin goal
44%
SHARE
TWEET

JavaScript simplyCountdown.js

a guest Jan 5th, 2019 12 in 131 days
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*!
  2.  * Project : simply-countdown
  3.  * File : simplyCountdown
  4.  * Date : 27/06/2015
  5.  * License : MIT
  6.  * Version : 1.3.2
  7.  * Author : Vincent Loy <vincent.loy1@gmail.com>
  8.  * Contributors :
  9.  *  - Justin Beasley <JustinB@harvest.org>
  10.  *  - Nathan Smith <NathanS@harvest.org>
  11.  */
  12. /*global window, document*/
  13. (function (exports) {
  14.     'use strict';
  15.  
  16.     var // functions
  17.         extend,
  18.         createElements,
  19.         createCountdownElt,
  20.         simplyCountdown;
  21.  
  22.     /**
  23.      * Function that merge user parameters with defaults one.
  24.      * @param out
  25.      * @returns {*|{}}
  26.      */
  27.     extend = function (out) {
  28.         var i,
  29.             obj,
  30.             key;
  31.         out = out || {};
  32.  
  33.         for (i = 1; i < arguments.length; i += 1) {
  34.             obj = arguments[i];
  35.  
  36.             if (obj) {
  37.                 for (key in obj) {
  38.                     if (obj.hasOwnProperty(key)) {
  39.                         if (typeof obj[key] === 'object') {
  40.                             extend(out[key], obj[key]);
  41.                         } else {
  42.                             out[key] = obj[key];
  43.                         }
  44.                     }
  45.                 }
  46.             }
  47.         }
  48.  
  49.         return out;
  50.     };
  51.  
  52.     /**
  53.      * Function that create a countdown section
  54.      * @param countdown
  55.      * @param parameters
  56.      * @param typeClass
  57.      * @returns {{full: (*|Element), amount: (*|Element), word: (*|Element)}}
  58.      */
  59.     createCountdownElt = function (countdown, parameters, typeClass) {
  60.         var innerSectionTag,
  61.             sectionTag,
  62.             amountTag,
  63.             wordTag;
  64.  
  65.         sectionTag = document.createElement('div');
  66.         amountTag = document.createElement('span');
  67.         wordTag = document.createElement('span');
  68.         innerSectionTag = document.createElement('div');
  69.  
  70.         innerSectionTag.appendChild(amountTag);
  71.         innerSectionTag.appendChild(wordTag);
  72.         sectionTag.appendChild(innerSectionTag);
  73.  
  74.         sectionTag.classList.add(parameters.sectionClass);
  75.         sectionTag.classList.add(typeClass);
  76.         amountTag.classList.add(parameters.amountClass);
  77.         wordTag.classList.add(parameters.wordClass);
  78.  
  79.         countdown.appendChild(sectionTag);
  80.  
  81.         return {
  82.             full: sectionTag,
  83.             amount: amountTag,
  84.             word: wordTag
  85.         };
  86.     };
  87.  
  88.     /**
  89.      * Function that create full countdown DOM elements calling createCountdownElt
  90.      * @param parameters
  91.      * @param countdown
  92.      * @returns {{days: (*|Element), hours: (*|Element), minutes: (*|Element), seconds: (*|Element)}}
  93.      */
  94.     createElements = function (parameters, countdown) {
  95.         var spanTag;
  96.  
  97.         if (!parameters.inline) {
  98.             return {
  99.                 days: createCountdownElt(countdown, parameters, 'simply-days-section'),
  100.                 hours: createCountdownElt(countdown, parameters, 'simply-hours-section'),
  101.                 minutes: createCountdownElt(countdown, parameters, 'simply-minutes-section'),
  102.                 seconds: createCountdownElt(countdown, parameters, 'simply-seconds-section')
  103.             };
  104.         }
  105.  
  106.         spanTag = document.createElement('span');
  107.         spanTag.classList.add(parameters.inlineClass);
  108.         return spanTag;
  109.     };
  110.  
  111.     /**
  112.      * simplyCountdown, create and display the coundtown.
  113.      * @param elt
  114.      * @param args (parameters)
  115.      */
  116.     simplyCountdown = function (elt, args) {
  117.         var parameters = extend({
  118.                 year: 2019,
  119.                 month: 6,
  120.                 day: 1,
  121.                 hours: 14,
  122.                 minutes: 0,
  123.                 seconds: 0,
  124.                 words: {
  125.                     days: 'Tage',
  126.                     hours: 'Stunde',
  127.                     minutes: 'Minute',
  128.                     seconds: 'Sekunde',
  129.                     pluralLetter: 'n'
  130.                 },
  131.                 plural: true,
  132.                 inline: false,
  133.                 enableUtc: true,
  134.                 onEnd: function () {
  135.                     return;
  136.                 },
  137.                 refresh: 1000,
  138.                 inlineClass: 'simply-countdown-inline',
  139.                 sectionClass: 'simply-section',
  140.                 amountClass: 'simply-amount',
  141.                 wordClass: 'simply-word',
  142.                 zeroPad: false
  143.             }, args),
  144.             interval,
  145.             targetDate,
  146.             targetTmpDate,
  147.             now,
  148.             nowUtc,
  149.             secondsLeft,
  150.             days,
  151.             hours,
  152.             minutes,
  153.             seconds,
  154.             cd = document.querySelectorAll(elt);
  155.  
  156.         targetTmpDate = new Date(
  157.             parameters.year,
  158.             parameters.month - 1,
  159.             parameters.day,
  160.             parameters.hours,
  161.             parameters.minutes,
  162.             parameters.seconds
  163.         );
  164.  
  165.         if (parameters.enableUtc) {
  166.             targetDate = new Date(
  167.                 targetTmpDate.getUTCFullYear(),
  168.                 targetTmpDate.getUTCMonth(),
  169.                 targetTmpDate.getUTCDate(),
  170.                 targetTmpDate.getUTCHours(),
  171.                 targetTmpDate.getUTCMinutes(),
  172.                 targetTmpDate.getUTCSeconds()
  173.             );
  174.         } else {
  175.             targetDate = targetTmpDate;
  176.         }
  177.  
  178.         Array.prototype.forEach.call(cd, function (countdown) {
  179.             var fullCountDown = createElements(parameters, countdown),
  180.                 refresh;
  181.  
  182.             refresh = function () {
  183.                 var dayWord,
  184.                     hourWord,
  185.                     minuteWord,
  186.                     secondWord;
  187.  
  188.                 now = new Date();
  189.                 if (parameters.enableUtc) {
  190.                     nowUtc = new Date(now.getFullYear(), now.getMonth(), now.getDate(),
  191.                         now.getHours(), now.getMinutes(), now.getSeconds());
  192.                     secondsLeft = (targetDate - nowUtc.getTime()) / 1000;
  193.  
  194.                 } else {
  195.                     secondsLeft = (targetDate - now.getTime()) / 1000;
  196.                 }
  197.  
  198.                 if (secondsLeft > 0) {
  199.                     days = parseInt(secondsLeft / 86400, 10);
  200.                     secondsLeft = secondsLeft % 86400;
  201.  
  202.                     hours = parseInt(secondsLeft / 3600, 10);
  203.                     secondsLeft = secondsLeft % 3600;
  204.  
  205.                     minutes = parseInt(secondsLeft / 60, 10);
  206.                     seconds = parseInt(secondsLeft % 60, 10);
  207.                 } else {
  208.                     days = 0;
  209.                     hours = 0;
  210.                     minutes = 0;
  211.                     seconds = 0;
  212.                     window.clearInterval(interval);
  213.                     parameters.onEnd();
  214.                 }
  215.  
  216.                 if (parameters.plural) {
  217.                     dayWord = days > 1
  218.                         ? parameters.words.days + parameters.words.pluralLetter
  219.                         : parameters.words.days;
  220.  
  221.                     hourWord = hours > 1
  222.                         ? parameters.words.hours + parameters.words.pluralLetter
  223.                         : parameters.words.hours;
  224.  
  225.                     minuteWord = minutes > 1
  226.                         ? parameters.words.minutes + parameters.words.pluralLetter
  227.                         : parameters.words.minutes;
  228.  
  229.                     secondWord = seconds > 1
  230.                         ? parameters.words.seconds + parameters.words.pluralLetter
  231.                         : parameters.words.seconds;
  232.  
  233.                 } else {
  234.                     dayWord = parameters.words.days;
  235.                     hourWord = parameters.words.hours;
  236.                     minuteWord = parameters.words.minutes;
  237.                     secondWord = parameters.words.seconds;
  238.                 }
  239.  
  240.                 /* display an inline countdown into a span tag */
  241.                 if (parameters.inline) {
  242.                     countdown.innerHTML =
  243.                         days + ' ' + dayWord + ', ' +
  244.                         hours + ' ' + hourWord + ', ' +
  245.                         minutes + ' ' + minuteWord + ', ' +
  246.                         seconds + ' ' + secondWord + '.';
  247.  
  248.                 } else {
  249.                     fullCountDown.days.amount.textContent = (parameters.zeroPad && days.toString().length < 2 ? '0' : '') + days;
  250.                     fullCountDown.days.word.textContent = dayWord;
  251.  
  252.                     fullCountDown.hours.amount.textContent = (parameters.zeroPad && hours.toString().length < 2 ? '0' : '') + hours;
  253.                     fullCountDown.hours.word.textContent = hourWord;
  254.  
  255.                     fullCountDown.minutes.amount.textContent = (parameters.zeroPad && minutes.toString().length < 2 ? '0' : '') + minutes;
  256.                     fullCountDown.minutes.word.textContent = minuteWord;
  257.  
  258.                     fullCountDown.seconds.amount.textContent = (parameters.zeroPad && seconds.toString().length < 2 ? '0' : '') + seconds;
  259.                     fullCountDown.seconds.word.textContent = secondWord;
  260.                 }
  261.             };
  262.  
  263.             // Refresh immediately to prevent a Flash of Unstyled Content
  264.             refresh();
  265.             interval = window.setInterval(refresh, parameters.refresh);
  266.         });
  267.     };
  268.  
  269.     exports.simplyCountdown = simplyCountdown;
  270. }(window));
  271.  
  272. /*global $, jQuery, simplyCountdown*/
  273. if (window.jQuery) {
  274.     (function ($, simplyCountdown) {
  275.         'use strict';
  276.  
  277.         function simplyCountdownify(el, options) {
  278.             simplyCountdown(el, options);
  279.         }
  280.  
  281.         $.fn.simplyCountdown = function (options) {
  282.             return simplyCountdownify(this.selector, options);
  283.         };
  284.     }(jQuery, simplyCountdown));
  285. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top