git_sitools_idoc / szcluster-db / workspace / client-user / js / components / entete / navBar.js @ master
1 | c79bb7e3 | Alessandro_N | /***************************************
|
---|---|---|---|
2 | * Copyright 2010-2014 CNES - CENTRE NATIONAL d'ETUDES SPATIALES
|
||
3 | *
|
||
4 | * This file is part of SITools2.
|
||
5 | *
|
||
6 | * SITools2 is free software: you can redistribute it and/or modify
|
||
7 | * it under the terms of the GNU General Public License as published by
|
||
8 | * the Free Software Foundation, either version 3 of the License, or
|
||
9 | * (at your option) any later version.
|
||
10 | *
|
||
11 | * SITools2 is distributed in the hope that it will be useful,
|
||
12 | * but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||
13 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||
14 | * GNU General Public License for more details.
|
||
15 | *
|
||
16 | * You should have received a copy of the GNU General Public License
|
||
17 | * along with SITools2. If not, see <http://www.gnu.org/licenses/>.
|
||
18 | ***************************************/
|
||
19 | /*global Ext, sitools, window, showVersion, publicStorage, userLogin, projectGlobal, SitoolsDesk, showResponse, i18n, extColModelToJsonColModel, loadUrl*/
|
||
20 | |||
21 | Ext.namespace('sitools.user.component.entete');
|
||
22 | /**
|
||
23 | * @cfg {Array} modules la liste des modules
|
||
24 | * @class sitools.user.component.entete.NavBar
|
||
25 | * @extends Ext.Toolbar
|
||
26 | */
|
||
27 | sitools.user.component.entete.NavBar = Ext.extend(Ext.Toolbar, { |
||
28 | |||
29 | initComponent : function () { |
||
30 | var items = [];
|
||
31 | var categories = this.categorizeModules(); |
||
32 | |||
33 | var homeButton = new Ext.Button({ |
||
34 | handler : function () { |
||
35 | projectGlobal.getPreferences(function () {
|
||
36 | SitoolsDesk.removeActivePanel(); |
||
37 | SitoolsDesk.removeAllWindows(); |
||
38 | SitoolsDesk.loadPreferences(); |
||
39 | }); |
||
40 | }, |
||
41 | scale : "medium", |
||
42 | icon : "/sitools/common/res/images/icons/button-home.png", |
||
43 | iconCls : 'navBarButtons-icon', |
||
44 | tooltip : {
|
||
45 | html : i18n.get("label.homeButton"), |
||
46 | anchor : 'bottom', |
||
47 | trackMouse : false |
||
48 | }, |
||
49 | template : new Ext.Template('<table cellspacing="0" class="x-btn {3}" style="padding-left:5px;"><tbody><tr>', |
||
50 | '<td><i> </i></td>',
|
||
51 | '<td><em class="{5} unselectable="on">',
|
||
52 | '<button type="{1}" style="height:28px; width:28px;">{0}</button>', '</em></td>', |
||
53 | '<td><i> </i></td>', "</tr></tbody></table>") |
||
54 | }); |
||
55 | items.push(homeButton); |
||
56 | items.push('|');
|
||
57 | |||
58 | Ext.each(categories, function (category) {
|
||
59 | var modules = category.modules;
|
||
60 | |||
61 | //Le module n'appartient pas à une catégorie: inclusion en tant que bouton dans le menu.
|
||
62 | if (Ext.isEmpty(category.category)) {
|
||
63 | var module = modules[0]; |
||
64 | var xtype = module.xtype;
|
||
65 | try {
|
||
66 | if (Ext.isEmpty(module.divIdToDisplay)) {
|
||
67 | var handler = null; |
||
68 | var item = {
|
||
69 | text : i18n.get(module.label),
|
||
70 | iconCls : module.icon,
|
||
71 | scope : module,
|
||
72 | tooltip : {
|
||
73 | html : i18n.get(module.description),
|
||
74 | anchor : 'bottom', |
||
75 | trackMouse : false |
||
76 | }, |
||
77 | cls : "x-navBar-items", |
||
78 | clickEvent : 'mousedown', |
||
79 | template : new Ext.Template('<table cellspacing="0" class="x-btn {3}"><tbody><tr>', |
||
80 | '<td class="ux-taskbutton-left"><i> </i></td>',
|
||
81 | '<td class="ux-taskbutton-center"><em class="{5} unselectable="on">',
|
||
82 | '<button class="x-btn-text {2}" type="{1}" style="height:28px;">{0}</button>', '</em></td>', |
||
83 | '<td class="ux-taskbutton-right"><i> </i></td>', "</tr></tbody></table>") |
||
84 | |||
85 | }; |
||
86 | var xtype = module.xtype;
|
||
87 | var func = xtype + ".openModule"; |
||
88 | if (!Ext.isEmpty(xtype) && Ext.isFunction(eval(func))) {
|
||
89 | handler = eval(func); |
||
90 | } |
||
91 | else {
|
||
92 | handler = module.openModule; |
||
93 | } |
||
94 | Ext.apply(item, { |
||
95 | handler : handler
|
||
96 | }); |
||
97 | if(module.name!="projectDescription"){ |
||
98 | items.push(item); |
||
99 | items.push('|');}
|
||
100 | } |
||
101 | } |
||
102 | catch(err) {
|
||
103 | //Nothing to do
|
||
104 | var tmp = null; |
||
105 | } |
||
106 | } |
||
107 | //Le module est dans une catégorie : On crée un menu contenant tous les modules de la catégorie
|
||
108 | else {
|
||
109 | var menuItems = [];
|
||
110 | Ext.each(category.modules, function (moduleInCategory) {
|
||
111 | try {
|
||
112 | if (Ext.isEmpty(moduleInCategory)) {
|
||
113 | return;
|
||
114 | } |
||
115 | |||
116 | if (Ext.isEmpty(moduleInCategory.divIdToDisplay)) {
|
||
117 | var item = {
|
||
118 | text : i18n.get(moduleInCategory.label),
|
||
119 | |||
120 | iconCls : moduleInCategory.icon,
|
||
121 | scope : this |
||
122 | }; |
||
123 | |||
124 | //Test spécifique pour savoir si on doit inclure un sous menu :
|
||
125 | var xtype = moduleInCategory.xtype;
|
||
126 | if (Ext.isEmpty(xtype)) {
|
||
127 | return;
|
||
128 | } |
||
129 | var Func = eval(xtype + ".getStaticParameters"); |
||
130 | if (Ext.isFunction(Func)) {
|
||
131 | var staticParameters = Func();
|
||
132 | if (staticParameters && staticParameters.showAsMenu) {
|
||
133 | Ext.apply(item, { |
||
134 | menu : {
|
||
135 | xtype : moduleInCategory.xtype,
|
||
136 | cls : "sitools-navbar-menu" |
||
137 | } |
||
138 | }); |
||
139 | } |
||
140 | else {
|
||
141 | Ext.apply(item, { |
||
142 | handler : moduleInCategory.openModule
|
||
143 | }); |
||
144 | } |
||
145 | } |
||
146 | |||
147 | |||
148 | func = xtype + ".openModule";
|
||
149 | if (Ext.isFunction(eval(func))) {
|
||
150 | handler = eval(func); |
||
151 | } |
||
152 | else {
|
||
153 | handler = moduleInCategory.openModule |
||
154 | } |
||
155 | Ext.apply(item, { |
||
156 | handler : handler
|
||
157 | }); |
||
158 | |||
159 | menuItems.push(item); |
||
160 | |||
161 | |||
162 | } |
||
163 | } |
||
164 | catch (err) {
|
||
165 | //nothing to do
|
||
166 | var tmp = null; |
||
167 | } |
||
168 | |||
169 | }); |
||
170 | if (!Ext.isEmpty(menuItems)) {
|
||
171 | var menu = new Ext.menu.Menu({ |
||
172 | items : menuItems,
|
||
173 | cls : "sitools-navbar-menu" |
||
174 | }); |
||
175 | items.push({ |
||
176 | text : category.category,
|
||
177 | menu : menu,
|
||
178 | icon : "/sitools/common/res/images/icons/white_arrow.gif", |
||
179 | iconAlign : "left", |
||
180 | clickEvent : 'mousedown', |
||
181 | cls : "x-navBar-items", |
||
182 | template : new Ext.Template('<table cellspacing="0" class="x-btn {3}"><tbody><tr>', |
||
183 | '<td class="ux-taskbutton-center"><em class="{2} unselectable="on">',
|
||
184 | '<button class="x-btn-text {2}" type="{1}" style="height:28px;">{0}</button>', '</em></td>', |
||
185 | "</tr></tbody></table>")
|
||
186 | |||
187 | }); |
||
188 | items.push('|');
|
||
189 | } |
||
190 | } |
||
191 | |||
192 | }); |
||
193 | |||
194 | sitools.user.component.entete.NavBar.superclass.initComponent.call(Ext.apply(this, {
|
||
195 | id : "navBarId", |
||
196 | enableOverflow: true, |
||
197 | defaults : {
|
||
198 | overCls : "x-navBar-items-over", |
||
199 | ctCls : "x-navBar-items-ct" |
||
200 | }, |
||
201 | items : items,
|
||
202 | cls : "x-navBar", |
||
203 | overCls : "x-navBar-over", |
||
204 | ctCls : "x-navBar-ct", |
||
205 | flex : 1, |
||
206 | listeners : {
|
||
207 | scope : this, |
||
208 | afterRender : function (me) { |
||
209 | this.observer.fireEvent("navBarRendered", me); |
||
210 | } |
||
211 | }, |
||
212 | border : false |
||
213 | })); |
||
214 | }, |
||
215 | /**
|
||
216 | * From the modules attribute, return an array of categories.
|
||
217 | * Each items of the array could be either
|
||
218 | * - {
|
||
219 | * modules : [module]
|
||
220 | * }
|
||
221 | * - {
|
||
222 | * category : categoryName,
|
||
223 | * modules : [modules]
|
||
224 | * }
|
||
225 | * @returns {Array}
|
||
226 | */
|
||
227 | categorizeModules : function () { |
||
228 | function getCategoryIndex(category, categoryList) { |
||
229 | var idx = -1; |
||
230 | for (var i = 0; i < categoryList.length; i++) { |
||
231 | if (categoryList[i].category === category) {
|
||
232 | return i;
|
||
233 | } |
||
234 | } |
||
235 | return idx;
|
||
236 | } |
||
237 | var categoryModules = [];
|
||
238 | Ext.each(this.modules, function (module) { |
||
239 | if (Ext.isEmpty(module.categoryModule)) {
|
||
240 | categoryModules.push({ |
||
241 | modules : [module]
|
||
242 | }); |
||
243 | } |
||
244 | else {
|
||
245 | var idx = getCategoryIndex(module.categoryModule, categoryModules);
|
||
246 | if (idx >= 0) { |
||
247 | categoryModules[idx].modules.push(module); |
||
248 | } |
||
249 | else {
|
||
250 | categoryModules.push({ |
||
251 | category : module.categoryModule,
|
||
252 | modules : [module]
|
||
253 | }); |
||
254 | } |
||
255 | } |
||
256 | |||
257 | }); |
||
258 | return categoryModules;
|
||
259 | } |
||
260 | }); |
||
261 | |||
262 | Ext.reg('sitools.user.component.entete.NavBar', sitools.user.component.entete.NavBar); |