Skip to content

Commit c110ac7

Browse files
pacesmpacesm
committed
Refactoring App initialization.
1 parent d4b3616 commit c110ac7

File tree

5 files changed

+244
-216
lines changed

5 files changed

+244
-216
lines changed

‎app/scripts/app.js‎

Lines changed: 54 additions & 207 deletions
Original file line numberDiff line numberDiff line change
@@ -67,10 +67,6 @@
6767
show:{ effect: false, delay: 700}
6868
});
6969

70-
var v = {}; //views
71-
var m = {}; //models
72-
var t = {}; //templates
73-
7470
var colors = d3.scale.category10();
7571
var color_index = 0;
7672

@@ -86,202 +82,69 @@
8682
}, this);
8783

8884
//Load all configured views
89-
_.each(config.views, function(viewDef) {
90-
var View = require(viewDef);
91-
$.extend(v, View);
92-
}, this);
85+
var views = {};
86+
_.each(config.views, function(item){ $.extend(views,require(item)); }, this);
9387

9488
//Load all configured models
95-
_.each(config.models, function(modelDef) {
96-
var Model = require(modelDef);
97-
$.extend(m, Model);
98-
}, this);
89+
var models = {}
90+
_.each(config.models, function(item){ $.extend(models,require(item)); }, this);
9991

10092
//Load all configured templates
101-
_.each(config.templates, function(tmplDef) {
102-
var Tmpl = require(tmplDef.template);
103-
t[tmplDef.id] = Tmpl;
104-
}, this);
93+
var templates = {}; //templates
94+
_.each(config.templates, function(item){ templates[item.id] = require(item.template); }, this);
10595

10696

10797
//Map attributes are loaded and added to the global map model
108-
globals.objects.add('mapmodel', new m.MapModel({
109-
visualizationLibs : config.mapConfig.visualizationLibs,
110-
center: config.mapConfig.center,
111-
zoom: config.mapConfig.zoom
112-
})
113-
);
98+
globals.objects.add('mapmodel', models.parseMapConfig(config.mapConfig));
11499

115100
//Base Layers are loaded and added to the global collection
116-
_.each(config.mapConfig.baseLayers, function(baselayer) {
117-
118-
globals.baseLayers.add(
119-
new m.LayerModel({
120-
name: baselayer.name,
121-
visible: baselayer.visible,
122-
view: {
123-
id : baselayer.id,
124-
urls : baselayer.urls,
125-
protocol: baselayer.protocol,
126-
projection: baselayer.projection,
127-
attribution: baselayer.attribution,
128-
matrixSet: baselayer.matrixSet,
129-
style: baselayer.style,
130-
format: baselayer.format,
131-
resolutions: baselayer.resolutions,
132-
maxExtent: baselayer.maxExtent,
133-
gutter: baselayer.gutter,
134-
buffer: baselayer.buffer,
135-
units: baselayer.units,
136-
transitionEffect: baselayer.transitionEffect,
137-
isphericalMercator: baselayer.isphericalMercator,
138-
isBaseLayer: true,
139-
wrapDateLine: baselayer.wrapDateLine,
140-
zoomOffset: baselayer.zoomOffset,
141-
time: baselayer.time,
142-
requestEncoding: baselayer.requestEncoding
143-
}
144-
})
145-
);
146-
console.log("Added baselayer " + baselayer.id );
101+
_.each(config.mapConfig.baseLayers, function(item) {
102+
globals.baseLayers.add( models.parseBaseLayer(item) );
103+
console.log("Added base-layer " + item.id );
147104
}, this);
148105

149-
//Productsare loaded and added to the global collection
150-
_.each(config.mapConfig.products, function(products) {
151-
152-
if (! products.info ) {
153-
products.info = {} ;
154-
}
155-
156-
var is_wms = ( products.view.protocol == 'WMS' )
157-
158-
// parse extra wms layers
159-
var extraLayers = {};
160-
if ( products.view.extraLayers && typeof products.view.extraLayers == 'object' ) {
161-
extraLayers = _.extend({},products.view.extraLayers);
162-
}
163-
164-
globals.products.add(
165-
new m.LayerModel({
166-
name: products.name,
167-
description: (products.description ? products.description: null),
168-
visible: products.visible,
169-
timeSlider: products.timeSlider,
170-
// Default to WMS if no protocol is defined (allowed protocols: WMS|EOWCS|WPS)
171-
timeSliderProtocol: (products.timeSliderProtocol) ? products.timeSliderProtocol : 'WMS',
172-
color: (products.color) ? products.color : colors(color_index++),
173-
time: products.time,
174-
opacity: 1,
175-
view:{
176-
id : products.view.id,
177-
protocol: products.view.protocol,
178-
urls : products.view.urls,
179-
visualization: products.view.visualization,
180-
projection: products.view.projection,
181-
attribution: products.view.attribution,
182-
matrixSet: products.view.matrixSet,
183-
style: products.view.style,
184-
format: products.view.format,
185-
resolutions: products.view.resolutions,
186-
maxExtent: products.view.maxExtent,
187-
gutter: products.view.gutter,
188-
buffer: products.view.buffer,
189-
units: products.view.units,
190-
transitionEffect: products.view.transitionEffect,
191-
isphericalMercator: products.view.isphericalMercator,
192-
isBaseLayer: false,
193-
wrapDateLine: products.view.wrapDateLine,
194-
zoomOffset: products.view.zoomOffset,
195-
requestEncoding: products.view.requestEncoding,
196-
extraLayers: extraLayers
197-
},
198-
download: {
199-
id : products.download.id,
200-
protocol: products.download.protocol,
201-
url : products.download.url,
202-
rectified: ( products.rectified != null ? products.rectified : true )
203-
},
204-
info: {
205-
// NOTE: If the wiew protocol is WMS info default to getFeatureInfo()
206-
// on the same layer.
207-
id: products.info.id ? products.info.id : ( is_wms ? products.view.id : null ),
208-
protocol: products.info.protocol ? products.info.protocol : ( is_wms ? 'WMS' : null ),
209-
url: products.info.url ? products.info.url : ( is_wms ? products.view.urls[0] : null )
210-
}
211-
})
212-
);
213-
console.log("Added product " + products.view.id );
106+
//Overlays are loaded and added to the global collection
107+
_.each(config.mapConfig.overlays, function(item) {
108+
globals.overlays.add( models.parseOverlayLayer(item) );
109+
console.log("Added overlay-layer " + item.id );
214110
}, this);
215111

216-
//Overlays are loaded and added to the global collection
217-
_.each(config.mapConfig.overlays, function(overlay) {
218-
219-
globals.overlays.add(
220-
new m.LayerModel({
221-
name: overlay.name,
222-
visible: overlay.visible,
223-
view: {
224-
id : overlay.id,
225-
urls : overlay.urls,
226-
protocol: overlay.protocol,
227-
projection: overlay.projection,
228-
attribution: overlay.attribution,
229-
matrixSet: overlay.matrixSet,
230-
style: overlay.style,
231-
format: overlay.format,
232-
resolutions: overlay.resolutions,
233-
maxExtent: overlay.maxExtent,
234-
gutter: overlay.gutter,
235-
buffer: overlay.buffer,
236-
units: overlay.units,
237-
transitionEffect: overlay.transitionEffect,
238-
isphericalMercator: overlay.isphericalMercator,
239-
isBaseLayer: false,
240-
wrapDateLine: overlay.wrapDateLine,
241-
zoomOffset: overlay.zoomOffset,
242-
time: overlay.time,
243-
requestEncoding: overlay.requestEncoding
244-
}
245-
})
246-
);
247-
console.log("Added overlay " + overlay.id );
112+
//Productsare loaded and added to the global collection
113+
_.each(config.mapConfig.products, function(item) {
114+
globals.products.add( models.parseProductLayer(item) );
115+
console.log("Added data-layer " + item.view.id );
248116
}, this);
249117

250118

251119
// Create map view and execute show of its region
252-
this.map.show(new v.MapView({el: $("#map")}));
120+
this.map.show(new views.MapView({el: $("#map")}));
253121

254122
// If Navigation Bar is set in configuration go through the
255123
// defined elements creating a item collection to rendered
256124
// by the marionette collection view
257125
if (config.navBarConfig) {
258126

259-
var navBarItemCollection = new m.NavBarCollection;
127+
var navBarItemCollection = new models.NavBarCollection();
260128

261-
_.each(config.navBarConfig.items, function(list_item){
262-
navBarItemCollection.add(
263-
new m.NavBarItemModel({
264-
name:list_item.name,
265-
icon:list_item.icon,
266-
eventToRaise:list_item.eventToRaise
267-
}));
129+
_.each(config.navBarConfig.items, function(item){
130+
navBarItemCollection.add(models.parseNavBarItemConfig(item));
268131
}, this);
269132

270-
this.topBar.show(new v.NavBarCollectionView(
271-
{template: t.NavBar({
133+
this.topBar.show(new views.NavBarCollectionView(
134+
{template: templates.NavBar({
272135
title: config.navBarConfig.title,
273136
url: config.navBarConfig.url}),
274137
className:"navbar navbar-inverse navbar-opaque navbar-fixed-top not-selectable",
275-
itemView: v.NavBarItemView, tag: "div",
138+
itemView: views.NavBarItemView, tag: "div",
276139
collection: navBarItemCollection}));
277140

278141
};
279142

280143
// Added region to test combination of backbone
281144
// functionality combined with jQuery UI
282145
this.addRegions({dialogRegion: DialogRegion.extend({el: "#viewContent"})});
283-
this.DialogContentView = new v.ContentView({
284-
template: {type: 'handlebars', template: t.Info},
146+
this.DialogContentView = new views.ContentView({
147+
template: {type: 'handlebars', template: templates.Info},
285148
id: "about",
286149
className: "modal fade",
287150
attributes: {
@@ -295,33 +158,36 @@
295158
});
296159

297160
// Create the views - these are Marionette.CollectionViews that render ItemViews
298-
this.baseLayerView = new v.BaseLayerSelectionView({
161+
this.baseLayerView = new views.BaseLayerSelectionView({
299162
collection:globals.baseLayers,
300-
itemView: v.LayerItemView.extend({
163+
itemView: views.LayerItemView.extend({
301164
template: {
302165
type:'handlebars',
303-
template: t.BulletLayer},
166+
template: templates.BulletLayer
167+
},
304168
className: "radio"
305169
})
306170
});
307171

308-
this.productsView = new v.LayerSelectionView({
172+
this.productsView = new views.LayerSelectionView({
309173
collection:globals.products,
310-
itemView: v.LayerItemView.extend({
174+
itemView: views.LayerItemView.extend({
311175
template: {
312176
type:'handlebars',
313-
template: t.CheckBoxLayer},
177+
template: templates.CheckBoxLayer
178+
},
314179
className: "sortable-layer"
315180
}),
316181
className: "sortable"
317182
});
318183

319-
this.overlaysView = new v.BaseLayerSelectionView({
184+
this.overlaysView = new views.BaseLayerSelectionView({
320185
collection:globals.overlays,
321-
itemView: v.LayerItemView.extend({
186+
itemView: views.LayerItemView.extend({
322187
template: {
323188
type:'handlebars',
324-
template: t.CheckBoxOverlayLayer},
189+
template: templates.CheckBoxOverlayLayer
190+
},
325191
className: "checkbox"
326192
}),
327193
className: "check"
@@ -332,62 +198,45 @@
332198

333199

334200
// Define collection of selection tools
335-
var selectionToolsCollection = new m.ToolCollection();
336-
_.each(config.selectionTools, function(selTool) {
337-
selectionToolsCollection.add(
338-
new m.ToolModel({
339-
id: selTool.id,
340-
description: selTool.description,
341-
icon:selTool.icon,
342-
enabled: true,
343-
active: false,
344-
type: "selection"
345-
}));
201+
var selectionToolsCollection = new models.ToolCollection();
202+
_.each(config.selectionTools, function(item) {
203+
selectionToolsCollection.add( models.parseSelectionTool(item) );
346204
}, this);
347205

348206
// Define collection of visualization tools
349-
var visualizationToolsCollection = new m.ToolCollection();
350-
_.each(config.visualizationTools, function(visTool) {
351-
visualizationToolsCollection.add(
352-
new m.ToolModel({
353-
id: visTool.id,
354-
eventToRaise: visTool.eventToRaise,
355-
description: visTool.description,
356-
disabledDescription: visTool.disabledDescription,
357-
icon:visTool.icon,
358-
enabled: visTool.enabled,
359-
active: visTool.active,
360-
type: "tool"
361-
}));
207+
var visualizationToolsCollection = new models.ToolCollection();
208+
_.each(config.visualizationTools, function(item) {
209+
visualizationToolsCollection.add( models.parseVisualizationTool(item) );
362210
}, this);
363211

364212
// Create Collection Views to hold set of views for selection tools
365-
this.visualizationToolsView = new v.ToolSelectionView({
213+
this.visualizationToolsView = new views.ToolSelectionView({
366214
collection:visualizationToolsCollection,
367-
itemView: v.ToolItemView.extend({
215+
itemView: views.ToolItemView.extend({
368216
template: {
369217
type:'handlebars',
370-
template: t.ToolIcon}
218+
template: templates.ToolIcon
219+
}
371220
})
372221
});
373222

374223
// Create Collection Views to hold set of views for visualization tools
375-
this.selectionToolsView = new v.ToolSelectionView({
224+
this.selectionToolsView = new views.ToolSelectionView({
376225
collection:selectionToolsCollection,
377-
itemView: v.ToolItemView.extend({
226+
itemView: views.ToolItemView.extend({
378227
template: {
379228
type:'handlebars',
380-
template: t.ToolIcon}
229+
template: templates.ToolIcon
230+
}
381231
})
382232
});
383233

384234

385-
386235
// Create layout to hold collection views
387236
this.toolLayout = new ToolControlLayout();
388237

389238

390-
this.timeSliderView = new v.TimeSliderView(config.timeSlider);
239+
this.timeSliderView = new views.TimeSliderView(config.timeSlider);
391240
this.bottomBar.show(this.timeSliderView);
392241

393242
// Add a trigger for ajax calls in order to display loading state
@@ -430,8 +279,6 @@
430279

431280
}
432281

433-
434-
435282
});
436283

437284
return new Application();

0 commit comments

Comments
 (0)