scroller.min.js

!function(t){function i(t){this.fragment=null,this.div=null,this.innerDdiv=null,this.direction=t.direction||null,this.interval=t.interval||0,this.amount=t.amount||0,this.width=t.width||0,this.height=t.amount||0,this.textAlign=t.textAlign||"center",this.upperBound=t.upperBound||9,this.forceFallback=t.forceFallback||!1,this.mode=t._mode||h.MODE.COUNTUP,this.stepSize=Math.ceil(1*(this.amount+1)/10)||2,this.stepInterval=0,this.step=1,this.startNum=1,this.endNum=1,this.nextNum=1,this.firstChild=null,this.lastChild=null,this.count=0}function e(t){i.call(this,t)}function n(t){i.call(this,t),this.scrolledAmount=0,this.scrollID=null}var s={extend:function(t,i){return i.prototype=Object.create(t.prototype),i.prototype.constructor=t,i},clone:function(t){if(null==t||"object"!=typeof t)return t;var i=t.constructor();for(var e in t)t.hasOwnProperty(e)&&(i[e]=t[e]);return i}};i.prototype=function(){return{init:function(){switch(this.fragment=document.createDocumentFragment(),this.div=document.createElement("div"),this.div.className="scroller",this.div.setAttribute("style","position:relative;overflow:hidden;width:"+this.width+"px;text-align:"+this.textAlign+";height:"+this.height+"px;line-height:"+this.height+"px;"),this.innerDiv=document.createElement("div"),this.innerDiv.className="scroller-inner-pane",this.innerDiv.setAttribute("style","position:absolute;width:"+this.width+"px;text-align:"+this.textAlign+";top:0;"),this.firstChild=document.createElement("span"),this.firstChild.className="scroller-span",this.firstChild.setAttribute("style","position:absolute;height:"+this.height+"px;line-height:"+this.height+"px;left:0px;top:0px;width:"+this.width+"px;"),this.innerDiv.appendChild(this.firstChild),this.lastChild=document.createElement("span"),this.lastChild.className="scroller-span",this.lastChild.setAttribute("style","position:absolute;height:"+this.height+"px;line-height:"+this.height+"px;left:0px;width:"+this.width+"px;"),this.direction){case h.DIRECTION.UP:this.innerDiv.appendChild(this.lastChild),this.lastChild.style.top=this.height+"px";break;case h.DIRECTION.DOWN:this.innerDiv.insertBefore(this.lastChild,this.firstChild),this.lastChild.style.top=-this.height+"px"}return this.div.appendChild(this.innerDiv),this.fragment.appendChild(this.div),this.innerInit(),this},innerInit:function(){},start:function(t,i){t=parseInt(t),i=parseInt(i),this.startNum=t,this.endNum=i,this.nextNum=this.startNum,this.step=this.mode==h.MODE.COUNTDOWN?t!=i?this.endNum>this.startNum?this.startNum+(this.upperBound+1)-this.endNum:this.startNum-this.endNum:Number.MAX_VALUE:t!=i?this.endNum<this.startNum?this.endNum+(this.upperBound+1)-this.startNum:this.endNum-this.startNum:Number.MAX_VALUE,this.firstChild.innerHTML=this.startNum,this.lastChild.innerHTML=this.nextNum,this.innerStart(),this.iterate()},innerStart:function(){},iterate:function(){(this.nextNum!=this.endNum||this.lastChild.innerHTML!=this.endNum)&&(this.nextNum==this.endNum&&(this.nextNum=parseInt(this.lastChild.innerHTML)),this.nextNum=this.mode==h.MODE.COUNTDOWN?0==this.nextNum?this.upperBound:this.nextNum-1:this.nextNum==this.upperBound?0:this.nextNum+1,this.innerIterate())},innerIterate:function(){},scroll:function(){},stop:function(){},revalidate:function(){this.nextNum=parseInt(this.nextNum),this.endNum=parseInt(this.endNum),this.nextNum!=this.endNum&&(this.step=this.mode==h.MODE.COUNTDOWN?this.nextNum!=this.endNum?this.endNum>this.nextNum?this.nextNum+(this.upperBound+1)-this.endNum:this.nextNum-this.endNum:Number.MAX_VALUE:this.nextNum!=this.endNum?this.endNum<this.nextNum?this.endNum+(this.upperBound+1)-this.nextNum:this.endNum-this.nextNum:Number.MAX_VALUE,this.innerRevalidate())},innerRevalidate:function(){},resetPosition:function(){this.innerDiv.style.top="0px",this.innerDiv.offsetHeight},getPanel:function(){return this.fragment},setEndNum:function(t){this.endNum=t},setMode:function(t){this.mode=t}}}(),s.extend(i,e),e.prototype._props={},e.prototype._cssPropMap={"transition-timing-function":"TransitionTimingFunction","transition-duration":"TransitionDuration",transform:"Transform"},e.prototype._set=function(t,i,n){if(this._props[i])t.style.setProperty(this._props[i],n,"important");else{var s="-webkit- -moz- -ms- -o-".split(" ");e.prototype._props[i]=i;for(var r=0,h=s.length;h>r;++r){var o=s[r].replace(/-/g,"");o="moz"==o?"Moz":o;var a=o+e.prototype._cssPropMap[i];if(void 0!==t.style[a]){e.prototype._props[i]=s[r]+i;break}}this._set(t,i,n)}},e.prototype._addEventListener=function(t,i){var e={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",MSTransition:"msTransitionEnd",OTransition:"oTransitionEnd",transition:"transitionend"};for(var n in e)if(void 0!==t.style[n]){t.addEventListener(e[n],function(){var e=t.style.transitionDuration||t.style.webkitTransitionDuration;"0ms"!=e&&i.stop()},!1);break}},e.prototype.innerInit=function(){this._addEventListener(this.innerDiv,this),this._set(this.innerDiv,"transition-timing-function","linear")},e.prototype.innerStart=function(){this.stepInterval=Math.max(1,Math.floor(1*this.interval/this.step)),this.direction==h.DIRECTION.UP&&(this.amount=-this.amount)},e.prototype.innerIterate=function(){this.firstChild.innerHTML=this.lastChild.innerHTML,this.lastChild.innerHTML=this.nextNum,this.lastChild.offsetHeight;var t=this;setTimeout(function(){t.scroll()},0)},e.prototype.scroll=function(){var t=1+Math.random()/1e5,i="translateY("+this.amount+"px) scaleX("+t+")",e=this.stepInterval+"ms";this._set(this.innerDiv,"transition-duration",e),this._set(this.innerDiv,"transform",i)},e.prototype.stop=function(){var t=1+Math.random()/1e5,i="translateY(0px) scaleX("+t+")",e="0ms";this.firstChild.innerHTML=this.lastChild.innerHTML,this.lastChild.offsetHeight,this.nextNum=parseInt(this.lastChild.innerHTML),this._set(this.innerDiv,"transition-duration",e),this._set(this.innerDiv,"transform",i);var n=this;setTimeout(function(){n.iterate()},1)},e.prototype.innerRevalidate=function(){this.stepInterval=Math.max(1,Math.floor(1*this.interval/this.step))},s.extend(i,n),n.prototype.innerStart=function(){this.stepInterval=Math.ceil(this.interval*this.stepSize/(this.amount*this.step))},n.prototype.innerIterate=function(){this.firstChild.innerHTML=this.lastChild.innerHTML,this.lastChild.innerHTML=this.nextNum,this.lastChild.offsetHeight,this.scroll()},n.prototype.scroll=function(){var t=this.innerDiv.style,i=parseInt(t.top);switch(this.direction){case h.DIRECTION.UP:t.top=i-this.stepSize+"px";break;case h.DIRECTION.DOWN:t.top=i+this.stepSize+"px"}if(this.scrolledAmount+=this.stepSize,this.scrolledAmount<this.amount){this.stepSize=Math.min(this.stepSize,this.amount-this.scrolledAmount);var e=this;this.scrollID=setTimeout(function(){e.scroll()},this.stepInterval)}else null!=this.scrollID&&clearTimeout(this.scrollID),this.stop(),this.iterate()},n.prototype.stop=function(){this.scrolledAmount=0,this.firstChild.innerHTML=this.lastChild.innerHTML,this.resetPosition()},n.prototype.innerRevalidate=function(){this.stepInterval=Math.ceil(this.interval*this.stepSize/(this.amount*this.step))};var r=function(){function t(t){var i=!1,e="Webkit Moz ms O Khtml".split(" "),n=document.createElement("div"),s=null;if(t=t.toLowerCase(),void 0!==n.style[t]&&(i=!0),i===!1){s=t.charAt(0).toUpperCase()+t.substr(1);for(var r=0;r<e.length;r++)if(void 0!==n.style[e[r]+s]){i=!0;break}}return i}var i=t("transform");return{createScrollPanel:function(t){return i&&!t.forceFallback?new e(t):new n(t)}}}(),h=function(){function t(t){this.scrollPanelArray=[],this.props=t,this.scrollPane=document.createElement("div"),this.table=null,this.beginNum=0,this.endNum=0,this.css=null,this.width=this.props.width,this.init(0,0)}function i(i){t.call(this,i)}var e=0;t.prototype={init:function(t,i){this.clear(),this.oldCountArray=[],this.newCountArray=[],this.scrollPanelArray=[],this.beginNum=t,this.endNum=i,t+="",i+="";for(var e=t.length,n=i.length,s=0;e>s;++s)this.oldCountArray.push(t.charAt(s));for(var s=0;n>s;++s)this.newCountArray.push(i.charAt(s));var r=Math.abs(e-n),o=Math.max(e,n);if(e>n)for(var s=1;r>=s;++s)this.newCountArray.unshift("0");else if(n>e)for(var s=1;r>=s;++s)this.oldCountArray.unshift("0");var a=document.createDocumentFragment();this.table=document.createElement("table"),this.table.className="scroller-table",this.table.setAttribute("style","margin:auto;"),null!=this.css&&this.setStyle(this.css);var l=Math.floor(this.width/o);this.props._mode=this.beginNum>this.endNum?h.MODE.COUNTDOWN:h.MODE.COUNTUP,this.props.width=l,this.innerInit(o),a.appendChild(this.table),this.scrollPane.appendChild(a);for(var s=0,p=this.oldCountArray.length;p>s;++s)this.scrollPanelArray[s].start(this.oldCountArray[s],this.oldCountArray[s])},innerInit:function(t){var i=0;this.props.separatorType!==h.SEPARATOR.NONE&&(i=this.props.separatorType+1-t%this.props.separatorType);for(var e=document.createElement("tr"),n=0;t>n;++n){var s=document.createElement("td"),o=r.createScrollPanel(this.props).init();if(this.scrollPanelArray.push(o),s.appendChild(o.getPanel()),e.appendChild(s),this.props.separatorType!=h.SEPARATOR.NONE&&(n+i)%this.props.separatorType===0&&t>n+1){var s=document.createElement("td"),a=document.createElement("div");a.className="scroller-separator-pane";var l=document.createElement("span");l.className="scroller-span",l.innerHTML=this.props.separator,a.setAttribute("style","height:"+(this.props.amount+10)+"px;line-height:"+this.props.amount+"px;left:0px;top:0px;vertical-align:middle;"),a.appendChild(l),s.appendChild(a),e.appendChild(s)}}this.table.appendChild(e)},appendTo:function(t){return t.appendChild(this.scrollPane),this},getScrollPanels:function(){return this.scrollPanelArray},setStyle:function(t){if(this.css=t,"string"==typeof t){var i=t.split(";");for(var e in i){var n=i[e].split(":"),s=n[0],r=2==n.length?n[1]:"";this.isUnmodifiableStyle(s)||(this.table.style[s]=r)}}else if("object"==typeof t)for(var h in t)this.table.style[h]=t[h]},isUnmodifiableStyle:function(t){var i=["position","overflow"];for(var e in i)if(t.toLowerCase()===i[e])return!0;return!1},start:function(t){var i=0;i="number"==typeof t?parseInt(t)+"":t.trim().replace(/,/g,""),this.init(t,t)},scrollTo:function(t){var i=(t+"").trim().replace(/,:/g,"");if(i.length!=this.newCountArray.length)this.init(this.endNum,i);else{this.beginNum=this.endNum,this.oldCountArray=this.newCountArray,this.endNum=i,this.newCountArray=[],this.props._mode=this.beginNum>this.endNum?h.MODE.COUNTDOWN:h.MODE.COUNTUP;for(var e=0,n=i.length;n>e;++e)this.newCountArray.push(i.charAt(e))}this.refresh()},scrollFromTo:function(t,i){var t=(t+"").trim().replace(/,:/g,""),i=(i+"").trim().replace(/,:/g,"");this.start(t),this.scrollTo(i)},refresh:function(){var t=this;setTimeout(function(){for(var i=0,e=t.oldCountArray.length;e>i;++i)t.props._mode&&t.scrollPanelArray[i].setMode(t.props._mode),t.scrollPanelArray[i].setEndNum(t.newCountArray[i]),t.scrollPanelArray[i].revalidate(),t.scrollPanelArray[i].iterate()},1)},clear:function(){for(;this.scrollPane.firstChild;)this.scrollPane.removeChild(this.scrollPane.firstChild)}},s.extend(t,i),i.prototype.innerInit=function(t){for(var i=this.props.separatorType+1-t%this.props.separatorType,e=document.createElement("tr"),n=0;t>n;++n){var h=document.createElement("td"),o=s.clone(this.props);n%2==0&&(o.upperBound=0==n?2:5);var a=r.createScrollPanel(o).init();if(this.scrollPanelArray.push(a),h.appendChild(a.getPanel()),e.appendChild(h),(n+i)%o.separatorType===0&&t>n+1){var h=document.createElement("td"),l=document.createElement("div"),p=document.createElement("span");p.className="scroller-span",p.innerHTML=o.separator,l.setAttribute("style","height:"+(o.amount+10)+"px;line-height:"+o.amount+"px;left:0px;top:0px;vertical-align:middle;"),l.appendChild(p),h.appendChild(l),e.appendChild(h)}}this.table.appendChild(e)};var n=function(){return{createScrollerImpl:function(e){var n=null;switch(e.separatorType){case h.SEPARATOR.TIME:n=new i(e);break;case h.SEPARATOR.THOUSAND:default:n=new t(e)}return n}}}();return{DIRECTION:{UP:1,DOWN:2},SEPARATOR:{NONE:0,TIME:2,THOUSAND:3},MODE:{COUNTUP:0,COUNTDOWN:1},getNewInstance:function(t){return e++,t=t||{},t.direction=t.direction||h.DIRECTION.UP,t.interval=t.interval||5e3,t.width=t.width||400,t.amount=t.amount||250,t.separatorType=t.separatorType||h.SEPARATOR.NONE,t.separator=t.separator||"",t.textAlign=t.textAlign||"center",t.forceFallback=t.forceFallback||!1,n.createScrollerImpl(t)},getScrollerSize:function(){return e}}}();t.Scroller=h}(window);