ridingwind-scrolllist
Version:
pull-up load more drop-down refresh on mobile, AND scroll load more on PC, React Compopnent
1 lines • 16.5 kB
JavaScript
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports["ridingwind-scrolllist"]=e(require("react")):t["ridingwind-scrolllist"]=e(t.react)}("undefined"!=typeof self?self:this,function(t){return function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.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=1)}([function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r={init:"",pulling:"pulling",enough:"pullingenough",refreshing:"refreshing",refreshed:"refreshed",reset:"reset",loading:"loading"};e.default=r},function(t,e,n){t.exports=n(2)},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}Object.defineProperty(e,"__esModule",{value:!0}),e.RidingWindScrollList=e.RSTATES=void 0;var o=n(3);Object.defineProperty(e,"RidingWindScrollList",{enumerable:!0,get:function(){return r(o).default}});var i=n(0),a=r(i);e.RSTATES=a.default},function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function s(t,e,n){var r=t;r.attachEvent?(r["e"+e+n]=n,r[e+n]=function(){r["e"+e+n](window.event)},r.attachEvent("on"+e,r[e+n])):r.addEventListener(e,n,!1,{passive:!1})}function l(t,e,n){var r=t;r.detachEvent?(r.detachEvent("on"+e,r[e+n]),r[e+n]=null):r.removeEventListener(e,n,!1)}Object.defineProperty(e,"__esModule",{value:!0});var u=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),f=n(4),c=r(f),d=n(0),p=r(d),h=n(5),m=r(h),v=function(t){function e(t){o(this,e);var n=i(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,t));return n.getScrollTopFunc=function(){var t=n.props.id;return n[t+"_defaultConfig"].container?n[t+"_defaultConfig"].container.scrollTop:0},n.setScrollTop=function(t){var e=n.props.id,r=t;if(n[e+"_defaultConfig"].container){var o=n[e+"_defaultConfig"].container.scrollHeight;return t<0&&(r=0),t>o&&(r=o),n[e+"_defaultConfig"].container.scrollTop=r,n[e+"_defaultConfig"].container.scrollTop}return 0},n.easing=function(t){var e=window.screen.availHeight;return e/2.5*Math.sin(t/e*(Math.PI/2))+0},n.canRefresh=function(){var t=n.props.currentState;return[p.default.refreshing,p.default.loading].indexOf(t)<0},n.onPullDownMove=function(t){var e=n.props,r=e.executeFunc,o=e.id;if(!n.canRefresh())return!1;var i=void 0,a=t[0].touchMoveY-t[0].touchStartY;a<0&&(a=0),a=n.easing(a),i=a>n[o+"_defaultConfig"].pullDownSpace?p.default.enough:p.default.pulling,n.setState({pullDistance:a}),r(i)},n.onPullDownRefresh=function(){var t=n.props,e=t.executeFunc,r=t.currentState;if(!n.canRefresh())return!1;r===p.default.pulling?(n.setState({pullDistance:0}),e(p.default.reset)):(n.setState({pullDistance:0}),e(p.default.refreshing))},n.onPullUpMove=function(){var t=n.props.executeFunc;if(!n.canRefresh())return!1;n.setState({pullDistance:0}),t(p.default.loading)},n.scrollFunc=function(){var t=n.state,e=t.beforeHeight,r=t.scollLoading,o=n.props.actionSpaceBottom,i=n[n.props.id+"_container"],a=i.scrollTop,s=i.offsetHeight,l=n[n.props.id+"_container_box"].scrollHeight;e===l?l-s-a<=o&&r&&(n.setState({scollLoading:!1}),n.onPullUpMove()):n.setState({beforeHeight:l,scollLoading:!0})},n.onTouchStart=function(t){var e=t.changedTouches[0];n.startX=e.clientX,n.startY=e.clientY},n.onTouchMove=function(t){var e=n.props.id,r=n.getScrollTopFunc(),o=n[e+"_defaultConfig"].container.scrollHeight,i=n[e+"_defaultConfig"].container.offsetHeight,a=t.changedTouches[0],s=a.clientX,l=a.clientY,u=s-n.startX,f=l-n.startY;Math.abs(f)>5&&Math.abs(f)>Math.abs(u)&&(f>5&&r<n[e+"_defaultConfig"].offsetScrollTop?(t.preventDefault(),n.onPullDownMove([{touchStartY:n.startY,touchMoveY:l}])):f<0&&o-r-i<n[e+"_defaultConfig"].actionSpaceBottom&&n.onPullUpMove())},n.onTouchEnd=function(t){var e=n.props.id,r=n.getScrollTopFunc(),o=t.changedTouches[0],i=o.clientX,a=o.clientY,s=i-n.startX,l=a-n.startY;Math.abs(l)>5&&Math.abs(l)>Math.abs(s)&&l>5&&r<n[e+"_defaultConfig"].offsetScrollTop&&n.onPullDownRefresh()},n.state={pageWidth:document.body.clientWidth,pullDistance:0,beforeHeight:0,scollLoading:!0},n}return a(e,t),u(e,[{key:"componentDidMount",value:function(){var t=this.props,e=t.pullDownSpace,n=t.actionSpaceBottom,r=t.id;this[r+"_defaultConfig"]={container:this[r+"_container"],offsetScrollTop:1,pullDownSpace:e,actionSpaceBottom:n},this.state.pageWidth<=780?(s(this[r+"_container"],"touchstart",this.onTouchStart),s(this[r+"_container"],"touchmove",this.onTouchMove),s(this[r+"_container"],"touchend",this.onTouchEnd)):s(this[r+"_container"],"scroll",this.scrollFunc)}},{key:"componentWillUnmount",value:function(){var t=this.props.id;this.state.pageWidth<=780?(l(this[t+"_container"],"touchstart",this.onTouchStart),l(this[t+"_container"],"touchmove",this.onTouchMove),l(this[t+"_container"],"touchend",this.onTouchEnd)):l(this[t+"_container"],"scroll",this.scrollFunc)}},{key:"componentWillReceiveProps",value:function(t){var e=this.props.executeFunc;t.currentState===p.default.refreshed&&setTimeout(function(){e(p.default.reset)},1e3)}},{key:"render",value:function(){var t=this,e=this.props,n=e.id,r=e.children,o=e.currentState,i=e.HeadDOM,a=e.hasMore,s=e.FooterTipDOM,l=this.state.pullDistance,u=l?{WebkitTransform:"translate3d(0, "+l+"px, 0)",transform:"translate3d(0, "+l+"px, 0)"}:null,f=o?m.default["state_"+o]:m.default.ridingwind,d=a?m.default.pullLoadFooterDefault:m.default.pullLoadFooterDefaultNomore;return c.default.createElement("div",{className:f,id:n,ref:function(e){t[n+"_container"]=e}},c.default.createElement("div",{className:m.default.pullLoadBody,style:u},c.default.createElement("div",{className:m.default.pullLoadHead},i||c.default.createElement("div",{className:m.default.pullLoadHeadDefault},c.default.createElement("i",null))),c.default.createElement("div",{ref:function(e){t[n+"_container_box"]=e}},r),c.default.createElement("div",{className:m.default.pullLoadFooter},c.default.createElement("div",{className:d},o===p.default.loading?c.default.createElement("i",null):""),s||null)))}}]),e}(c.default.PureComponent);e.default=v},function(e,n){e.exports=t},function(t,e,n){var r=n(6);"string"==typeof r&&(r=[[t.i,r,""]]);var o={hmr:!0};o.transform=void 0;n(8)(r,o);r.locals&&(t.exports=r.locals)},function(t,e,n){e=t.exports=n(7)(!1),e.push([t.i,'._1-KRN,._1mtvy,._2CPSH,._2cqic,._3tBfp,._3YdwY,.OY9vJ{width:100%;height:100%;position:relative;overflow-y:scroll;-webkit-overflow-scrolling:touch}._2CErn{position:absolute;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);width:100%}._1-KRN ._2CErn,.OY9vJ ._2CErn{position:relative;-webkit-transform:none;transform:none}._3S935{position:relative}._2CPSH ._3S935,.OY9vJ ._3S935{transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s}._3mKaY{text-align:center;font-size:12px;line-height:3rem;color:#7676a1}._1mtvy ._3mKaY:after{content:"\\4E0B\\62C9\\5237\\65B0"}._3tBfp ._3mKaY:after{content:"\\677E\\5F00\\5237\\65B0"}.OY9vJ ._3mKaY:after{content:"\\6B63\\5728\\5237\\65B0..."}._1-KRN ._3mKaY:after{content:"\\5237\\65B0\\6210\\529F"}._1mtvy ._3mKaY{opacity:1}._1mtvy ._3mKaY i{display:inline-block;font-size:2em;margin-right:.6em;vertical-align:middle;height:1em;border-left:1px solid;position:relative;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease}._1mtvy ._3mKaY i:after,._1mtvy ._3mKaY i:before{content:"";position:absolute;font-size:.5em;width:1em;bottom:0;border-top:1px solid}._1mtvy ._3mKaY i:before{right:1px;-webkit-transform:rotate(50deg);transform:rotate(50deg);-webkit-transform-origin:right;transform-origin:right}._1mtvy ._3mKaY i:after{left:0;-webkit-transform:rotate(-50deg);transform:rotate(-50deg);-webkit-transform-origin:left;transform-origin:left}._3tBfp ._3mKaY i{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.OY9vJ ._3mKaY i{margin-right:10px;display:inline-block;vertical-align:middle;font-size:1.5rem;width:1em;height:1em;border:2px solid #9494b6;border-top-color:#fff;border-radius:100%;-webkit-animation:_1OSYy .8s infinite linear;animation:_1OSYy .8s infinite linear}._1-KRN ._3mKaY{opacity:1;transition:opacity 1s}._1-KRN ._3mKaY i{display:inline-block;box-sizing:content-box;vertical-align:middle;margin-right:10px;font-size:20px;height:1em;width:1em;border:1px solid;border-radius:100%;position:relative}._1-KRN ._3mKaY i:before{content:"";position:absolute;top:3px;left:7px;height:11px;width:5px;border:solid;border-width:0 1px 1px 0;-webkit-transform:rotate(40deg);transform:rotate(40deg)}._1rhJ3,._2pg0b{text-align:center;font-size:12px;line-height:3rem;color:#7676a1}._3YdwY ._1rhJ3:after{content:"\\52A0\\8F7D\\66F4\\591A"}._2pg0b:after{content:"\\6CA1\\6709\\66F4\\591A"}._3YdwY ._1rhJ3 i{margin-right:10px;display:inline-block;vertical-align:middle;font-size:1.5rem;width:1em;height:1em;border:2px solid #9494b6;border-top-color:#fff;border-radius:100%;-webkit-animation:_1OSYy .8s infinite linear;animation:_1OSYy .8s infinite linear}@-webkit-keyframes _1OSYy{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes _1OSYy{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}',""]),e.locals={ridingwind:"_2cqic",state_refreshing:"OY9vJ",stateRefreshing:"OY9vJ",state_pullingenough:"_3tBfp",statePullingenough:"_3tBfp",state_refreshed:"_1-KRN",stateRefreshed:"_1-KRN",state_reset:"_2CPSH",stateReset:"_2CPSH",state_pulling:"_1mtvy",statePulling:"_1mtvy",state_loading:"_3YdwY",stateLoading:"_3YdwY","pull-load-head":"_2CErn",pullLoadHead:"_2CErn","pull-load-body":"_3S935",pullLoadBody:"_3S935","pull-load-head-default":"_3mKaY",pullLoadHeadDefault:"_3mKaY",circle:"_1OSYy","pull-load-footer-default-nomore":"_2pg0b",pullLoadFooterDefaultNomore:"_2pg0b","pull-load-footer-default":"_1rhJ3",pullLoadFooterDefault:"_1rhJ3"}},function(t,e){function n(t,e){var n=t[1]||"",o=t[3];if(!o)return n;if(e&&"function"==typeof btoa){var i=r(o);return[n].concat(o.sources.map(function(t){return"/*# sourceURL="+o.sourceRoot+t+" */"})).concat([i]).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 r=n(e,t);return e[2]?"@media "+e[2]+"{"+r+"}":r}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var r={},o=0;o<this.length;o++){var i=this[o][0];"number"==typeof i&&(r[i]=!0)}for(o=0;o<t.length;o++){var a=t[o];"number"==typeof a[0]&&r[a[0]]||(n&&!a[2]?a[2]=n:n&&(a[2]="("+a[2]+") and ("+n+")"),e.push(a))}},e}},function(t,e,n){function r(t,e){for(var n=0;n<t.length;n++){var r=t[n],o=h[r.id];if(o){o.refs++;for(var i=0;i<o.parts.length;i++)o.parts[i](r.parts[i]);for(;i<r.parts.length;i++)o.parts.push(f(r.parts[i],e))}else{for(var a=[],i=0;i<r.parts.length;i++)a.push(f(r.parts[i],e));h[r.id]={id:r.id,refs:1,parts:a}}}}function o(t,e){for(var n=[],r={},o=0;o<t.length;o++){var i=t[o],a=e.base?i[0]+e.base:i[0],s=i[1],l=i[2],u=i[3],f={css:s,media:l,sourceMap:u};r[a]?r[a].parts.push(f):n.push(r[a]={id:a,parts:[f]})}return n}function i(t,e){var n=v(t.insertInto);if(!n)throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");var r=_[_.length-1];if("top"===t.insertAt)r?r.nextSibling?n.insertBefore(e,r.nextSibling):n.appendChild(e):n.insertBefore(e,n.firstChild),_.push(e);else if("bottom"===t.insertAt)n.appendChild(e);else{if("object"!=typeof t.insertAt||!t.insertAt.before)throw new Error("[Style Loader]\n\n Invalid value for parameter 'insertAt' ('options.insertAt') found.\n Must be 'top', 'bottom', or Object.\n (https://github.com/webpack-contrib/style-loader#insertat)\n");var o=v(t.insertInto+" "+t.insertAt.before);n.insertBefore(e,o)}}function a(t){if(null===t.parentNode)return!1;t.parentNode.removeChild(t);var e=_.indexOf(t);e>=0&&_.splice(e,1)}function s(t){var e=document.createElement("style");return t.attrs.type="text/css",u(e,t.attrs),i(t,e),e}function l(t){var e=document.createElement("link");return t.attrs.type="text/css",t.attrs.rel="stylesheet",u(e,t.attrs),i(t,e),e}function u(t,e){Object.keys(e).forEach(function(n){t.setAttribute(n,e[n])})}function f(t,e){var n,r,o,i;if(e.transform&&t.css){if(!(i=e.transform(t.css)))return function(){};t.css=i}if(e.singleton){var u=b++;n=g||(g=s(e)),r=c.bind(null,n,u,!1),o=c.bind(null,n,u,!0)}else t.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(n=l(e),r=p.bind(null,n,e),o=function(){a(n),n.href&&URL.revokeObjectURL(n.href)}):(n=s(e),r=d.bind(null,n),o=function(){a(n)});return r(t),function(e){if(e){if(e.css===t.css&&e.media===t.media&&e.sourceMap===t.sourceMap)return;r(t=e)}else o()}}function c(t,e,n,r){var o=n?"":r.css;if(t.styleSheet)t.styleSheet.cssText=w(e,o);else{var i=document.createTextNode(o),a=t.childNodes;a[e]&&t.removeChild(a[e]),a.length?t.insertBefore(i,a[e]):t.appendChild(i)}}function d(t,e){var n=e.css,r=e.media;if(r&&t.setAttribute("media",r),t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}function p(t,e,n){var r=n.css,o=n.sourceMap,i=void 0===e.convertToAbsoluteUrls&&o;(e.convertToAbsoluteUrls||i)&&(r=y(r)),o&&(r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */");var a=new Blob([r],{type:"text/css"}),s=t.href;t.href=URL.createObjectURL(a),s&&URL.revokeObjectURL(s)}var h={},m=function(t){var e;return function(){return void 0===e&&(e=t.apply(this,arguments)),e}}(function(){return window&&document&&document.all&&!window.atob}),v=function(t){var e={};return function(n){if(void 0===e[n]){var r=t.call(this,n);if(r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(t){r=null}e[n]=r}return e[n]}}(function(t){return document.querySelector(t)}),g=null,b=0,_=[],y=n(9);t.exports=function(t,e){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");e=e||{},e.attrs="object"==typeof e.attrs?e.attrs:{},e.singleton||"boolean"==typeof e.singleton||(e.singleton=m()),e.insertInto||(e.insertInto="head"),e.insertAt||(e.insertAt="bottom");var n=o(t,e);return r(n,e),function(t){for(var i=[],a=0;a<n.length;a++){var s=n[a],l=h[s.id];l.refs--,i.push(l)}if(t){r(o(t,e),e)}for(var a=0;a<i.length;a++){var l=i[a];if(0===l.refs){for(var u=0;u<l.parts.length;u++)l.parts[u]();delete h[l.id]}}}};var w=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t){var e="undefined"!=typeof window&&window.location;if(!e)throw new Error("fixUrls requires window.location");if(!t||"string"!=typeof t)return t;var n=e.protocol+"//"+e.host,r=n+e.pathname.replace(/\/[^\/]*$/,"/");return t.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi,function(t,e){var o=e.trim().replace(/^"(.*)"$/,function(t,e){return e}).replace(/^'(.*)'$/,function(t,e){return e});if(/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/)/i.test(o))return t;var i;return i=0===o.indexOf("//")?o:0===o.indexOf("/")?n+o:r+o.replace(/^\.\//,""),"url("+JSON.stringify(i)+")"})}}])});