framework7/components/grid/grid.js

Full featured mobile HTML framework for building iOS & Android apps

(function framework7ComponentLoader(e,t){void 0===t&&(t=!0);var r=e.$,a=e.utils,i=(e.getDevice,e.getSupport,e.Class,e.Modal,e.ConstructorMethods,e.ModalMethods,a.extend);function s(e,t){var r=t.css("min-"+e);return"auto"===r||"none"===r?r=0:r.indexOf("px")>=0?r=parseFloat(r):r.indexOf("%")>=0&&(r=t.parent()[0]["height"===e?"offsetHeight":"offsetWidth"]*parseFloat(r)/100),r}function o(e,t){var r=t.css("max-"+e);return"auto"===r||"none"===r?r=null:r.indexOf("px")>=0?r=parseFloat(r):r.indexOf("%")>=0&&(r=t.parent()[0]["height"===e?"offsetHeight":"offsetWidth"]*parseFloat(r)/100),r}var n={init:function(){var e,t,a,i,n,l,g,d,h,c,p,f,u,v,z,m,x,b=this;r(document).on(b.touchEvents.start,".col > .resize-handler, .row > .resize-handler",(function(s){e||t||(n=r(s.target).closest(".resize-handler"),a="touchstart"===s.type?s.targetTouches[0].pageX:s.pageX,i="touchstart"===s.type?s.targetTouches[0].pageY:s.pageY,e=!0,l=void 0,g=void 0,x=void 0)})),b.on("touchmove",(function(r){if(e){var w=1===n.parent(".row").length,y=w?"height":"width",C=w?"offsetHeight":"offsetWidth";t||(!(l=n.parent(w?".row":".col")).length||l.hasClass("resizable")&&!l.hasClass("resizable-fixed")||(l=l.prevAll(".resizable:not(.resizable-fixed)").eq(0)),!(g=l.next(w?".row":".col")).length||g.hasClass("resizable")&&!g.hasClass("resizable-fixed")||(g=g.nextAll(".resizable:not(.resizable-fixed)").eq(0)),l.length&&(d=l[0][C],h=s(y,l),c=o(y,l),v=l.parent()[0][C],z=l.parent().children(w?".row":'[class*="col-"], .col').length,m=parseFloat(l.css(w?"--f7-grid-row-gap":"--f7-grid-gap"))),g.length&&(p=g[0][C],f=s(y,g),u=o(y,g),l.length||(v=g.parent()[0][C],z=g.parent().children(w?".row":'[class*="col-"], .col').length,m=parseFloat(g.css(w?"--f7-grid-row-gap":"--f7-grid-gap"))))),t=!0;var M="touchmove"===r.type?r.targetTouches[0].pageX:r.pageX,F="touchmove"===r.type?r.targetTouches[0].pageY:r.pageY;if(void 0!==x||w||(x=!!(x||Math.abs(F-i)>Math.abs(M-a))),x)return e=!1,void(t=!1);var O=l.hasClass("resizable-absolute")||g.hasClass("resizable-absolute"),R=!w||w&&!O;if(R&&!g.length||!l.length)return e=!1,void(t=!1);r.preventDefault();var T,X,Y=w?F-i:M-a;if(l.length&&((T=d+Y)<h&&(Y=(T=h)-d),c&&T>c&&(Y=(T=c)-d)),g.length&&R&&((X=p-Y)<f&&(T=d+(Y=p-(X=f))),u&&X>u&&(T=d+(Y=p-(X=u)))),O)return l[0].style[y]=T+"px",R&&(g[0].style[y]=X+"px"),l.trigger("grid:resize"),g.trigger("grid:resize"),b.emit("gridResize",l[0]),void b.emit("gridResize",g[0]);var H=(z-1)*m/z,W=w?z-1+" * var(--f7-grid-row-gap) / "+z:"(var(--f7-cols-per-row) - 1) * var(--f7-grid-gap) / var(--f7-cols-per-row)",q=T+H,A=X+H;l[0].style[y]="calc("+q/v*100+"% - "+W+")",g[0].style[y]="calc("+A/v*100+"% - "+W+")",l.trigger("grid:resize"),g.trigger("grid:resize"),b.emit("gridResize",l[0]),b.emit("gridResize",g[0])}})),b.on("touchend",(function(){e&&(t||(e=!1),e=!1,t=!1)}))}},l={name:"grid",create:function(){i(this,{grid:{init:n.init.bind(this)}})},on:{init:function(){this.grid.init()}}};if(t){if(e.prototype.modules&&e.prototype.modules[l.name])return;e.use(l),e.instance&&(e.instance.useModuleParams(l,e.instance.params),e.instance.useModule(l))}return l}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))