28 lines
No EOL
17 KiB
JavaScript
28 lines
No EOL
17 KiB
JavaScript
/*
|
|
* tabellajs - v0.4.1
|
|
* 2016-11-09
|
|
*
|
|
* https://github.com/iliketomatoes/tabellajs
|
|
*/
|
|
|
|
/*
|
|
* Copyright (C) 2014-2016 Interpromotion <info@interpromotion.com>
|
|
* Copyright (C) 2014-2016 Giancarlo Soverini <giancarlosoverini@gmail.com>
|
|
*
|
|
* This file is part of Tabellajs.
|
|
*
|
|
* Tabellajs is free software: you can redistribute it and/or modify
|
|
* it under the terms of the GNU Affero General Public License as
|
|
* published by the Free Software Foundation, either version 3 of the
|
|
* License, or (at your option) any later version.
|
|
*
|
|
* Tabellajs is distributed in the hope that it will be useful,
|
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
* GNU Affero General Public License for more details.
|
|
*
|
|
* You should have received a copy of the GNU Affero General Public License
|
|
* along with this program. If not, see <http://www.gnu.org/licenses/>
|
|
*/
|
|
|
|
!function(a,b,c){"use strict";"function"==typeof define&&define.amd?define(a):b.Tabella=a()}(function(){"use strict";function a(a){return new RegExp("(^|\\s+)"+a+"(\\s+|$)")}function b(a,b){var c=q(a,b)?s:r;c(a,b)}function c(a,b){for(var c in b)b.hasOwnProperty(c)&&(a[c]=b[c]);return a}function d(){for(var a="transform WebkitTransform MozTransform OTransform msTransform".split(" "),b=0;b<a.length;b++)if(void 0!==document.createElement("div").style[a[b]])return a[b];return!1}function e(a,b,c,d){var e=document.createElement(a);return e.className=b,d&&(e.innerHTML=d),c.appendChild(e),e}function f(a){return Array.prototype.slice.call(a,0)}function g(a,b,c){for(var d=b.split(" "),e=d.length;e--;)a.addEventListener(d[e],c,!1)}function h(a,b){var c=b||null,d=Array.prototype.slice.call(arguments,2);return a.apply(c,d)}function i(a,b){return Math.round(Math.abs(a)/b*1e3)}function j(a,b){var c=a.getBoundingClientRect(),d=b||0;return c.top<=0&&c.bottom>=d}function k(a){var b=a.getBoundingClientRect();return b.top>=0&&b.top<=(window.innerHeight||document.documentElement.clientHeight)&&b.bottom>=0&&b.bottom<=(window.innerHeight||document.documentElement.clientHeight)}function l(a){this.value=a,this.message="Tabella.js error: ",this.toString=function(){return this.message+this.value}}function m(a){return v.hasOwnProperty(a)?v[a]:v.easeInOutSine}function n(a,b){return o(a[0],a[1],a[2],a[3],b)}function o(a,b,c,d,e){var f=function(b){var d=1-b;return 3*d*d*b*a+3*d*b*b*c+b*b*b},g=function(a){var c=1-a;return 3*c*c*a*b+3*c*a*a*d+a*a*a},h=function(b){var d=1-b;return 3*(2*(b-1)*b+d*d)*a+3*(-b*b*b+2*d*b)*c};return function(a){var b,c,d,i,j,k,l=a;for(d=l,k=0;k<8;k++){if(i=f(d)-l,Math.abs(i)<e)return g(d);if(j=h(d),Math.abs(j)<1e-6)break;d-=i/j}if(b=0,c=1,d=l,d<b)return g(b);if(d>c)return g(c);for(;b<c;){if(i=f(d),Math.abs(i-l)<e)return g(d);l>i?b=d:c=d,d=.5*(c-b)+b}return g(d)}}function p(a,b){var d=this,e={tableHeader:null,rows:null,cellBreakpoints:{default:[0,1],small:[360,2],medium:[640,3],large:[820,4],xlarge:[1080,5]},descBreakpoints:{default:[0,0],medium:[460,160],large:[900,200]},from:"from",to:"to",currency:"€",easing:"easeInOutSine",duration:600,reboundSpeed:300,edgeThreshold:150,swipeThreshold:60,swipeSingleTick:!0,onRefreshSize:!1,headerRowDevider:"-",emptyCell:"not set",fixedHeader:!0,fixedHeaderBottomThreshold:80,fixedHeaderTop:"0"};try{if("undefined"==typeof a)throw new l("You did not pass a valid target element to the constructor");if("undefined"==typeof b)throw new l("You did not pass any options to the constructor");if(d.options=c(e,b),!d.options.tableHeader||!d.options.rows)throw new l("tableHeader or rows are undefined or null")}catch(a){return console.error(a.toString()),!1}if(d.tableHeaderRow=null,d.slidingRows=null,d.arrows=null,d.pointer=0,d.currentBreakpoint={},d.currentCellWidth=0,d.currentWindowWidth=window.innerWidth,d.el=a,d.tableHeaderRow=E.setUpTableHeader(d.el,d.options),d.tableHeaderRow)try{if(!E.setUpRows(d.el,d.options))throw new l("Number of rows is zero");d.arrows=E.setUpArrows(d.tableHeaderRow),d.slidingRows=f(d.el.querySelectorAll(".t-sliding-row"));var g=function(a,b,c){var e;return function(){var f=arguments,g=function(){e=null,c||a.apply(d,f)},h=c&&!e;clearTimeout(e),e=setTimeout(g,b),h&&a.apply(d,f)}},h=function(){d.currentBreakpoint=d.getBreakpoint(),d.currentCellWidth=d.getCellWidth(d.currentBreakpoint),d.refreshSize()};"function"==typeof define&&define.amd?h():window.addEventListener("load",g(h,50)),window.addEventListener("resize",g(d.refreshSize,250)),d.attachEvents()}catch(a){return console.error(a.toString()),!1}}var q,r,s;"classList"in document.documentElement?(q=function(a,b){return a.classList.contains(b)},r=function(a,b){a.classList.add(b)},s=function(a,b){a.classList.remove(b)}):(q=function(b,c){return a(c).test(b.className)},r=function(a,b){q(a,b)||(a.className=a.className+" "+b)},s=function(b,c){b.className=b.className.replace(a(c)," ")});var t={hasClass:q,addClass:r,removeClass:s,toggleClass:b,has:q,add:r,remove:s,toggle:b},u=d(),v={easeInSine:[.47,0,.745,.715],easeOutSine:[.39,.575,.565,1],easeInOutSine:[.445,.05,.55,.95],easeInQuad:[.55,.085,.68,.53],easeOutQuad:[.25,.46,.45,.94],easeInOutQuad:[.455,.03,.515,.955],easeInCubic:[.55,.055,.675,.19],easeOutCubic:[.215,.61,.355,1],easeInOutCubic:[.645,.045,.355,1],easeInQuart:[.895,.03,.685,.22],easeOutQuart:[.165,.84,.44,1],easeInOutQuart:[.77,0,.175,1],easeInQuint:[.755,.05,.855,.06],easeOutQuint:[.23,1,.32,1],easeInOutQuint:[.86,0,.07,1],easeInExpo:[.95,.05,.795,.035],easeOutExpo:[.19,1,.22,1],easeInOutExpo:[1,0,0,1],easeInCirc:[.6,.04,.98,.335],easeOutCirc:[.075,.82,.165,1],easeInOutCirc:[.785,.135,.15,.86],easeInBack:[.6,-.28,.735,.045],easeOutBack:[.175,.885,.32,1.275],easeInOutBack:[.68,-.55,.265,1.55]},w=0;window.requestAnimationFrame||(window.requestAnimationFrame=function(a){var b=(new Date).getTime(),c=Math.max(0,16-(b-w)),d=window.setTimeout(function(){a(b+c)},c);return w=b+c,d}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(a){clearTimeout(a)});var x=window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.oRequestAnimationFrame||window.requestAnimationFrame,y=window.mozCancelAnimationFrame||window.cancelAnimationFrame,z={easeing:"easeInOutSine",animated:!1,dragged:null,getAnimationCurve:function(a,b){var c=1e3/60/a/4;return n(b,c)},actualAnimation:function(a,b,c,d,e,f){function g(b){null===k&&(k=b);var l=b-k,m=l/c;m>=1&&(m=1);var n=d(m).toFixed(2);i.step(a,n,e,j),1===m?(y(h),k=null,f&&(i.animated=!1)):x(g)}var h,i=this,j=e-b,k=null;h=x(g)},step:function(a,b,c,d){this.offset(a,parseInt(c)+parseInt((d-c)*b))},offset:function(a,b){if("undefined"==typeof b){if(u){var c=a.style[u]?a.style[u].match(/-?\d+/g)[0]:0;return c}return a.style.left}u?a.style[u]="translate("+b+"px, 0px)":a.style.left=b+"px"},animate:function(a,b,c,d){var e=this,f=d||e.easeing,g=m(f);if(e.animated)return!1;e.animated=!0;var h=e.getAnimationCurve(c,g);return a.forEach(function(a,d,f){d+1===f.length?e.actualAnimation(a,b,c,h,e.offset(a),!0):e.actualAnimation(a,b,c,h,e.offset(a))}),!0},resetRows:function(a){var b=this;return a.forEach(function(a){b.offset(a,0)}),b.animated=!1,!0},drag:function(a,b){var c=this;return!c.animated&&void a.forEach(function(a){c.dragged=x(function(){c.offset(a,b)})})},stopDragging:function(){var a=this;y(a.dragged)}},A=function(a){var b=a.toLowerCase(),c="MS"+a;return window.navigator.msPointerEnabled?c:b},B={start:A("PointerDown")+" touchstart mousedown",end:A("PointerUp")+" touchend mouseup",move:A("PointerMove")+" touchmove mousemove"},C=function(a){return a.targetTouches?a.targetTouches[0]:a},D={points:{cachedX:null,cachedY:null,currX:null,currY:null},touchStarted:!1,touchEvents:B,getPointerEvent:C,onTouchStart:function(a){var b=this,c=b.getPointerEvent(a);return b.points.cachedX=b.points.currX=c.pageX,b.points.cachedY=b.points.currY=c.pageY,b.touchStarted=!0,b.points},onTouchEnd:function(){var a=this,b=a.points.cachedY-a.points.currY,c=a.points.cachedX-a.points.currX;return a.touchStarted=!1,{deltaX:c,deltaY:b}},onTouchMove:function(a){var b=this;if(b.touchStarted===!1)return!1;var c=b.getPointerEvent(a);return b.points.currX=c.pageX,b.points.currY=c.pageY,!(Math.abs(b.points.cachedY-b.points.currY)>=Math.abs(b.points.cachedX-b.points.currX)/2)&&b.points}},E={setUpTableHeader:function(a,b){var c,d,f,g=b.tableHeader,h=document.createDocumentFragment();try{if(!(g instanceof Array&&g.length))throw new l("tableHeader is not an Array");var i=e("div","t-fixed-header",h);c=e("div","t-row t-first-row",i);var j=e("div","t-row-content-wrapper",c),k=e("div","t-row-content",j),m='<div class="t-element">';m+='<div class="t-cell-desc-l">',m+=b.from,"undefined"!=typeof g[0][1]&&(m+='<span class="t-header-devider">'+b.headerRowDevider+"</span>",m+=b.to),m+="</div>",m+="</div>",d=e("div","t-row-desc",k,m);for(var n=e("div","t-row-values",k),o=e("div","t-sliding-row",n),p=0;p<g.length;p++){var q=document.createElement("div");q.className="t-row-cell";var r='<div class="t-cell-desc-s">';r+=b.from,"undefined"!=typeof g[p][1]&&(r+='<span class="t-header-devider">'+b.headerRowDevider+"</span>",r+=b.to),r+="</div>",r+='<div class="t-cell-value t-bold">',r+="undefined"!=typeof g[p][0]?g[p][0]:"not set","undefined"!=typeof g[p][1]&&(r+='<span class="t-header-devider">'+b.headerRowDevider+"</span>",r+=g[p][1]),r+="</div>",f=e("div","t-element",q,r),o.appendChild(q)}a.appendChild(h)}catch(a){c=!1,console.error(a.toString())}finally{return c}},setUpRows:function(a,b){var c,d,f,g=b.tableHeader,h=b.rows,i=h.length,j=document.createDocumentFragment();if(i>0){for(var k=0;k<i;k++){var l=e("div","t-row",j);if(h[k].rowHeader&&(c=e("section","t-row-header",l,h[k].rowHeader)),h[k].rowVal)for(var m=0;m<h[k].rowVal.length;m++){var n=e("div","t-row-content-wrapper",l),o=e("div","t-row-content",n),p='<div class="t-element">';p+='<div class="t-cell-desc-l">',p+="undefined"!=typeof h[k].rowDesc&&h[k].rowDesc[m]?h[k].rowDesc[m]:"",p+="</div>",p+="</div>";var q="t-row-desc";m>=1&&(q+=" t-cell-border-top"),d=e("div",q,o,p);for(var r=e("div","t-row-values",o),s=e("div","t-sliding-row",r),t=0;t<g.length;t++){var u=document.createElement("div"),v="t-row-cell";m>=1&&(v+=" t-cell-border-top"),u.className=v;var w="";"undefined"!=typeof h[k].rowDesc&&h[k].rowDesc[m]&&(w+='<div class="t-cell-desc-s">',w+=h[k].rowDesc[m],w+="</div>"),w+='<div class="t-cell-value">',"undefined"!=typeof h[k].rowVal[m][t]?(w+=h[k].rowVal[m][t],isNaN(h[k].rowVal[m][t])||(w+=" "+b.currency)):w+=b.emptyCell,w+="</div>",f=e("div","t-element",u,w),s.appendChild(u)}}}return a.appendChild(j),i}return!1},setUpArrows:function(a){var b="http://www.w3.org/2000/svg",c=document.createElementNS(b,"svg");c.setAttribute("viewBox","0 0 100 100");var d=document.createElementNS(b,"path");d.setAttribute("d","M 50,0 L 60,10 L 20,50 L 60,90 L 50,100 L 0,50 Z"),d.setAttribute("transform","translate(15,0)"),d.setAttribute("class","t-svg-arrow"),c.appendChild(d);var f=document.createElementNS(b,"svg");f.setAttribute("viewBox","0 0 100 100");var g=document.createElementNS(b,"path");g.setAttribute("d","M 50,0 L 60,10 L 20,50 L 60,90 L 50,100 L 0,50 Z"),g.setAttribute("class","t-svg-arrow"),g.setAttribute("transform","translate(85,100) rotate(180)"),f.appendChild(g);var h=e("div","t-arr-right t-hide",a),i=e("div","t-arr-left t-hide",a);return h.appendChild(f),i.appendChild(c),{arrowRight:h,arrowLeft:i}}};return p.prototype.attachEvents=function(){var a=this;z.easing=a.options.easing,a.arrows.arrowLeft.addEventListener("click",function(){a.move("left")}),a.arrows.arrowRight.addEventListener("click",function(){a.move("right")});var b,c,d,e,f,h,i=a.options.tableHeader.length,l=a.tableHeaderRow.querySelector(".t-sliding-row"),m=!0,n=0;a.slidingRows.forEach(function(j){g(j,D.touchEvents.start,function(b){d=z.offset(l),c=D.onTouchStart(b),f=parseInt(a.currentCellWidth),n=0,h=a.pointer}),g(j,D.touchEvents.move,function(g){if(b=D.onTouchMove(g),b&&m){if(e=b.currX-c.cachedX,z.drag(a.slidingRows,e+parseInt(d)),n=Math.abs(Math.floor(e/a.options.swipeThreshold)),a.options.swipeSingleTick&&n>=1&&(n=1),e>=0)0===a.pointer?parseInt(z.offset(l))>=a.options.edgeThreshold&&(m=!1):a.pointer=h-n;else if(a.pointer===i-a.currentBreakpoint.cellBreakpoint[1]||i<a.currentBreakpoint.cellBreakpoint[1]){var j=Math.abs(parseInt(z.offset(l)));j>=a.options.edgeThreshold+f*a.pointer&&(m=!1)}else a.pointer=h+n;c=b}}),g(j,D.touchEvents.end,function(){D.onTouchEnd(),d=0;var b=parseInt(z.offset(l));a.resetDragging(parseInt(b+a.pointer*f)),m=!0,a.updateArrows()})}),a.options.fixedHeader&&g(window,"scroll",function(){if(k(a.el)&&"relative"===a.tableHeaderRow.getAttribute("data-position"))return!1;if(k(a.el))return a.unsetFixedHeader(),!1;if(j(a.el,a.options.fixedHeaderBottomThreshold))a.setFixedHeader();else{if("relative"===a.tableHeaderRow.getAttribute("data-position"))return!1;a.unsetFixedHeader()}})},p.prototype.resetDragging=function(a){var b=this;z.stopDragging(),z.animate(b.slidingRows,a,i(a,b.options.reboundSpeed),"easeOutBack")},p.prototype.setFixedHeader=function(){var a=this,b=a.tableHeaderRow.parentElement;b.style.width=b.clientWidth+"px",b.style.height=b.clientHeight+"px",a.tableHeaderRow.style.top=a.options.fixedHeaderTop,a.tableHeaderRow.style.marginTop=0,a.tableHeaderRow.style.width=b.clientWidth+"px",a.tableHeaderRow.style.height=b.clientHeight+"px",t.add(a.tableHeaderRow,"t-shadow"),a.tableHeaderRow.style.position="fixed",a.tableHeaderRow.setAttribute("data-position","fixed")},p.prototype.unsetFixedHeader=function(){var a=this;a.tableHeaderRow.style.position="relative",a.tableHeaderRow.setAttribute("data-position","relative"),t.remove(a.tableHeaderRow,"t-shadow");var b=a.tableHeaderRow.parentElement;b.style.width="auto",b.style.height="auto",a.tableHeaderRow.style.top="",a.tableHeaderRow.style.marginTop="",a.tableHeaderRow.style.width="auto",a.tableHeaderRow.style.height="auto"},p.prototype.refreshSize=function(){var a=this,b=a.currentBreakpoint,c=a.currentBreakpoint=a.getBreakpoint(),d=a.currentWindowWidth;a.currentWindowWidth=window.innerWidth;var e=a.currentCellWidth,g=a.currentCellWidth=a.getCellWidth(c),i=c.descBreakpoint[1],j=a.options.tableHeader.length;a.refreshArrowPosition(i),a.options.fixedHeader&&d!==a.currentWindowWidth&&a.unsetFixedHeader();var k=f(a.el.querySelectorAll(".t-row"));k.forEach(function(a){var b=f(a.querySelectorAll(".t-row-content"));c.descBreakpoint[1]>0?b.forEach(function(a){a.style.width=i+j*g+"px";var b=a.querySelector(".t-row-desc");b.style.width=i+"px",t.remove(b,"t-hide"),f(a.querySelectorAll(".t-row-cell")).forEach(function(a){a.style.width=g+"px"}),f(a.querySelectorAll(".t-cell-desc-s")).forEach(function(a){t.add(a,"t-hide")})}):b.forEach(function(a){a.style.width=j*g+"px",t.add(a.querySelector(".t-row-desc"),"t-hide"),f(a.querySelectorAll(".t-row-cell")).forEach(function(a){a.style.width=g+"px"}),f(a.querySelectorAll(".t-cell-desc-s")).forEach(function(a){t.remove(a,"t-hide")})})}),a.pointer>0&&(b.cellBreakpoint[0]!=c.cellBreakpoint[0]||b.descBreakpoint[1]!=c.descBreakpoint[1]?a.move():e!=g&&a.move(parseInt(g-e)*parseInt(a.pointer))),"function"==typeof a.options.onRefreshSize&&h(a.options.onRefreshSize,a),a.arrowsCentering()},p.prototype.getCellWidth=function(a){var b,c=this,d=c.options.tableHeader.length,e=a.cellBreakpoint,f=a.descBreakpoint;return b=e[1]>d?(c.el.clientWidth-f[1])/d:(c.el.clientWidth-f[1])/e[1],Math.round(b)},p.prototype.getBreakpoint=function(){var a=this,b=0,c=a.el.clientWidth,d=a.options.cellBreakpoints,e=a.options.descBreakpoints,f=[0,1],g=[0,0];for(var h in d){var i=d[h][0];"number"==typeof i&&i>0&&i<=c&&Math.abs(c-i)<Math.abs(c-b)&&(b=i,f=d[h])}b=0;for(var j in e){var k=e[j][0];"number"==typeof k&&k>0&&k<=c&&Math.abs(c-k)<Math.abs(c-b)&&(b=k,g=e[j])}return{cellBreakpoint:f,descBreakpoint:g}},p.prototype.refreshArrowPosition=function(a){var b=this,c=a||b.currentBreakpoint.descBreakpoint[1];b.arrows.arrowLeft.style.left=c+"px",b.updateArrows()},p.prototype.updateArrows=function(){var a=this,b=a.currentBreakpoint||a.getBreakpoint(),c=a.options.tableHeader.length;c>b.cellBreakpoint[1]?0===a.pointer?(t.add(a.arrows.arrowLeft,"t-hide"),t.remove(a.arrows.arrowRight,"t-hide")):a.pointer===c-b.cellBreakpoint[1]?(t.remove(a.arrows.arrowLeft,"t-hide"),t.add(a.arrows.arrowRight,"t-hide")):(t.remove(a.arrows.arrowLeft,"t-hide"),t.remove(a.arrows.arrowRight,"t-hide")):(t.add(a.arrows.arrowLeft,"t-hide"),t.add(a.arrows.arrowRight,"t-hide"))},p.prototype.move=function(a){var b=this,c=b.getCellWidth(b.currentBreakpoint);"right"===a?z.animate(b.slidingRows,c,b.options.duration)&&b.pointer++:"left"===a?z.animate(b.slidingRows,-c,b.options.duration)&&b.pointer--:"number"==typeof a?z.animate(b.slidingRows,a,i(a,b.options.reboundSpeed))&&(b.pointer=a):(z.resetRows(b.slidingRows),b.pointer=0),b.updateArrows()},p.prototype.setSingleTick=function(a){this.options.swipeSingleTick=!!a},p.prototype.getCurrentBreakPoint=function(){return this.currentBreakpoint},p.prototype.arrowsCentering=function(){var a=this,b=a.tableHeaderRow.offsetHeight,c=a.arrows.arrowRight.offsetHeight;if(c&&b>c){var d=parseInt((b-c)/2-1);a.arrows.arrowRight.style.marginTop=d+"px",a.arrows.arrowLeft.style.marginTop=d+"px"}},p},window,document); |