diff --git a/demo/index-2.html b/demo/index-2.html new file mode 100644 index 0000000..a46c246 --- /dev/null +++ b/demo/index-2.html @@ -0,0 +1,47 @@ + + + + + vue-multipane - Resizable split panes for Vue.js. + + + + + +
+ +
+
+
+

vue-multipane demo

+

Resizable split panes for Vue.js.

+ View GitHub page » +
+
+
+ +
+ +
+
+
+ +
+ + + +
+ + + + + + diff --git a/demo/main.js b/demo/main.js index 6a7c50e..93811a0 100644 --- a/demo/main.js +++ b/demo/main.js @@ -1 +1 @@ -!function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,t),i.l=!0,i.exports}var n={};t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=4)}([function(e,t){e.exports=function(e,t,n,r,i){var o,a=e=e||{},s=typeof e.default;"object"!==s&&"function"!==s||(o=e,a=e.default);var c="function"==typeof a?a.options:a;t&&(c.render=t.render,c.staticRenderFns=t.staticRenderFns),r&&(c._scopeId=r);var u;if(i?(u=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(i)},c._ssrRegister=u):n&&(u=n),u){var l=c.functional,f=l?c.render:c.beforeCreate;l?c.render=function(e,t){return u.call(t),f(e,t)}:c.beforeCreate=f?[].concat(f,u):[u]}return{esModule:o,exports:a,options:c}}},function(e,t){function n(e,t){var n=e[1]||"",i=e[3];if(!i)return n;if(t&&"function"==typeof btoa){var o=r(i);return[n].concat(i.sources.map(function(e){return"/*# sourceURL="+i.sourceRoot+e+" */"})).concat([o]).join("\n")}return[n].join("\n")}function r(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var r=n(t,e);return t[2]?"@media "+t[2]+"{"+r+"}":r}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var r={},i=0;in.parts.length&&(r.parts.length=n.parts.length)}else{for(var a=[],i=0;i=0&&Math.floor(t)===t&&isFinite(e)}function f(e){return null==e?"":"object"==typeof e?JSON.stringify(e,null,2):String(e)}function p(e){var t=parseFloat(e);return isNaN(t)?e:t}function d(e,t){for(var n=Object.create(null),r=e.split(","),i=0;i-1)return e.splice(n,1)}}function h(e,t){return Bi.call(e,t)}function m(e){var t=Object.create(null);return function(n){return t[n]||(t[n]=e(n))}}function g(e,t){function n(n){var r=arguments.length;return r?r>1?e.apply(t,arguments):e.call(t,n):e.call(t)}return n._length=e.length,n}function y(e,t){t=t||0;for(var n=e.length-t,r=new Array(n);n--;)r[n]=e[n+t];return r}function _(e,t){for(var n in t)e[n]=t[n];return e}function b(e){for(var t={},n=0;nVo&&Do[n].id>e.id;)n--;Do.splice(n+1,0,e)}else Do.push(e);Uo||(Uo=!0,Co(je))}}function Re(e){Jo.clear(),ze(e,Jo)}function ze(e,t){var n,r,i=Array.isArray(e);if((i||s(e))&&Object.isExtensible(e)){if(e.__ob__){var o=e.__ob__.dep.id;if(t.has(o))return;t.add(o)}if(i)for(n=e.length;n--;)ze(e[n],t);else for(r=Object.keys(e),n=r.length;n--;)ze(e[r[n]],t)}}function Ie(e,t,n){qo.get=function(){return this[t][n]},qo.set=function(e){this[t][n]=e},Object.defineProperty(e,n,qo)}function De(e){e._watchers=[];var t=e.$options;t.props&&Fe(e,t.props),t.methods&&Ke(e,t.methods),t.data?He(e):N(e._data={},!0),t.computed&&Be(e,t.computed),t.watch&&t.watch!==vo&&Je(e,t.watch)}function Fe(e,t){var n=e.$options.propsData||{},r=e._props={},i=e.$options._propKeys=[],o=!e.$parent;To.shouldConvert=o;for(var a in t)!function(o){i.push(o);var a=q(o,t,n,e);L(r,o,a),o in e||Ie(e,"_props",o)}(a);To.shouldConvert=!0}function He(e){var t=e.$options.data;t=e._data="function"==typeof t?Ue(t,e):t||{},c(t)||(t={});for(var n=Object.keys(t),r=e.$options.props,i=(e.$options.methods,n.length);i--;){var o=n[i];r&&h(r,o)||k(o)||Ie(e,"_data",o)}N(t,!0)}function Ue(e,t){try{return e.call(t)}catch(e){return S(e,t,"data()"),{}}}function Be(e,t){var n=e._computedWatchers=Object.create(null),r=_o();for(var i in t){var o=t[i],a="function"==typeof o?o:o.get;r||(n[i]=new Ko(e,a||x,x,Go)),i in e||Ve(e,i,o)}}function Ve(e,t,n){var r=!_o();"function"==typeof n?(qo.get=r?We(t):n,qo.set=x):(qo.get=n.get?r&&!1!==n.cache?We(t):n.get:x,qo.set=n.set?n.set:x),Object.defineProperty(e,t,qo)}function We(e){return function(){var t=this._computedWatchers&&this._computedWatchers[e];if(t)return t.dirty&&t.evaluate(),$o.target&&t.depend(),t.value}}function Ke(e,t){e.$options.props;for(var n in t)e[n]=null==t[n]?x:g(t[n],e)}function Je(e,t){for(var n in t){var r=t[n];if(Array.isArray(r))for(var i=0;i=0||n.indexOf(e[i])<0)&&r.push(e[i]);return r}return e}function wt(e){this._init(e)}function $t(e){e.use=function(e){var t=this._installedPlugins||(this._installedPlugins=[]);if(t.indexOf(e)>-1)return this;var n=y(arguments,1);return n.unshift(this),"function"==typeof e.install?e.install.apply(e,n):"function"==typeof e&&e.apply(null,n),t.push(e),this}}function kt(e){e.mixin=function(e){return this.options=K(this.options,e),this}}function At(e){e.cid=0;var t=1;e.extend=function(e){e=e||{};var n=this,r=n.cid,i=e._Ctor||(e._Ctor={});if(i[r])return i[r];var o=e.name||n.options.name,a=function(e){this._init(e)};return a.prototype=Object.create(n.prototype),a.prototype.constructor=a,a.cid=t++,a.options=K(n.options,e),a.super=n,a.options.props&&Ot(a),a.options.computed&&St(a),a.extend=n.extend,a.mixin=n.mixin,a.use=n.use,Yi.forEach(function(e){a[e]=n[e]}),o&&(a.options.components[o]=a),a.superOptions=n.options,a.extendOptions=e,a.sealedOptions=_({},a.options),i[r]=a,a}}function Ot(e){var t=e.options.props;for(var n in t)Ie(e.prototype,"_props",n)}function St(e){var t=e.options.computed;for(var n in t)Ve(e.prototype,n,t[n])}function Tt(e){Yi.forEach(function(t){e[t]=function(e,n){return n?("component"===t&&c(n)&&(n.name=n.name||e,n=this.options._base.extend(n)),"directive"===t&&"function"==typeof n&&(n={bind:n,update:n}),this.options[t+"s"][e]=n,n):this.options[t+"s"][e]}})}function Et(e){return e&&(e.Ctor.options.name||e.tag)}function jt(e,t){return Array.isArray(e)?e.indexOf(t)>-1:"string"==typeof e?e.split(",").indexOf(t)>-1:!!u(e)&&e.test(t)}function Mt(e,t,n){for(var r in e){var i=e[r];if(i){var o=Et(i.componentOptions);o&&!n(o)&&(i!==t&&Pt(i),e[r]=null)}}}function Pt(e){e&&e.componentInstance.$destroy()}function Nt(e){for(var t=e.data,n=e,i=e;r(i.componentInstance);)i=i.componentInstance._vnode,i.data&&(t=Lt(i.data,t));for(;r(n=n.parent);)n.data&&(t=Lt(t,n.data));return Rt(t.staticClass,t.class)}function Lt(e,t){return{staticClass:zt(e.staticClass,t.staticClass),class:r(e.class)?[e.class,t.class]:t.class}}function Rt(e,t){return r(e)||r(t)?zt(e,It(t)):""}function zt(e,t){return e?t?e+" "+t:e:t||""}function It(e){return Array.isArray(e)?Dt(e):s(e)?Ft(e):"string"==typeof e?e:""}function Dt(e){for(var t,n="",i=0,o=e.length;i-1?Oa[e]=t.constructor===window.HTMLUnknownElement||t.constructor===window.HTMLElement:Oa[e]=/HTMLUnknownElement/.test(t.toString())}function Bt(e){if("string"==typeof e){var t=document.querySelector(e);return t||document.createElement("div")}return e}function Vt(e,t){var n=document.createElement(e);return"select"!==e?n:(t.data&&t.data.attrs&&void 0!==t.data.attrs.multiple&&n.setAttribute("multiple","multiple"),n)}function Wt(e,t){return document.createElementNS(Ca[e],t)}function Kt(e){return document.createTextNode(e)}function Jt(e){return document.createComment(e)}function qt(e,t,n){e.insertBefore(t,n)}function Gt(e,t){e.removeChild(t)}function Zt(e,t){e.appendChild(t)}function Xt(e){return e.parentNode}function Yt(e){return e.nextSibling}function Qt(e){return e.tagName}function en(e,t){e.textContent=t}function tn(e,t,n){e.setAttribute(t,n)}function nn(e,t){var n=e.data.ref;if(n){var r=e.context,i=e.componentInstance||e.elm,o=r.$refs;t?Array.isArray(o[n])?v(o[n],i):o[n]===i&&(o[n]=void 0):e.data.refInFor?Array.isArray(o[n])?o[n].indexOf(i)<0&&o[n].push(i):o[n]=[i]:o[n]=i}}function rn(e,t){return e.key===t.key&&(e.tag===t.tag&&e.isComment===t.isComment&&r(e.data)===r(t.data)&&on(e,t)||i(e.isAsyncPlaceholder)&&e.asyncFactory===t.asyncFactory&&n(t.asyncFactory.error))}function on(e,t){if("input"!==e.tag)return!0;var n,i=r(n=e.data)&&r(n=n.attrs)&&n.type,o=r(n=t.data)&&r(n=n.attrs)&&n.type;return i===o||Sa(i)&&Sa(o)}function an(e,t,n){var i,o,a={};for(i=t;i<=n;++i)o=e[i].key,r(o)&&(a[o]=i);return a}function sn(e,t){(e.data.directives||t.data.directives)&&cn(e,t)}function cn(e,t){var n,r,i,o=e===ja,a=t===ja,s=un(e.data.directives,e.context),c=un(t.data.directives,t.context),u=[],l=[];for(n in c)r=s[n],i=c[n],r?(i.oldValue=r.value,fn(i,"update",t,e),i.def&&i.def.componentUpdated&&l.push(i)):(fn(i,"bind",t,e),i.def&&i.def.inserted&&u.push(i));if(u.length){var f=function(){for(var n=0;n=0&&" "===(m=e.charAt(h));h--);m&&Ia.test(m)||(l=!0)}}else void 0===o?(v=i+1,o=e.slice(0,i).trim()):t();if(void 0===o?o=e.slice(0,i).trim():0!==v&&t(),a)for(i=0;i=ia}function En(e){return 34===e||39===e}function jn(e){var t=1;for(ca=sa;!Tn();)if(e=Sn(),En(e))Mn(e);else if(91===e&&t++,93===e&&t--,0===t){ua=sa;break}}function Mn(e){for(var t=e;!Tn()&&(e=Sn())!==t;);}function Pn(e,t,n){la=n;var r=t.value,i=t.modifiers,o=e.tag,a=e.attrsMap.type;if(e.component)return kn(e,r,i),!1;if("select"===o)Rn(e,r,i);else if("input"===o&&"checkbox"===a)Nn(e,r,i);else if("input"===o&&"radio"===a)Ln(e,r,i);else if("input"===o||"textarea"===o)zn(e,r,i);else if(!eo.isReservedTag(o))return kn(e,r,i),!1;return!0}function Nn(e,t,n){var r=n&&n.number,i=wn(e,"value")||"null",o=wn(e,"true-value")||"true",a=wn(e,"false-value")||"false";_n(e,"checked","Array.isArray("+t+")?_i("+t+","+i+")>-1"+("true"===o?":("+t+")":":_q("+t+","+o+")")),Cn(e,Fa,"var $$a="+t+",$$el=$event.target,$$c=$$el.checked?("+o+"):("+a+");if(Array.isArray($$a)){var $$v="+(r?"_n("+i+")":i)+",$$i=_i($$a,$$v);if($$el.checked){$$i<0&&("+t+"=$$a.concat([$$v]))}else{$$i>-1&&("+t+"=$$a.slice(0,$$i).concat($$a.slice($$i+1)))}}else{"+An(t,"$$c")+"}",null,!0)}function Ln(e,t,n){var r=n&&n.number,i=wn(e,"value")||"null";i=r?"_n("+i+")":i,_n(e,"checked","_q("+t+","+i+")"),Cn(e,Fa,An(t,i),null,!0)}function Rn(e,t,n){var r=n&&n.number,i='Array.prototype.filter.call($event.target.options,function(o){return o.selected}).map(function(o){var val = "_value" in o ? o._value : o.value;return '+(r?"_n(val)":"val")+"})",o="var $$selectedVal = "+i+";";o=o+" "+An(t,"$event.target.multiple ? $$selectedVal : $$selectedVal[0]"),Cn(e,"change",o,null,!0)}function zn(e,t,n){var r=e.attrsMap.type,i=n||{},o=i.lazy,a=i.number,s=i.trim,c=!o&&"range"!==r,u=o?"change":"range"===r?Da:"input",l="$event.target.value";s&&(l="$event.target.value.trim()"),a&&(l="_n("+l+")");var f=An(t,l);c&&(f="if($event.target.composing)return;"+f),_n(e,"value","("+t+")"),Cn(e,u,f,null,!0),(s||a)&&Cn(e,"blur","$forceUpdate()")}function In(e){var t;r(e[Da])&&(t=so?"change":"input",e[t]=[].concat(e[Da],e[t]||[]),delete e[Da]),r(e[Fa])&&(t=po?"click":"change",e[t]=[].concat(e[Fa],e[t]||[]),delete e[Fa])}function Dn(e,t,n,r,i){if(n){var o=t,a=fa;t=function(n){null!==(1===arguments.length?o(n):o.apply(null,arguments))&&Fn(e,t,r,a)}}fa.addEventListener(e,t,ho?{capture:r,passive:i}:r)}function Fn(e,t,n,r){(r||fa).removeEventListener(e,t,n)}function Hn(e,t){if(!n(e.data.on)||!n(t.data.on)){var r=t.data.on||{},i=e.data.on||{};fa=t.elm,In(r),re(r,i,Dn,Fn,t.context)}}function Un(e,t){if(!n(e.data.domProps)||!n(t.data.domProps)){var i,o,a=t.elm,s=e.data.domProps||{},c=t.data.domProps||{};r(c.__ob__)&&(c=t.data.domProps=_({},c));for(i in s)n(c[i])&&(a[i]="");for(i in c)if(o=c[i],"textContent"!==i&&"innerHTML"!==i||(t.children&&(t.children.length=0),o!==s[i]))if("value"===i){a._value=o;var u=n(o)?"":String(o);Bn(a,t,u)&&(a.value=u)}else a[i]=o}}function Bn(e,t,n){return!e.composing&&("option"===t.tag||Vn(e,n)||Wn(e,n))}function Vn(e,t){var n=!0;try{n=document.activeElement!==e}catch(e){}return n&&e.value!==t}function Wn(e,t){var n=e.value,i=e._vModifiers;return r(i)&&i.number?p(n)!==p(t):r(i)&&i.trim?n.trim()!==t.trim():n!==t}function Kn(e){var t=Jn(e.style);return e.staticStyle?_(e.staticStyle,t):t}function Jn(e){return Array.isArray(e)?b(e):"string"==typeof e?Ba(e):e}function qn(e,t){var n,r={};if(t)for(var i=e;i.componentInstance;)i=i.componentInstance._vnode,i.data&&(n=Kn(i.data))&&_(r,n);(n=Kn(e.data))&&_(r,n);for(var o=e;o=o.parent;)o.data&&(n=Kn(o.data))&&_(r,n);return r}function Gn(e,t){var i=t.data,o=e.data;if(!(n(i.staticStyle)&&n(i.style)&&n(o.staticStyle)&&n(o.style))){var a,s,c=t.elm,u=o.staticStyle,l=o.normalizedStyle||o.style||{},f=u||l,p=Jn(t.data.style)||{};t.data.normalizedStyle=r(p.__ob__)?_({},p):p;var d=qn(t,!0);for(s in f)n(d[s])&&Ka(c,s,"");for(s in d)(a=d[s])!==f[s]&&Ka(c,s,null==a?"":a)}}function Zn(e,t){if(t&&(t=t.trim()))if(e.classList)t.indexOf(" ")>-1?t.split(/\s+/).forEach(function(t){return e.classList.add(t)}):e.classList.add(t);else{var n=" "+(e.getAttribute("class")||"")+" ";n.indexOf(" "+t+" ")<0&&e.setAttribute("class",(n+t).trim())}}function Xn(e,t){if(t&&(t=t.trim()))if(e.classList)t.indexOf(" ")>-1?t.split(/\s+/).forEach(function(t){return e.classList.remove(t)}):e.classList.remove(t),e.classList.length||e.removeAttribute("class");else{for(var n=" "+(e.getAttribute("class")||"")+" ",r=" "+t+" ";n.indexOf(r)>=0;)n=n.replace(r," ");n=n.trim(),n?e.setAttribute("class",n):e.removeAttribute("class")}}function Yn(e){if(e){if("object"==typeof e){var t={};return!1!==e.css&&_(t,Za(e.name||"v")),_(t,e),t}return"string"==typeof e?Za(e):void 0}}function Qn(e){is(function(){is(e)})}function er(e,t){var n=e._transitionClasses||(e._transitionClasses=[]);n.indexOf(t)<0&&(n.push(t),Zn(e,t))}function tr(e,t){e._transitionClasses&&v(e._transitionClasses,t),Xn(e,t)}function nr(e,t,n){var r=rr(e,t),i=r.type,o=r.timeout,a=r.propCount;if(!i)return n();var s=i===Ya?ts:rs,c=0,u=function(){e.removeEventListener(s,l),n()},l=function(t){t.target===e&&++c>=a&&u()};setTimeout(function(){c0&&(n=Ya,l=a,f=o.length):t===Qa?u>0&&(n=Qa,l=u,f=c.length):(l=Math.max(a,u),n=l>0?a>u?Ya:Qa:null,f=n?n===Ya?o.length:c.length:0),{type:n,timeout:l,propCount:f,hasTransform:n===Ya&&os.test(r[es+"Property"])}}function ir(e,t){for(;e.length1}function lr(e,t){!0!==t.data.show&&ar(t)}function fr(e,t,n){pr(e,t,n),(so||uo)&&setTimeout(function(){pr(e,t,n)},0)}function pr(e,t,n){var r=t.value,i=e.multiple;if(!i||Array.isArray(r)){for(var o,a,s=0,c=e.options.length;s-1,a.selected!==o&&(a.selected=o);else if(C(vr(a),r))return void(e.selectedIndex!==s&&(e.selectedIndex=s));i||(e.selectedIndex=-1)}}function dr(e,t){return t.every(function(t){return!C(t,e)})}function vr(e){return"_value"in e?e._value:e.value}function hr(e){e.target.composing=!0}function mr(e){e.target.composing&&(e.target.composing=!1,gr(e.target,"input"))}function gr(e,t){var n=document.createEvent("HTMLEvents");n.initEvent(t,!0,!0),e.dispatchEvent(n)}function yr(e){return!e.componentInstance||e.data&&e.data.transition?e:yr(e.componentInstance._vnode)}function _r(e){var t=e&&e.componentOptions;return t&&t.Ctor.options.abstract?_r(he(t.children)):e}function br(e){var t={},n=e.$options;for(var r in n.propsData)t[r]=e[r];var i=n._parentListeners;for(var o in i)t[Wi(o)]=i[o];return t}function xr(e,t){if(/\d-keep-alive$/.test(t.tag))return e("keep-alive",{props:t.componentOptions.propsData})}function Cr(e){for(;e=e.parent;)if(e.data.transition)return!0}function wr(e,t){return t.key===e.key&&t.tag===e.tag}function $r(e){e.elm._moveCb&&e.elm._moveCb(),e.elm._enterCb&&e.elm._enterCb()}function kr(e){e.data.newPos=e.elm.getBoundingClientRect()}function Ar(e){var t=e.data.pos,n=e.data.newPos,r=t.left-n.left,i=t.top-n.top;if(r||i){e.data.moved=!0;var o=e.elm.style;o.transform=o.WebkitTransform="translate("+r+"px,"+i+"px)",o.transitionDuration="0s"}}function Or(e,t){var n=t?Cs(t):bs;if(n.test(e)){for(var r,i,o=[],a=n.lastIndex=0;r=n.exec(e);){i=r.index,i>a&&o.push(JSON.stringify(e.slice(a,i)));var s=hn(r[1].trim());o.push("_s("+s+")"),a=i+r[0].length}return a=0&&a[i].lowerCasedTag!==s;i--);else i=0;if(i>=0){for(var c=a.length-1;c>=i;c--)t.end&&t.end(a[c].tag,n,r);a.length=i,o=i&&a[i-1].tag}else"br"===s?t.start&&t.start(e,[],!0,n,r):"p"===s&&(t.start&&t.start(e,[],!1,n,r),t.end&&t.end(e,n,r))}for(var i,o,a=[],s=t.expectHTML,c=t.isUnaryTag||Gi,u=t.canBeLeftOpenTag||Gi,l=0;e;){if(i=e,o&&Ys(o)){var f=0,p=o.toLowerCase(),d=Qs[p]||(Qs[p]=new RegExp("([\\s\\S]*?)(]*>)","i")),v=e.replace(d,function(e,n,r){return f=r.length,Ys(p)||"noscript"===p||(n=n.replace(//g,"$1").replace(//g,"$1")),ic(p,n)&&(n=n.slice(1)),t.chars&&t.chars(n),""});l+=e.length-v.length,e=v,r(p,l-f,l)}else{var h=e.indexOf("<");if(0===h){if(Ds.test(e)){var m=e.indexOf("--\x3e");if(m>=0){t.shouldKeepComment&&t.comment(e.substring(4,m)),n(m+3);continue}}if(Fs.test(e)){var g=e.indexOf("]>");if(g>=0){n(g+2);continue}}var y=e.match(Is);if(y){n(y[0].length);continue}var _=e.match(zs);if(_){var b=l;n(_[0].length),r(_[1],b,l);continue}var x=function(){var t=e.match(Ls);if(t){var r={tagName:t[1],attrs:[],start:l};n(t[0].length);for(var i,o;!(i=e.match(Rs))&&(o=e.match(Ms));)n(o[0].length),r.attrs.push(o);if(i)return r.unarySlash=i[1],n(i[0].length),r.end=l,r}}();if(x){!function(e){var n=e.tagName,i=e.unarySlash;s&&("p"===o&&Ts(n)&&r(o),u(n)&&o===n&&r(n));for(var l=c(n)||!!i,f=e.attrs.length,p=new Array(f),d=0;d=0){for(w=e.slice(h);!(zs.test(w)||Ls.test(w)||Ds.test(w)||Fs.test(w)||($=w.indexOf("<",1))<0);)h+=$,w=e.slice(h);C=e.substring(0,h),n(h)}h<0&&(C=e,e=""),t.chars&&C&&t.chars(C)}if(e===i){t.chars&&t.chars(e);break}}r()}function Rr(e,t){function n(e){e.pre&&(s=!1),Js(e.tag)&&(c=!1)}Us=t.warn||gn,Js=t.isPreTag||Gi,qs=t.mustUseProp||Gi,Gs=t.getTagNamespace||Gi,Vs=yn(t.modules,"transformNode"),Ws=yn(t.modules,"preTransformNode"),Ks=yn(t.modules,"postTransformNode"),Bs=t.delimiters;var r,i,o=[],a=!1!==t.preserveWhitespace,s=!1,c=!1;return Lr(e,{warn:Us,expectHTML:t.expectHTML,isUnaryTag:t.isUnaryTag,canBeLeftOpenTag:t.canBeLeftOpenTag,shouldDecodeNewlines:t.shouldDecodeNewlines,shouldKeepComment:t.comments,start:function(e,a,u){var l=i&&i.ns||Gs(e);so&&"svg"===l&&(a=ti(a));var f={type:1,tag:e,attrsList:a,attrsMap:Yr(a),parent:i,children:[]};l&&(f.ns=l),ei(f)&&!_o()&&(f.forbidden=!0);for(var p=0;p0,uo=ao&&ao.indexOf("edge/")>0,lo=ao&&ao.indexOf("android")>0,fo=ao&&/iphone|ipad|ipod|ios/.test(ao),po=ao&&/chrome\/\d+/.test(ao)&&!uo,vo={}.watch,ho=!1;if(oo)try{var mo={};Object.defineProperty(mo,"passive",{get:function(){ho=!0}}),window.addEventListener("test-passive",null,mo)}catch(e){}var go,yo,_o=function(){return void 0===go&&(go=!oo&&void 0!==t&&"server"===t.process.env.VUE_ENV),go},bo=oo&&window.__VUE_DEVTOOLS_GLOBAL_HOOK__,xo="undefined"!=typeof Symbol&&T(Symbol)&&"undefined"!=typeof Reflect&&T(Reflect.ownKeys),Co=function(){function e(){r=!1;var e=n.slice(0);n.length=0;for(var t=0;t1?y(n):n;for(var r=y(arguments,1),i=0,o=n.length;i1&&(t[n[0].trim()]=n[1].trim())}}),t}),Va=/^--/,Wa=/\s*!important$/,Ka=function(e,t,n){if(Va.test(t))e.style.setProperty(t,n);else if(Wa.test(n))e.style.setProperty(t,n.replace(Wa,""),"important");else{var r=qa(t);if(Array.isArray(n))for(var i=0,o=n.length;iv?(f=n(i[g+1])?null:i[g+1].elm,y(e,f,i,d,g,o)):d>g&&b(e,t,p,v)}function w(e,t,n,i){for(var o=n;o',n.innerHTML.indexOf(t)>0}("\n"," "),bs=/\{\{((?:.|\n)+?)\}\}/g,xs=/[-.*+?^${}()|[\]\/\\]/g,Cs=m(function(e){var t=e[0].replace(xs,"\\$&"),n=e[1].replace(xs,"\\$&");return new RegExp(t+"((?:.|\\n)+?)"+n,"g")}),ws={staticKeys:["staticClass"],transformNode:Sr,genData:Tr},$s={staticKeys:["staticStyle"],transformNode:Er,genData:jr},ks=[ws,$s],As={model:Pn,text:Mr,html:Pr},Os=d("area,base,br,col,embed,frame,hr,img,input,isindex,keygen,link,meta,param,source,track,wbr"),Ss=d("colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr,source"),Ts=d("address,article,aside,base,blockquote,body,caption,col,colgroup,dd,details,dialog,div,dl,dt,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,head,header,hgroup,hr,html,legend,li,menuitem,meta,optgroup,option,param,rp,rt,source,style,summary,tbody,td,tfoot,th,thead,title,tr,track"),Es={expectHTML:!0,modules:ks,directives:As,isPreTag:ka,isUnaryTag:Os,mustUseProp:ha,canBeLeftOpenTag:Ss,isReservedTag:Aa,getTagNamespace:Ht,staticKeys:function(e){return e.reduce(function(e,t){return e.concat(t.staticKeys||[])},[]).join(",")}(ks)},js={decode:function(e){return ys=ys||document.createElement("div"),ys.innerHTML=e,ys.textContent}},Ms=/^\s*([^\s"'<>\/=]+)(?:\s*(=)\s*(?:"([^"]*)"+|'([^']*)'+|([^\s"'=<>`]+)))?/,Ps="[a-zA-Z_][\\w\\-\\.]*",Ns="((?:"+Ps+"\\:)?"+Ps+")",Ls=new RegExp("^<"+Ns),Rs=/^\s*(\/?)>/,zs=new RegExp("^<\\/"+Ns+"[^>]*>"),Is=/^]+>/i,Ds=/^/g,"$1").replace(//g,"$1")),bo(u,n)&&(n=n.slice(1)),t.chars&&t.chars(n),""});c+=e.length-p.length,e=p,A(u,c-l,c)}else{var d=e.indexOf("<");if(0===d){if(uo.test(e)){var v=e.indexOf("--\x3e");if(v>=0){t.shouldKeepComment&&t.comment(e.substring(4,v)),C(v+3);continue}}if(fo.test(e)){var h=e.indexOf("]>");if(h>=0){C(h+2);continue}}var m=e.match(lo);if(m){C(m[0].length);continue}var g=e.match(co);if(g){var y=c;C(g[0].length),A(g[1],y,c);continue}var _=$();if(_){k(_),bo(r,e)&&C(1);continue}}var b=void 0,w=void 0,x=void 0;if(d>=0){for(w=e.slice(d);!(co.test(w)||ao.test(w)||uo.test(w)||fo.test(w)||(x=w.indexOf("<",1))<0);)d+=x,w=e.slice(d);b=e.substring(0,d),C(d)}d<0&&(b=e,e=""),t.chars&&b&&t.chars(b)}if(e===n){t.chars&&t.chars(e);break}}function C(t){c+=t,e=e.substring(t)}function $(){var t=e.match(ao);if(t){var n,r,i={tagName:t[1],attrs:[],start:c};for(C(t[0].length);!(n=e.match(so))&&(r=e.match(ro));)C(r[0].length),i.attrs.push(r);if(n)return i.unarySlash=n[1],C(n[0].length),i.end=c,i}}function k(e){var n=e.tagName,c=e.unarySlash;o&&("p"===r&&no(n)&&A(r),s(n)&&r===n&&A(n));for(var l=a(n)||!!c,u=e.attrs.length,f=new Array(u),p=0;p=0&&i[a].lowerCasedTag!==s;a--);else a=0;if(a>=0){for(var l=i.length-1;l>=a;l--)t.end&&t.end(i[l].tag,n,o);i.length=a,r=a&&i[a-1].tag}else"br"===s?t.start&&t.start(e,[],!0,n,o):"p"===s&&(t.start&&t.start(e,[],!1,n,o),t.end&&t.end(e,n,o))}A()}(e,{warn:xo,expectHTML:t.expectHTML,isUnaryTag:t.isUnaryTag,canBeLeftOpenTag:t.canBeLeftOpenTag,shouldDecodeNewlines:t.shouldDecodeNewlines,shouldDecodeNewlinesForHref:t.shouldDecodeNewlinesForHref,shouldKeepComment:t.comments,start:function(e,o,l){var u=r&&r.ns||So(e);X&&"svg"===u&&(o=function(e){for(var t=[],n=0;n-1"+("true"===o?":("+t+")":":_q("+t+","+o+")")),Cr(e,"change","var $$a="+t+",$$el=$event.target,$$c=$$el.checked?("+o+"):("+a+");if(Array.isArray($$a)){var $$v="+(r?"_n("+i+")":i)+",$$i=_i($$a,$$v);if($$el.checked){$$i<0&&("+Or(t,"$$a.concat([$$v])")+")}else{$$i>-1&&("+Or(t,"$$a.slice(0,$$i).concat($$a.slice($$i+1))")+")}}else{"+Or(t,"$$c")+"}",null,!0)}(e,r,i);else if("input"===o&&"radio"===a)!function(e,t,n){var r=n&&n.number,i=$r(e,"value")||"null";_r(e,"checked","_q("+t+","+(i=r?"_n("+i+")":i)+")"),Cr(e,"change",Or(t,i),null,!0)}(e,r,i);else if("input"===o||"textarea"===o)!function(e,t,n){var r=e.attrsMap.type,i=n||{},o=i.lazy,a=i.number,s=i.trim,c=!o&&"range"!==r,l=o?"change":"range"===r?Nr:"input",u="$event.target.value";s&&(u="$event.target.value.trim()"),a&&(u="_n("+u+")");var f=Or(t,u);c&&(f="if($event.target.composing)return;"+f),_r(e,"value","("+t+")"),Cr(e,l,f,null,!0),(s||a)&&Cr(e,"blur","$forceUpdate()")}(e,r,i);else if(!F.isReservedTag(o))return Ar(e,r,i),!1;return!0},text:function(e,t){t.value&&_r(e,"textContent","_s("+t.value+")")},html:function(e,t){t.value&&_r(e,"innerHTML","_s("+t.value+")")}},isPreTag:function(e){return"pre"===e},isUnaryTag:eo,mustUseProp:Cn,canBeLeftOpenTag:to,isReservedTag:Rn,getTagNamespace:zn,staticKeys:function(e){return e.reduce(function(e,t){return e.concat(t.staticKeys||[])},[]).join(",")}(qo)},Zo=w(function(e){return h("type,tag,attrsList,attrsMap,plain,parent,children,attrs"+(e?","+e:""))});function Qo(e,t){e&&(Go=Zo(t.staticKeys||""),Xo=t.isReservedTag||j,function e(t){t.static=function(e){if(2===e.type)return!1;if(3===e.type)return!0;return!(!e.pre&&(e.hasBindings||e.if||e.for||m(e.tag)||!Xo(e.tag)||function(e){for(;e.parent;){if("template"!==(e=e.parent).tag)return!1;if(e.for)return!0}return!1}(e)||!Object.keys(e).every(Go)))}(t);if(1===t.type){if(!Xo(t.tag)&&"slot"!==t.tag&&null==t.attrsMap["inline-template"])return;for(var n=0,r=t.children.length;n|^function\s*\(/,ta=/^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*|\['[^']*?']|\["[^"]*?"]|\[\d+]|\[[A-Za-z_$][\w$]*])*$/,na={esc:27,tab:9,enter:13,space:32,up:38,left:37,right:39,down:40,delete:[8,46]},ra={esc:"Escape",tab:"Tab",enter:"Enter",space:" ",up:["Up","ArrowUp"],left:["Left","ArrowLeft"],right:["Right","ArrowRight"],down:["Down","ArrowDown"],delete:["Backspace","Delete"]},ia=function(e){return"if("+e+")return null;"},oa={stop:"$event.stopPropagation();",prevent:"$event.preventDefault();",self:ia("$event.target !== $event.currentTarget"),ctrl:ia("!$event.ctrlKey"),shift:ia("!$event.shiftKey"),alt:ia("!$event.altKey"),meta:ia("!$event.metaKey"),left:ia("'button' in $event && $event.button !== 0"),middle:ia("'button' in $event && $event.button !== 1"),right:ia("'button' in $event && $event.button !== 2")};function aa(e,t,n){var r=t?"nativeOn:{":"on:{";for(var i in e)r+='"'+i+'":'+sa(i,e[i])+",";return r.slice(0,-1)+"}"}function sa(e,t){if(!t)return"function(){}";if(Array.isArray(t))return"["+t.map(function(t){return sa(e,t)}).join(",")+"]";var n=ta.test(t.value),r=ea.test(t.value);if(t.modifiers){var i="",o="",a=[];for(var s in t.modifiers)if(oa[s])o+=oa[s],na[s]&&a.push(s);else if("exact"===s){var c=t.modifiers;o+=ia(["ctrl","shift","alt","meta"].filter(function(e){return!c[e]}).map(function(e){return"$event."+e+"Key"}).join("||"))}else a.push(s);return a.length&&(i+=function(e){return"if(!('button' in $event)&&"+e.map(ca).join("&&")+")return null;"}(a)),o&&(i+=o),"function($event){"+i+(n?"return "+t.value+"($event)":r?"return ("+t.value+")($event)":t.value)+"}"}return n||r?t.value:"function($event){"+t.value+"}"}function ca(e){var t=parseInt(e,10);if(t)return"$event.keyCode!=="+t;var n=na[e],r=ra[e];return"_k($event.keyCode,"+JSON.stringify(e)+","+JSON.stringify(n)+",$event.key,"+JSON.stringify(r)+")"}var la={on:function(e,t){e.wrapListeners=function(e){return"_g("+e+","+t.value+")"}},bind:function(e,t){e.wrapData=function(n){return"_b("+n+",'"+e.tag+"',"+t.value+","+(t.modifiers&&t.modifiers.prop?"true":"false")+(t.modifiers&&t.modifiers.sync?",true":"")+")"}},cloak:M},ua=function(e){this.options=e,this.warn=e.warn||gr,this.transforms=yr(e.modules,"transformCode"),this.dataGenFns=yr(e.modules,"genData"),this.directives=S(S({},la),e.directives);var t=e.isReservedTag||j;this.maybeComponent=function(e){return!t(e.tag)},this.onceId=0,this.staticRenderFns=[]};function fa(e,t){var n=new ua(t);return{render:"with(this){return "+(e?pa(e,n):'_c("div")')+"}",staticRenderFns:n.staticRenderFns}}function pa(e,t){if(e.staticRoot&&!e.staticProcessed)return da(e,t);if(e.once&&!e.onceProcessed)return va(e,t);if(e.for&&!e.forProcessed)return function(e,t,n,r){var i=e.for,o=e.alias,a=e.iterator1?","+e.iterator1:"",s=e.iterator2?","+e.iterator2:"";0;return e.forProcessed=!0,(r||"_l")+"(("+i+"),function("+o+a+s+"){return "+(n||pa)(e,t)+"})"}(e,t);if(e.if&&!e.ifProcessed)return ha(e,t);if("template"!==e.tag||e.slotTarget){if("slot"===e.tag)return function(e,t){var n=e.slotName||'"default"',r=ya(e,t),i="_t("+n+(r?","+r:""),o=e.attrs&&"{"+e.attrs.map(function(e){return C(e.name)+":"+e.value}).join(",")+"}",a=e.attrsMap["v-bind"];!o&&!a||r||(i+=",null");o&&(i+=","+o);a&&(i+=(o?"":",null")+","+a);return i+")"}(e,t);var n;if(e.component)n=function(e,t,n){var r=t.inlineTemplate?null:ya(t,n,!0);return"_c("+e+","+ma(t,n)+(r?","+r:"")+")"}(e.component,e,t);else{var r=e.plain?void 0:ma(e,t),i=e.inlineTemplate?null:ya(e,t,!0);n="_c('"+e.tag+"'"+(r?","+r:"")+(i?","+i:"")+")"}for(var o=0;o':'
',ka.innerHTML.indexOf(" ")>0}var Ta=!!K&&Oa(!1),Sa=!!K&&Oa(!0),Ea=w(function(e){var t=Hn(e);return t&&t.innerHTML}),Ma=dn.prototype.$mount;dn.prototype.$mount=function(e,t){if((e=e&&Hn(e))===document.body||e===document.documentElement)return this;var n=this.$options;if(!n.render){var r=n.template;if(r)if("string"==typeof r)"#"===r.charAt(0)&&(r=Ea(r));else{if(!r.nodeType)return this;r=r.innerHTML}else e&&(r=function(e){if(e.outerHTML)return e.outerHTML;var t=document.createElement("div");return t.appendChild(e.cloneNode(!0)),t.innerHTML}(e));if(r){0;var i=Aa(r,{shouldDecodeNewlines:Ta,shouldDecodeNewlinesForHref:Sa,delimiters:n.delimiters,comments:n.comments},this),o=i.render,a=i.staticRenderFns;n.render=o,n.staticRenderFns=a}}return Ma.call(this,e,t)},dn.compile=Aa,e.exports=dn}).call(t,n(3),n(8).setImmediate)},function(e,t,n){(function(e){var r=void 0!==e&&e||"undefined"!=typeof self&&self||window,i=Function.prototype.apply;function o(e,t){this._id=e,this._clearFn=t}t.setTimeout=function(){return new o(i.call(setTimeout,r,arguments),clearTimeout)},t.setInterval=function(){return new o(i.call(setInterval,r,arguments),clearInterval)},t.clearTimeout=t.clearInterval=function(e){e&&e.close()},o.prototype.unref=o.prototype.ref=function(){},o.prototype.close=function(){this._clearFn.call(r,this._id)},t.enroll=function(e,t){clearTimeout(e._idleTimeoutId),e._idleTimeout=t},t.unenroll=function(e){clearTimeout(e._idleTimeoutId),e._idleTimeout=-1},t._unrefActive=t.active=function(e){clearTimeout(e._idleTimeoutId);var t=e._idleTimeout;t>=0&&(e._idleTimeoutId=setTimeout(function(){e._onTimeout&&e._onTimeout()},t))},n(9),t.setImmediate="undefined"!=typeof self&&self.setImmediate||void 0!==e&&e.setImmediate||this&&this.setImmediate,t.clearImmediate="undefined"!=typeof self&&self.clearImmediate||void 0!==e&&e.clearImmediate||this&&this.clearImmediate}).call(t,n(3))},function(e,t,n){(function(e,t){!function(e,n){"use strict";if(!e.setImmediate){var r,i,o,a,s,c=1,l={},u=!1,f=e.document,p=Object.getPrototypeOf&&Object.getPrototypeOf(e);p=p&&p.setTimeout?p:e,"[object process]"==={}.toString.call(e.process)?r=function(e){t.nextTick(function(){v(e)})}:!function(){if(e.postMessage&&!e.importScripts){var t=!0,n=e.onmessage;return e.onmessage=function(){t=!1},e.postMessage("","*"),e.onmessage=n,t}}()?e.MessageChannel?((o=new MessageChannel).port1.onmessage=function(e){v(e.data)},r=function(e){o.port2.postMessage(e)}):f&&"onreadystatechange"in f.createElement("script")?(i=f.documentElement,r=function(e){var t=f.createElement("script");t.onreadystatechange=function(){v(e),t.onreadystatechange=null,i.removeChild(t),t=null},i.appendChild(t)}):r=function(e){setTimeout(v,0,e)}:(a="setImmediate$"+Math.random()+"$",s=function(t){t.source===e&&"string"==typeof t.data&&0===t.data.indexOf(a)&&v(+t.data.slice(a.length))},e.addEventListener?e.addEventListener("message",s,!1):e.attachEvent("onmessage",s),r=function(t){e.postMessage(a+t,"*")}),p.setImmediate=function(e){"function"!=typeof e&&(e=new Function(""+e));for(var t=new Array(arguments.length-1),n=0;n1)for(var n=1;n.pane{text-align:left;padding:15px;overflow:hidden;background:#eee}.vertical-panes>.pane~.pane{border-left:1px solid #ccc}",""])},function(e,t){e.exports=function(e,t){for(var n=[],r={},i=0;idiv{position:relative;z-index:1}.multipane-resizer{display:block;position:relative;z-index:2}.layout-h>.multipane-resizer{width:100%;height:10px;margin-top:-10px;top:5px;cursor:row-resize}.layout-v>.multipane-resizer{width:10px;height:100%;margin-left:-10px;left:5px;cursor:col-resize}",""])},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.default={name:"multipane",props:{layout:{type:String,default:"vertical"}},data:function(){return{isResizing:!1}},computed:{classnames:function(){return["multipane","layout-"+this.layout.slice(0,1),this.isResizing?"is-resizing":""]},cursor:function(){return this.isResizing?"vertical"==this.layout?"col-resize":"row-resize":""},userSelect:function(){return this.isResizing?"none":""}},methods:{onMouseDown:function(e){var t=e.target;if(t.className&&"string"==typeof t.className&&t.className.match("multipane-resizer")){e.preventDefault();var n=void 0,r=void 0;"touchstart"==e.type?(n=e.touches[0].pageX,r=e.touches[0].pageY):(n=e.pageX,r=e.pageY);var i=this,o=i.$el,a=i.layout,s=Boolean(t.className.match("affect-follower")),c=t.previousElementSibling;s&&(c=t.nextElementSibling);var l=c,u=l.offsetWidth,f=l.offsetHeight,p=!!(c.style.width+"").match("%"),d=window,v=d.addEventListener,h=d.removeEventListener,m=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;if(s&&(t=-t),"vertical"==a){var n=o.clientWidth,r=e+t;return c.style.width=p?r/n*100+"%":r+"px"}if("horizontal"==a){var i=o.clientHeight,l=e+t;return c.style.height=p?l/i*100+"%":l+"px"}};i.isResizing=!0;var g=m();i.$emit("paneResizeStart",c,t,g);var y=function(e){var o=void 0,s=void 0;"touchmove"==e.type?(o=e.touches[0].pageX,s=e.touches[0].pageY):(e.preventDefault(),o=e.pageX,s=e.pageY),g="vertical"==a?m(u,o-n):m(f,s-r),i.$emit("paneResize",c,t,g)},_=function e(){g=m("vertical"==a?c.clientWidth:c.clientHeight),i.isResizing=!1,h("mousemove",y),h("mouseup",e),h("touchmove",y),h("touchend",e),i.$emit("paneResizeStop",c,t,g)};v("mousemove",y),v("mouseup",_),v("touchmove",y),v("touchend",_)}}}}},function(e,t){e.exports={render:function(){var e=this.$createElement;return(this._self._c||e)("div",{class:this.classnames,style:{cursor:this.cursor,userSelect:this.userSelect},on:{mousedown:this.onMouseDown,touchstart:this.onMouseDown}},[this._t("default")],2)},staticRenderFns:[]}},function(e,t,n){var r=n(0)(n(24),n(25),!1,null,null,null);e.exports=r.exports},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={name:"multipane-resizer",props:{affectFollower:{type:Boolean,default:!1}},computed:{classnames:function(){return["multipane-resizer",this.affectFollower?"affect-follower":""]}}}},function(e,t){e.exports={render:function(){var e=this.$createElement;return(this._self._c||e)("div",{class:this.classnames},[this._t("default")],2)},staticRenderFns:[]}},function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("multipane",{staticClass:"vertical-panes",attrs:{layout:"vertical"}},[n("div",{staticClass:"pane",style:{minWidth:"100px",width:"150px",maxWidth:"200px"}},[n("div",[n("h6",{staticClass:"title is-6"},[e._v("Pane 1")]),e._v(" "),n("p",{staticClass:"subtitle is-6"},[e._v("Fixed width.")]),e._v(" "),n("p",[n("small",[n("strong",[e._v("Configured with:")]),n("br"),e._v("\n minWidth: 100px"),n("br"),e._v("\n width: 150px"),n("br"),e._v("\n maxWidth: 200px"),n("br")])])])]),e._v(" "),n("multipane-resizer"),e._v(" "),n("div",{staticClass:"pane",style:{width:"25%",maxWidth:"50%"}},[n("div",[n("h6",{staticClass:"title is-6"},[e._v("Pane 2")]),e._v(" "),n("p",{staticClass:"subtitle is-6"},[e._v("Fluid width.")]),e._v(" "),n("p",[n("small",[n("strong",[e._v("Configured with:")]),n("br"),e._v("\n width: 25%"),n("br"),e._v("\n maxWidth: 50%"),n("br")])])])]),e._v(" "),n("multipane-resizer"),e._v(" "),n("div",{staticClass:"pane",style:{flexGrow:1}},[n("div",[n("h6",{staticClass:"title is-6"},[e._v("Pane 3")]),e._v(" "),n("p",{staticClass:"subtitle is-6"},[e._v("Takes remaining available space.")]),e._v(" "),n("p",[n("small",[n("strong",[e._v("Configured with:")]),n("br"),e._v("\n flex-grow: 1"),n("br")])])])])],1)},staticRenderFns:[]}},function(e,t,n){var r=n(0)(n(30),n(31),!1,function(e){n(28)},null,null);e.exports=r.exports},function(e,t,n){var r=n(29);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);n(2)("dea67e52",r,!0,{})},function(e,t,n){(e.exports=n(1)(!1)).push([e.i,".horizontal-panes{width:100%;height:600px;border:1px solid #ccc}.horizontal-panes>.pane{text-align:left;padding:15px;overflow:hidden;background:#eee}.horizontal-panes>.pane~.pane{border-top:1px solid #ccc}",""])},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(4);t.default={components:{Multipane:r.Multipane,MultipaneResizer:r.MultipaneResizer}}},function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("multipane",{staticClass:"horizontal-panes",attrs:{layout:"horizontal"}},[n("div",{staticClass:"pane",style:{minHeight:"100px",height:"200px",maxHeight:"300px"}},[n("div",[n("h6",{staticClass:"title is-6"},[e._v("Pane 1")]),e._v(" "),n("p",{staticClass:"subtitle is-6"},[e._v("Fixed height.")]),e._v(" "),n("p",[n("small",[n("strong",[e._v("Configured with:")]),n("br"),e._v("\n minHeight: 100px"),n("br"),e._v("\n height: 200px"),n("br"),e._v("\n maxHeight: 300px"),n("br")])])])]),e._v(" "),n("multipane-resizer"),e._v(" "),n("div",{staticClass:"pane",style:{height:"40%",maxHeight:"60%"}},[n("div",[n("h6",{staticClass:"title is-6"},[e._v("Pane 2")]),e._v(" "),n("p",{staticClass:"subtitle is-6"},[e._v("Fluid height.")]),e._v(" "),n("p",[n("small",[n("strong",[e._v("Configured with:")]),n("br"),e._v("\n height: 40%"),n("br"),e._v("\n maxHeight: 60%"),n("br")])])])]),e._v(" "),n("multipane-resizer"),e._v(" "),n("div",{staticClass:"pane",style:{flexGrow:1}},[n("div",[n("h6",{staticClass:"title is-6"},[e._v("Pane 3")]),e._v(" "),n("p",{staticClass:"subtitle is-6"},[e._v("Takes remaining available space.")]),e._v(" "),n("p",[n("small",[n("strong",[e._v("Configured with:")]),n("br"),e._v("\n flex-grow: 1"),n("br")])])])])],1)},staticRenderFns:[]}},function(e,t,n){var r=n(0)(n(35),n(36),!1,function(e){n(33)},null,null);e.exports=r.exports},function(e,t,n){var r=n(34);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);n(2)("222990d9",r,!0,{})},function(e,t,n){(e.exports=n(1)(!1)).push([e.i,'.custom-resizer{width:100%;height:400px}.custom-resizer>.pane{text-align:left;padding:15px;overflow:hidden;background:#eee;border:1px solid #ccc}.custom-resizer>.multipane-resizer{margin:0;left:0;position:relative}.custom-resizer>.multipane-resizer:before{display:block;content:"";width:3px;height:40px;position:absolute;top:50%;left:50%;margin-top:-20px;margin-left:-1.5px;border-left:1px solid #ccc;border-right:1px solid #ccc}.custom-resizer>.multipane-resizer:hover:before{border-color:#999}',""])},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(4);t.default={components:{Multipane:r.Multipane,MultipaneResizer:r.MultipaneResizer}}},function(e,t){e.exports={render:function(){var e=this.$createElement,t=this._self._c||e;return t("multipane",{staticClass:"custom-resizer",attrs:{layout:"vertical"}},[t("div",{staticClass:"pane"},[t("div",[t("h6",{staticClass:"title is-6"},[this._v("Pane 1")])])]),this._v(" "),t("multipane-resizer"),this._v(" "),t("div",{staticClass:"pane"},[t("div",[t("h6",{staticClass:"title is-6"},[this._v("Pane 2")])])]),this._v(" "),t("multipane-resizer"),this._v(" "),t("div",{staticClass:"pane",style:{flexGrow:1}},[t("div",[t("h6",{staticClass:"title is-6"},[this._v("Pane 3")])])])],1)},staticRenderFns:[]}},function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{attrs:{id:"app"}},[n("section",{staticClass:"hero"},[n("div",{staticClass:"hero-body"},[e._m(0),e._v(" "),n("VerticalPanes")],1)]),e._v(" "),n("section",{staticClass:"hero"},[n("div",{staticClass:"hero-body"},[e._m(1),e._v(" "),n("HorizontalPanes")],1)]),e._v(" "),n("section",{staticClass:"hero"},[n("div",{staticClass:"hero-body"},[e._m(2),e._v(" "),n("CustomResizer")],1)])])},staticRenderFns:[function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"columns"},[t("div",{staticClass:"column"},[t("h2",{staticClass:"title"},[this._v("Vertical Panes")])]),this._v(" "),t("div",{staticClass:"column is-narrow"},[t("a",{staticClass:"button is-warning",attrs:{href:"https://github.com/yansern/vue-multipane/blob/master/demo/src/VerticalPanes.vue"}},[this._v("View code »")])])])},function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"columns"},[t("div",{staticClass:"column"},[t("h2",{staticClass:"title"},[this._v("Horizontal Panes")])]),this._v(" "),t("div",{staticClass:"column is-narrow"},[t("a",{staticClass:"button is-warning",attrs:{href:"https://github.com/yansern/vue-multipane/blob/master/demo/src/HorizontalPanes.vue"}},[this._v("View code »")])])])},function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"columns"},[t("div",{staticClass:"column"},[t("h2",{staticClass:"title"},[this._v("Custom Resizer")])]),this._v(" "),t("div",{staticClass:"column is-narrow"},[t("a",{staticClass:"button is-warning",attrs:{href:"https://github.com/yansern/vue-multipane/blob/master/demo/src/CustomResizer.vue"}},[this._v("View code »")])])])}]}}]); \ No newline at end of file diff --git a/dist/vue-multipane.esm.js b/dist/vue-multipane.esm.js index 06fc1ac..e880d1b 100644 --- a/dist/vue-multipane.esm.js +++ b/dist/vue-multipane.esm.js @@ -1 +1 @@ -var LAYOUT_HORIZONTAL="horizontal",LAYOUT_VERTICAL="vertical",__vue_module__={name:"multipane",props:{layout:{type:String,default:LAYOUT_VERTICAL}},data:function(){return{isResizing:!1}},computed:{classnames:function(){return["multipane","layout-"+this.layout.slice(0,1),this.isResizing?"is-resizing":""]},cursor:function(){return this.isResizing?this.layout==LAYOUT_VERTICAL?"col-resize":"row-resize":""},userSelect:function(){return this.isResizing?"none":""}},methods:{onMouseDown:function(e){var t=e.target,i=e.pageX,n=e.pageY;if(t.className&&t.className.match("multipane-resizer")){var s=this,o=s.$el,a=s.layout,u=t.previousElementSibling,r=u.offsetWidth,l=u.offsetHeight,d=!!(u.style.width+"").match("%"),c=window.addEventListener,p=window.removeEventListener,m=function(e,t){if(void 0===t&&(t=0),a==LAYOUT_VERTICAL){var i=o.clientWidth,n=e+t;return u.style.width=d?n/i*100+"%":n+"px"}if(a==LAYOUT_HORIZONTAL){var s=o.clientHeight,r=e+t;return u.style.height=d?r/s*100+"%":r+"px"}};s.isResizing=!0;var _=m();s.$emit("paneResizeStart",u,t,_);var h=function(e){var o=e.pageX,d=e.pageY;_=a==LAYOUT_VERTICAL?m(r,o-i):m(l,d-n),s.$emit("paneResize",u,t,_)},f=function(){_=m(a==LAYOUT_VERTICAL?u.clientWidth:u.clientHeight),s.isResizing=!1,p("mousemove",h),p("mouseup",f),s.$emit("paneResizeStop",u,t,_)};c("mousemove",h),c("mouseup",f)}}}};!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style"),i=".multipane { display: flex; } .multipane.layout-h { flex-direction: column; } .multipane.layout-v { flex-direction: row; } .multipane > div { position: relative; z-index: 1; } .multipane-resizer { display: block; position: relative; z-index: 2; } .layout-h > .multipane-resizer { width: 100%; height: 10px; margin-top: -10px; top: 5px; cursor: row-resize; } .layout-v > .multipane-resizer { width: 10px; height: 100%; margin-left: -10px; left: 5px; cursor: col-resize; } ";t.type="text/css",t.styleSheet?t.styleSheet.cssText=i:t.appendChild(document.createTextNode(i)),e.appendChild(t)}}();var __$__vue_module__=Object.assign(__vue_module__,{render:function(){var e=this,t=e.$createElement;return(e._self._c||t)("div",{class:e.classnames,style:{cursor:e.cursor,userSelect:e.userSelect},on:{mousedown:e.onMouseDown}},[e._t("default")],2)},staticRenderFns:[]});__$__vue_module__.prototype=__vue_module__.prototype,function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css",t.styleSheet?t.styleSheet.cssText="":t.appendChild(document.createTextNode("")),e.appendChild(t)}}();var MultipaneResizer={render:function(){var e=this,t=e.$createElement;return(e._self._c||t)("div",{staticClass:"multipane-resizer"},[e._t("default")],2)},staticRenderFns:[]};"undefined"!=typeof window&&window.Vue&&(window.Vue.component("multipane",__$__vue_module__),window.Vue.component("multipane-resizer",MultipaneResizer));export{__$__vue_module__ as Multipane,MultipaneResizer}; +var LAYOUT_HORIZONTAL="horizontal",LAYOUT_VERTICAL="vertical",__vue_module__={name:"multipane",props:{layout:{type:String,default:LAYOUT_VERTICAL}},data:function(){return{isResizing:!1}},computed:{classnames:function(){return["multipane","layout-"+this.layout.slice(0,1),this.isResizing?"is-resizing":""]},cursor:function(){return this.isResizing?this.layout==LAYOUT_VERTICAL?"col-resize":"row-resize":""},userSelect:function(){return this.isResizing?"none":""}},methods:{onMouseDown:function(e){var t=e.target;if(t.className&&"string"==typeof t.className&&t.className.match("multipane-resizer")){var i,n;e.preventDefault(),"touchstart"==e.type?(i=e.touches[0].pageX,n=e.touches[0].pageY):(i=e.pageX,n=e.pageY);var s=this,o=s.$el,a=s.layout,u=Boolean(t.className.match("affect-follower")),r=t.previousElementSibling;u&&(r=t.nextElementSibling);var l=r.offsetWidth,c=r.offsetHeight,p=!!(r.style.width+"").match("%"),d=window.addEventListener,m=window.removeEventListener,h=function(e,t){if(void 0===t&&(t=0),u&&(t=-t),a==LAYOUT_VERTICAL){var i=o.clientWidth,n=e+t;return r.style.width=p?n/i*100+"%":n+"px"}if(a==LAYOUT_HORIZONTAL){var s=o.clientHeight,l=e+t;return r.style.height=p?l/s*100+"%":l+"px"}};s.isResizing=!0;var _=h();s.$emit("paneResizeStart",r,t,_);var f=function(e){var o,u;"touchmove"==e.type?(o=e.touches[0].pageX,u=e.touches[0].pageY):(e.preventDefault(),o=e.pageX,u=e.pageY),_=a==LAYOUT_VERTICAL?h(l,o-i):h(c,u-n),s.$emit("paneResize",r,t,_)},v=function(){_=h(a==LAYOUT_VERTICAL?r.clientWidth:r.clientHeight),s.isResizing=!1,m("mousemove",f),m("mouseup",v),m("touchmove",f),m("touchend",v),s.$emit("paneResizeStop",r,t,_)};d("mousemove",f),d("mouseup",v),d("touchmove",f),d("touchend",v)}}}};!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style"),i=".multipane { display: flex; } .multipane.layout-h { flex-direction: column; } .multipane.layout-v { flex-direction: row; } .multipane > div { position: relative; z-index: 1; } .multipane-resizer { display: block; position: relative; z-index: 2; } .layout-h > .multipane-resizer { width: 100%; height: 10px; margin-top: -10px; top: 5px; cursor: row-resize; } .layout-v > .multipane-resizer { width: 10px; height: 100%; margin-left: -10px; left: 5px; cursor: col-resize; } ";t.type="text/css",t.styleSheet?t.styleSheet.cssText=i:t.appendChild(document.createTextNode(i)),e.appendChild(t)}}();var __$__vue_module__=Object.assign(__vue_module__,{render:function(){var e=this.$createElement;return(this._self._c||e)("div",{class:this.classnames,style:{cursor:this.cursor,userSelect:this.userSelect},on:{mousedown:this.onMouseDown,touchstart:this.onMouseDown}},[this._t("default")],2)},staticRenderFns:[]});__$__vue_module__.prototype=__vue_module__.prototype,function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css",t.styleSheet?t.styleSheet.cssText="":t.appendChild(document.createTextNode("")),e.appendChild(t)}}();var MultipaneResizer={render:function(){var e=this.$createElement;return(this._self._c||e)("div",{class:this.classnames},[this._t("default")],2)},staticRenderFns:[],name:"multipane-resizer",props:{affectFollower:{type:Boolean,default:!1}},computed:{classnames:function(){return["multipane-resizer",this.affectFollower?"affect-follower":""]}}};"undefined"!=typeof window&&window.Vue&&(window.Vue.component("multipane",__$__vue_module__),window.Vue.component("multipane-resizer",MultipaneResizer));export{__$__vue_module__ as Multipane,MultipaneResizer}; diff --git a/dist/vue-multipane.js b/dist/vue-multipane.js index 2e60aab..b2782cd 100644 --- a/dist/vue-multipane.js +++ b/dist/vue-multipane.js @@ -41,17 +41,28 @@ var __vue_module__ = { }, methods: { - onMouseDown: function onMouseDown(ref) { - var resizer = ref.target; - var initialPageX = ref.pageX; - var initialPageY = ref.pageY; - - if (resizer.className && resizer.className.match('multipane-resizer')) { + onMouseDown: function onMouseDown(e) { + var resizer = e.target; + if (resizer.className && typeof resizer.className === 'string' && resizer.className.match('multipane-resizer')) { + e.preventDefault(); + var initialPageX, initialPageY; + if (e.type == "touchstart") { + initialPageX = e.touches[0].pageX; + initialPageY = e.touches[0].pageY; + } else { + initialPageX = e.pageX; + initialPageY = e.pageY; + } var self = this; var container = self.$el; var layout = self.layout; + var reversed = Boolean(resizer.className.match('affect-follower')); + var pane = resizer.previousElementSibling; + if (reversed) { + pane = resizer.nextElementSibling; + } var initialPaneWidth = pane.offsetWidth; var initialPaneHeight = pane.offsetHeight; @@ -63,6 +74,9 @@ var __vue_module__ = { var resize = function (initialSize, offset) { if ( offset === void 0 ) offset = 0; + if (reversed) { + offset = -offset; + } if (layout == LAYOUT_VERTICAL) { var containerWidth = container.clientWidth; var paneWidth = initialSize + offset; @@ -91,10 +105,16 @@ var __vue_module__ = { // Trigger paneResizeStart event self.$emit('paneResizeStart', pane, resizer, size); - var onMouseMove = function(ref) { - var pageX = ref.pageX; - var pageY = ref.pageY; - + var onMouseMove = function(e) { + var pageX, pageY; + if (e.type == "touchmove") { + pageX = e.touches[0].pageX; + pageY = e.touches[0].pageY; + } else { + e.preventDefault(); + pageX = e.pageX; + pageY = e.pageY; + } size = layout == LAYOUT_VERTICAL ? resize(initialPaneWidth, pageX - initialPageX) @@ -115,12 +135,16 @@ var __vue_module__ = { removeEventListener('mousemove', onMouseMove); removeEventListener('mouseup', onMouseUp); + removeEventListener('touchmove', onMouseMove); + removeEventListener('touchend', onMouseUp); self.$emit('paneResizeStop', pane, resizer, size); }; addEventListener('mousemove', onMouseMove); addEventListener('mouseup', onMouseUp); + addEventListener('touchmove', onMouseMove); + addEventListener('touchend', onMouseUp); } }, }, @@ -174,12 +198,30 @@ var __vue_module__ = { - var __$__vue_module__ = Object.assign(__vue_module__, {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.classnames,style:({ cursor: _vm.cursor, userSelect: _vm.userSelect }),on:{"mousedown":_vm.onMouseDown}},[_vm._t("default")],2)},staticRenderFns: [],}); + var __$__vue_module__ = Object.assign(__vue_module__, {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.classnames,style:({ cursor: _vm.cursor, userSelect: _vm.userSelect }),on:{"mousedown":_vm.onMouseDown,"touchstart":_vm.onMouseDown}},[_vm._t("default")],2)},staticRenderFns: [],}); __$__vue_module__.prototype = __vue_module__.prototype; (function(){ if(typeof document !== 'undefined'){ var head=document.head||document.getElementsByTagName('head')[0], style=document.createElement('style'), css=""; style.type='text/css'; if (style.styleSheet){ style.styleSheet.cssText = css; } else { style.appendChild(document.createTextNode(css)); } head.appendChild(style); } })(); -var MultipaneResizer = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"multipane-resizer"},[_vm._t("default")],2)},staticRenderFns: [], + + + +var MultipaneResizer = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.classnames},[_vm._t("default")],2)},staticRenderFns: [], + name: 'multipane-resizer', + + props: { + affectFollower: { + type: Boolean, + default: false, + }, + }, + computed: { + classnames: function classnames() { + return [ + 'multipane-resizer', + this.affectFollower ? 'affect-follower' : '' ]; + }, + } }; if (typeof window !== 'undefined' && window.Vue) { diff --git a/dist/vue-multipane.min.js b/dist/vue-multipane.min.js index f7eb071..c9ce6e1 100644 --- a/dist/vue-multipane.min.js +++ b/dist/vue-multipane.min.js @@ -1 +1 @@ -!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e.Multipane={})}(this,function(e){"use strict";var t={name:"multipane",props:{layout:{type:String,default:"vertical"}},data:function(){return{isResizing:!1}},computed:{classnames:function(){return["multipane","layout-"+this.layout.slice(0,1),this.isResizing?"is-resizing":""]},cursor:function(){return this.isResizing?"vertical"==this.layout?"col-resize":"row-resize":""},userSelect:function(){return this.isResizing?"none":""}},methods:{onMouseDown:function(e){var t=e.target,i=e.pageX,n=e.pageY;if(t.className&&t.className.match("multipane-resizer")){var s=this,o=s.$el,r=s.layout,a=t.previousElementSibling,u=a.offsetWidth,l=a.offsetHeight,c=!!(a.style.width+"").match("%"),d=window.addEventListener,p=window.removeEventListener,m=function(e,t){if(void 0===t&&(t=0),"vertical"==r){var i=o.clientWidth,n=e+t;return a.style.width=c?n/i*100+"%":n+"px"}if("horizontal"==r){var s=o.clientHeight,u=e+t;return a.style.height=c?u/s*100+"%":u+"px"}};s.isResizing=!0;var f=m();s.$emit("paneResizeStart",a,t,f);var h=function(e){var o=e.pageX,c=e.pageY;f="vertical"==r?m(u,o-i):m(l,c-n),s.$emit("paneResize",a,t,f)},y=function(){f=m("vertical"==r?a.clientWidth:a.clientHeight),s.isResizing=!1,p("mousemove",h),p("mouseup",y),s.$emit("paneResizeStop",a,t,f)};d("mousemove",h),d("mouseup",y)}}}};!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style"),i=".multipane { display: flex; } .multipane.layout-h { flex-direction: column; } .multipane.layout-v { flex-direction: row; } .multipane > div { position: relative; z-index: 1; } .multipane-resizer { display: block; position: relative; z-index: 2; } .layout-h > .multipane-resizer { width: 100%; height: 10px; margin-top: -10px; top: 5px; cursor: row-resize; } .layout-v > .multipane-resizer { width: 10px; height: 100%; margin-left: -10px; left: 5px; cursor: col-resize; } ";t.type="text/css",t.styleSheet?t.styleSheet.cssText=i:t.appendChild(document.createTextNode(i)),e.appendChild(t)}}();var i=Object.assign(t,{render:function(){var e=this,t=e.$createElement;return(e._self._c||t)("div",{class:e.classnames,style:{cursor:e.cursor,userSelect:e.userSelect},on:{mousedown:e.onMouseDown}},[e._t("default")],2)},staticRenderFns:[]});i.prototype=t.prototype,function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css",t.styleSheet?t.styleSheet.cssText="":t.appendChild(document.createTextNode("")),e.appendChild(t)}}();var n={render:function(){var e=this,t=e.$createElement;return(e._self._c||t)("div",{staticClass:"multipane-resizer"},[e._t("default")],2)},staticRenderFns:[]};"undefined"!=typeof window&&window.Vue&&(window.Vue.component("multipane",i),window.Vue.component("multipane-resizer",n)),e.Multipane=i,e.MultipaneResizer=n,Object.defineProperty(e,"__esModule",{value:!0})}); +!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e.Multipane={})}(this,function(e){"use strict";var t={name:"multipane",props:{layout:{type:String,default:"vertical"}},data:function(){return{isResizing:!1}},computed:{classnames:function(){return["multipane","layout-"+this.layout.slice(0,1),this.isResizing?"is-resizing":""]},cursor:function(){return this.isResizing?"vertical"==this.layout?"col-resize":"row-resize":""},userSelect:function(){return this.isResizing?"none":""}},methods:{onMouseDown:function(e){var t=e.target;if(t.className&&"string"==typeof t.className&&t.className.match("multipane-resizer")){var i,n;e.preventDefault(),"touchstart"==e.type?(i=e.touches[0].pageX,n=e.touches[0].pageY):(i=e.pageX,n=e.pageY);var o=this,s=o.$el,a=o.layout,r=Boolean(t.className.match("affect-follower")),u=t.previousElementSibling;r&&(u=t.nextElementSibling);var l=u.offsetWidth,c=u.offsetHeight,p=!!(u.style.width+"").match("%"),d=window.addEventListener,m=window.removeEventListener,h=function(e,t){if(void 0===t&&(t=0),r&&(t=-t),"vertical"==a){var i=s.clientWidth,n=e+t;return u.style.width=p?n/i*100+"%":n+"px"}if("horizontal"==a){var o=s.clientHeight,l=e+t;return u.style.height=p?l/o*100+"%":l+"px"}};o.isResizing=!0;var f=h();o.$emit("paneResizeStart",u,t,f);var v=function(e){var s,r;"touchmove"==e.type?(s=e.touches[0].pageX,r=e.touches[0].pageY):(e.preventDefault(),s=e.pageX,r=e.pageY),f="vertical"==a?h(l,s-i):h(c,r-n),o.$emit("paneResize",u,t,f)},y=function(){f=h("vertical"==a?u.clientWidth:u.clientHeight),o.isResizing=!1,m("mousemove",v),m("mouseup",y),m("touchmove",v),m("touchend",y),o.$emit("paneResizeStop",u,t,f)};d("mousemove",v),d("mouseup",y),d("touchmove",v),d("touchend",y)}}}};!function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style"),i=".multipane { display: flex; } .multipane.layout-h { flex-direction: column; } .multipane.layout-v { flex-direction: row; } .multipane > div { position: relative; z-index: 1; } .multipane-resizer { display: block; position: relative; z-index: 2; } .layout-h > .multipane-resizer { width: 100%; height: 10px; margin-top: -10px; top: 5px; cursor: row-resize; } .layout-v > .multipane-resizer { width: 10px; height: 100%; margin-left: -10px; left: 5px; cursor: col-resize; } ";t.type="text/css",t.styleSheet?t.styleSheet.cssText=i:t.appendChild(document.createTextNode(i)),e.appendChild(t)}}();var i=Object.assign(t,{render:function(){var e=this.$createElement;return(this._self._c||e)("div",{class:this.classnames,style:{cursor:this.cursor,userSelect:this.userSelect},on:{mousedown:this.onMouseDown,touchstart:this.onMouseDown}},[this._t("default")],2)},staticRenderFns:[]});i.prototype=t.prototype,function(){if("undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css",t.styleSheet?t.styleSheet.cssText="":t.appendChild(document.createTextNode("")),e.appendChild(t)}}();var n={render:function(){var e=this.$createElement;return(this._self._c||e)("div",{class:this.classnames},[this._t("default")],2)},staticRenderFns:[],name:"multipane-resizer",props:{affectFollower:{type:Boolean,default:!1}},computed:{classnames:function(){return["multipane-resizer",this.affectFollower?"affect-follower":""]}}};"undefined"!=typeof window&&window.Vue&&(window.Vue.component("multipane",i),window.Vue.component("multipane-resizer",n)),e.Multipane=i,e.MultipaneResizer=n,Object.defineProperty(e,"__esModule",{value:!0})}); diff --git a/package.json b/package.json index 53fecb5..0ade2b1 100644 --- a/package.json +++ b/package.json @@ -57,5 +57,8 @@ }, "engines": { "node": ">=6.0.0" + }, + "dependencies": { + "yarn": "^1.6.0" } } diff --git a/src/multipane-resizer.vue b/src/multipane-resizer.vue index 9ef7736..3a87929 100644 --- a/src/multipane-resizer.vue +++ b/src/multipane-resizer.vue @@ -1,3 +1,24 @@ \ No newline at end of file +
+ + + \ No newline at end of file diff --git a/src/multipane.js b/src/multipane.js index a43bac8..9faeefd 100644 --- a/src/multipane.js +++ b/src/multipane.js @@ -36,12 +36,27 @@ export default { }, methods: { - onMouseDown({ target: resizer, pageX: initialPageX, pageY: initialPageY }) { - if (resizer.className && resizer.className.match('multipane-resizer')) { + onMouseDown(e) { + let resizer = e.target; + if (resizer.className && typeof resizer.className === 'string' && resizer.className.match('multipane-resizer')) { + e.preventDefault(); + let initialPageX, initialPageY + if (e.type == "touchstart") { + initialPageX = e.touches[0].pageX; + initialPageY = e.touches[0].pageY; + } else { + initialPageX = e.pageX; + initialPageY = e.pageY; + } let self = this; let { $el: container, layout } = self; + let reversed = Boolean(resizer.className.match('affect-follower')) + let pane = resizer.previousElementSibling; + if (reversed) { + pane = resizer.nextElementSibling; + } let { offsetWidth: initialPaneWidth, offsetHeight: initialPaneHeight, @@ -52,6 +67,9 @@ export default { const { addEventListener, removeEventListener } = window; const resize = (initialSize, offset = 0) => { + if (reversed) { + offset = -offset; + } if (layout == LAYOUT_VERTICAL) { let containerWidth = container.clientWidth; let paneWidth = initialSize + offset; @@ -80,7 +98,16 @@ export default { // Trigger paneResizeStart event self.$emit('paneResizeStart', pane, resizer, size); - const onMouseMove = function({ pageX, pageY }) { + const onMouseMove = function(e) { + let pageX, pageY; + if (e.type == "touchmove") { + pageX = e.touches[0].pageX; + pageY = e.touches[0].pageY; + } else { + e.preventDefault(); + pageX = e.pageX; + pageY = e.pageY; + } size = layout == LAYOUT_VERTICAL ? resize(initialPaneWidth, pageX - initialPageX) @@ -101,12 +128,16 @@ export default { removeEventListener('mousemove', onMouseMove); removeEventListener('mouseup', onMouseUp); + removeEventListener('touchmove', onMouseMove); + removeEventListener('touchend', onMouseUp); self.$emit('paneResizeStop', pane, resizer, size); }; addEventListener('mousemove', onMouseMove); addEventListener('mouseup', onMouseUp); + addEventListener('touchmove', onMouseMove); + addEventListener('touchend', onMouseUp); } }, }, diff --git a/src/multipane.vue b/src/multipane.vue index c4f6f26..290870e 100644 --- a/src/multipane.vue +++ b/src/multipane.vue @@ -1,5 +1,5 @@ diff --git a/webpack.mix.js b/webpack.mix.js index 269b0ae..ab00e7c 100644 --- a/webpack.mix.js +++ b/webpack.mix.js @@ -47,8 +47,8 @@ if (argv.env.entry=='demo') { if (mix.inDevelopment()) { // Dev Server - const port = 8012; - const publicPath = `http://localhost:${port}/`; + const port = 8080; + const publicPath = `http://0.0.0.0:${port}/`; mix.options({ webpackConfig: { @@ -57,8 +57,9 @@ if (argv.env.entry=='demo') { }, devServer: { port: port, + host: '0.0.0.0', publicPath: publicPath, - public: `localhost:${port}`, + public: `0.0.0.0:${port}`, contentBase: './demo/', noInfo: false, quiet: false,