vue-gutter-resize/dist/vue-gutter-resize.min.js

resize adjacent dom by dragging the gutter

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var MAX_DRAG_RANGE=100,MIN_DRAG_RANGE=0,script={data:function(){return{target:void 0,areaSize:[],gutterComponent:{width:0,height:0,offsetX:0,offsetY:0}}},created:function(){this.divideArea()},mounted:function(){this.setPlaygroundRect()},methods:{draggingGutter:function(e,t,i,n){var r=this.getGutterSum(i,this.gutterSize,this.gutterSizes);if(this.isDraggingGutter(e)){var _=(t+r)/n*100;if(this.isGutterInRange(_)){for(var s=0,a=0;a<i;a++)s+=this.areaSize[a];var o=this.areaSize[i]+this.areaSize[i+1];0<=_-s&&0<=s+o-_&&(this.areaSize.splice(i,1,_-s),this.areaSize.splice(i+1,1,s+o-_))}}},specifyDivideArea:function(e){var i=this,n=e.reduce(function(e,t){return e+t});e.forEach(function(e){var t=100/n;i.areaSize.push(e*t)})},generalDivideArea:function(){for(var e=0;e<this.row;e++)this.areaSize.push(100/this.row)},dragstart:function(e,t){this.target&&this.target.classList&&this.target.classList.remove("active"),e.target.classList.add("active"),this.target=e.target},setPlaygroundRect:function(){var e=this.$refs.gutter.getBoundingClientRect();this.gutterComponent.width=e.width,this.gutterComponent.height=e.height,this.gutterComponent.offsetX=window.pageXOffset+e.left,this.gutterComponent.offsetY=window.pageYOffset+e.top},isDraggingGutter:function(e){return e&&0<e.clientX&&0<e.clientY},isGutterInRange:function(e){return e<MAX_DRAG_RANGE&&MIN_DRAG_RANGE<e},getCurrentMousePosition:function(e){return{mouseX:e.clientX-this.gutterComponent.offsetX,mouseY:e.clientY-this.gutterComponent.offsetY}},getGutterSum:function(e,t,i){var n=0;if(this.gutterSizes&&this.gutterSizes.length&&0<this.gutterSizes.length){for(var r=0;r<e;r++)n+=0|this.gutterSizes[r].match(/-?[0-9]+\.?[0-9]*/g).pop();n+=(0|this.gutterSizes[e].match(/-?[0-9]+\.?[0-9]*/g).pop())/2}else{for(var _=0;_<e;_++)n+=0|this.gutterSize.match(/-?[0-9]+\.?[0-9]*/g).pop();n+=(0|this.gutterSize.match(/-?[0-9]+\.?[0-9]*/g).pop())/2}return n}}},__vue_script__=script,__vue_template__="undefined"!=typeof __vue_render__?{render:__vue_render__,staticRenderFns:__vue_staticRenderFns__}:{},__vue_inject_styles__=void 0,__vue_scope_id__=void 0,__vue_module_identifier__=void 0,__vue_is_functional_template__=void 0;function __vue_normalize__(e,t,i,n,r,_,s,a){var o=("function"==typeof i?i.options:i)||{};return o.__file="/Users/tobashunsuke/development/vue-gutter-resize/src/mixins/gutter.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,r&&(o.functional=!0)),o._scopeId=n,o}function __vue_create_injector__(){var u=document.head||document.getElementsByTagName("head")[0],d=__vue_create_injector__.styles||(__vue_create_injector__.styles={}),c="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(e,t){if(!document.querySelector('style[data-vue-ssr-id~="'+e+'"]')){var i=c?t.media||"default":e,n=d[i]||(d[i]={ids:[],parts:[],element:void 0});if(!n.ids.includes(e)){var r=t.source,_=n.ids.length;if(n.ids.push(e),c&&(n.element=n.element||document.querySelector("style[data-group="+i+"]")),!n.element){var s=n.element=document.createElement("style");s.type="text/css",t.media&&s.setAttribute("media",t.media),c&&(s.setAttribute("data-group",i),s.setAttribute("data-next-index","0")),u.appendChild(s)}if(c&&(_=parseInt(n.element.getAttribute("data-next-index")),n.element.setAttribute("data-next-index",_+1)),n.element.styleSheet)n.parts.push(r),n.element.styleSheet.cssText=n.parts.filter(Boolean).join("\n");else{var a=document.createTextNode(r),o=n.element.childNodes;o[_]&&n.element.removeChild(o[_]),o.length?n.element.insertBefore(a,o[_]):n.element.appendChild(a)}}}}}var gutter=__vue_normalize__(__vue_template__,__vue_inject_styles__,void 0===script?{}:script,__vue_scope_id__,__vue_is_functional_template__,__vue_module_identifier__,void 0!==__vue_create_injector__?__vue_create_injector__:function(){},"undefined"!=typeof __vue_create_injector_ssr__?__vue_create_injector_ssr__:function(){}),script$1={name:"columnGutter",mixins:[gutter],props:["width","height","gutterSize","gutterSizes","color","column","colors","columnSizes"],methods:{divideArea:function(){this.columnSizes&&this.columnSizes.length&&0<this.columnSizes.length?this.specifyDivideArea(this.columnSizes):this.generalDivideArea()},drag:function(e,t){var i=this.getCurrentMousePosition(e).mouseX;this.draggingGutter(e,i,t,this.gutterComponent.width),this.$emit("resize",{col:this.areaSize})}}},__vue_script__$1=script$1,__vue_render__$1=function(){var i=this,e=i.$createElement,n=i._self._c||e;return n("section",{ref:"gutter",style:"width: "+i.width+"; height: "+i.height+";"},[n("div",{staticClass:"pane pane-v left",style:"width: calc("+i.areaSize[0]+"% - "+(i.gutterSize||i.gutterSizes[0])+");"},[i._t("col-0")],2),i._v(" "),i._l(i.column-1,function(t){return n("div",{key:t,staticClass:"afterCol",style:"width: calc("+i.areaSize[t]+"% - "+(i.gutterSize||i.gutterSizes[t-1])+");"},[n("div",{staticClass:"gutter gutter-v",style:"width: "+(i.gutterSize||i.gutterSizes[t-1])+"; height: "+i.height+"; background-color: "+(i.color||i.colors[t-1])+";",attrs:{draggable:"true"},on:{drag:function(e){i.drag(e,t-1)},dragstart:function(e){i.dragstart(e,t-1)}}}),i._v(" "),t!==i.column-1?n("div",{staticClass:"pane pane-v",style:"width: calc(100% - "+(i.gutterSize||i.gutterSizes[t-1])},[i._t("col-"+t)],2):n("div",{staticClass:"pane pane-v",style:"width: calc(100%}"},[i._t("col-"+t)],2)])})],2)},__vue_staticRenderFns__$1=[];__vue_render__$1._withStripped=!0;var __vue_template__$1=void 0!==__vue_render__$1?{render:__vue_render__$1,staticRenderFns:__vue_staticRenderFns__$1}:{},__vue_inject_styles__$1=function(e){e&&e("data-v-4b1f587d_0",{source:"\n.pane-v[data-v-4b1f587d] {\n  float: left;\n  height: 100%;\n}\n.afterCol[data-v-4b1f587d] {\n  height: 100%;\n  display: inline-block;\n}\n.gutter[data-v-4b1f587d] {\n  background: #ccc;\n  overflow: hidden;\n  position: relative;\n}\n.active[data-v-4b1f587d] {\n  z-index: 1;\n}\n.gutter-v[data-v-4b1f587d] {\n  float: left;\n  width: 2px;\n  height: 100%;\n  cursor: ew-resize;\n}\n",map:void 0,media:void 0})},__vue_scope_id__$1="data-v-4b1f587d",__vue_module_identifier__$1=void 0,__vue_is_functional_template__$1=!1;function __vue_normalize__$1(e,t,i,n,r,_,s,a){var o=("function"==typeof i?i.options:i)||{};o.__file="/Users/tobashunsuke/development/vue-gutter-resize/src/components/column-gutter.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,r&&(o.functional=!0)),o._scopeId=n;var u=void 0;if(t&&(u=function(e){t.call(this,s(e))}),void 0!==u)if(o.functional){var d=o.render;o.render=function(e,t){return u.call(t),d(e,t)}}else{var c=o.beforeCreate;o.beforeCreate=c?[].concat(c,u):[u]}return o}function __vue_create_injector__$1(){var u=document.head||document.getElementsByTagName("head")[0],d=__vue_create_injector__$1.styles||(__vue_create_injector__$1.styles={}),c="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(e,t){if(!document.querySelector('style[data-vue-ssr-id~="'+e+'"]')){var i=c?t.media||"default":e,n=d[i]||(d[i]={ids:[],parts:[],element:void 0});if(!n.ids.includes(e)){var r=t.source,_=n.ids.length;if(n.ids.push(e),c&&(n.element=n.element||document.querySelector("style[data-group="+i+"]")),!n.element){var s=n.element=document.createElement("style");s.type="text/css",t.media&&s.setAttribute("media",t.media),c&&(s.setAttribute("data-group",i),s.setAttribute("data-next-index","0")),u.appendChild(s)}if(c&&(_=parseInt(n.element.getAttribute("data-next-index")),n.element.setAttribute("data-next-index",_+1)),n.element.styleSheet)n.parts.push(r),n.element.styleSheet.cssText=n.parts.filter(Boolean).join("\n");else{var a=document.createTextNode(r),o=n.element.childNodes;o[_]&&n.element.removeChild(o[_]),o.length?n.element.insertBefore(a,o[_]):n.element.appendChild(a)}}}}}var columnGutter=__vue_normalize__$1(__vue_template__$1,__vue_inject_styles__$1,void 0===__vue_script__$1?{}:__vue_script__$1,__vue_scope_id__$1,__vue_is_functional_template__$1,__vue_module_identifier__$1,void 0!==__vue_create_injector__$1?__vue_create_injector__$1:function(){},"undefined"!=typeof __vue_create_injector_ssr__?__vue_create_injector_ssr__:function(){}),script$2={name:"rowGutter",mixins:[gutter],props:["width","height","gutterSize","gutterSizes","color","row","colors","rowSizes"],methods:{divideArea:function(){this.rowSizes&&this.rowSizes.length&&0<this.rowSizes.length?this.specifyDivideArea(this.rowSizes):this.generalDivideArea()},drag:function(e,t){var i=this.getCurrentMousePosition(e).mouseY;this.draggingGutter(e,i,t,this.gutterComponent.height),this.$emit("resize",{row:this.areaSize})}}},__vue_script__$2=script$2,__vue_render__$2=function(){var i=this,e=i.$createElement,n=i._self._c||e;return n("section",{ref:"gutter",style:"width: "+i.width+"; height: "+i.height+";"},[n("div",{style:"height: calc("+i.areaSize[0]+"%);"},[i._t("row-0")],2),i._v(" "),i._l(i.row-1,function(t){return n("div",{key:t,style:"height: calc("+i.areaSize[t]+"% - "+(i.gutterSize||i.gutterSizes[t-1])+");"},[n("div",{staticClass:"gutter gutter-h",style:"height: "+(i.gutterSize||i.gutterSizes[t-1])+"; width: "+i.width+"; background-color: "+(i.color||i.colors[t-1])+";",attrs:{draggable:"true"},on:{drag:function(e){i.drag(e,t-1)},dragstart:function(e){i.dragstart(e,t-1)}}}),i._v(" "),t!==i.row-1?n("div",{staticClass:"pane pane-h",style:"height: calc(100% - "+(i.gutterSize||i.gutterSizes[t-1])+");"},[i._t("row-"+t)],2):n("div",{staticClass:"pane pane-h",style:"height: calc(100%});"},[i._t("row-"+t)],2)])})],2)},__vue_staticRenderFns__$2=[];__vue_render__$2._withStripped=!0;var __vue_template__$2=void 0!==__vue_render__$2?{render:__vue_render__$2,staticRenderFns:__vue_staticRenderFns__$2}:{},__vue_inject_styles__$2=function(e){e&&e("data-v-69001e36_0",{source:"\n.pane[data-v-69001e36] {\n  height: 100%;\n}\n.pane-v[data-v-69001e36] {\n  float: left;\n}\n.gutter[data-v-69001e36] {\n  background: #ccc;\n  overflow: hidden;\n  position: relative;\n}\n.active[data-v-69001e36] {\n  z-index: 1;\n}\n.gutter-h[data-v-69001e36] {\n  width: 100%;\n  height: 2px;\n  cursor: ns-resize;\n}\n",map:void 0,media:void 0})},__vue_scope_id__$2="data-v-69001e36",__vue_module_identifier__$2=void 0,__vue_is_functional_template__$2=!1;function __vue_normalize__$2(e,t,i,n,r,_,s,a){var o=("function"==typeof i?i.options:i)||{};o.__file="/Users/tobashunsuke/development/vue-gutter-resize/src/components/row-gutter.vue",o.render||(o.render=e.render,o.staticRenderFns=e.staticRenderFns,o._compiled=!0,r&&(o.functional=!0)),o._scopeId=n;var u=void 0;if(t&&(u=function(e){t.call(this,s(e))}),void 0!==u)if(o.functional){var d=o.render;o.render=function(e,t){return u.call(t),d(e,t)}}else{var c=o.beforeCreate;o.beforeCreate=c?[].concat(c,u):[u]}return o}function __vue_create_injector__$2(){var u=document.head||document.getElementsByTagName("head")[0],d=__vue_create_injector__$2.styles||(__vue_create_injector__$2.styles={}),c="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(e,t){if(!document.querySelector('style[data-vue-ssr-id~="'+e+'"]')){var i=c?t.media||"default":e,n=d[i]||(d[i]={ids:[],parts:[],element:void 0});if(!n.ids.includes(e)){var r=t.source,_=n.ids.length;if(n.ids.push(e),c&&(n.element=n.element||document.querySelector("style[data-group="+i+"]")),!n.element){var s=n.element=document.createElement("style");s.type="text/css",t.media&&s.setAttribute("media",t.media),c&&(s.setAttribute("data-group",i),s.setAttribute("data-next-index","0")),u.appendChild(s)}if(c&&(_=parseInt(n.element.getAttribute("data-next-index")),n.element.setAttribute("data-next-index",_+1)),n.element.styleSheet)n.parts.push(r),n.element.styleSheet.cssText=n.parts.filter(Boolean).join("\n");else{var a=document.createTextNode(r),o=n.element.childNodes;o[_]&&n.element.removeChild(o[_]),o.length?n.element.insertBefore(a,o[_]):n.element.appendChild(a)}}}}}var rowGutter=__vue_normalize__$2(__vue_template__$2,__vue_inject_styles__$2,void 0===__vue_script__$2?{}:__vue_script__$2,__vue_scope_id__$2,__vue_is_functional_template__$2,__vue_module_identifier__$2,void 0!==__vue_create_injector__$2?__vue_create_injector__$2:function(){},"undefined"!=typeof __vue_create_injector_ssr__?__vue_create_injector_ssr__:function(){}),Components={columnGutter:columnGutter,rowGutter:rowGutter};function install(t){Object.keys(Components).forEach(function(e){t.component(e,Components[e])})}var index={install:install};exports.columnGutter=columnGutter,exports.rowGutter=rowGutter,exports.default=index;