w-ui/lib/infinite-list/index.js

A Vue.js 2.0 UI Toolkit for mobile

module.exports=function(t){function e(i){if(n[i])return n[i].exports;var r=n[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,i){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:i})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=350)}({1:function(t,e,n){"use strict";function i(t,e){var n=t[1]||"",i=t[3];if(!i)return n;if(e&&"function"==typeof btoa){var s=r(i);return[n].concat(i.sources.map(function(t){return"/*# sourceURL="+i.sourceRoot+t+" */"})).concat([s]).join("\n")}return[n].join("\n")}function r(t){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */"}t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var n=i(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var i={},r=0;r<this.length;r++){var s=this[r][0];"number"==typeof s&&(i[s]=!0)}for(r=0;r<t.length;r++){var o=t[r];"number"==typeof o[0]&&i[o[0]]||(n&&!o[2]?o[2]=n:n&&(o[2]="("+o[2]+") and ("+n+")"),e.push(o))}},e}},2:function(t,e,n){function i(t){for(var e=0;e<t.length;e++){var n=t[e],i=h[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(s(n.parts[r]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{for(var o=[],r=0;r<n.parts.length;r++)o.push(s(n.parts[r]));h[n.id]={id:n.id,refs:1,parts:o}}}}function r(){var t=document.createElement("style");return t.type="text/css",c.appendChild(t),t}function s(t){var e,n,i=document.querySelector("style["+g+'~="'+t.id+'"]');if(i){if(p)return v;i.parentNode.removeChild(i)}if(x){var s=d++;i=l||(l=r()),e=o.bind(null,i,s,!1),n=o.bind(null,i,s,!0)}else i=r(),e=a.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 o(t,e,n,i){var r=n?"":i.css;if(t.styleSheet)t.styleSheet.cssText=b(e,r);else{var s=document.createTextNode(r),o=t.childNodes;o[e]&&t.removeChild(o[e]),o.length?t.insertBefore(s,o[e]):t.appendChild(s)}}function a(t,e){var n=e.css,i=e.media,r=e.sourceMap;if(i&&t.setAttribute("media",i),m.ssrId&&t.setAttribute(g,e.id),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 u="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!u)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var f=n(3),h={},c=u&&(document.head||document.getElementsByTagName("head")[0]),l=null,d=0,p=!1,v=function(){},m=null,g="data-vue-ssr-id",x="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,n,r){p=n,m=r||{};var s=f(t,e);return i(s),function(e){for(var n=[],r=0;r<s.length;r++){var o=s[r],a=h[o.id];a.refs--,n.push(a)}e?(s=f(t,e),i(s)):s=[];for(var r=0;r<n.length;r++){var a=n[r];if(0===a.refs){for(var u=0;u<a.parts.length;u++)a.parts[u]();delete h[a.id]}}}};var b=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}()},3:function(t,e,n){"use strict";t.exports=function(t,e){for(var n=[],i={},r=0;r<e.length;r++){var s=e[r],o=s[0],a=s[1],u=s[2],f=s[3],h={id:t+":"+r,css:a,media:u,sourceMap:f};i[o]?i[o].parts.push(h):n.push(i[o]={id:o,parts:[h]})}return n}},350:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.InfiniteList=void 0;var i=n(351),r=function(t){return t&&t.__esModule?t:{default:t}}(i);e.InfiniteList=r.default},351:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),n(352),e.default={name:"w-infinite-scroll",data:function(){return{drag:!1,startY:0,startTime:0,currentY:0,offsetH:0,currentPage:0,pageInfo:[],sizeInfo:[],lastCount:0,ww:0,hh:0}},props:{containsIframe:{type:Boolean,default:!1},pageCount:{type:Number,default:1/0,required:!0}},methods:{touchstart:function(t){this.drag=!0;var e=t.touches||[t];e=e[0],this.startY=e.pageY,this.startTime=Date.now(),this.offsetH=0,this.currentY=this.getCurrentY(),this.hh=this.$el.offsetHeight;var n=this.$refs.box.offsetHeight;this.maxsh=0,this.minsh=this.hh-n,t.preventDefault(),t.stopPropagation()},touchmove:function(t){if(this.drag){var e=t.changedTouches||[t];e=e[0];var n=e.pageY-this.startY;this.offsetH=n;var i=this.currentY+n;this.translateTo(0,i,!0),t.preventDefault()}},touchend:function(t){if(this.drag){this.drag=!1;var e=this.getCurrentY();e>this.maxsh?this.prevPage():e<this.minsh?this.nextPage():this.momentumMove(t)}},bounceBack:function(t,e,n){var i=n||500;this.translateTo(t,e,i)},getCurrentY:function(){var t="0",e=this.$refs.box.style.transform;if(e){var n=e.replace(/\s/g,"").match(/translate3d\((?:.*?),(.*?),(?:.*?)\)/);n&&n.length>1&&(t=n[1].replace("px",""))}return Number.isNaN(t)?0:parseInt(t)},momentumMove:function(t){var e=this,n=Date.now()-this.startTime,i=this.getCurrentY();if(!(n>500||Math.abs(this.offsetH)<10)){var r=Math.abs(this.offsetH)/n,s=r*r/4e-4*(this.offsetH<0?-1:1),o=Math.round(i+s),a=Math.round(s/r);o<this.minsh?o=Math.round(this.minsh-this.hh/2*(r/8)):o>0&&(o=Math.round(this.hh/2*(r/8))),a<300&&(a=300),a>1200&&(a=1200),this.translateTo(0,o,a),setTimeout(function(){i=e.getCurrentY(),i>e.maxsh?e.bounceBack(0,e.maxsh):i<e.minsh&&e.bounceBack(0,e.minsh)},a)}},prevPage:function(){this.currentPage-1>-1?(this.currentPage--,this.$emit("change",this.currentPage,this.currentPage+1)):this.bounceBack(0,this.maxsh)},nextPage:function(){var t=this;if(this.currentPage+1<this.pageCount){this.getCurrentY()<this.minsh-40&&this.bounceBack(0,this.minsh-40),this.$refs.bottomLoader.style.bottom=0,this.currentPage++,this.$emit("change",this.currentPage,this.currentPage-1),setTimeout(function(){t.bounceBack(0,t.minsh),t.$refs.bottomLoader.style.bottom="-40px"},1e3)}else this.bounceBack(0,this.minsh)},setCurrent:function(t){var e=this;this.$nextTick(function(){if(t>=0&&t<e.pageCount)if(e.currentPage=t,"h"===e.direction){var n=-t*e.ww;e.translateTo(n,0,600)}else{var i=-t*e.hh;e.translateTo(0,i,600)}})},translateTo:function(t,e,n,i){var r=n||300;this.$refs.box.style.transition=i?"none":r+"ms all cubic-bezier(0.1, 0.57, 0.1, 1)",this.$refs.box.style.transform="translate3d("+t+"px, "+e+"px, 0)"},checkScroll:function(t){for(var e=t.currentTarget,n=t.target;n.parentNode&&n.parentNode!==e;)n=n.parentNode;if(n){var i=n.scrollHeight,r=n.offsetHeight;if("v"===this.direction)if(t.pageY<this.startY){if(i>r&&n.scrollTop<i-r)return!1}else if(n.scrollTop>0)return!1;return!0}}},render:function(t){var e=this;if(this.$slots.default&&this.$slots.default.length>0){var n=this.$slots.default.length;if(n>this.lastCount&&(this.pageInfo[this.currentPage]||(this.pageInfo[this.currentPage]={startIndex:this.lastCount,endIndex:n},this.lastCount=n)),this.hh)return t("div",{class:"wui-infinite-list-v"},[t("div",{class:"wui-infinite-list-wrapper",ref:"list"},[t("div",{class:"wui-infinite-list-container",ref:"box"},[this.$slots.default.map(function(n,i){var r=e.pageInfo[e.currentPage],s=e.sizeInfo[e.currentPage];return r&&n.tag&&i>=r.startIndex&&i<=r.endIndex?t("div",{class:"wui-infinite-list-item"},[n,e.containsIframe?t("div",{class:"wui-infinite-list-item-mask"}):""]):s&&s[i]?t("div",{class:"wui-infinite-list-item",style:{height:s[i].h+"px"}}):t("div",{class:"wui-infinite-list-item"})})]),t("div",{class:"page-loader-bottom",ref:"bottomLoader"},[t("slot",{attrs:{name:"loader-bottom"}},[t("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",width:"40px",height:"40px",viewBox:"0 0 50 50"}},[t("path",{attrs:{fill:"#000",d:"M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z"}},[t("animateTransform",{attrs:{attributeType:"xml",attributeName:"transform",type:"rotate",from:"0 25 25",to:"360 25 25",dur:"0.6s",repeatCount:"indefinite"}})])])])])])])}return t("div",{class:"wui-infinite-list-v"},[t("div",{class:"wui-infinite-list-wrapper",ref:"list"},[t("div",{class:"wui-infinite-list-container",ref:"box"})])])},updated:function(){var t=this.$refs.box.children,e=this.pageInfo[this.currentPage];if(!this.sizeInfo[this.currentPage]){this.sizeInfo[this.currentPage]=[];for(var n=this.sizeInfo[this.currentPage],i=e.startIndex;i<e.endIndex;i++){var r=t[i];n.push({h:r.offsetHeight})}}},mounted:function(){var t=this;this.hh=this.$el.offsetHeight,this.$refs.box.addEventListener("touchstart",this.touchstart,!1),this.$refs.box.addEventListener("mousedown",this.touchstart,!1),this.$refs.box.addEventListener("touchmove",this.touchmove,!1),this.$refs.box.addEventListener("mousemove",this.touchmove,!1),window.addEventListener("touchend",this.touchend,!1),window.addEventListener("mouseup",this.touchend,!1),this.$nextTick(function(){t.hh=t.$el.offsetHeight;var e=t.$refs.box.children,n=t.pageInfo[t.currentPage];if(!t.sizeInfo[t.currentPage]){t.sizeInfo[t.currentPage]=[];for(var i=t.sizeInfo[t.currentPage],r=n.startIndex;r<n.endIndex;r++){var s=e[r];i.push({h:s.offsetHeight})}}})},destroyed:function(){window.removeEventListener("mousemove",this.touchmove,!1),window.removeEventListener("mouseup",this.touchend,!1)}}},352:function(t,e,n){var i=n(353);"string"==typeof i&&(i=[[t.i,i,""]]),i.locals&&(t.exports=i.locals);n(2)("55284173",i,!1,{})},353:function(t,e,n){e=t.exports=n(1)(!1),e.push([t.i,".wui-infinite-list-v {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  position: relative;\n}\n.wui-infinite-list-v .wui-infinite-list-wrapper {\n  width: 100%;\n  height: 10000%;\n}\n.wui-infinite-list-v .wui-infinite-list-container {\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n  -webkit-flex-direction: column;\n      -ms-flex-direction: column;\n          flex-direction: column;\n  -webkit-box-align: center;\n  -webkit-align-items: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-pack: start;\n  -webkit-justify-content: flex-start;\n      -ms-flex-pack: start;\n          justify-content: flex-start;\n  -webkit-flex-wrap: wrap;\n      -ms-flex-wrap: wrap;\n          flex-wrap: wrap;\n}\n.wui-infinite-list-v .wui-infinite-list-item {\n  position: relative;\n  -webkit-box-flex: 0;\n  -webkit-flex-grow: 0;\n      -ms-flex-positive: 0;\n          flex-grow: 0;\n  -webkit-flex-shrink: 0;\n      -ms-flex-negative: 0;\n          flex-shrink: 0;\n  width: 100%;\n  overflow: auto;\n}\n.wui-infinite-list-v .wui-infinite-list-item-mask {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  z-index: 9999;\n}\n.wui-infinite-list-v .page-loader-bottom {\n  position: absolute;\n  left: 50%;\n  bottom: -40px;\n  width: 40px;\n  height: 40px;\n  -webkit-transform: translateX(-50%);\n          transform: translateX(-50%);\n  -webkit-transition: all 0.2s linear;\n  transition: all 0.2s linear;\n}\n",""])}});