]>
Commit | Line | Data |
---|---|---|
458e534c EK |
1 | /* |
2 | * Base class for all the multitab config panels | |
3 | */ | |
55ed1090 DM |
4 | Ext.define('PVE.panel.Config', { |
5 | extend: 'Ext.panel.Panel', | |
6 | alias: 'widget.pvePanelConfig', | |
7 | ||
458e534c EK |
8 | showSearch: true, // add a ressource grid with a search button as first tab |
9 | viewFilter: undefined, // a filter to pass to that ressource grid | |
10 | ||
55ed1090 DM |
11 | initComponent: function() { |
12 | var me = this; | |
13 | ||
14 | var stateid = me.hstateid; | |
15 | ||
16 | var sp = Ext.state.Manager.getProvider(); | |
17 | ||
cececa1d | 18 | var activeTab; // leaving this undefined means items[0] will be the default tab |
55ed1090 DM |
19 | |
20 | var hsregex = /^([^\-\s]+)(-\S+)?$/; | |
21 | ||
22 | if (stateid) { | |
23 | var state = sp.get(stateid); | |
24 | if (state && state.value) { | |
25 | var res = hsregex.exec(state.value); | |
26 | if (res && res[1]) { | |
27 | activeTab = res[1]; | |
28 | } | |
29 | } | |
30 | } | |
31 | ||
32 | var items = me.items || []; | |
33 | me.items = undefined; | |
34 | ||
35 | var tbar = me.tbar || []; | |
36 | me.tbar = undefined; | |
37 | ||
38 | var title = me.title || me.pveSelNode.data.text; | |
39 | me.title = undefined; | |
40 | ||
41 | tbar.unshift('->'); | |
42 | tbar.unshift({ | |
43 | xtype: 'tbtext', | |
44 | text: title, | |
22f2f9d6 | 45 | baseCls: 'x-panel-header-text' |
55ed1090 DM |
46 | }); |
47 | ||
55ed1090 DM |
48 | |
49 | if (me.showSearch) { | |
50 | items.unshift({ | |
7e27f5d1 DC |
51 | itemId: 'search', |
52 | title: gettext('Search'), | |
ec0bd652 DC |
53 | layout: { type:'fit' }, |
54 | plugins: [{ | |
7e27f5d1 | 55 | ptype: 'lazyitems', |
ec0bd652 | 56 | items: [{ |
7e27f5d1 DC |
57 | xtype: 'pveResourceGrid', |
58 | pveSelNode: me.pveSelNode | |
ec0bd652 DC |
59 | }] |
60 | }] | |
55ed1090 DM |
61 | }); |
62 | } | |
63 | ||
64 | var toolbar = Ext.create('Ext.toolbar.Toolbar', { | |
65 | items: tbar, | |
f3f4a823 DC |
66 | border: false, |
67 | height: 36 | |
55ed1090 DM |
68 | }); |
69 | ||
70 | var tab = Ext.create('Ext.tab.Panel', { | |
71 | flex: 1, | |
72 | border: true, | |
73 | activeTab: activeTab, | |
74 | defaults: Ext.apply(me.defaults || {}, { | |
75 | pveSelNode: me.pveSelNode, | |
76 | viewFilter: me.viewFilter, | |
77 | workspace: me.workspace, | |
78 | border: false | |
79 | }), | |
80 | items: items, | |
81 | listeners: { | |
55ed1090 DM |
82 | tabchange: function(tp, newcard, oldcard) { |
83 | var ntab = newcard.itemId; | |
84 | ||
85 | // Note: '' is alias for first tab. | |
86 | // First tab can be 'search' or something else | |
87 | if (newcard.itemId === items[0].itemId) { | |
88 | ntab = ''; | |
89 | } | |
90 | if (stateid) { | |
91 | if (newcard.phstateid) { | |
92 | sp.set(newcard.phstateid, newcard.getHState()); | |
93 | } else { | |
94 | sp.set(stateid, { value: ntab }); | |
95 | } | |
96 | } | |
a39018a7 DC |
97 | |
98 | // if we have a tabpanel which we declared lazy (with ptype: lazyitems) | |
99 | // then we have the actual item in items.items[0] | |
100 | // and there we need to fire the event hide | |
101 | // because some tabs use this event (which is not fired in this case) | |
102 | if (oldcard.plugins && oldcard.plugins[0] && oldcard.plugins[0].ptype == 'lazyitems') { | |
103 | oldcard.items.items[0].fireEvent('hide'); | |
104 | } | |
55ed1090 DM |
105 | } |
106 | } | |
107 | }); | |
108 | ||
109 | Ext.apply(me, { | |
110 | layout: { type: 'vbox', align: 'stretch' }, | |
111 | items: [ toolbar, tab] | |
112 | }); | |
113 | ||
114 | me.callParent(); | |
115 | ||
116 | var statechange = function(sp, key, state) { | |
117 | if (stateid && (key === stateid) && state) { | |
118 | var atab = tab.getActiveTab().itemId; | |
119 | var res = hsregex.exec(state.value); | |
120 | var ntab = (res && res[1]) ? res[1] : items[0].itemId; | |
121 | if (ntab && (atab != ntab)) { | |
122 | tab.setActiveTab(ntab); | |
123 | } | |
124 | } | |
125 | }; | |
126 | ||
127 | if (stateid) { | |
128 | me.mon(sp, 'statechange', statechange); | |
129 | } | |
130 | } | |
131 | }); |