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

resize adjacent dom by dragging the gutter

(function(t,e){"object"===typeof exports&&"object"===typeof module?module.exports=e():"function"===typeof define&&define.amd?define([],e):"object"===typeof exports?exports["vue-gutter-resize"]=e():t["vue-gutter-resize"]=e()})("undefined"!==typeof self?self:this,function(){return function(t){var e={};function r(i){if(e[i])return e[i].exports;var n=e[i]={i:i,l:!1,exports:{}};return t[i].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=t,r.c=e,r.d=function(t,e,i){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},r.r=function(t){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"===typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(r.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)r.d(i,n,function(e){return t[e]}.bind(null,n));return i},r.n=function(t){var e=t&&t.__esModule?function(){return t["default"]}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s="fb15")}({"533b":function(t,e,r){},8670:function(t,e,r){},bcf8:function(t,e,r){"use strict";var i=r("533b"),n=r.n(i);n.a},d4ca:function(t,e,r){"use strict";var i=r("8670"),n=r.n(i);n.a},f6fd:function(t,e){(function(t){var e="currentScript",r=t.getElementsByTagName("script");e in t||Object.defineProperty(t,e,{get:function(){try{throw new Error}catch(i){var t,e=(/.*at [^\(]*\((.*):.+:.+\)$/gi.exec(i.stack)||[!1])[1];for(t in r)if(r[t].src==e||"interactive"==r[t].readyState)return r[t];return null}}})})(document)},fb15:function(t,e,r){"use strict";var i;(r.r(e),"undefined"!==typeof window)&&(r("f6fd"),(i=window.document.currentScript)&&(i=i.src.match(/(.+\/)[^\/]+\.js(\?.*)?$/))&&(r.p=i[1]));var n=function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("section",{ref:"gutter",style:"width: "+t.width+"; height: "+t.height+";"},[r("div",{staticClass:"pane pane-v left",style:"width: calc("+t.areaSize[0]+"% - "+(t.gutterSize||t.gutterSizes[0])+");"},[t._t("col-0")],2),t._l(t.column-1,function(e){return r("div",{key:e,staticClass:"afterCol",style:"width: calc("+t.areaSize[e]+"% - "+(t.gutterSize||t.gutterSizes[e-1])+");"},[r("div",{staticClass:"gutter gutter-v",style:"\n        width: "+(t.gutterSize||t.gutterSizes[e-1])+";\n        height: "+t.height+";\n        background-color: "+(t.color||t.colors[e-1])+";\n      ",attrs:{draggable:"true"},on:{drag:function(r){return t.drag(r,e-1)},dragstart:function(r){return t.dragstart(r,e-1)}}}),e!==t.column-1?r("div",{staticClass:"pane pane-v",style:"width: calc(100% - "+(t.gutterSize||t.gutterSizes[e-1])},[t._t("col-"+e)],2):r("div",{staticClass:"pane pane-v",style:"width: calc(100%}"},[t._t("col-"+e)],2)])})],2)},s=[];const o=100,a=0;var u,c,l={props:{width:{type:String,required:!0,default:"500px"},height:{type:String,required:!0,default:"500px"},gutterSize:{type:String},gutterSizes:{type:Array},color:{type:String},colors:{type:Array}},data(){return{target:void 0,areaSize:[],gutterComponent:{width:0,height:0,offsetX:0,offsetY:0}}},created(){this.divideArea()},mounted(){this.setPlaygroundRect()},methods:{isArrayContains(t){return t&&t.length&&t.length>0},draggingGutter(t,e,r,i){const n=this.getGutterSum(r,this.gutterSize,this.gutterSizes);if(this.isDraggingGutter(t)){const t=(e+n)/i*100;if(this.isGutterInRange(t)){let e=0;for(let t=0;t<r;t+=1)e+=this.areaSize[t];const i=this.areaSize[r]+this.areaSize[r+1];t-e>=0&&e+i-t>=0&&(this.areaSize.splice(r,1,t-e),this.areaSize.splice(r+1,1,e+i-t))}}},specifyDivideArea(t){const e=t.reduce((t,e)=>t+e);if(e>100)throw console.error("Please total area size is 100 or less.");t.forEach(t=>{const r=100/e;this.areaSize.push(t*r)})},generalDivideArea(){for(let t=0;t<this.row;t+=1)this.areaSize.push(100/this.row)},dragstart(t){this.target&&this.target.classList&&this.target.classList.remove("active"),t.target.classList.add("active"),this.target=t.target},setPlaygroundRect(){const t=this.$refs.gutter.getBoundingClientRect();this.gutterComponent.width=t.width,this.gutterComponent.height=t.height,this.gutterComponent.offsetX=window.pageXOffset+t.left,this.gutterComponent.offsetY=window.pageYOffset+t.top},isDraggingGutter(t){return t&&t.clientX>0&&t.clientY>0},isGutterInRange(t){return t<o&&t>a},getCurrentMousePosition(t){return{mouseX:t.clientX-this.gutterComponent.offsetX,mouseY:t.clientY-this.gutterComponent.offsetY}},getGutterSum(t){let e=0;if(this.isArrayContains(this.gutterSizes)){for(let r=0;r<t;r+=1)e+=parseInt(this.gutterSizes[r].match(/-?[0-9]+\.?[0-9]*/g).pop(),10);e+=parseInt(this.gutterSizes[t].match(/-?[0-9]+\.?[0-9]*/g).pop(),10)/2}else{for(let r=0;r<t;r+=1)e+=parseInt(this.gutterSize.match(/-?[0-9]+\.?[0-9]*/g).pop(),10);e+=parseInt(this.gutterSize.match(/-?[0-9]+\.?[0-9]*/g).pop(),10)/2}return e}}},h=l;function g(t,e,r,i,n,s,o,a){var u,c="function"===typeof t?t.options:t;if(e&&(c.render=e,c.staticRenderFns=r,c._compiled=!0),i&&(c.functional=!0),s&&(c._scopeId="data-v-"+s),o?(u=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"===typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),n&&n.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},c._ssrRegister=u):n&&(u=a?function(){n.call(this,this.$root.$options.shadowRoot)}:n),u)if(c.functional){c._injectStyles=u;var l=c.render;c.render=function(t,e){return u.call(e),l(t,e)}}else{var h=c.beforeCreate;c.beforeCreate=h?[].concat(h,u):[u]}return{exports:t,options:c}}var d=g(h,u,c,!1,null,null,null),f=d.exports,p={name:"ColumnGutter",mixins:[f],props:{column:{type:Number,required:!0,default:2},columnSizes:{type:Array}},created(){if(this.isArrayContains(this.columnSizes)&&this.column!==this.columnSizes.length)throw console.error(`Please column equal columnSizes.length\ncolumn: ${this.column}, columnSizes.length: ${this.columnSizes.length}`);if(this.isArrayContains(this.colors)&&this.column-1!==this.colors.length)throw console.error(`Please (column - 1) equal colors.length\n(column - 1): ${this.column-1}, colors.length: ${this.colors.length}`)},methods:{divideArea(){this.isArrayContains(this.columnSizes)?this.specifyDivideArea(this.columnSizes):this.generalDivideArea()},drag(t,e){const{mouseX:r}=this.getCurrentMousePosition(t);this.draggingGutter(t,r,e,this.gutterComponent.width),this.$emit("resize",{col:this.areaSize})}}},m=p,S=(r("bcf8"),g(m,n,s,!1,null,"09736778",null)),y=S.exports,w=function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("section",{ref:"gutter",style:"width: "+t.width+"; height: "+t.height+";"},[r("div",{style:"height: calc("+t.areaSize[0]+"%);"},[t._t("row-0")],2),t._l(t.row-1,function(e){return r("div",{key:e,style:"height: calc("+t.areaSize[e]+"% - "+(t.gutterSize||t.gutterSizes[e-1])+");"},[r("div",{staticClass:"gutter gutter-h",style:"\n        height: "+(t.gutterSize||t.gutterSizes[e-1])+";\n        width: "+t.width+";\n        background-color: "+(t.color||t.colors[e-1])+";\n      ",attrs:{draggable:"true"},on:{drag:function(r){return t.drag(r,e-1)},dragstart:function(r){return t.dragstart(r,e-1)}}}),e!==t.row-1?r("div",{staticClass:"pane pane-h",style:"height: calc(100% - "+(t.gutterSize||t.gutterSizes[e-1])+");"},[t._t("row-"+e)],2):r("div",{staticClass:"pane pane-h",style:"height: calc(100%});"},[t._t("row-"+e)],2)])})],2)},z=[],v={name:"RowGutter",mixins:[f],props:{row:{type:Number,required:!0,default:2},rowSizes:{type:Array}},created(){if(this.isArrayContains(this.rowSizes)&&this.row!==this.rowSizes.length)throw console.error(`Please row equal rowSizes.length\nrow: ${this.row}, rowSizes.length: ${this.rowSizes.length}`);if(this.isArrayContains(this.colors)&&this.row-1!==this.colors.length)throw console.error(`Please (row - 1) equal colors.length\n(row - 1): ${this.row-1}, colors.length: ${this.colors.length}`)},methods:{divideArea(){this.isArrayContains(this.rowSizes)?this.specifyDivideArea(this.rowSizes):this.generalDivideArea()},drag(t,e){const{mouseY:r}=this.getCurrentMousePosition(t);this.draggingGutter(t,r,e,this.gutterComponent.height),this.$emit("resize",{row:this.areaSize})}}},C=v,_=(r("d4ca"),g(C,w,z,!1,null,"7f9fb64e",null)),b=_.exports;const A={ColumnGutter:y,RowGutter:b};function $(t){Object.keys(A).forEach(e=>{t.component(e,A[e])})}const x={install:$};"undefined"!==typeof window&&window.Vue&&window.Vue.use(x);var P=x;r.d(e,"ColumnGutter",function(){return y}),r.d(e,"RowGutter",function(){return b});e["default"]=P}})});
//# sourceMappingURL=vue-gutter-resize.umd.min.js.map