w-ui/lib/scroll/index.js

A Vue.js 2.0 UI Toolkit for mobile

module.exports=function(t){function e(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,e),i.l=!0,i.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},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=226)}({0:function(t,e){t.exports=function(t,e,n,r,i,s){var o,a=t=t||{},u=typeof t.default;"object"!==u&&"function"!==u||(o=t,a=t.default);var c="function"==typeof a?a.options:a;e&&(c.render=e.render,c.staticRenderFns=e.staticRenderFns,c._compiled=!0),n&&(c.functional=!0),i&&(c._scopeId=i);var l;if(s?(l=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),r&&r.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},c._ssrRegister=l):r&&(l=r),l){var f=c.functional,h=f?c.render:c.beforeCreate;f?(c._injectStyles=l,c.render=function(t,e){return l.call(e),h(t,e)}):c.beforeCreate=h?[].concat(h,l):[l]}return{esModule:o,exports:a,options:c}}},1:function(t,e,n){"use strict";function r(t,e){var n=t[1]||"",r=t[3];if(!r)return n;if(e&&"function"==typeof btoa){var s=i(r);return[n].concat(r.sources.map(function(t){return"/*# sourceURL="+r.sourceRoot+t+" */"})).concat([s]).join("\n")}return[n].join("\n")}function i(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=r(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var r={},i=0;i<this.length;i++){var s=this[i][0];"number"==typeof s&&(r[s]=!0)}for(i=0;i<t.length;i++){var o=t[i];"number"==typeof o[0]&&r[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 r(t){for(var e=0;e<t.length;e++){var n=t[e],r=l[n.id];if(r){r.refs++;for(var i=0;i<r.parts.length;i++)r.parts[i](n.parts[i]);for(;i<n.parts.length;i++)r.parts.push(s(n.parts[i]));r.parts.length>n.parts.length&&(r.parts.length=n.parts.length)}else{for(var o=[],i=0;i<n.parts.length;i++)o.push(s(n.parts[i]));l[n.id]={id:n.id,refs:1,parts:o}}}}function i(){var t=document.createElement("style");return t.type="text/css",f.appendChild(t),t}function s(t){var e,n,r=document.querySelector("style["+w+'~="'+t.id+'"]');if(r){if(p)return v;r.parentNode.removeChild(r)}if(b){var s=d++;r=h||(h=i()),e=o.bind(null,r,s,!1),n=o.bind(null,r,s,!0)}else r=i(),e=a.bind(null,r),n=function(){r.parentNode.removeChild(r)};return e(t),function(r){if(r){if(r.css===t.css&&r.media===t.media&&r.sourceMap===t.sourceMap)return;e(t=r)}else n()}}function o(t,e,n,r){var i=n?"":r.css;if(t.styleSheet)t.styleSheet.cssText=g(e,i);else{var s=document.createTextNode(i),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,r=e.media,i=e.sourceMap;if(r&&t.setAttribute("media",r),m.ssrId&&t.setAttribute(w,e.id),i&&(n+="\n/*# sourceURL="+i.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */"),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 c=n(3),l={},f=u&&(document.head||document.getElementsByTagName("head")[0]),h=null,d=0,p=!1,v=function(){},m=null,w="data-vue-ssr-id",b="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,n,i){p=n,m=i||{};var s=c(t,e);return r(s),function(e){for(var n=[],i=0;i<s.length;i++){var o=s[i],a=l[o.id];a.refs--,n.push(a)}e?(s=c(t,e),r(s)):s=[];for(var i=0;i<n.length;i++){var a=n[i];if(0===a.refs){for(var u=0;u<a.parts.length;u++)a.parts[u]();delete l[a.id]}}}};var g=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}()},226:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.Scroll=void 0;var r=n(227),i=function(t){return t&&t.__esModule?t:{default:t}}(r);e.Scroll=i.default},227:function(t,e,n){"use strict";function r(t){u||n(228)}Object.defineProperty(e,"__esModule",{value:!0});var i=n(47),s=n.n(i);for(var o in i)"default"!==o&&function(t){n.d(e,t,function(){return i[t]})}(o);var a=n(230),u=!1,c=n(0),l=r,f=c(s.a,a.a,!1,l,null,null);f.options.__file="packages/scroll/src/Scroll.vue",e.default=f.exports},228:function(t,e,n){var r=n(229);"string"==typeof r&&(r=[[t.i,r,""]]),r.locals&&(t.exports=r.locals);n(2)("01918b5e",r,!1,{})},229:function(t,e,n){e=t.exports=n(1)(!1),e.push([t.i,"\n.wui-scroll-h {\n  width: 100%;\n  overflow: hidden;\n}\n.wui-scroll-h-nav {\n  min-width: 50000%;\n  overflow: hidden;\n}\n.wui-scroll-h-container {\n  display: -webkit-inline-box;\n  display: -webkit-inline-flex;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  -webkit-align-content: center;\n      -ms-flex-line-pack: center;\n          align-content: 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: nowrap;\n      -ms-flex-wrap: nowrap;\n          flex-wrap: nowrap;\n  -webkit-backface-visibility: hidden;\n          backface-visibility: hidden;\n}\n.wui-scroll-v {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.wui-scroll-v-nav {\n  min-height: 50000%;\n  overflow: hidden;\n}\n.wui-scroll-v-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-align-content: center;\n      -ms-flex-line-pack: center;\n          align-content: 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  -webkit-backface-visibility: hidden;\n          backface-visibility: hidden;\n}\n",""])},230:function(t,e,n){"use strict";var r=function(){var t=this,e=t.$createElement,n=t._self._c||e;return"h"===t.direction?n("div",{staticClass:"wui-scroll-h"},[n("div",{ref:"nav",staticClass:"wui-scroll-h-nav"},[n("div",{ref:"box",staticClass:"wui-scroll-h-container",on:{touchstart:t.touchstart,mousedown:t.touchstart}},[t._t("default")],2)])]):n("div",{staticClass:"wui-scroll-v"},[n("div",{ref:"nav",staticClass:"wui-scroll-v-nav"},[n("div",{ref:"box",staticClass:"wui-scroll-v-container",on:{touchstart:t.touchstart,mousedown:t.touchstart}},[t._t("default")],2)])])},i=[];r._withStripped=!0;var s={render:r,staticRenderFns:i};e.a=s},3:function(t,e,n){"use strict";t.exports=function(t,e){for(var n=[],r={},i=0;i<e.length;i++){var s=e[i],o=s[0],a=s[1],u=s[2],c=s[3],l={id:t+":"+i,css:a,media:u,sourceMap:c};r[o]?r[o].parts.push(l):n.push(r[o]={id:o,parts:[l]})}return n}},47:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={name:"w-scroll",data:function(){return{drag:!1,startX:0,startY:0,startTime:0,currentX:0,currentY:0,currentIndex:0,offsetW:0,offsetH:0,lastTime:0,timer:null,total:0,ww:0}},props:{direction:{type:String,default:"h"},scrollBounce:{type:Boolean,default:!0}},methods:{touchstart:function(t){this.drag=!0;var e=t.targetTouches||[t];e=e[0],this.startX=e.pageX,this.startY=e.pageY,this.startTime=Date.now(),this.offsetW=0,this.offsetH=0,this.currentX=this.getCurrentX(),this.currentY=this.getCurrentY()},touchmove:function(t){this.drag&&(this.move(t),t.preventDefault(),t.stopPropagation())},touchend:function(t){if(this.drag)if(this.drag=!1,"h"==this.direction){var e=this.getCurrentX();e>this.maxsw?this.bounceBack(this.maxsw,0):e<this.minsw?this.bounceBack(this.minsw,0):this.momentumMove(t)}else{var n=this.getCurrentY();n>this.maxsh?this.bounceBack(0,this.maxsh):n<this.minsh?this.bounceBack(0,this.minsh):this.momentumMove(t)}},move:function(t){if(this.drag){var e=t.targetTouches||[t];if(e=e[0],"h"==this.direction){var n=e.pageX-this.startX;this.offsetW=n;var r=this.currentX+n;if(r>0){if(!this.scrollBounce)return void t.stopPropagation()}else if(r<this.minsw&&!this.scrollBounce)return void t.stopPropagation();r=this.getDamping(r),this.translateTo(r,0,0,!0),t.preventDefault(),t.stopPropagation()}else{var i=e.pageY-this.startY;this.offsetH=i;var s=this.currentY+i;if(s>0){if(!this.scrollBounce)return void t.stopPropagation()}else if(s<this.minsh&&!this.scrollBounce)return void t.stopPropagation();s=this.getDamping(s),this.translateTo(0,s,0,!0),t.preventDefault(),t.stopPropagation()}}},bounceBack:function(t,e,n){var r=n||600;this.translateTo(t,e,r)},getDamping:function(t){var e=this.minsw;return"v"===this.direction&&(e=this.minsh),t>0?Math.round(t/3):t<e?Math.round(e-(e-t)/3):t},momentumMove:function(t){var e=this,n=Date.now()-this.startTime;if("h"==this.direction){var r=this.getCurrentX();if(n>500||Math.abs(this.offsetW)<10)return;var i=Math.abs(this.offsetW)/n,s=i*i/8e-4*(this.offsetW<0?-1:1),o=Math.round(r+s),a=Math.round(s/i);o<this.minsw?o=this.scrollBounce?Math.round(this.minsw-this.ww/(6*i)):this.minsw:o>0&&(o=this.scrollBounce?Math.round(this.ww/(6*i)):0),a<300&&(a=300),a>600&&(a=600),this.translateTo(o,0,a),setTimeout(function(){r=e.getCurrentX(),r>e.maxsw?e.bounceBack(e.maxsw,0):r<e.minsw&&e.bounceBack(e.minsw,0)},a)}else{var u=this.getCurrentY();if(n>500||Math.abs(this.offsetH)<10)return;var c=Math.abs(this.offsetH)/n,l=c*c/4e-4*(this.offsetH<0?-1:1),f=Math.round(u+l),h=Math.round(l/c);f<this.minsh?f=this.scrollBounce?Math.round(this.minsh-this.hh/(6*c)):this.minsh:f>0&&(f=this.scrollBounce?Math.round(this.hh/(6*c)):0),h<300&&(h=300),h>600&&(h=600),this.translateTo(0,f,h),setTimeout(function(){u=e.getCurrentY(),u>e.maxsh?e.bounceBack(0,e.maxsh):u<e.minsh&&e.bounceBack(0,e.minsh)},h)}},getCurrentX: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)},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)},translateTo:function(t,e,n,r){var i=n||300;i<300&&(i=300),i>600&&(i=600),r?(this.$refs.box.style.webkitTransition="none",this.$refs.box.style.transition="none"):(this.$refs.box.style.webkitTransition=i+"ms all cubic-bezier(0.1, 0.57, 0.1, 1)",this.$refs.box.style.transition=i+"ms all cubic-bezier(0.1, 0.57, 0.1, 1)"),this.$refs.box.style.webkitTransform="translate("+t+"px, "+e+"px)",this.$refs.box.style.transform="translate3d("+t+"px, "+e+"px, 0)"}},mounted:function(){var t=this;this.$nextTick(function(){if(t.total=t.$slots.default.length,"h"==t.direction){var e=t.$refs.box.offsetWidth;t.ww=t.$el.offsetWidth,t.maxsw=0,t.minsw=t.ww-e,t.minsw>0&&(t.minsw=0)}else{var n=t.$refs.box.offsetHeight;t.hh=t.$el.offsetHeight,t.maxsh=0,t.minsh=t.hh-n,t.minsh>0&&(t.minsh=0)}t.$el.addEventListener("touchmove",t.touchmove,{passive:!0}),t.$el.addEventListener("touchend",t.touchend,{passive:!0}),window.addEventListener("mousemove",t.touchmove,!1),window.addEventListener("mouseup",t.touchend,!1)})},destroyed:function(){window.removeEventListener("mousemove",this.touchmove,!1),window.removeEventListener("mouseup",this.touchend,!1)}}}});