vue-side-nav
Version:
side-nav - done in vue
1 lines • 18.4 kB
JavaScript
!function(t){function e(n){if(i[n])return i[n].exports;var o=i[n]={exports:{},id:n,loaded:!1};return t[n].call(o.exports,o,o.exports,e),o.loaded=!0,o.exports}var i={};return e.m=t,e.c=i,e.p="",e(0)}([function(t,e,i){null==window.vueComps&&(window.vueComps={}),window.vueComps.sideNav=i(25)},function(t,e){function i(t){var e=typeof t;return null!=t&&("object"==e||"function"==e)}t.exports=i},function(t,e,i){function n(t,e,i){var n=!0,u=!0;if("function"!=typeof t)throw new TypeError(s);return r(i)&&(n="leading"in i?!!i.leading:n,u="trailing"in i?!!i.trailing:u),o(t,e,{leading:n,maxWait:e,trailing:u})}var o=i(11),r=i(1),s="Expected a function";t.exports=n},function(module,exports,__webpack_require__){!function(){module.exports={mixins:[__webpack_require__(5),__webpack_require__(4)],props:{id:{type:String},style:{"default":function(){}},"class":{"default":function(){}},factor:{type:Number,"default":2},maxLeft:{type:Number,"default":0},maxRight:{type:Number,"default":0},offset:{type:Number,"default":0},zIndex:{type:Number,"default":1002},disabled:{type:Boolean,"default":!1}},computed:{mergeStyle:function(){return{height:"100%",position:"absolute",top:"0",zIndex:this.zIndex}}},data:function(){return{atMax:!1,pos:null}},methods:{click:function(t){return null==this.pos||this.pos.x!==t.x||this.pos.y!==t.y?this.$emit("clean-click",t):void 0},onPan:function(t){var e;if("pan"===t.type){if(t.srcEvent.preventDefault(),e=t.deltaX*this.factor,this.pos=null,t.isFinal)return this.pos={x:t.srcEvent.x,y:t.srcEvent.y},this.maxRight>0&&e>=this.maxRight?(this.$emit("right"),this.$emit("max","right")):this.maxLeft>0&&e<=-this.maxLeft?(this.$emit("left"),this.$emit("max","left")):this.$emit("aborted");if(this.maxRight>0&&e>=0){if(e<=this.maxRight)return this.$emit("move",e+this.offset),this.atMax=!1;if(!this.atMax)return this.$emit("move",this.maxRight+this.offset),this.atMax=!0}else if(this.maxLeft>0&&0>=e){if(e>=-this.maxLeft)return this.$emit("move",e+this.offset),this.atMax=!1;if(!this.atMax)return this.$emit("move",-this.maxLeft+this.offset),this.atMax=!0}}}}}}(),module.exports.__esModule&&(module.exports=module.exports["default"]);var __vue__options__="function"==typeof module.exports?module.exports.options:module.exports;__vue__options__.render=function(){with(this)return disabled?_e():_h("div",{directives:[{name:"touch",value:onPan,expression:"onPan",arg:"pan"}],staticClass:"drag-handle","class":computedClass,style:computedStyle,attrs:{id:id},on:{click:click}})},__vue__options__.staticRenderFns=[]},function(t,e){(function(){var e,i;e=function(t){return"string"==typeof t||t instanceof String},i=function(t){var i;return i=Array.isArray(t),e(t)&&!i&&(t=t.split(" "),i=!0),{isArray:i,obj:t}},t.exports={computed:{computedClass:function(){var t,n,o,r,s,u,l,a,c,d,f,h,p,m;if(f=i(this["class"]),n=f.isArray,c=f.obj,null==this.mergeClass)return c;if(h=i(this.mergeClass),o=h.isArray,d=h.obj,n&&o)return d.concat(c);if(p={},o)for(t=0,l=d.length;l>t;t++)if(r=d[t],e(r))p[r]=!0;else for(u in r)m=r[u],p[u]=m;else for(u in d)m=d[u],p[u]=m;if(n)for(s=0,a=c.length;a>s;s++)if(r=c[s],e(r))p[r]=!0;else for(u in r)m=r[u],p[u]=m;else for(u in c)m=c[u],p[u]=m;return p}}}}).call(this)},function(t,e){(function(){var e,i,n;i=function(t){return"string"==typeof t||t instanceof String},n=function(t){return t.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,"")},e=function(t){var e,o,r,s,u,l;if(Array.isArray(t))return t;if(i(t)){for(s={},l=t.split(";"),e=0,r=l.length;r>e;e++)u=l[e],o=u.split(":"),s[n(o[0])]=n(o[1]);return[s]}return[t]},t.exports={computed:{computedStyle:function(){var t;return t=e(this.style),null==this.mergeStyle?t:e(this.mergeStyle).concat(t)}}}}).call(this)},function(t,e,i){(function(){var e,n,o,r;r=i(2),o=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame,e=window.cancelAnimationFrame||window.mozCancelAnimationFrame,o?n=function(t,i){var n;return n=null,window.addEventListener(t,function(){var t;return t=arguments,e(n),n=o(function(){return i.apply(null,t)})})}:(r=i(2),n=function(t,e){return window.addEventListener(t,r(e,66))}),t.exports=n}).call(this)},function(t,e){(function(){var e,i;e=function(t){return"string"==typeof t||t instanceof String},i=function(t){var i;return i=Array.isArray(t),e(t)&&!i&&(t=t.split(" "),i=!0),{isArray:i,obj:t}},t.exports={computed:{computedClass:function(){var t,n,o,r,s,u,l,a,c,d,f,h,p,m;if(f=i(this["class"]),n=f.isArray,c=f.obj,null==this.mergeClass)return c;if(h=i(this.mergeClass),o=h.isArray,d=h.obj,n&&o)return d.concat(c);if(p={},o)for(t=0,l=d.length;l>t;t++)if(r=d[t],e(r))p[r]=!0;else for(u in r)m=r[u],p[u]=m;else for(u in d)m=d[u],p[u]=m;if(n)for(s=0,a=c.length;a>s;s++)if(r=c[s],e(r))p[r]=!0;else for(u in r)m=r[u],p[u]=m;else for(u in c)m=c[u],p[u]=m;return p}}}}).call(this)},function(t,e){(function(){t.exports={props:{isOpened:{type:Boolean,"default":!1}},data:function(){return{opened:null}},methods:{setOpened:function(){return this.opened=!0,this.$emit("toggled",!0)},setClosed:function(){return this.opened=!1,this.$emit("toggled",!1)}},watch:{isOpened:function(t){return t!==this.opened?this.toggle():void 0}},mounted:function(){return this.$nextTick(function(){return this.isOpened?this.toggle():void 0})}}}).call(this)},function(t,e){(function(e){var i="object"==typeof e&&e&&e.Object===Object&&e;t.exports=i}).call(e,function(){return this}())},function(t,e,i){var n=i(9),o="object"==typeof self&&self&&self.Object===Object&&self,r=n||o||Function("return this")();t.exports=r},function(t,e,i){function n(t,e,i){function n(e){var i=_,n=y;return _=y=void 0,C=e,b=t.apply(n,i)}function c(t){return C=t,w=setTimeout(h,e),F?n(t):b}function d(t){var i=t-k,n=t-C,o=e-i;return z?a(o,g-n):o}function f(t){var i=t-k,n=t-C;return void 0===k||i>=e||0>i||z&&n>=g}function h(){var t=r();return f(t)?p(t):void(w=setTimeout(h,d(t)))}function p(t){return w=void 0,I&&_?n(t):(_=y=void 0,b)}function m(){void 0!==w&&clearTimeout(w),C=0,_=k=y=w=void 0}function x(){return void 0===w?b:p(r())}function v(){var t=r(),i=f(t);if(_=arguments,y=this,k=t,i){if(void 0===w)return c(k);if(z)return w=setTimeout(h,e),n(k)}return void 0===w&&(w=setTimeout(h,e)),b}var _,y,g,b,w,k,C=0,F=!1,z=!1,I=!0;if("function"!=typeof t)throw new TypeError(u);return e=s(e)||0,o(i)&&(F=!!i.leading,z="maxWait"in i,g=z?l(s(i.maxWait)||0,e):g,I="trailing"in i?!!i.trailing:I),v.cancel=m,v.flush=x,v}var o=i(1),r=i(14),s=i(15),u="Expected a function",l=Math.max,a=Math.min;t.exports=n},function(t,e){function i(t){return null!=t&&"object"==typeof t}t.exports=i},function(t,e,i){function n(t){return"symbol"==typeof t||o(t)&&u.call(t)==r}var o=i(12),r="[object Symbol]",s=Object.prototype,u=s.toString;t.exports=n},function(t,e,i){var n=i(10),o=function(){return n.Date.now()};t.exports=o},function(t,e,i){function n(t){if("number"==typeof t)return t;if(r(t))return s;if(o(t)){var e="function"==typeof t.valueOf?t.valueOf():t;t=o(e)?e+"":e}if("string"!=typeof t)return 0===t?t:+t;t=t.replace(u,"");var i=a.test(t);return i||c.test(t)?d(t.slice(2),i?2:8):l.test(t)?s:+t}var o=i(1),r=i(13),s=NaN,u=/^\s+|\s+$/g,l=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,c=/^0o[0-7]+$/i,d=parseInt;t.exports=n},function(t,e,i){(function(){var e,n;e=[],n=function(){var t,i,n,o;for(i=0,n=e.length;n>i;i++)t=e[i],t.apply(null,arguments);return o=!1},i(6)("resize",n),t.exports={data:function(){return{resizeCbDisposables:[]}},methods:{onWindowResize:function(t){var i;return e.push(t),i=function(){var i;return i=e.indexOf(t),i>-1?e.splice(i,1):void 0},this.resizeCbDisposables.push(i),function(t){return function(){var e;return i(),e=t.resizeCbDisposables.indexOf(i),e>-1?t.resizeCbDisposables.splice(e,1):void 0}}(this)}},beforeDestroy:function(){var t,e,i,n,o;for(i=this.resizeCbDisposables,o=[],t=0,e=i.length;e>t;t++)n=i[t],o.push(n());return o}}}).call(this)},function(t,e){(function(){var e;e=function(t,e,i){var n,o,r,s,u,l,a,c,d,f;if(null!=t&&null!=e){if(f=t.getAttribute("style"),n=null,null!=f){for(c=f.split(";"),n={},u=0,l=c.length;l>u;u++)d=c[u],d&&(a=d.split(":"),r=a[0],s=a[1]," "===r[0]&&(r=r.slice(1)),n[r]=s);null!=i&&""!==i?n[e]=i:null!=n[e]&&delete n[e]}else null!=i&&""!==i&&(n={},n[e]=i);if(o="",null!=n)for(e in n)i=n[e],o+=e+":"+i+";";return o?t.setAttribute("style",o):t.removeAttribute("style")}},t.exports={methods:{setCss:e}}}).call(this)},function(t,e){(function(){var e,i,n;i=function(t){return"string"==typeof t||t instanceof String},n=function(t){return t.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,"")},e=function(t){var e,o,r,s,u,l;if(Array.isArray(t))return t;if(i(t)){for(s={},l=t.split(";"),e=0,r=l.length;r>e;e++)u=l[e],o=u.split(":"),s[n(o[0])]=n(o[1]);return[s]}return[t]},t.exports={computed:{computedStyle:function(){var t;return t=e(this.style),null==this.mergeStyle?t:e(this.mergeStyle).concat(t)}}}}).call(this)},function(t,e){(function(){t.exports={computed:{Vue:function(){return Object.getPrototypeOf(Object.getPrototypeOf(this)).constructor}}}}).call(this)},function(t,e){(function(){var e;e=function(){var t,e;return null!=window.innerWidth?(e=window,t="inner"):(t="client",e=document.documentElement||document.body),{width:e[t+"Width"],height:e[t+"Height"]}},t.exports={methods:{getViewportSize:e}}}).call(this)},function(t,e){(function(){var e;e=function(t,e,i){var n;return document.documentElement.addEventListener(t,e,i),n=function(){return document.documentElement.removeEventListener(t,e),n=null}},t.exports={methods:{onDocument:e}}}).call(this)},function(t,e){(function(){var e;e=function(t,e,i){var n,o,r,s,u,l,a,c,d,f;if(null!=t&&null!=e){if(f=t.getAttribute("style"),n=null,null!=f){for(c=f.split(";"),n={},u=0,l=c.length;l>u;u++)d=c[u],d&&(a=d.split(":"),r=a[0],s=a[1]," "===r[0]&&(r=r.slice(1)),n[r]=s);null!=i&&""!==i?n[e]=i:null!=n[e]&&delete n[e]}else null!=i&&""!==i&&(n={},n[e]=i);if(o="",null!=n)for(e in n)i=n[e],o+=e+":"+i+";";return o?t.setAttribute("style",o):t.removeAttribute("style")}},t.exports={methods:{setCss:e}}}).call(this)},function(module,exports,__webpack_require__){!function(){module.exports={mixins:[__webpack_require__(22),__webpack_require__(21),__webpack_require__(20)],computed:{zIndex:function(){return null!=this.lastItem?this.lastItem.zIndex:995},color:function(){return null!=this.lastItem&&this.lastItem.color?this.lastItem.color:"black"},opacity:function(){return null!=this.lastItem?null!=this.lastItem.opacity?this.lastItem.opacity:.5:0},dismissable:function(){return null!=this.lastItem&&null!=this.lastItem.dismissable?this.lastItem.dismissable:!0},lastItem:function(){var t;return this.stack.length>0?(t=this.stack[this.stack.length-1],this.updateScroll(t),this.updateKeyListener(!0),t):(this.updateScroll(),this.updateKeyListener(),null)}},data:function(){return{stack:[]}},methods:{fade:function(t){var e,i,n;return i=t.el,n=t.opacity,e=t.cb,this.setCss(i,"opacity",n),e()},dismiss:function(t){return null!=t&&!t.defaultPrevented&&this.dismissable?"keyup"===t.type&&27!==t.which?null:(this.close(),t.preventDefault()):void 0},updateKeyListener:function(t){return!t||this.removeListener?("function"==typeof this.removeListener&&this.removeListener(),this.removeListener=null):this.removeListener?void 0:this.removeListener=this.onDocument("keyup",this.dismiss)},updateScroll:function(t){var e;if(e={o:null,m:null},t&&!t.allowScroll){if(this.scrollDisabled)return null;e.o="hidden",e.m=this.getViewportSize().width-document.documentElement.clientWidth+"px",this.scrollDisabled=!0}else this.scrollDisabled=!1;return this.setCss(document.documentElement,"overflow",e.o),this.setCss(document.documentElement,"margin-right",e.m)},open:function(t){var e;return null==t&&(t={}),null==this.lastItem&&document.body.appendChild(this.$el),"function"==typeof t.onBeforeOpen&&t.onBeforeOpen(),e=this.zIndex+5,(null==t.zIndex||t.zIndex<=e)&&(t.zIndex=e),this.stack.push(t),this.fade({el:this.$el,opacity:this.opacity,cb:function(){return"function"==typeof t.onOpened?t.onOpened():void 0}}),{zIndex:this.zIndex+1,close:function(e){return function(i){return null==i&&(i=!0),e.close(t,i)}}(this)}},close:function(t,e){var i;return null==t&&(t=this.lastItem),null==e&&(e=!0),(i=this.stack.indexOf(t))>-1?(this.stack.splice(i,1),e&&"function"==typeof t.onBeforeClose&&t.onBeforeClose(),this.fade({el:this.$el,opacity:this.opacity,cb:function(i){return function(){return e&&"function"==typeof t.onClosed&&t.onClosed(),null==i.lastItem?document.body.removeChild(i.$el):void 0}}(this)})):void 0}}}}(),module.exports.__esModule&&(module.exports=module.exports["default"]);var __vue__options__="function"==typeof module.exports?module.exports.options:module.exports;__vue__options__.render=function(){with(this)return _h("div",{style:{zIndex:zIndex,backgroundColor:color},attrs:{style:"opacity:0;position:fixed;top:-10px;left:0;right:0;height:120vh;willChange:opacity"},on:{click:dismiss}})},__vue__options__.staticRenderFns=[]},function(t,e,i){(function(){var e,n;n=null,e=function(t){return null==n&&(n=t.extend(e.obj),n=(new n).$mount()),n},e.obj=i(23),t.exports=e}).call(this)},function(module,exports,__webpack_require__){!function(){module.exports={components:{"drag-handle":__webpack_require__(3)},created:function(){return this.overlay=__webpack_require__(24)(this.Vue)},mixins:[__webpack_require__(19),__webpack_require__(16),__webpack_require__(17),__webpack_require__(8),__webpack_require__(7),__webpack_require__(18)],props:{id:{type:String},"class":{"default":function(){return["side-nav"]}},style:{"default":function(){return[]}},width:{type:Number,coerce:Number,"default":240},opacity:{type:Number,"default":.5,coerce:Number},right:{type:Boolean,"default":!1},notDismissable:{type:Boolean,"default":!1},closeOnClick:{type:Boolean,"default":!1},fixed:{type:Boolean,"default":!1},fixedScreenSize:{type:Number,coerce:Number,"default":992},transition:{type:Function,"default":function(t){var e,i,n;return i=t.el,n=t.style,e=t.cb,this.position=n[this.side].replace("px",""),e()}},zIndex:{type:Number,"default":1e3,coerce:Number}},computed:{side:function(){return this.right?"right":"left"},otherSide:function(){return this.right?"left":"right"},mergeClass:function(){return{fixed:this.fixed}},mergeStyle:function(){var t;return t={position:"fixed",width:this.width+"px",top:"0",margin:"0",height:"100%",zIndex:this.overlayZIndex+1,boxSizing:"border-box",transform:"translateX(0)"},t[this.side]=this.position+"px",t},realWidth:function(){var t;return null!=this.computedStyle[1]&&(t=this.computedStyle[1].width),null==t&&(t=this.computedStyle[0].width),t}},watch:{fixed:"processFixed",fixedScreenSize:"processFixed",side:"setParentMargin"},data:function(){return{isFixed:null,position:-1*(this.width+10),overlayZIndex:1001}},methods:{makeFixed:function(t){return t!==this.isFixed?(this.isFixed=t,this.setParentMargin(),this.$emit("fixed",t)):void 0},setParentMargin:function(){var t,e,i,n,o,r;if(this.$el.parentElement){for(r=this.isFixed?this.realWidth:null,n=this.$el.parentElement.children,o=[],e=0,i=n.length;i>e;e++)t=n[e],t!==this.$el?(this.setCss(t,"margin-"+this.side,r),o.push(this.setCss(t,"margin-"+this.otherSide,null))):o.push(void 0);return o}},processFixed:function(){return this.fixed?(this.makeFixed(window.innerWidth>this.fixedScreenSize),this.isFixed?this.position=0:this.position=-1*(this.width+10),this.disposeWindowResize=this.onWindowResize(function(t){return function(){if(window.innerWidth>t.fixedScreenSize){if(!t.isFixed)return t.opened?(t.close(!0),t.wasOpened=!0):t.show(!1),t.makeFixed(!0)}else if(t.isFixed)return t.wasOpened?t.open(!0):t.hide(!1),t.makeFixed(!1)}}(this))):(this.makeFixed(!1),this.opened?this.position=0:this.position=-1*(this.width+10),"function"==typeof this.disposeWindowResize&&this.disposeWindowResize()),this.setParentMargin()},onClick:function(t){return this.closeOnClick?this.dismiss(t):void 0},dismiss:function(t){return t.defaultPrevented||this.notDismissable||this.isFixed?void 0:(this.close(),t.preventDefault())},move:function(t){var e;return e=this.right?-1:1,this.position=-this.width+e*t},show:function(t){var e;return null==t&&(t=!0),this.$emit("before-enter"),t?(e={},e[this.side]="0",this.transition({el:this.$refs.nav,style:e,cb:function(t){return function(){return t.setCss(t.$refs.nav,"transform","translateX(0)"),t.setOpened(),t.$emit("after-enter")}}(this)})):(this.position=0,this.setOpened(),this.$emit("after-enter"))},hide:function(t){var e;return null==t&&(t=!0),this.wasOpened=!1,this.$emit("before-leave"),t?(e={},e[this.side]=-1*(this.width+10)+"px",this.transition({el:this.$refs.nav,style:e,cb:function(t){return function(){return t.setClosed(),t.$emit("after-leave")}}(this)})):(this.position=-1*(this.width+10),this.setClosed(),this.$emit("after-leave"))},open:function(t){var e,i,n;if(!this.opened||t)return i=this.overlay.open({zIndex:this.zIndex,opacity:this.opacity,onBeforeClose:function(t){return function(){return t.close()}}(this)}),n=i.zIndex,e=i.close,this.overlayZIndex=n,this.closeOverlay=e,t?void 0:this.show()},close:function(t){return this.opened?("function"==typeof this.closeOverlay&&this.closeOverlay(!1),this.closeOverlay=null,t?void 0:this.hide()):void 0},toggle:function(){return this.isFixed?this.opened=this.isOpened:this.opened?this.close():this.open()}},mounted:function(){return this.$nextTick(function(){return this.processFixed()})},beforeDestory:function(){return"function"==typeof this.closeOverlay?this.closeOverlay():void 0}}}(),module.exports.__esModule&&(module.exports=module.exports["default"]);var __vue__options__="function"==typeof module.exports?module.exports.options:module.exports;__vue__options__.render=function(){with(this)return _h("div",[_h("drag-handle",{style:{width:"20px",left:right?null:"0",right:right?"0":null},attrs:{disabled:opened||isFixed,"max-right":right?null:width,"max-left":right?width:null,"z-index":overlayZIndex},on:{move:move,max:function(t){open(!1)},aborted:hide}}),_h("drag-handle",{style:{left:"0",right:"0"},attrs:{disabled:!opened||isFixed,"max-right":right?width:null,"max-left":right?null:width,offset:right?-width:width,"z-index":overlayZIndex},on:{move:move,max:function(t){close(!1)},aborted:show,"clean-click":dismiss}}),_h("ul",{ref:"nav","class":computedClass,style:computedStyle,attrs:{id:id},on:{click:onClick,keyup:function(t){27===t.keyCode&&dismiss(t)}}},[_t("default")])])},__vue__options__.staticRenderFns=[]}]);