quarkd
Version:
Mobile UI Components built on Web Components.
2 lines (1 loc) • 8.24 kB
JavaScript
import{_ as t,a as e}from"../typeof.js";import{_ as n,a as o,b as r,c as a,H as i,d as l,N as s,O as u,B as c}from"../index2.js";import{_ as h}from"../defineProperty.js";import"../loading/index.js";import{c as d}from"../public.js";import{a as f}from"../index3.js";import{Local as p}from"../locale/index.js";function g(t){var e="scrollTop"in t?t.scrollTop:t.pageYOffset;return Math.max(e,0)}var A=0,v=0,m=0,x=0,y=0,k=0,w=!1,E="";function T(){var t=function(){m=0,x=0,y=0,k=0,E=""};return{move:function(t){var e=t.touches[0];m=e.clientX<0?0:e.clientX-A,x=e.clientY-v,y=Math.abs(m),k=Math.abs(x);var n,o;(!E||y<10&&k<10)&&(E=(n=y)>(o=k)?"horizontal":o>n?"vertical":"")},start:function(e){t(),w||(A=e.touches[0].clientX,v=e.touches[0].clientY,w=!0)},reset:t,end:function(){t(),w=!1},startX:A,startY:v,deltaX:m,deltaY:x,offsetX:y,offsetY:k,direction:E,isVertical:function(){return"vertical"===E},isHorizontal:function(){return"horizontal"===E}}}function b(t){var e=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}();return function(){var r,a=n(t);if(e){var i=n(this).constructor;r=Reflect.construct(a,arguments,i)}else r=a.apply(this,arguments);return o(this,r)}}var q=function(n){r(l,i);var o=b(l);function l(){var e;t(this,l);for(var n=arguments.length,r=new Array(n),s=0;s<n;s++)r[s]=arguments[s];return e=o.call.apply(o,[this].concat(r)),h(a(e),"disabled",!1),h(a(e),"loading",!1),h(a(e),"headheight",96),h(a(e),"pullingtext",p.current.pullRefresh.pulling),h(a(e),"loosingtext",p.current.pullRefresh.loosing),h(a(e),"textcolor","#879099"),h(a(e),"loadingtext",p.current.loading),h(a(e),"dark",!1),h(a(e),"status","normal"),h(a(e),"distance",0),h(a(e),"duration",0),h(a(e),"scrollParent",null),h(a(e),"isTouchable",(function(){return"loading"!==e.status&&!e.disabled})),h(a(e),"removeEvent",(function(){e.removeEventListener("touchstart",e.onTouchStart),e.removeEventListener("touchmove",e.onTouchMove),e.removeEventListener("touchend",e.onTouchEnd),e.addEventListener("touchcancel",e.onTouchEnd)})),h(a(e),"ease",(function(t){var n=+e.headheight;return t>n&&(t=t<2*n?n+(t-n)/2:1.5*n+(t-2*n)/4),Math.round(t)})),h(a(e),"setStatus",(function(t,n){var o=+e.headheight;e.distance=t,e.status=n?"loading":0===t?"normal":t<o?"pulling":"loosing"})),h(a(e),"getTextColor",(function(){return e.dark?"#FFF":e.textcolor})),h(a(e),"getStatusText",(function(){var t=a(e),n=t.status,o=t.dark;return"normal"===n?"":"loading"===n?o?i.h("div",{class:"quark-dark-loading",part:"dark-loading"},i.h("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAHKADAAQAAAABAAAAHAAAAABkvfSiAAADD0lEQVRIDa2WzUuUURSHncky08yilEKDKCpaCLWTdiF9uGhR0KaWEf0FQRD+BW2jXbt27SKEdtHGkr6/IQQ16FszLft0ep6ZOdN11EGdOfDMufd97zm/e9733vtOpm4Rlsvl2hi2E7bCOmiFLHyHKRiG55lM5g2+omUq3UVoB/f3wwZYUaQ+aXst7X+i34/wA/y8Nq8gQi2M7oHNYCXlYiFS7h3n+BG4grATmGVzBBFTRLFGCKHwCgRei7Y+xoSf5tplRF/hSzZLELF27hwGg9LKHDcMQ/AeJsFra6ETumAvrIQQNF67iOiLQrMQlG8j1kzjCKyGVNDHM0DQBH5BI34TN4/DPkhFXVh9xH/A52epryOgB2eQM4vq7jHwCf1FG3mc9AmISZtriDwXTGJHsQ6cS/1vwuBSxYitI6Yfdw2iSv0uNLrxBUH8bpiBEBwh8Bn9ZRmxNwi8DyFqYadMlkXZjbwGQuwP7YdQrV0lgQsrRDvQ2q6yKzPE9KPM0NOjKiPHOxIMQgjquxW0QoWsTN5CrewuiWKvKthlx72jkOVrXwquJr+vyaKGZv62ULfCsJ/RqIH/TI4QNF1e0NWZWi7tVNmORRNpsr7DaUjf4aq4WwO/kRzxFH2H43YUjLKtzi3itVrYHpKYO57amBV6RqYV+mmqlR0gUVrhYwXHQcGgmQ3aQL8qI0cnCXog3Ye3smxQT/N4jyHqIV6tnSOBEw9BD5SXVqi52dOztJEZepgvy4g9Q+AhCDF1LpksL4iy7/EbRIX6VgKX/D6JOUvseQgx/VM0buJLp4ufKE8cn7uWVusjnyTASSxoxG/jZh8cBMdGjjHax4gfxf8XtEOQ/2PaIQ2wLT/gV7GNq2uCLeBfi17ww6vFeAUdfxKxO97Q4vws9PhF1L8Y64sXIjh8HPB6r5X3Y5zeyk4jNoAvWSya0gUGWMlH8Ex1lm7aFLqzzEmbRx9tv6e95WJcq2xU2wAtRZqsHuohAzPwG6ZhCiZgEI5Wyjrnkc43mCSx4rwdi+ErbReC3IbrVPQIX9H+ATXUIAon3nomAAAAAElFTkSuQmCC"}),e.loadingtext):i.h("quark-loading",{type:"pullrefresh",color:e.getTextColor(),size:"28",vertical:!0,part:"loading"},e.loadingtext):"pulling"===n?e.pullingtext:"loosing"===n?e.loosingtext:""})),h(a(e),"checkPosition",(function(t){e.duration=0,T().start(t)})),h(a(e),"onTouchStart",(function(t){!e.isTouchable()||g(e.scrollParent)||e.scrollTop||window.pageYOffset||e.checkPosition(t)})),h(a(e),"onTouchMove",(function(t){if(e.isTouchable()&&!g(e.scrollParent)&&!e.scrollTop&&!window.pageYOffset){e.checkPosition(t),T().move(t);var n=T().deltaY;n>=0&&T().isVertical()&&(t.preventDefault(),e.setStatus(e.ease(n)))}})),h(a(e),"onTouchEnd",(function(){T().deltaY&&e.isTouchable()&&(T().end(),e.duration=300,"loosing"===e.status?(e.setStatus(+e.headheight,!0),e.$emit("refresh")):e.setStatus(0))})),h(a(e),"getHeadStyle",(function(){return{height:"".concat(96!==e.headheight?e.headheight:96,"px")}})),h(a(e),"renderHead",(function(){var t=a(e).status;return"loading"===t&&e.querySelector("[slot='loading']")?i.h("slot",{name:"loading"}):"pulling"===t&&e.querySelector("[slot='pulling']")?i.h("slot",{name:"pulling"}):"loosing"===t&&e.querySelector("[slot='loosing']")?i.h("slot",{name:"loosing"}):i.h("div",{class:"quark-pull-refresh-text",part:"text",style:"color: ".concat(e.getTextColor())},e.getStatusText())})),e}return e(l,[{key:"shouldComponentUpdate",value:function(t,e,n){return"loading"===t&&d(n)&&this.setStatus(0),!1}},{key:"componentDidMount",value:function(){this.eventBind(),this.scrollParent=f(this)}},{key:"eventBind",value:function(){this.removeEvent(),this.addEventListener("touchstart",this.onTouchStart),this.addEventListener("touchmove",this.onTouchMove),this.addEventListener("touchend",this.onTouchEnd),this.addEventListener("touchcancel",this.onTouchEnd)}},{key:"render",value:function(){var t={transitionDuration:"".concat(this.duration,"ms"),transform:this.distance?"translate3d(0,".concat(this.distance,"px, 0)"):""};return i.h("div",{class:"quark-pull-refresh",part:"root"},i.h("div",{class:"quark-pull-refresh-container",part:"container",style:t},i.h("div",{class:"quark-pull-refresh-head",part:"head",style:this.getHeadStyle()},this.renderHead()),i.h("slot",{name:"content"})))}}]),l}();l([s({type:Boolean})],q.prototype,"disabled",void 0),l([s({type:Boolean})],q.prototype,"loading",void 0),l([s({type:Number})],q.prototype,"headheight",void 0),l([s()],q.prototype,"pullingtext",void 0),l([s()],q.prototype,"loosingtext",void 0),l([s()],q.prototype,"textcolor",void 0),l([s()],q.prototype,"loadingtext",void 0),l([s({type:Boolean})],q.prototype,"dark",void 0),l([u()],q.prototype,"status",void 0),l([u()],q.prototype,"distance",void 0),l([u()],q.prototype,"duration",void 0);var Q=q=l([c({tag:"quark-pull-refresh",style:":host {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n}\n\n.quark-pull-refresh {\n width: 100%;\n background: var(--pull-refresh-bg-light, var(--pull-refresh-bg, transparent));\n}\n\n.quark-pull-refresh-container {\n position: relative;\n transition-property: transform;\n background: var(--pull-refresh-container-bg, #fff);\n}\n\n.quark-pull-refresh-head {\n position: absolute;\n left: 0;\n width: 100%;\n height: var(--pull-refresh-head-height);\n overflow: hidden;\n color: var(--pull-refresh-head-text-color);\n font-size: var(--pull-refresh-head-font-size);\n line-height: var(--pull-refresh-head-height);\n text-align: center;\n transform: translateY(-100%);\n}\n\n.quark-pull-refresh-text {\n font-size: 3.73333vw;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: flex-end;\n padding-bottom: 5.06667vw;\n box-sizing: border-box;\n}\n\n:host([dark]) .quark-pull-refresh {\n background: var(--pull-refresh-bg-dark, var(--pull-refresh-bg, #0088ff));\n}\n\n:host([dark]) .quark-pull-refresh-text {\n --loading-text-color: #fff;\n color: #fff;\n}\n\n.quark-dark-loading {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\n\n.quark-dark-loading img {\n width: 7.46667vw;\n height: 7.46667vw;\n margin-bottom: 2.13333vw;\n animation: rotate 1.4s linear infinite;\n}\n\n@keyframes rotate {\n to {\n transform: rotate(360deg);\n }\n}"})],q);export{Q as default};