ax5ui-docker - npm Package Compare versions

Comparing version 1.3.89 to 1.3.90

bower.json

 {
 	"name": "ax5ui-docker",
-	"version": "1.3.89",
+	"version": "1.3.90",
 	"description": "A dashboard plugin that works with Bootstrap & jQuery",
@@ -22,2 +22,3 @@ "authors": [
 		"ax5core": ">=1.3.0",
+		"ax5ui-menu": ">=1.3.0",
 		"bootstrap": "^3.3.6"
@@ -24,0 +25,0 @@ },

dist/ax5docker.js

@@ -16,3 +16,3 @@ "use strict";
         className: "docker",
-        version: "1.3.89"
+        version: "1.3.90"
     }, function () {
@@ -47,2 +47,3 @@
             this.xvar = {};
+            this.menu = null;
 
@@ -156,4 +157,11 @@ // 패널 정보
                         _panel.$item.addClass("active");
+
+                        var $pane = _panel.$label.parent();
+                        if ($pane.get(0) && $pane.get(0).clientWidth !== $pane.get(0).scrollWidth) {
+                            $pane.animate({ scrollLeft: _panel.$label.position().left }, 300);
+                        }
+
                         module = _panel.moduleName in _this.modules && 'active' in _this.modules[_panel.moduleName] ? _this.modules[_panel.moduleName] : defaultModule;
                         module.active(moduleContainer, moduleState);
+                        $pane = null;
                     },
@@ -216,3 +224,3 @@ deactive: function deactive() {
 
-                        $dom = jQuery('<div data-ax5docker-pane="" data-ax5docker-path="' + myself.panelPath + '" style="flex-grow: ' + (myself.flexGrow || 1) + ';">' + '<ul data-ax5docker-pane-tabs=""></ul>' + '<div data-ax5docker-pane-tabs-aside="">' + cfg.icons.more + '</div>' + '<div data-ax5docker-pane-item-views=""></div>' + '</div>');
+                        $dom = jQuery('<div data-ax5docker-pane="" data-ax5docker-path="' + myself.panelPath + '" style="flex-grow: ' + (myself.flexGrow || 1) + ';">' + '<ul data-ax5docker-pane-tabs=""></ul>' + '<div data-ax5docker-pane-tabs-more="">' + cfg.icons.more + '</div>' + '<div data-ax5docker-pane-item-views=""></div>' + '</div>');
                         $parent.append($dom);
@@ -319,4 +327,18 @@
                 }).on("click.ax5docker-pane", "[data-ax5docker-pane-tab]", function (e) {
-                    changeActiveStackPanel(this);
+                    // pane, panelIndex 인자 변경.
+                    var $clickedLabel = jQuery(this);
+                    var pane = getPanel($clickedLabel.parents('[data-ax5docker-pane]').attr("data-ax5docker-path"));
+                    var panelIndex = $clickedLabel.attr("data-ax5docker-pane-tab");
+
+                    if (!$clickedLabel.hasClass("active")) {
+                        changeActiveStackPanel(pane, panelIndex);
+                    }
+
+                    $clickedLabel = null;
+                    pane = null;
+                    panelIndex = null;
                     U.stopEvent(e);
+                }).on("click.ax5docker-pane", "[data-ax5docker-pane-tabs-more]", function (e) {
+                    openStackPanelMore($(this).parents('[data-ax5docker-pane]'), e);
+                    U.stopEvent(e);
                 });
@@ -360,24 +382,21 @@
              * 액티브 패널 변경(stack인 상황에서)
-             * @param clickedLabel
+             * @param pane
+             * @param panelIndex
              * @returns {boolean}
              */
-            var changeActiveStackPanel = function changeActiveStackPanel(clickedLabel) {
-                var $clickedLabel = jQuery(clickedLabel),
-                    $pane = $clickedLabel.parents('[data-ax5docker-pane]'),
-                    labelIndex = $clickedLabel.attr("data-ax5docker-pane-tab"),
-                    pane = getPanel($pane.attr("data-ax5docker-path")),
-                    panel = getPanel($clickedLabel.attr("data-ax5docker-path"));
+            var changeActiveStackPanel = function changeActiveStackPanel(pane, panelIndex) {
+                var panel = pane.panels[panelIndex];
 
-                if ($clickedLabel.hasClass("active")) {
-                    return false;
-                } else {
-                    for (var p = 0, pl = pane.panels.length; p < pl; p++) {
-                        if (pane.panels[p].active) {
-                            controlPanel(pane.panels[p], "deactive");
-                        }
+                for (var p = 0, pl = pane.panels.length; p < pl; p++) {
+                    if (pane.panels[p].active) {
+                        controlPanel(pane.panels[p], "deactive");
                     }
+                }
 
-                    if (!panel.builded) controlPanel(panel, "init");
-                    controlPanel(panel, "active");
-                }
+                if (!panel.builded) controlPanel(panel, "init");
+                controlPanel(panel, "active");
+
+                pane = null;
+                panelIndex = null;
+                panel = null;
                 return _this;
@@ -397,5 +416,43 @@ };
                 controlPanel(panel, "destroy");
+
+                $clickedLabel = null;
+                panelPath = null;
+                panel = null;
                 return _this;
             };
 
+            var openStackPanelMore = function openStackPanelMore(stackPane, e) {
+                var $stackPane = jQuery(stackPane),
+                    panePath = $stackPane.attr("data-ax5docker-path"),
+                    pane = getPanel(panePath);
+
+                if (_this.menu) {
+                    var menuItems = U.map(pane.panels, function (index) {
+                        return {
+                            label: this.name,
+                            index: index,
+                            panePath: panePath
+                        };
+                    });
+
+                    _this.menu.setConfig({
+                        items: menuItems,
+                        onClick: function onClick() {
+                            //console.log(pane);
+                            changeActiveStackPanel(getPanel(this.panePath), this.index);
+                        }
+                    });
+
+                    _this.menu.popup(e);
+                } else {
+                    console.log(pane.panels);
+                    throw "'ax5ui-menu' is required to implement the function.";
+                }
+
+                $stackPane = null;
+                panePath = null;
+                pane = null;
+                return _this;
+            };
+
             var panelResizerEvent = {
@@ -602,2 +659,12 @@ "on": function on(_resizer) {
 
+                if (ax5.ui.menu) {
+                    this.menu = new ax5.ui.menu({
+                        theme: 'default',
+                        position: "absolute",
+                        icons: {
+                            'arrow': '▸'
+                        }
+                    });
+                }
+
                 jQuery(window).bind("resize.ax5docker-" + this.id, function () {
@@ -978,3 +1045,2 @@ // stackPane tabs 스크롤처리
 
-// todo : active 된 패널만 표시하기 -- ok
 // todo : row > stack 구현 -- ok
@@ -985,3 +1051,4 @@ // todo : stack 패널 active change -- ok
 // todo : 패널 스플릿 리사이즈 -- ok
-// todo : stack tab overflow 처리. -- ok (탭 포커싱와 탭 목록 메뉴 처리전)
+// todo : stack tab overflow 처리. -- ok
+// todo : 탭 포커싱와 탭 목록 메뉴 처리전
 // todo : 패널 drag & drop
@@ -988,0 +1055,0 @@ // ax5.ui.docker.tmpl

dist/ax5docker.min.js

@@ -1,1 +0,1 @@
-"use strict";!function(){var e=ax5.ui,a=ax5.util;e.addClass({className:"docker",version:"1.3.89"},function(){var e=function(){var e=this,n=this,t=void 0;this.instanceId=ax5.getGuid(),this.config={theme:"default",animateTime:250,columnKeys:{},control:{},icons:{close:"X",more:"..."}},this.xvar={},this.panels=[],this.panelId=0,this.modules={},t=this.config;var r=function(){return e.panelId++},s={init:function(e,a){e.$element.html(a.name)},active:function(e,a){},deactive:function(e,a){},destroy:function(e,a){}},l=function(e,a){var n=[];return e&&"undefined"!=typeof e.panelPath&&n.push(e.panelPath),n.push("panels["+(a||0)+"]"),n.join(".")},o=function(n){var t=[],r=a.isArray(n)?[].concat(n):[].concat(n.split(/[\.\[\]]/g));r.forEach(function(e){""!==e&&t.push('["'+e.replace(/['\"]/g,"")+'"]')});try{return Function("","return this"+t.join("")+";").call(e)}catch(s){return}},i=function(n,t){var r=[],s=a.isArray(n)?[].concat(n):[].concat(n.split(/[\.\[\]]/g));return s.forEach(function(e){""!==e&&r.push('["'+e.replace(/['\"]/g,"")+'"]')}),Function("val","return this"+r.join("")+" = val;").call(e,t)},d=function(e){var a=void 0,n=e.originalEvent?e.originalEvent:e;return a="changedTouches"in n?n.changedTouches[0]:n,{clientX:a.pageX,clientY:a.pageY}},p=function(n,r){var l=jQuery.extend(n.moduleState,{name:n.name}),o={$element:n.$item},d=void 0,p={init:function(){n.builded=!0,d=n.moduleName in e.modules&&"init"in e.modules[n.moduleName]?e.modules[n.moduleName]:s,d.init(o,l)},active:function(){n.active=!0,n.$label.addClass("active"),n.$item.addClass("active"),d=n.moduleName in e.modules&&"active"in e.modules[n.moduleName]?e.modules[n.moduleName]:s,d.active(o,l)},deactive:function(){n.active=!1,n.$label.removeClass("active"),n.$item.removeClass("active"),d=n.moduleName in e.modules&&"deactive"in e.modules[n.moduleName]?e.modules[n.moduleName]:s,d.deactive(o,l)},destroy:function(){d=n.moduleName in e.modules&&"destroy"in e.modules[n.moduleName]?e.modules[n.moduleName]:s,d.destroy(o,l),i(n.panelPath,null),m()}},u={panel:n,controlType:r},c=function(){p[r](),d=null,a.isFunction(t.control.after)&&t.control.after.call(u,u)};p[r]&&(a.isFunction(t.control.before)?t.control.before.call(u,u,function(){c()}):c())},u=function(){var s={stack:function(e,n,r,o){var i=void 0,d=-1;r.panelPath=l(n,o),i=jQuery('<div data-ax5docker-pane="" data-ax5docker-path="'+r.panelPath+'" style="flex-grow: '+(r.flexGrow||1)+';"><ul data-ax5docker-pane-tabs=""></ul><div data-ax5docker-pane-tabs-aside="">'+t.icons.more+'</div><div data-ax5docker-pane-item-views=""></div></div>'),e.append(i),a.isArray(r.panels)&&(r.panels.forEach(function(e,a){e.active&&(d=a)}),d===-1&&(d=0),r.panels[d].active=!0,r.panels.forEach(function(e,a){e.panelIndex=a,s[e.type](i,r,e,a)})),i=null,d=null},panel:function(e,a,n,s){var o=void 0;n.panelPath=l(a,s),n.$label=jQuery('<li data-ax5docker-pane-tab="'+s+'" data-ax5docker-path="'+n.panelPath+'"><div class="title">'+n.name+'</div><div class="close-icon">'+t.icons.close+"</div></li>"),n.$item||(n.$item=jQuery('<div data-ax5docker-pane-item="'+s+'" data-ax5docker-pane-id="'+r()+'" data-ax5docker-path="'+n.panelPath+'"></div>')),a&&"stack"==a.type?(n.active&&(n.builded||p(n,"init"),p(n,"active")),e.find("[data-ax5docker-pane-tabs]").append(n.$label),e.find("[data-ax5docker-pane-item-views]").append(n.$item)):(o=jQuery('<div data-ax5docker-pane="" data-ax5docker-path="'+n.panelPath+'" style="flex-grow: '+(n.flexGrow||1)+';"><ul data-ax5docker-pane-tabs=""></ul><div data-ax5docker-pane-tabs-aside="">'+t.icons.more+'</div><div data-ax5docker-pane-item-views=""></div></div>'),n.builded||p(n,"init"),p(n,"active"),o.find("[data-ax5docker-pane-tabs]").append(n.$label),o.find("[data-ax5docker-pane-item-views]").append(n.$item),e.append(o)),o=null},resizeHandle:function(e,a,n,t){var r=jQuery('<div data-ax5docker-resize-handle="'+a.type+"/"+a.panelPath+"/"+t+'"></div>');e.append(r),r=null},row:function(e,n,t,r){var o=void 0;if(t.panelPath=l(n,r),n&&"stack"==n.type)throw"The 'stack' type child nodes are allowed only for the 'panel' type.";o=jQuery('<div data-ax5docker-pane-axis="row" data-ax5docker-path="'+t.panelPath+'" style="flex-grow: '+(t.flexGrow||1)+';"></div>'),e.append(o),a.isArray(t.panels)&&t.panels.forEach(function(e,a){a>0&&s.resizeHandle(o,t,e,a),e.panelIndex=a,s[e.type](o,t,e,a)}),o=null},column:function(e,n,t,r){var o=void 0;if(t.panelPath=l(n,r),n&&"stack"==n.type)throw"The 'stack' type child nodes are allowed only for the 'panel' type.";o=jQuery('<div data-ax5docker-pane-axis="column" data-ax5docker-path="'+t.panelPath+'" style="flex-grow: '+(t.flexGrow||1)+';"></div>'),e.append(o),a.isArray(t.panels)&&t.panels.forEach(function(e,a){a>0&&s.resizeHandle(o,t,e,a),e.panelIndex=a,s[e.type](o,t,e,a)}),o=null}},o=jQuery('<div data-ax5docker-panes=""></div>');e.panels[0]&&s[e.panels[0].type](o,null,e.panels[0],0),e.$target.html(o),e.$target.off("click.ax5docker-pane").on("click.ax5docker-pane","[data-ax5docker-pane-tab] .close-icon",function(e){h($(this).parents("[data-ax5docker-pane-tab]")),a.stopEvent(e)}).on("click.ax5docker-pane","[data-ax5docker-pane-tab]",function(e){c(this),a.stopEvent(e)}),e.$target.off("mousedown.ax5docker-pane-resize").off("dragstart.ax5docker-pane-resize").on("mousedown.ax5docker-pane-resize","[data-ax5docker-resize-handle]",function(e){var t=this.getAttribute("data-ax5docker-resize-handle").split(/\//g);n.xvar.mousePosition=d(e),n.xvar.resizerType=t[0],n.xvar.resizerPath=t[1],n.xvar.resizerIndex=t[2],n.xvar.resizer$dom=$(this),n.xvar.resizerParent$dom=n.xvar.resizer$dom.parent(),n.xvar.resizerPrevGrow=a.number(n.xvar.resizer$dom.prev().css("flex-grow")),n.xvar.resizerNextGrow=a.number(n.xvar.resizer$dom.next().css("flex-grow")),"row"==n.xvar.resizerType?n.xvar.resizerCanvasWidth=n.xvar.resizer$dom.prev().innerWidth()+n.xvar.resizer$dom.next().innerWidth()+n.xvar.resizer$dom.width():n.xvar.resizerCanvasHeight=n.xvar.resizer$dom.prev().innerHeight()+n.xvar.resizer$dom.next().innerHeight()+n.xvar.resizer$dom.height(),v.on(this),a.stopEvent(e)}).on("dragstart.ax5docker-pane-resize","[data-ax5docker-resize-handle]",function(e){return a.stopEvent(e),!1}),x(),o=null},c=function(a){var n=jQuery(a),t=n.parents("[data-ax5docker-pane]"),r=(n.attr("data-ax5docker-pane-tab"),o(t.attr("data-ax5docker-path"))),s=o(n.attr("data-ax5docker-path"));if(n.hasClass("active"))return!1;for(var l=0,i=r.panels.length;l<i;l++)r.panels[l].active&&p(r.panels[l],"deactive");return s.builded||p(s,"init"),p(s,"active"),e},h=function(a){var n=jQuery(a),t=n.attr("data-ax5docker-path"),r=o(t);return p(r,"destroy"),e},v={on:function(t){var r=$(t);r.offset().left,e.$target.offset().left;jQuery(document.body).bind("mousemove.ax5docker-"+e.instanceId,function(e){var t=d(e),r=void 0;n.xvar.resizerLived?"row"==n.xvar.resizerType?(n.xvar.__da=t.clientX-n.xvar.mousePosition.clientX,r=a.number(2*n.xvar.__da/n.xvar.resizerCanvasWidth,{round:6}),n.xvar.resizer$dom.prev().css({"flex-grow":n.xvar.resizerPrevGrow+r}),n.xvar.resizer$dom.next().css({"flex-grow":n.xvar.resizerNextGrow-r})):(n.xvar.__da=t.clientY-n.xvar.mousePosition.clientY,r=a.number(2*n.xvar.__da/n.xvar.resizerCanvasHeight,{round:6}),n.xvar.resizer$dom.prev().css({"flex-grow":n.xvar.resizerPrevGrow+r}),n.xvar.resizer$dom.next().css({"flex-grow":n.xvar.resizerNextGrow-r})):n.xvar.resizerLived=!0,t=null,r=null}).bind("mouseup.ax5docker-"+e.instanceId,function(e){v.off.call(n),a.stopEvent(e)}).bind("mouseleave.ax5docker-"+e.instanceId,function(e){v.off.call(n),a.stopEvent(e)}),jQuery(document.body).attr("unselectable","on").css("user-select","none").on("selectstart",!1)},off:function(){if(n.xvar.resizerLived=!1,"undefined"==typeof e.xvar.__da);else{var t=n.xvar.resizer$dom.prev(),r=n.xvar.resizer$dom.next(),s=o(t.attr("data-ax5docker-path")),l=o(r.attr("data-ax5docker-path"));s.flexGrow=a.number(t.css("flex-grow")),l.flexGrow=a.number(r.css("flex-grow")),t=null,r=null,s=null,l=null}jQuery(document.body).unbind("mousemove.ax5docker-"+e.instanceId).unbind("mouseup.ax5docker-"+e.instanceId).unbind("mouseleave.ax5docker-"+e.instanceId),jQuery(document.body).removeAttr("unselectable").css("user-select","auto").off("selectstart")}},f=ax5.util.debounce(function(e){e()},t.animateTime),x=function(){f(function(){this.$target.find("[data-ax5docker-pane-tabs]").each(function(){var e=jQuery(this).parent();this.scrollWidth>this.clientWidth?e.addClass("tabs-scrolled"):e.removeClass("tabs-scrolled"),e=null})}.bind(e))},m=function(){var n={stack:function(e){if(!a.isArray(e.panels))return!1;var t={type:"stack",panels:[]};return e.panels.forEach(function(e,a){if(e){var r=n[e.type](e);r&&t.panels.push(r),r=null}}),0==t.panels.length?null:(t.panels.length<2&&(t=t.panels[0]),t)},panel:function(e){return e},row:function(e){if(!a.isArray(e.panels))return!1;var t={type:"row",panels:[]};return e.panels.forEach(function(e,a){if(e){var r=n[e.type](e);r&&t.panels.push(r),r=null}}),0==t.panels.length?null:(t.panels.length<2&&(t=t.panels[0]),t)},column:function(e){if(!a.isArray(e.panels))return!1;var t={type:"column",panels:[]};return e.panels.forEach(function(e,a){if(e){var r=n[e.type](e);r&&t.panels.push(r),r=null}}),0==t.panels.length?null:(t.panels.length<2&&(t=t.panels[0]),t)}};e.panels[0]?e.panels[0]=n[e.panels[0].type](e.panels[0]):e.panels=[],u()};this.init=function(e){return t=jQuery.extend(!0,{},t,e),t.target?(this.$target=jQuery(t.target),this.panels=t.panels||[],this.onStateChanged=t.onStateChanged,this.onClick=t.onClick,this.onLoad=t.onLoad,this.onDataChanged=t.onDataChanged,void jQuery(window).bind("resize.ax5docker-"+this.id,function(){x()})):(console.log(ax5.info.getError("ax5docker","401","init")),this)},this.setPanels=function(e){return this.panels=e||[],u(),this},this.addModule=function(e){return a.isObject(e)&&jQuery.extend(!0,this.modules,e),this},this.repaint=function(){return u(),this},this.addPanel=function(e,a,n,t){"undefined"==e&&(e="0"),e=e.replace(/[a-zA-Z\[\]]+/g,"").replace(/(\d+)/g,function(e,a){return"panels["+e+"]"});var r=o(e);console.log(r);var s={stack:function(a,n,t){var r=jQuery.extend({},a),s={stack:function(e,a){e.panels.push(a),m()},"row-left":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"row"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"row",panels:[]}),a.panels.push(t),a.panels.push(r),m())},"row-right":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"row"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"row",panels:[]}),a.panels.push(r),a.panels.push(t),m())},"column-top":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"column"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"column",panels:[]}),a.panels.push(t),a.panels.push(r),m())},"column-bottom":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"column"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"column",panels:[]}),a.panels.push(r),a.panels.push(t),m())}};n in s&&s[n].call(this,a,t),r=null,s=null},row:function(a,n,t,r){var s=jQuery.extend({},a),l={stack:function(e,a){e.panels[0]&&e.panels[0].panelPath&&this.addPanel(e.panels[0].panelPath,n,a)},"row-left":function(a,n,t){var r=e.substr(0,e.lastIndexOf(".")),l=o(r);"row"==l.type?(a.panels.splice(t,0,n),m()):(a=i(e,{type:"row",panels:[]}),a.panels.push(n),a.panels.push(s),m())},"row-right":function(a,n,t){var r=e.substr(0,e.lastIndexOf(".")),l=o(r);"row"==l.type?(a.panels.splice(t+1,0,n),m()):(a=i(e,{type:"row",panels:[]}),a.panels.push(s),a.panels.push(n),m())},"column-top":function(a,t,r){var l=e.substr(0,e.lastIndexOf(".")),d=o(l);"column"==d.type?this.addPanel(d.panelPath,n,t,a.panelIndex):(a=i(e,{type:"column",panels:[]}),a.panels.push(t),a.panels.push(s),m())},"column-bottom":function(a,t,r){var l=e.substr(0,e.lastIndexOf(".")),d=o(l);"column"==d.type?this.addPanel(d.panelPath,n,t,a.panelIndex):(a=i(e,{type:"column",panels:[]}),a.panels.push(s),a.panels.push(t),m())}};n in l&&l[n].call(this,a,t,r),l=null,s=null},column:function(a,n,t,r){var s=jQuery.extend({},a),l={stack:function(e,a){e.panels[0]&&e.panels[0].panelPath&&this.addPanel(e.panels[0].panelPath,n,a)},"row-left":function(a,t){var r=e.substr(0,e.lastIndexOf(".")),l=o(r);"row"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"row",panels:[]}),a.panels.push(t),a.panels.push(s),m())},"row-right":function(a,t){var r=e.substr(0,e.lastIndexOf(".")),l=o(r);"row"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"row",panels:[]}),a.panels.push(s),a.panels.push(t),m())},"column-top":function(e,a){e.panels.splice(r,0,a),m()},"column-bottom":function(e,a){e.panels.splice(r+1,0,a),m()}};n in l&&l[n].call(this,a,t),l=null,s=null},panel:function(a,n,t){var r=jQuery.extend({},a),s={stack:function(a,n){a=i(e,{type:"stack",panels:[]}),a.panels.push(r),a.panels.push(n),m()},"row-left":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"row"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"row",panels:[]}),a.panels.push(t),a.panels.push(r),m())},"row-right":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"row"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"row",panels:[]}),a.panels.push(r),a.panels.push(t),m())},"column-top":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"column"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"column",panels:[]}),a.panels.push(t),a.panels.push(r),m())},"column-bottom":function(a,t){var s=e.substr(0,e.lastIndexOf(".")),l=o(s);"column"==l.type?this.addPanel(l.panelPath,n,t,a.panelIndex):(a=i(e,{type:"column",panels:[]}),a.panels.push(r),a.panels.push(t),m())}};n in s&&s[n].call(this,a,t),r=null,s=null}};return s[r.type].call(this,r,a,n,t),this},this.main=function(){arguments&&a.isObject(arguments[0])&&this.setConfig(arguments[0])}.apply(this,arguments)};return e}())}(),function(){var e=ax5.ui.docker,a=function(e){return" \n{{#panels}}\n{{#panels}}\n{{/panels}}\n{{^panels}}\n{{/panels}}\n{{/panels}}\n        "};e.tmpl={panels:a,get:function(a,n,t){return ax5.mustache.render(e.tmpl[a].call(this,t),n)}}}();
+"use strict";!function(){var e=ax5.ui,n=ax5.util;e.addClass({className:"docker",version:"1.3.90"},function(){var e=function(){var e=this,a=this,t=void 0;this.instanceId=ax5.getGuid(),this.config={theme:"default",animateTime:250,columnKeys:{},control:{},icons:{close:"X",more:"..."}},this.xvar={},this.menu=null,this.panels=[],this.panelId=0,this.modules={},t=this.config;var l=function(){return e.panelId++},r={init:function(e,n){e.$element.html(n.name)},active:function(e,n){},deactive:function(e,n){},destroy:function(e,n){}},s=function(e,n){var a=[];return e&&"undefined"!=typeof e.panelPath&&a.push(e.panelPath),a.push("panels["+(n||0)+"]"),a.join(".")},i=function(a){var t=[],l=n.isArray(a)?[].concat(a):[].concat(a.split(/[\.\[\]]/g));l.forEach(function(e){""!==e&&t.push('["'+e.replace(/['\"]/g,"")+'"]')});try{return Function("","return this"+t.join("")+";").call(e)}catch(r){return}},o=function(a,t){var l=[],r=n.isArray(a)?[].concat(a):[].concat(a.split(/[\.\[\]]/g));return r.forEach(function(e){""!==e&&l.push('["'+e.replace(/['\"]/g,"")+'"]')}),Function("val","return this"+l.join("")+" = val;").call(e,t)},d=function(e){var n=void 0,a=e.originalEvent?e.originalEvent:e;return n="changedTouches"in a?a.changedTouches[0]:a,{clientX:n.pageX,clientY:n.pageY}},u=function(a,l){var s=jQuery.extend(a.moduleState,{name:a.name}),i={$element:a.$item},d=void 0,u={init:function(){a.builded=!0,d=a.moduleName in e.modules&&"init"in e.modules[a.moduleName]?e.modules[a.moduleName]:r,d.init(i,s)},active:function(){a.active=!0,a.$label.addClass("active"),a.$item.addClass("active");var n=a.$label.parent();n.get(0)&&n.get(0).clientWidth!==n.get(0).scrollWidth&&n.animate({scrollLeft:a.$label.position().left},300),d=a.moduleName in e.modules&&"active"in e.modules[a.moduleName]?e.modules[a.moduleName]:r,d.active(i,s),n=null},deactive:function(){a.active=!1,a.$label.removeClass("active"),a.$item.removeClass("active"),d=a.moduleName in e.modules&&"deactive"in e.modules[a.moduleName]?e.modules[a.moduleName]:r,d.deactive(i,s)},destroy:function(){d=a.moduleName in e.modules&&"destroy"in e.modules[a.moduleName]?e.modules[a.moduleName]:r,d.destroy(i,s),o(a.panelPath,null),y()}},p={panel:a,controlType:l},c=function(){u[l](),d=null,n.isFunction(t.control.after)&&t.control.after.call(p,p)};u[l]&&(n.isFunction(t.control.before)?t.control.before.call(p,p,function(){c()}):c())},p=function(){var r={stack:function(e,a,l,i){var o=void 0,d=-1;l.panelPath=s(a,i),o=jQuery('<div data-ax5docker-pane="" data-ax5docker-path="'+l.panelPath+'" style="flex-grow: '+(l.flexGrow||1)+';"><ul data-ax5docker-pane-tabs=""></ul><div data-ax5docker-pane-tabs-more="">'+t.icons.more+'</div><div data-ax5docker-pane-item-views=""></div></div>'),e.append(o),n.isArray(l.panels)&&(l.panels.forEach(function(e,n){e.active&&(d=n)}),d===-1&&(d=0),l.panels[d].active=!0,l.panels.forEach(function(e,n){e.panelIndex=n,r[e.type](o,l,e,n)})),o=null,d=null},panel:function(e,n,a,r){var i=void 0;a.panelPath=s(n,r),a.$label=jQuery('<li data-ax5docker-pane-tab="'+r+'" data-ax5docker-path="'+a.panelPath+'"><div class="title">'+a.name+'</div><div class="close-icon">'+t.icons.close+"</div></li>"),a.$item||(a.$item=jQuery('<div data-ax5docker-pane-item="'+r+'" data-ax5docker-pane-id="'+l()+'" data-ax5docker-path="'+a.panelPath+'"></div>')),n&&"stack"==n.type?(a.active&&(a.builded||u(a,"init"),u(a,"active")),e.find("[data-ax5docker-pane-tabs]").append(a.$label),e.find("[data-ax5docker-pane-item-views]").append(a.$item)):(i=jQuery('<div data-ax5docker-pane="" data-ax5docker-path="'+a.panelPath+'" style="flex-grow: '+(a.flexGrow||1)+';"><ul data-ax5docker-pane-tabs=""></ul><div data-ax5docker-pane-tabs-aside="">'+t.icons.more+'</div><div data-ax5docker-pane-item-views=""></div></div>'),a.builded||u(a,"init"),u(a,"active"),i.find("[data-ax5docker-pane-tabs]").append(a.$label),i.find("[data-ax5docker-pane-item-views]").append(a.$item),e.append(i)),i=null},resizeHandle:function(e,n,a,t){var l=jQuery('<div data-ax5docker-resize-handle="'+n.type+"/"+n.panelPath+"/"+t+'"></div>');e.append(l),l=null},row:function(e,a,t,l){var i=void 0;if(t.panelPath=s(a,l),a&&"stack"==a.type)throw"The 'stack' type child nodes are allowed only for the 'panel' type.";i=jQuery('<div data-ax5docker-pane-axis="row" data-ax5docker-path="'+t.panelPath+'" style="flex-grow: '+(t.flexGrow||1)+';"></div>'),e.append(i),n.isArray(t.panels)&&t.panels.forEach(function(e,n){n>0&&r.resizeHandle(i,t,e,n),e.panelIndex=n,r[e.type](i,t,e,n)}),i=null},column:function(e,a,t,l){var i=void 0;if(t.panelPath=s(a,l),a&&"stack"==a.type)throw"The 'stack' type child nodes are allowed only for the 'panel' type.";i=jQuery('<div data-ax5docker-pane-axis="column" data-ax5docker-path="'+t.panelPath+'" style="flex-grow: '+(t.flexGrow||1)+';"></div>'),e.append(i),n.isArray(t.panels)&&t.panels.forEach(function(e,n){n>0&&r.resizeHandle(i,t,e,n),e.panelIndex=n,r[e.type](i,t,e,n)}),i=null}},o=jQuery('<div data-ax5docker-panes=""></div>');e.panels[0]&&r[e.panels[0].type](o,null,e.panels[0],0),e.$target.html(o),e.$target.off("click.ax5docker-pane").on("click.ax5docker-pane","[data-ax5docker-pane-tab] .close-icon",function(e){h($(this).parents("[data-ax5docker-pane-tab]")),n.stopEvent(e)}).on("click.ax5docker-pane","[data-ax5docker-pane-tab]",function(e){var a=jQuery(this),t=i(a.parents("[data-ax5docker-pane]").attr("data-ax5docker-path")),l=a.attr("data-ax5docker-pane-tab");a.hasClass("active")||c(t,l),a=null,t=null,l=null,n.stopEvent(e)}).on("click.ax5docker-pane","[data-ax5docker-pane-tabs-more]",function(e){v($(this).parents("[data-ax5docker-pane]"),e),n.stopEvent(e)}),e.$target.off("mousedown.ax5docker-pane-resize").off("dragstart.ax5docker-pane-resize").on("mousedown.ax5docker-pane-resize","[data-ax5docker-resize-handle]",function(e){var t=this.getAttribute("data-ax5docker-resize-handle").split(/\//g);a.xvar.mousePosition=d(e),a.xvar.resizerType=t[0],a.xvar.resizerPath=t[1],a.xvar.resizerIndex=t[2],a.xvar.resizer$dom=$(this),a.xvar.resizerParent$dom=a.xvar.resizer$dom.parent(),a.xvar.resizerPrevGrow=n.number(a.xvar.resizer$dom.prev().css("flex-grow")),a.xvar.resizerNextGrow=n.number(a.xvar.resizer$dom.next().css("flex-grow")),"row"==a.xvar.resizerType?a.xvar.resizerCanvasWidth=a.xvar.resizer$dom.prev().innerWidth()+a.xvar.resizer$dom.next().innerWidth()+a.xvar.resizer$dom.width():a.xvar.resizerCanvasHeight=a.xvar.resizer$dom.prev().innerHeight()+a.xvar.resizer$dom.next().innerHeight()+a.xvar.resizer$dom.height(),f.on(this),n.stopEvent(e)}).on("dragstart.ax5docker-pane-resize","[data-ax5docker-resize-handle]",function(e){return n.stopEvent(e),!1}),m(),o=null},c=function(n,a){for(var t=n.panels[a],l=0,r=n.panels.length;l<r;l++)n.panels[l].active&&u(n.panels[l],"deactive");return t.builded||u(t,"init"),u(t,"active"),n=null,a=null,t=null,e},h=function(n){var a=jQuery(n),t=a.attr("data-ax5docker-path"),l=i(t);return u(l,"destroy"),a=null,t=null,l=null,e},v=function(a,t){var l=jQuery(a),r=l.attr("data-ax5docker-path"),s=i(r);if(!e.menu)throw console.log(s.panels),"'ax5ui-menu' is required to implement the function.";var o=n.map(s.panels,function(e){return{label:this.name,index:e,panePath:r}});return e.menu.setConfig({items:o,onClick:function(){c(i(this.panePath),this.index)}}),e.menu.popup(t),l=null,r=null,s=null,e},f={on:function(t){var l=$(t);l.offset().left,e.$target.offset().left;jQuery(document.body).bind("mousemove.ax5docker-"+e.instanceId,function(e){var t=d(e),l=void 0;a.xvar.resizerLived?"row"==a.xvar.resizerType?(a.xvar.__da=t.clientX-a.xvar.mousePosition.clientX,l=n.number(2*a.xvar.__da/a.xvar.resizerCanvasWidth,{round:6}),a.xvar.resizer$dom.prev().css({"flex-grow":a.xvar.resizerPrevGrow+l}),a.xvar.resizer$dom.next().css({"flex-grow":a.xvar.resizerNextGrow-l})):(a.xvar.__da=t.clientY-a.xvar.mousePosition.clientY,l=n.number(2*a.xvar.__da/a.xvar.resizerCanvasHeight,{round:6}),a.xvar.resizer$dom.prev().css({"flex-grow":a.xvar.resizerPrevGrow+l}),a.xvar.resizer$dom.next().css({"flex-grow":a.xvar.resizerNextGrow-l})):a.xvar.resizerLived=!0,t=null,l=null}).bind("mouseup.ax5docker-"+e.instanceId,function(e){f.off.call(a),n.stopEvent(e)}).bind("mouseleave.ax5docker-"+e.instanceId,function(e){f.off.call(a),n.stopEvent(e)}),jQuery(document.body).attr("unselectable","on").css("user-select","none").on("selectstart",!1)},off:function(){if(a.xvar.resizerLived=!1,"undefined"==typeof e.xvar.__da);else{var t=a.xvar.resizer$dom.prev(),l=a.xvar.resizer$dom.next(),r=i(t.attr("data-ax5docker-path")),s=i(l.attr("data-ax5docker-path"));r.flexGrow=n.number(t.css("flex-grow")),s.flexGrow=n.number(l.css("flex-grow")),t=null,l=null,r=null,s=null}jQuery(document.body).unbind("mousemove.ax5docker-"+e.instanceId).unbind("mouseup.ax5docker-"+e.instanceId).unbind("mouseleave.ax5docker-"+e.instanceId),jQuery(document.body).removeAttr("unselectable").css("user-select","auto").off("selectstart")}},x=ax5.util.debounce(function(e){e()},t.animateTime),m=function(){x(function(){this.$target.find("[data-ax5docker-pane-tabs]").each(function(){var e=jQuery(this).parent();this.scrollWidth>this.clientWidth?e.addClass("tabs-scrolled"):e.removeClass("tabs-scrolled"),e=null})}.bind(e))},y=function(){var a={stack:function(e){if(!n.isArray(e.panels))return!1;var t={type:"stack",panels:[]};return e.panels.forEach(function(e,n){if(e){var l=a[e.type](e);l&&t.panels.push(l),l=null}}),0==t.panels.length?null:(t.panels.length<2&&(t=t.panels[0]),t)},panel:function(e){return e},row:function(e){if(!n.isArray(e.panels))return!1;var t={type:"row",panels:[]};return e.panels.forEach(function(e,n){if(e){var l=a[e.type](e);l&&t.panels.push(l),l=null}}),0==t.panels.length?null:(t.panels.length<2&&(t=t.panels[0]),t)},column:function(e){if(!n.isArray(e.panels))return!1;var t={type:"column",panels:[]};return e.panels.forEach(function(e,n){if(e){var l=a[e.type](e);l&&t.panels.push(l),l=null}}),0==t.panels.length?null:(t.panels.length<2&&(t=t.panels[0]),t)}};e.panels[0]?e.panels[0]=a[e.panels[0].type](e.panels[0]):e.panels=[],p()};this.init=function(e){return t=jQuery.extend(!0,{},t,e),t.target?(this.$target=jQuery(t.target),this.panels=t.panels||[],this.onStateChanged=t.onStateChanged,this.onClick=t.onClick,this.onLoad=t.onLoad,this.onDataChanged=t.onDataChanged,ax5.ui.menu&&(this.menu=new ax5.ui.menu({theme:"default",position:"absolute",icons:{arrow:"▸"}})),void jQuery(window).bind("resize.ax5docker-"+this.id,function(){m()})):(console.log(ax5.info.getError("ax5docker","401","init")),this)},this.setPanels=function(e){return this.panels=e||[],p(),this},this.addModule=function(e){return n.isObject(e)&&jQuery.extend(!0,this.modules,e),this},this.repaint=function(){return p(),this},this.addPanel=function(e,n,a,t){"undefined"==e&&(e="0"),e=e.replace(/[a-zA-Z\[\]]+/g,"").replace(/(\d+)/g,function(e,n){return"panels["+e+"]"});var l=i(e);console.log(l);var r={stack:function(n,a,t){var l=jQuery.extend({},n),r={stack:function(e,n){e.panels.push(n),y()},"row-left":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"row"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"row",panels:[]}),n.panels.push(t),n.panels.push(l),y())},"row-right":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"row"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"row",panels:[]}),n.panels.push(l),n.panels.push(t),y())},"column-top":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"column"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"column",panels:[]}),n.panels.push(t),n.panels.push(l),y())},"column-bottom":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"column"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"column",panels:[]}),n.panels.push(l),n.panels.push(t),y())}};a in r&&r[a].call(this,n,t),l=null,r=null},row:function(n,a,t,l){var r=jQuery.extend({},n),s={stack:function(e,n){e.panels[0]&&e.panels[0].panelPath&&this.addPanel(e.panels[0].panelPath,a,n)},"row-left":function(n,a,t){var l=e.substr(0,e.lastIndexOf(".")),s=i(l);"row"==s.type?(n.panels.splice(t,0,a),y()):(n=o(e,{type:"row",panels:[]}),n.panels.push(a),n.panels.push(r),y())},"row-right":function(n,a,t){var l=e.substr(0,e.lastIndexOf(".")),s=i(l);"row"==s.type?(n.panels.splice(t+1,0,a),y()):(n=o(e,{type:"row",panels:[]}),n.panels.push(r),n.panels.push(a),y())},"column-top":function(n,t,l){var s=e.substr(0,e.lastIndexOf(".")),d=i(s);"column"==d.type?this.addPanel(d.panelPath,a,t,n.panelIndex):(n=o(e,{type:"column",panels:[]}),n.panels.push(t),n.panels.push(r),y())},"column-bottom":function(n,t,l){var s=e.substr(0,e.lastIndexOf(".")),d=i(s);"column"==d.type?this.addPanel(d.panelPath,a,t,n.panelIndex):(n=o(e,{type:"column",panels:[]}),n.panels.push(r),n.panels.push(t),y())}};a in s&&s[a].call(this,n,t,l),s=null,r=null},column:function(n,a,t,l){var r=jQuery.extend({},n),s={stack:function(e,n){e.panels[0]&&e.panels[0].panelPath&&this.addPanel(e.panels[0].panelPath,a,n)},"row-left":function(n,t){var l=e.substr(0,e.lastIndexOf(".")),s=i(l);"row"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"row",panels:[]}),n.panels.push(t),n.panels.push(r),y())},"row-right":function(n,t){var l=e.substr(0,e.lastIndexOf(".")),s=i(l);"row"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"row",panels:[]}),n.panels.push(r),n.panels.push(t),y())},"column-top":function(e,n){e.panels.splice(l,0,n),y()},"column-bottom":function(e,n){e.panels.splice(l+1,0,n),y()}};a in s&&s[a].call(this,n,t),s=null,r=null},panel:function(n,a,t){var l=jQuery.extend({},n),r={stack:function(n,a){n=o(e,{type:"stack",panels:[]}),n.panels.push(l),n.panels.push(a),y()},"row-left":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"row"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"row",panels:[]}),n.panels.push(t),n.panels.push(l),y())},"row-right":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"row"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"row",panels:[]}),n.panels.push(l),n.panels.push(t),y())},"column-top":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"column"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"column",panels:[]}),n.panels.push(t),n.panels.push(l),y())},"column-bottom":function(n,t){var r=e.substr(0,e.lastIndexOf(".")),s=i(r);"column"==s.type?this.addPanel(s.panelPath,a,t,n.panelIndex):(n=o(e,{type:"column",panels:[]}),n.panels.push(l),n.panels.push(t),y())}};a in r&&r[a].call(this,n,t),l=null,r=null}};return r[l.type].call(this,l,n,a,t),this},this.main=function(){arguments&&n.isObject(arguments[0])&&this.setConfig(arguments[0])}.apply(this,arguments)};return e}())}(),function(){var e=ax5.ui.docker,n=function(e){return" \n{{#panels}}\n{{#panels}}\n{{/panels}}\n{{^panels}}\n{{/panels}}\n{{/panels}}\n        "};e.tmpl={panels:n,get:function(n,a,t){return ax5.mustache.render(e.tmpl[n].call(this,t),a)}}}();

package.json

 {
   "name": "ax5ui-docker",
-  "version": "1.3.89",
+  "version": "1.3.90",
   "description": "A dashboard plugin that works with Bootstrap & jQuery",
@@ -5,0 +5,0 @@ "license": "MIT",

README.md

@@ -12,2 +12,3 @@ [![Build Status](https://travis-ci.org/ax5ui/ax5ui-docker.svg?branch=master)](https://travis-ci.org/ax5ui/ax5ui-docker)
 > * _[ax5core](http://ax5.io/ax5core)_
+> * _[ax5ui-menu](http://ax5.io/ax5ui-menu)_
 
@@ -32,2 +33,3 @@ ### Install with bower
 npm install ax5core
+npm install ax5ui-menu
 npm install ax5ui-docker
@@ -34,0 +36,0 @@ ```

src/ax5docker.js

@@ -42,2 +42,3 @@ /*
             this.xvar = {};
+            this.menu = null;
 
@@ -156,4 +157,11 @@ // 패널 정보
                         _panel.$item.addClass("active");
+
+                        let $pane = _panel.$label.parent();
+                        if ($pane.get(0) && $pane.get(0).clientWidth !== $pane.get(0).scrollWidth) {
+                            $pane.animate({scrollLeft: _panel.$label.position().left}, 300);
+                        }
+
                         module = (_panel.moduleName in this.modules && 'active' in this.modules[_panel.moduleName]) ? this.modules[_panel.moduleName] : defaultModule;
                         module.active(moduleContainer, moduleState);
+                        $pane = null;
                     },
@@ -218,3 +226,3 @@ deactive: () => {
                             '<ul data-ax5docker-pane-tabs=""></ul>' +
-                            '<div data-ax5docker-pane-tabs-aside="">' + cfg.icons.more + '</div>' +
+                            '<div data-ax5docker-pane-tabs-more="">' + cfg.icons.more + '</div>' +
                             '<div data-ax5docker-pane-item-views=""></div>' +
@@ -333,4 +341,19 @@ '</div>');
                     .on("click.ax5docker-pane", "[data-ax5docker-pane-tab]", function (e) {
-                        changeActiveStackPanel(this);
+                        // pane, panelIndex 인자 변경.
+                        let $clickedLabel = jQuery(this);
+                        let pane = getPanel($clickedLabel.parents('[data-ax5docker-pane]').attr("data-ax5docker-path"));
+                        let panelIndex = $clickedLabel.attr("data-ax5docker-pane-tab");
+
+                        if (!$clickedLabel.hasClass("active")) {
+                            changeActiveStackPanel(pane, panelIndex);
+                        }
+
+                        $clickedLabel = null;
+                        pane = null;
+                        panelIndex = null;
                         U.stopEvent(e);
+                    })
+                    .on("click.ax5docker-pane", "[data-ax5docker-pane-tabs-more]", function (e) {
+                        openStackPanelMore($(this).parents('[data-ax5docker-pane]'), e);
+                        U.stopEvent(e);
                     });
@@ -378,24 +401,21 @@
              * 액티브 패널 변경(stack인 상황에서)
-             * @param clickedLabel
+             * @param pane
+             * @param panelIndex
              * @returns {boolean}
              */
-            const changeActiveStackPanel = (clickedLabel) => {
-                let $clickedLabel = jQuery(clickedLabel),
-                    $pane = $clickedLabel.parents('[data-ax5docker-pane]'),
-                    labelIndex = $clickedLabel.attr("data-ax5docker-pane-tab"),
-                    pane = getPanel($pane.attr("data-ax5docker-path")),
-                    panel = getPanel($clickedLabel.attr("data-ax5docker-path"));
+            const changeActiveStackPanel = (pane, panelIndex) => {
+                let panel = pane.panels[panelIndex];
 
-                if ($clickedLabel.hasClass("active")) {
-                    return false;
-                } else {
-                    for (let p = 0, pl = pane.panels.length; p < pl; p++) {
-                        if (pane.panels[p].active) {
-                            controlPanel(pane.panels[p], "deactive");
-                        }
+                for (let p = 0, pl = pane.panels.length; p < pl; p++) {
+                    if (pane.panels[p].active) {
+                        controlPanel(pane.panels[p], "deactive");
                     }
+                }
 
-                    if (!panel.builded) controlPanel(panel, "init");
-                    controlPanel(panel, "active");
-                }
+                if (!panel.builded) controlPanel(panel, "init");
+                controlPanel(panel, "active");
+
+                pane = null;
+                panelIndex = null;
+                panel = null;
                 return this;
@@ -415,5 +435,43 @@ };
                 controlPanel(panel, "destroy");
+
+                $clickedLabel = null;
+                panelPath = null;
+                panel = null;
                 return this;
             };
 
+            const openStackPanelMore = (stackPane, e) => {
+                let $stackPane = jQuery(stackPane),
+                    panePath = $stackPane.attr("data-ax5docker-path"),
+                    pane = getPanel(panePath);
+
+                if (this.menu) {
+                    let menuItems = U.map(pane.panels, function (index) {
+                        return {
+                            label: this.name,
+                            index: index,
+                            panePath: panePath
+                        }
+                    });
+
+                    this.menu.setConfig({
+                        items: menuItems,
+                        onClick: function () {
+                            //console.log(pane);
+                            changeActiveStackPanel(getPanel(this.panePath), this.index);
+                        }
+                    });
+
+                    this.menu.popup(e);
+                } else {
+                    console.log(pane.panels);
+                    throw "'ax5ui-menu' is required to implement the function.";
+                }
+
+                $stackPane = null;
+                panePath = null;
+                pane = null;
+                return this;
+            };
+
             const panelResizerEvent = {
@@ -635,2 +693,12 @@ "on": (_resizer) => {
 
+                if (ax5.ui.menu) {
+                    this.menu = new ax5.ui.menu({
+                        theme: 'default',
+                        position: "absolute",
+                        icons: {
+                            'arrow': '▸'
+                        }
+                    });
+                }
+
                 jQuery(window).bind("resize.ax5docker-" + this.id, function () {
@@ -1016,3 +1084,2 @@ // stackPane tabs 스크롤처리
 
-// todo : active 된 패널만 표시하기 -- ok
 // todo : row > stack 구현 -- ok
@@ -1023,3 +1090,4 @@ // todo : stack 패널 active change -- ok
 // todo : 패널 스플릿 리사이즈 -- ok
-// todo : stack tab overflow 처리. -- ok (탭 포커싱와 탭 목록 메뉴 처리전)
+// todo : stack tab overflow 처리. -- ok
+// todo : 탭 포커싱와 탭 목록 메뉴 처리전
 // todo : 패널 drag & drop

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

272534

increased by5.38%

Lines of code

2048

increased by5.84%

Number of lines in readme file

82

increased by2.5%

No dependency changes