vue-waterfall.min.js 12 KB

123456
  1. /*!
  2. * vue-waterfall v1.0.6
  3. * (c) 2017 MopTym <moptym@163.com>
  4. * https://github.com/MopTym/vue-waterfall
  5. */
  6. !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.Waterfall=e():t.Waterfall=e()}(this,function(){return function(t){function e(i){if(n[i])return n[i].exports;var r=n[i]={exports:{},id:i,loaded:!1};return t[i].call(r.exports,r,r.exports,e),r.loaded=!0,r.exports}var n={};return e.m=t,e.c=n,e.p="",e(0)}([function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}var r=n(1),o=i(r),a=n(10),u=i(a);t.exports={Waterfall:o["default"],WaterfallSlot:u["default"],waterfall:o["default"],waterfallSlot:u["default"]}},function(t,e,n){n(2);var i=n(7)(n(8),n(9),null,null);t.exports=i.exports},function(t,e,n){var i=n(3);"string"==typeof i&&(i=[[t.id,i,""]]),i.locals&&(t.exports=i.locals);n(5)("046d321a",i,!0)},function(t,e,n){e=t.exports=n(4)(),e.push([t.id,".vue-waterfall{position:relative}",""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var n=this[e];n[2]?t.push("@media "+n[2]+"{"+n[1]+"}"):t.push(n[1])}return t.join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var i={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(i[o]=!0)}for(r=0;r<e.length;r++){var a=e[r];"number"==typeof a[0]&&i[a[0]]||(n&&!a[2]?a[2]=n:n&&(a[2]="("+a[2]+") and ("+n+")"),t.push(a))}},t}},function(t,e,n){function i(t){for(var e=0;e<t.length;e++){var n=t[e],i=f[n.id];if(i){i.refs++;for(var r=0;r<i.parts.length;r++)i.parts[r](n.parts[r]);for(;r<n.parts.length;r++)i.parts.push(o(n.parts[r]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{for(var a=[],r=0;r<n.parts.length;r++)a.push(o(n.parts[r]));f[n.id]={id:n.id,refs:1,parts:a}}}}function r(){var t=document.createElement("style");return t.type="text/css",c.appendChild(t),t}function o(t){var e,n,i=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(i){if(p)return v;i.parentNode.removeChild(i)}if(g){var o=h++;i=d||(d=r()),e=a.bind(null,i,o,!1),n=a.bind(null,i,o,!0)}else i=r(),e=u.bind(null,i),n=function(){i.parentNode.removeChild(i)};return e(t),function(i){if(i){if(i.css===t.css&&i.media===t.media&&i.sourceMap===t.sourceMap)return;e(t=i)}else n()}}function a(t,e,n,i){var r=n?"":i.css;if(t.styleSheet)t.styleSheet.cssText=m(e,r);else{var o=document.createTextNode(r),a=t.childNodes;a[e]&&t.removeChild(a[e]),a.length?t.insertBefore(o,a[e]):t.appendChild(o)}}function u(t,e){var n=e.css,i=e.media,r=e.sourceMap;if(i&&t.setAttribute("media",i),r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}var s="undefined"!=typeof document,l=n(6),f={},c=s&&(document.head||document.getElementsByTagName("head")[0]),d=null,h=0,p=!1,v=function(){},g="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,n){p=n;var r=l(t,e);return i(r),function(e){for(var n=[],o=0;o<r.length;o++){var a=r[o],u=f[a.id];u.refs--,n.push(u)}e?(r=l(t,e),i(r)):r=[];for(var o=0;o<n.length;o++){var u=n[o];if(0===u.refs){for(var s=0;s<u.parts.length;s++)u.parts[s]();delete f[u.id]}}}};var m=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var n=[],i={},r=0;r<e.length;r++){var o=e[r],a=o[0],u=o[1],s=o[2],l=o[3],f={id:t+":"+r,css:u,media:s,sourceMap:l};i[a]?i[a].parts.push(f):n.push(i[a]={id:a,parts:[f]})}return n}},function(t,e){t.exports=function(t,e,n,i){var r,o=t=t||{},a=typeof t["default"];("object"===a||"function"===a)&&(r=t,o=t["default"]);var u="function"==typeof o?o.options:o;if(e&&(u.render=e.render,u.staticRenderFns=e.staticRenderFns),n&&(u._scopeId=n),i){var s=Object.create(u.computed||null);Object.keys(i).forEach(function(t){var e=i[t];s[t]=function(){return e}}),u.computed=s}return{esModule:r,exports:o,options:u}}},function(t,e){"use strict";function n(t){t!==!1&&this.autoResize?G(window,"resize",this.reflowHandler,!1):M(window,"resize",this.reflowHandler,!1)}function i(t){var e=t.target,n=e[L];n&&x(e,n)}function r(){clearTimeout(this.token),this.token=setTimeout(this.reflow,this.interval)}function o(){var t=this;if(this.$el){var e=this.$el.clientWidth,n=this.$children.map(function(t){return t.getMeta()});n.sort(function(t,e){return t.order-e.order}),this.virtualRects=n.map(function(){return{}}),u(this,n,this.virtualRects),setTimeout(function(){a(t.$el,e)&&u(t,n,t.virtualRects),t.style.overflow="hidden",c(t.virtualRects,n),t.$emit("reflowed",t)},0)}}function a(t,e){return e!==t.clientWidth}function u(t,e,n){var i=s(t),r="h"===t.line?$:R;r.calculate(t,i,e,n)}function s(t){var e=t.maxLineGap?+t.maxLineGap:t.lineGap;return{align:~["left","right","center"].indexOf(t.align)?t.align:"left",line:~["v","h"].indexOf(t.line)?t.line:"v",lineGap:+t.lineGap,minLineGap:t.minLineGap?+t.minLineGap:t.lineGap,maxLineGap:e,singleMaxWidth:Math.max(t.singleMaxWidth||0,e),fixedHeight:!!t.fixedHeight,grow:t.grow&&t.grow.map(function(t){return+t})}}function l(t,e,n){switch(n){case"right":return t-e;case"center":return(t-e)/2;default:return 0}}function f(t){return t.reduce(function(t,e){return t+e})}function c(t,e){var n=e.filter(function(t){return t.moveClass}),i=d(n);h(t,e);var r=d(n);n.forEach(function(t,e){t.node[L]=t.moveClass,p(t.node,i[e],r[e])}),document.body.clientWidth,n.forEach(function(t){w(t.node,t.moveClass),v(t.node)})}function d(t){return t.map(function(t){return t.vm.rect})}function h(t,e){t.forEach(function(t,n){var i=e[n].node.style;e[n].vm.rect=t;for(var r in t)i[r]=t[r]+"px"})}function p(t,e,n){var i=e.left-n.left,r=e.top-n.top,o=e.width/n.width,a=e.height/n.height;t.style.transform=t.style.WebkitTransform="translate("+i+"px,"+r+"px) scale("+o+","+a+")",t.style.transitionDuration="0s"}function v(t){t.style.transform=t.style.WebkitTransform="",t.style.transitionDuration=""}function g(){var t=void 0===window.ontransitionend&&void 0!==window.onwebkittransitionend,e=t?"webkitTransitionEnd":"transitionend";return e}function m(t,e){for(var n="function"==typeof t?function(){return t()}:function(){return t},i=[],r=0;e>r;r++)i[r]=n();return i}function w(t,e){if(!y(t,e)){var n=b(t,"class").trim(),i=(n+" "+e).trim();b(t,"class",i)}}function x(t,e){var n=new RegExp("\\s*\\b"+e+"\\b\\s*","g"),i=b(t,"class").replace(n," ").trim();b(t,"class",i)}function y(t,e){return new RegExp("\\b"+e+"\\b").test(b(t,"class"))}function b(t,e,n){return"undefined"==typeof n?t.getAttribute(e)||"":void t.setAttribute(e,n)}function G(t,e,n){var i=arguments.length<=3||void 0===arguments[3]?!1:arguments[3];t.addEventListener(e,n,i)}function M(t,e,n){var i=arguments.length<=3||void 0===arguments[3]?!1:arguments[3];t.removeEventListener(e,n,i)}Object.defineProperty(e,"__esModule",{value:!0});var L="_wfMoveClass";e["default"]={props:{autoResize:{"default":!0},interval:{"default":200,validator:function(t){return t>=0}},align:{"default":"left",validator:function(t){return~["left","right","center"].indexOf(t)}},line:{"default":"v",validator:function(t){return~["v","h"].indexOf(t)}},lineGap:{required:!0,validator:function(t){return t>=0}},minLineGap:{validator:function(t){return t>=0}},maxLineGap:{validator:function(t){return t>=0}},singleMaxWidth:{validator:function(t){return t>=0}},fixedHeight:{"default":!1},grow:{validator:function(t){return t instanceof Array}},watch:{"default":function(){return{}}}},data:function(){return{style:{height:"",overflow:""},token:null}},methods:{reflowHandler:r,autoResizeHandler:n,reflow:o},created:function(){var t=this;this.virtualRects=[],this.$on("reflow",function(){t.reflowHandler()}),this.$watch(function(){return t.align,t.line,t.lineGap,t.minLineGap,t.maxLineGap,t.singleMaxWidth,t.fixedHeight,t.watch},this.reflowHandler),this.$watch("grow",this.reflowHandler)},mounted:function(){this.$watch("autoResize",this.autoResizeHandler),G(this.$el,g(),i,!0),this.autoResizeHandler(this.autoResize)},beforeDestroy:function(){this.autoResizeHandler(!1),M(this.$el,g(),i,!0)}};var R=function(){function t(t,i,r,o){var a=t.$el.clientWidth,u=i.grow,s=u?n(a,u):e(a,i),l=m(0,s.count);r.forEach(function(t,e){var n=l.reduce(function(t,e,n){return e<l[t]?n:t},0),r=s.width[n%s.count],a=o[e];a.top=l[n],a.left=s.left+(n?f(s.width.slice(0,n)):0),a.width=r,a.height=t.height*(i.fixedHeight?1:r/t.width),l[n]=l[n]+a.height}),t.style.height=Math.max.apply(Math,l)+"px"}function e(t,e){var n=t/e.lineGap,i=void 0;if(e.singleMaxWidth>=t)n=1,i=Math.max(t,e.minLineGap);else{var r=e.maxLineGap*~~n,o=e.minLineGap*~~(n+1),a=r>=t,u=t>=o;a&&u?(n=Math.round(n),i=t/n):a?(n=~~n,i=t/n):u?(n=~~(n+1),i=t/n):(n=~~n,i=e.maxLineGap),1===n&&(i=Math.min(t,e.singleMaxWidth),i=Math.max(i,e.minLineGap))}return{width:m(i,n),count:n,left:l(t,i*n,e.align)}}function n(t,e){var n=f(e);return{width:e.map(function(e){return t*e/n}),count:e.length,left:0}}return{calculate:t}}(),$=function(){function t(t,n,i,r){for(var o=t.$el.clientWidth,a=i.length,u=0,s=0;a>s;){for(var l,f,c=e(o,n,i,s),d=0,h=0;d<c.count;d++)l=i[s+d],f=r[s+d],f.top=u,f.left=c.left+h,f.width=l.width*c.height/l.height,f.height=c.height,h+=f.width;s+=c.count,u+=c.height}t.style.height=u+"px"}function e(t,e,o,a){var u=n(t,e.lineGap,o,a),s=Math.max(u-1,1),f=i(t,e,o,a,u),c=i(t,e,o,a,s),d=r(c,f,t),h=d.height,p=d.width;return 1===d.count&&(p=Math.min(e.singleMaxWidth,t),h=o[a].height*p/o[a].width),{left:l(t,p,e.align),count:d.count,height:h}}function n(t,e,n,i){for(var r=0,o=i,a=0;o<n.length&&t>=a;o++)a+=n[o].width*e/n[o].height,r++;return r}function i(t,e,n,i,r){for(var o=0,a=r-1;a>=0;a--){var u=n[i+a];o+=u.width*e.lineGap/u.height}var s=e.lineGap*t/o,l=s<=e.maxLineGap&&s>=e.minLineGap;if(l)return{cost:Math.abs(e.lineGap-s),count:r,width:t,height:s};var f=o>t?e.minLineGap:e.maxLineGap;return{cost:1/0,count:r,width:o*f/e.lineGap,height:f}}function r(t,e,n){return t.cost===1/0&&e.cost===1/0?e.width<n?e:t:e.cost>=t.cost?t:e}return{calculate:t}}()},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"vue-waterfall",style:t.style},[t._t("default")],2)},staticRenderFns:[]}},function(t,e,n){n(11);var i=n(7)(n(13),n(14),null,null);t.exports=i.exports},function(t,e,n){var i=n(12);"string"==typeof i&&(i=[[t.id,i,""]]),i.locals&&(t.exports=i.locals);n(5)("466de276",i,!0)},function(t,e,n){e=t.exports=n(4)(),e.push([t.id,".vue-waterfall-slot{position:absolute;margin:0;padding:0;box-sizing:border-box}",""])},function(t,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e["default"]={data:function(){return{isShow:!1}},props:{width:{required:!0,validator:function(t){return t>=0}},height:{required:!0,validator:function(t){return t>=0}},order:{"default":0},moveClass:{"default":""}},methods:{notify:function(){this.$parent.$emit("reflow",this)},getMeta:function(){return{vm:this,node:this.$el,order:this.order,width:this.width,height:this.height,moveClass:this.moveClass}}},created:function(){var t=this;this.rect={top:0,left:0,width:0,height:0},this.$watch(function(){return t.width,t.height},this.notify)},mounted:function(){var t=this;this.$parent.$once("reflowed",function(){t.isShow=!0}),this.notify()},destroyed:function(){this.notify()}}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{directives:[{name:"show",rawName:"v-show",value:t.isShow,expression:"isShow"}],staticClass:"vue-waterfall-slot"},[t._t("default")],2)},staticRenderFns:[]}}])});