react-date-countdown-timer
Version:
Date countdown timer component with a cool animaton for react.js
1 lines • 13.9 kB
JavaScript
(()=>{var e={164:(e,t,n)=>{(e.exports=n(252)(!1)).push([e.id,"\n\n@keyframes moveup {\n 0% {opacity: 0; transform: translateY(12px);}\n 100% {opacity: 1; transform: translateY(0px);}\n}\n\n@keyframes movedown {\n 0% {opacity: 1; transform: translateY(0px);}\n 100% {opacity: 0; transform: translateY(-12px);}\n}\n\n.odometerStart{\n display: inline-block;\n animation-name: modeup 0.25s;\n -webkit-animation: moveup 0.25s;\n animation-fill-mode: forwards;\n}\n.odometerEnd{\n display: inline-block;\n animation-name: movedown 0.25s;\n -webkit-animation: movedown 0.25s;\n animation-fill-mode: forwards;\n}\n\n.odometer-block{\n display: inline-block;\n justify-content: center;\n align-items: center;\n}\n",""])},252:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=function(e,t){var n,r=e[1]||"",o=e[3];if(!o)return r;if(t&&"function"==typeof btoa){var i=(n=o,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(n))))+" */"),a=o.sources.map((function(e){return"/*# sourceURL="+o.sourceRoot+e+" */"}));return[r].concat(a).concat([i]).join("\n")}return[r].join("\n")}(t,e);return t[2]?"@media "+t[2]+"{"+n+"}":n})).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var r={},o=0;o<this.length;o++){var i=this[o][0];"number"==typeof i&&(r[i]=!0)}for(o=0;o<e.length;o++){var a=e[o];"number"==typeof a[0]&&r[a[0]]||(n&&!a[2]?a[2]=n:n&&(a[2]="("+a[2]+") and ("+n+")"),t.push(a))}},t}},703:(e,t,n)=>{"use strict";var r=n(414);function o(){}function i(){}i.resetWarningCache=o,e.exports=function(){function e(e,t,n,o,i,a){if(a!==r){var s=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw s.name="Invariant Violation",s}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:i,resetWarningCache:o};return n.PropTypes=n,n}},697:(e,t,n)=>{e.exports=n(703)()},414:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},548:(e,t,n)=>{var r=n(164);"string"==typeof r&&(r=[[e.id,r,""]]);n(723)(r,{hmr:!0,transform:void 0,insertInto:void 0}),r.locals&&(e.exports=r.locals)},723:(e,t,n)=>{var r,o,i={},a=(r=function(){return window&&document&&document.all&&!window.atob},function(){return void 0===o&&(o=r.apply(this,arguments)),o}),s=function(e,t){return t?t.querySelector(e):document.querySelector(e)},c=function(e){var t={};return function(e,n){if("function"==typeof e)return e();if(void 0===t[e]){var r=s.call(this,e,n);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}t[e]=r}return t[e]}}(),f=null,u=0,l=[],d=n(947);function p(e,t){for(var n=0;n<e.length;n++){var r=e[n],o=i[r.id];if(o){o.refs++;for(var a=0;a<o.parts.length;a++)o.parts[a](r.parts[a]);for(;a<r.parts.length;a++)o.parts.push(g(r.parts[a],t))}else{var s=[];for(a=0;a<r.parts.length;a++)s.push(g(r.parts[a],t));i[r.id]={id:r.id,refs:1,parts:s}}}}function m(e,t){for(var n=[],r={},o=0;o<e.length;o++){var i=e[o],a=t.base?i[0]+t.base:i[0],s={css:i[1],media:i[2],sourceMap:i[3]};r[a]?r[a].parts.push(s):n.push(r[a]={id:a,parts:[s]})}return n}function h(e,t){var n=c(e.insertInto);if(!n)throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");var r=l[l.length-1];if("top"===e.insertAt)r?r.nextSibling?n.insertBefore(t,r.nextSibling):n.appendChild(t):n.insertBefore(t,n.firstChild),l.push(t);else if("bottom"===e.insertAt)n.appendChild(t);else{if("object"!=typeof e.insertAt||!e.insertAt.before)throw new Error("[Style Loader]\n\n Invalid value for parameter 'insertAt' ('options.insertAt') found.\n Must be 'top', 'bottom', or Object.\n (https://github.com/webpack-contrib/style-loader#insertat)\n");var o=c(e.insertAt.before,n);n.insertBefore(t,o)}}function y(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e);var t=l.indexOf(e);t>=0&&l.splice(t,1)}function v(e){var t=document.createElement("style");if(void 0===e.attrs.type&&(e.attrs.type="text/css"),void 0===e.attrs.nonce){var r=n.nc;r&&(e.attrs.nonce=r)}return b(t,e.attrs),h(e,t),t}function b(e,t){Object.keys(t).forEach((function(n){e.setAttribute(n,t[n])}))}function g(e,t){var n,r,o,i;if(t.transform&&e.css){if(!(i="function"==typeof t.transform?t.transform(e.css):t.transform.default(e.css)))return function(){};e.css=i}if(t.singleton){var a=u++;n=f||(f=v(t)),r=S.bind(null,n,a,!1),o=S.bind(null,n,a,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(n=function(e){var t=document.createElement("link");return void 0===e.attrs.type&&(e.attrs.type="text/css"),e.attrs.rel="stylesheet",b(t,e.attrs),h(e,t),t}(t),r=k.bind(null,n,t),o=function(){y(n),n.href&&URL.revokeObjectURL(n.href)}):(n=v(t),r=x.bind(null,n),o=function(){y(n)});return r(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;r(e=t)}else o()}}e.exports=function(e,t){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");(t=t||{}).attrs="object"==typeof t.attrs?t.attrs:{},t.singleton||"boolean"==typeof t.singleton||(t.singleton=a()),t.insertInto||(t.insertInto="head"),t.insertAt||(t.insertAt="bottom");var n=m(e,t);return p(n,t),function(e){for(var r=[],o=0;o<n.length;o++){var a=n[o];(s=i[a.id]).refs--,r.push(s)}for(e&&p(m(e,t),t),o=0;o<r.length;o++){var s;if(0===(s=r[o]).refs){for(var c=0;c<s.parts.length;c++)s.parts[c]();delete i[s.id]}}}};var w,O=(w=[],function(e,t){return w[e]=t,w.filter(Boolean).join("\n")});function S(e,t,n,r){var o=n?"":r.css;if(e.styleSheet)e.styleSheet.cssText=O(t,o);else{var i=document.createTextNode(o),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(i,a[t]):e.appendChild(i)}}function x(e,t){var n=t.css,r=t.media;if(r&&e.setAttribute("media",r),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}function k(e,t,n){var r=n.css,o=n.sourceMap,i=void 0===t.convertToAbsoluteUrls&&o;(t.convertToAbsoluteUrls||i)&&(r=d(r)),o&&(r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */");var a=new Blob([r],{type:"text/css"}),s=e.href;e.href=URL.createObjectURL(a),s&&URL.revokeObjectURL(s)}},947:e=>{e.exports=function(e){var t="undefined"!=typeof window&&window.location;if(!t)throw new Error("fixUrls requires window.location");if(!e||"string"!=typeof e)return e;var n=t.protocol+"//"+t.host,r=n+t.pathname.replace(/\/[^\/]*$/,"/");return e.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi,(function(e,t){var o,i=t.trim().replace(/^"(.*)"$/,(function(e,t){return t})).replace(/^'(.*)'$/,(function(e,t){return t}));return/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(i)?e:(o=0===i.indexOf("//")?i:0===i.indexOf("/")?n+i:r+i.replace(/^\.\//,""),"url("+JSON.stringify(o)+")")}))}}},t={};function n(r){var o=t[r];if(void 0!==o)return o.exports;var i=t[r]={id:r,exports:{}};return e[r](i,i.exports,n),i.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};(()=>{"use strict";n.r(r),n.d(r,{default:()=>m});const e=require("react");var t=n.n(e),o=n(697),i=n.n(o);function a(e){return a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},a(e)}function s(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function c(e,t){return c=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},c(e,t)}function f(e,t){if(t&&("object"===a(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return u(e)}function u(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function l(e){return l=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},l(e)}n(548);var d=function(e){var t=e.dateTo,n=e.dateFrom,r=e.numberOfFigures,o=e.mostSignificantFigure,i=n?new Date(n):new Date,a=new Date(t)-i,s=["year","month","day","hour","min","sec"],c=Math.floor(a/31104e6),f=Math.floor(a/2592e6%12),u=Math.floor(a/864e5%30),l=Math.floor(a/36e5%24),d=Math.floor(a/6e4%60),p=Math.floor(a/1e3%60);return"none"===o?0===c&&(s=s.slice(1),0===f&&(s=s.slice(1),0===u&&(s=s.slice(1),0===l&&(s=s.slice(1),0===d&&(s=s.slice(1)))))):s=s.slice(s.indexOf(o)),-1===(s=s.slice(0,r)).indexOf("year")&&(f+=12*c,c=0),-1===s.indexOf("month")&&(u+=30*f,f=0),-1===s.indexOf("day")&&(l+=24*u,u=0),-1===s.indexOf("hour")&&(d+=60*l,l=0),-1===s.indexOf("min")&&(p+=60*d,d=0),{speed:250,diff:a,significance:s,year:c,month:f,day:u,hour:l,min:d,sec:p}},p=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&c(e,t)}(p,e);var n,r,o,i,a=(o=p,i=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=l(o);if(i){var n=l(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return f(this,e)});function p(e){var t;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,p),t=a.call(this,e);var n=d(e);return t.state=n,n.diff<=0&&e.callback(),t.animateAndChangeIfNeeded=t.animateAndChangeIfNeeded.bind(u(t)),t.tick=t.tick.bind(u(t)),t.dissect=t.dissect.bind(u(t)),t.figuresMax={year:Number.MAX_SAFE_INTEGER,month:12,day:30,hour:24,min:60,sec:60},t}return n=p,(r=[{key:"componentDidMount",value:function(){var e=this,t=d(this.props),n=t.diff;this.setState(t,(function(){if(n>0){var t=setInterval(e.tick,1e3);e.setState({tickId:t})}}))}},{key:"componentWillUnmount",value:function(){var e=this.state.tickId;clearInterval(e)}},{key:"animateAndChangeIfNeeded",value:function(e,t){var n=this,r=this.state,o=this.refs,i=this.props.noAnimate,a=r.speed;-1!==r.significance.indexOf(e)&&function(){for(var s=o[e].children,c=function(o){if(o===s.length-1)setTimeout((function(){i||s[o].classList.toggle("odometerEnd"),setTimeout((function(){if(i||s[o].classList.toggle("odometerEnd"),i||s[o].classList.toggle("odometerStart"),"none"!==t){var c={};c[t]=n.figuresMax[t]-1,c[e]=r[e]-1,n.setState(c)}i||setTimeout((function(){return s[o].classList.toggle("odometerStart")}),a)}),a)}),1e3-a);else{for(var c=!0,f=o+1;f<s.length;f+=1)if("0"!==s[f].innerHTML){c=!1;break}c&&setTimeout((function(){i||s[o].classList.toggle("odometerEnd"),setTimeout((function(){if(i||s[o].classList.toggle("odometerEnd"),i||s[o].classList.toggle("odometerStart"),"none"!==t){var c={};c[t]=n.figuresMax[t]-1,c[e]=r[e]-1,n.setState(c)}i||setTimeout((function(){return s[o].classList.toggle("odometerStart")}),a)}),a)}),1e3-a)}},f=0;f<s.length;f+=1)c(f)}()}},{key:"tick",value:function(){var e=this.state,t=e.sec,n=e.min,r=e.hour,o=e.day,i=e.month,a=e.year,s=e.tickId,c=this.props.callback,f=t-1;this.setState({sec:f}),this.animateAndChangeIfNeeded("sec","none"),0===f&&(this.animateAndChangeIfNeeded("min","sec"),0===n&&(this.animateAndChangeIfNeeded("hour","min"),0===r&&(this.animateAndChangeIfNeeded("day","hour"),0===o&&(this.animateAndChangeIfNeeded("month","day"),0===i&&this.animateAndChangeIfNeeded("year","month"))))),0===t&&0===n&&0===r&&0===o&&0===i&&0===a&&(this.setState({diff:-1}),clearInterval(s),c())}},{key:"dissect",value:function(e){var n=Number(e).toString();return 1===n.length&&(n="0".concat(n)),n.split("").map((function(e,n){return t().createElement("span",{key:n,className:n},e)}))}},{key:"render",value:function(){var e=this,n=this.state,r=n.significance,o=n.diff,i=this.props,a=i.locales,s=i.locales_plural,c=["year","month","day","hour","min","sec"];return o<0?t().createElement("span",{className:"odometer-block"},c.map((function(e,n){return-1!==r.indexOf(e)?t().createElement("span",{key:n},"00"," ",a[n]," "):null}))):t().createElement("span",{className:"odometer-block"},c.map((function(o,i){return-1!==r.indexOf(o)?t().createElement("span",{key:i},t().createElement("span",{ref:o,className:"".concat(o)},e.dissect(n[o],o))," ",n[o]<=1&&a[i],n[o]>1&&s[i]," "):null})))}}])&&s(n.prototype,r),p}(e.Component);p.propTypes={locales:i().array,locales_plural:i().array,dateTo:i().string.isRequired,dateFrom:i().string,callback:i().func,mostSignificantFigure:i().string,numberOfFigures:i().number,noAnimate:i().bool},p.defaultProps={locales:["year","month","day","hour","minute","second"],locales_plural:["years","months","days","hours","minutes","seconds"],dateTo:(new Date).toString(),dateFrom:(new Date).toString(),callback:function(){return null},mostSignificantFigure:"none",numberOfFigures:6,noAnimate:!1};const m=p})(),module.exports=r})();