root / snf-cyclades-app / synnefo / ui / new_ui / ui / javascripts / okeanos-ember / ember-all.js @ 97171a7e
History | View | Annotate | Download (9.1 kB)
1 |
/* Mapping */
|
---|---|
2 |
|
3 |
Synnefo.Router.map(function() {
|
4 |
// I defined the above resource to extend its Route
|
5 |
this.resource('sections', {'path':'/'}); |
6 |
for(var i=0; i<Synnefo.conf.sectors.length; i++) |
7 |
this.resource(Synnefo.conf.sectors[i].destination/*, function() { |
8 |
this.route('grid');
|
9 |
this.route('list');
|
10 |
}*/);
|
11 |
}); |
12 |
|
13 |
|
14 |
/* Routes */
|
15 |
|
16 |
Synnefo.ApplicationRoute = Ember.Route.extend({ |
17 |
model: function() { |
18 |
return {email: 'athina@mail.com'}; |
19 |
}, |
20 |
redirect: function() { |
21 |
// have to set vm navigation icon full
|
22 |
this.transitionTo('vms'); |
23 |
} |
24 |
}); |
25 |
|
26 |
Synnefo.SectionsRoute = Ember.Route.extend({ |
27 |
modelName: undefined, |
28 |
model: function() { |
29 |
return this.store.find(this.modelName); |
30 |
}, |
31 |
renderTemplate: function(controller) { |
32 |
this.render('snfElems', {controller: controller}); |
33 |
} |
34 |
}); |
35 |
|
36 |
|
37 |
Synnefo.VmsRoute = Synnefo.SectionsRoute.extend({ |
38 |
modelName: 'vm' |
39 |
}); |
40 |
|
41 |
Synnefo.NetworksRoute = Synnefo.SectionsRoute.extend({ |
42 |
modelName: 'network' |
43 |
}); |
44 |
|
45 |
Synnefo.VolumesRoute = Synnefo.SectionsRoute.extend({ |
46 |
modelName: 'volume' |
47 |
}); |
48 |
|
49 |
Synnefo.SnapshotsRoute = Synnefo.SectionsRoute.extend({ |
50 |
modelName: 'snapshot' |
51 |
}); |
52 |
|
53 |
Synnefo.ImagesRoute = Synnefo.SectionsRoute.extend({ |
54 |
modelName: 'userImage' |
55 |
}); |
56 |
|
57 |
|
58 |
|
59 |
|
60 |
|
61 |
/* Controllers */
|
62 |
|
63 |
Synnefo.ApplicationController = Ember.Controller.extend({ |
64 |
updateCurrentPath: function() { |
65 |
// we need the set because ElemsController gets the value of current path in every transition
|
66 |
Synnefo.set('currentPath', this.get('currentPath')) |
67 |
return this.get('currentPath'); |
68 |
}.observes('currentPath'),
|
69 |
actions: {
|
70 |
test: function() { |
71 |
console.log('This is test from Synnefo.ApplicationController');
|
72 |
return 0; |
73 |
} |
74 |
}, |
75 |
|
76 |
pageTitle : function() { |
77 |
var currentPath =this.get('currentPath'); |
78 |
if(currentPath!== 'index') return Synnefo.conf.sectors.findBy('destination', this.get('currentPath')).title; |
79 |
else return 'Home'; |
80 |
}.property('currentPath'),
|
81 |
|
82 |
// name: "okeanos application",
|
83 |
}); |
84 |
|
85 |
|
86 |
|
87 |
Synnefo.ElemsController = Ember.ArrayController.extend({ |
88 |
type: undefined, |
89 |
itemController: function(){ |
90 |
var type = this.type; |
91 |
return type.substring(0, type.length - 1); |
92 |
}.property(), |
93 |
icon: function() { |
94 |
// should this be placed in ElemsView?
|
95 |
return Synnefo.conf.sectors.findBy('destination', this.get('type')).icon.replace('outline', 'full'); |
96 |
}.property(), |
97 |
hasOS: function(){ |
98 |
if(Synnefo.get('currentPath') == "vms") |
99 |
return true; |
100 |
else return false; |
101 |
}.property(), |
102 |
hasTags: function(){ |
103 |
if(Synnefo.get('currentPath') == "vms") |
104 |
return true; |
105 |
else return false; |
106 |
}.property(), |
107 |
}); |
108 |
|
109 |
Synnefo.VmsController = Synnefo.ElemsController.extend({ |
110 |
type: 'vms' |
111 |
}); |
112 |
|
113 |
|
114 |
Synnefo.NetworksController = Synnefo.ElemsController.extend({ |
115 |
type: 'networks' |
116 |
}); |
117 |
|
118 |
Synnefo.VolumesController = Synnefo.ElemsController.extend({ |
119 |
type: 'volumes' |
120 |
}); |
121 |
|
122 |
|
123 |
Synnefo.SnapshotsController = Synnefo.ElemsController.extend({ |
124 |
type: 'snapshots' |
125 |
}); |
126 |
|
127 |
Synnefo.ImagesController = Synnefo.ElemsController.extend({ |
128 |
type: 'images' |
129 |
}); |
130 |
|
131 |
|
132 |
|
133 |
Synnefo.ElemController = Ember.ObjectController.extend({ |
134 |
needs: [],
|
135 |
actionsList: Synnefo.conf.userActions,
|
136 |
setAvailableActions: function() { |
137 |
var parent = this.needs; |
138 |
var self = this; |
139 |
return this.actionsList.filter(function(el) { |
140 |
return _.contains(el['snf-components'], self.get('controllers.'+parent).type) &&( _.contains(el['enabled-status'], self.get('model.status')) || _.contains(el['enabled-status'], 'all')); |
141 |
}) |
142 |
}.property(), |
143 |
createBtn: false, |
144 |
actions: {
|
145 |
shutdown: function(param) { |
146 |
console.log(this.get('model.status')); |
147 |
this.set('model.status', 'shutting'); |
148 |
}, |
149 |
destroyElement: function(param) { |
150 |
var element = this.get('model'); |
151 |
element.deleteRecord(); |
152 |
element.save(); |
153 |
} |
154 |
} |
155 |
}); |
156 |
|
157 |
Synnefo.VmController = Synnefo.ElemController.extend({ |
158 |
needs: ['vms'] |
159 |
}); |
160 |
|
161 |
Synnefo.NetworkController = Synnefo.ElemController.extend({ |
162 |
needs: ['networks'] |
163 |
}); |
164 |
|
165 |
Synnefo.VolumeController = Synnefo.ElemController.extend({ |
166 |
needs: ['volumes'] |
167 |
}); |
168 |
|
169 |
Synnefo.SnapshotController = Synnefo.ElemController.extend({ |
170 |
needs: ['snapshots'] |
171 |
}); |
172 |
|
173 |
Synnefo.ImageController = Synnefo.ElemController.extend({ |
174 |
needs: ['images'] |
175 |
}); |
176 |
|
177 |
|
178 |
/* Views */
|
179 |
|
180 |
Synnefo.NavIconView = Ember.View.extend({ |
181 |
tagName: 'span', |
182 |
click: function(e) { |
183 |
var parentEl = this.$().parent('a'); |
184 |
var currentEl = this.$().parents('li').siblings('li').find('a.current'); |
185 |
|
186 |
ui.replaceClass(currentEl, 'full', 'outline', 'snf-'); |
187 |
ui.replaceClass(parentEl, 'outline', 'full', 'snf-'); |
188 |
} |
189 |
|
190 |
}); |
191 |
|
192 |
Synnefo.NavigationView = Ember.CollectionView.extend({ |
193 |
tagName: "ul", |
194 |
classNames: ['icons-nav'], |
195 |
|
196 |
content: Synnefo.conf.sectors,
|
197 |
itemViewClass: Ember.View.extend({
|
198 |
templateName: "navigationItem" |
199 |
}), |
200 |
}); |
201 |
|
202 |
|
203 |
Synnefo.ElemView = Ember.View.extend({ |
204 |
// templateName: 'elem',
|
205 |
addNewBtn: false, |
206 |
templateName: 'snfElem', |
207 |
tagName: 'li', |
208 |
selectable: true, |
209 |
initSelect: 'unchecked', |
210 |
classNameBindings: ['status'], |
211 |
attributeBindings: ['data-status'], |
212 |
'data-status': function() { |
213 |
return this.status; |
214 |
}.property(), |
215 |
status: function() { |
216 |
return this.get('controller.status'); |
217 |
}.property('controller.status')
|
218 |
}); |
219 |
|
220 |
Synnefo.ImgWrapView = Ember.View.extend({ |
221 |
templateName: 'img-wrap', |
222 |
classNames: ['img-wrap'], |
223 |
icon: function() { |
224 |
var parentView = this.get('parentView'); |
225 |
var addNewBtn = parentView.get('addNewBtn'); |
226 |
if(addNewBtn)
|
227 |
return parentView.get('icon'); |
228 |
else
|
229 |
return parentView.get('controller').get('parentController').get('icon'); |
230 |
}.property() |
231 |
}); |
232 |
|
233 |
Synnefo.NameView = Ember.View.extend({ |
234 |
templateName: 'name', |
235 |
tagName: 'h4', |
236 |
name: function() { |
237 |
// the name may be defined inside the parent view or in its model or controller
|
238 |
return this.get('parentView').get('controller').get('name'); |
239 |
}.property() |
240 |
}); |
241 |
|
242 |
// to be changed
|
243 |
Synnefo.ImmediateActionView = Ember.View.extend({ |
244 |
templateName: 'actions', |
245 |
classNames: ['actions'] |
246 |
}) |
247 |
|
248 |
/* Components */
|
249 |
|
250 |
Synnefo.Btn1Component = Ember.Component.extend({ |
251 |
tagName: 'a', |
252 |
click: function() { |
253 |
this.sendAction("action", this.get('param')); |
254 |
} |
255 |
}); |
256 |
|
257 |
Synnefo.AddNewComponent = Ember.Component.extend({ |
258 |
templateName: 'snfElem', |
259 |
addNewBtn: true, |
260 |
selectable: false, |
261 |
icon: function() { |
262 |
baseIcon = Synnefo.conf.sectors.findBy('destination', this.get('type')).icon; |
263 |
return baseIcon.replace('outline', 'create-full'); |
264 |
}.property(), |
265 |
tagName: 'li', |
266 |
status: 'add-new', |
267 |
classNameBindings: ['status'], |
268 |
attributeBindings: ['data-status, data-reveal-id'], |
269 |
'data-reveal-id': function(){ |
270 |
if(addNewBtn)
|
271 |
return /*this.get('type').substring(0, type.length - 1)+*/'-wizard'; |
272 |
else
|
273 |
return undefined; |
274 |
}.property(), |
275 |
'data-status': function() { |
276 |
return this.status; |
277 |
}.property(), |
278 |
name: function() { |
279 |
var msg = 'Create New '; |
280 |
var btnType = this.get('type') |
281 |
switch(btnType){
|
282 |
case 'vms': |
283 |
return msg + 'Machine'; |
284 |
case 'networks': |
285 |
return msg + 'Network'; |
286 |
case 'volumes': |
287 |
return msg + 'Volume'; |
288 |
case 'snapshots': |
289 |
return msg + 'Snapshot'; |
290 |
case 'images': |
291 |
return '+ Upload New Image'; |
292 |
} |
293 |
}.property(), |
294 |
click: function () { |
295 |
var type = this.get('type'); |
296 |
var wizardEl = $('#'+ type.substring(0, type.length - 1)+'-wizard'); |
297 |
$('.overlay-area-custom').fadeIn(100); |
298 |
$('body').addClass('with-overlay'); |
299 |
wizardEl.fadeIn('slow');
|
300 |
} |
301 |
}); |
302 |
|
303 |
Synnefo.LoginMenuComponent = Ember.Component.extend({ |
304 |
classNames: ['login'], |
305 |
didInsertElement: function() { |
306 |
console.log('didInsertElement');
|
307 |
var self = this.$(); |
308 |
self.mouseenter(function(e){
|
309 |
self.find('ul').stop(true, true).slideDown(200); |
310 |
}); |
311 |
self.mouseleave(function(e){
|
312 |
self.find('ul').stop(true, true).slideUp(200); |
313 |
}); |
314 |
|
315 |
} |
316 |
}); |
317 |
|
318 |
Synnefo.SnfCheckboxComponent = Ember.Component.extend({ |
319 |
tagName: 'a', |
320 |
classNames: ['check'], |
321 |
templateName: 'components/select-btn', |
322 |
initState: function() { |
323 |
return this.get('initState'); |
324 |
}.property(), |
325 |
didInsertElement: function() { |
326 |
var el = this.$(); |
327 |
var self =this; |
328 |
this.setInitClasses();
|
329 |
el.click(function(e) {
|
330 |
e.preventDefault(); |
331 |
e.stopPropagation(); |
332 |
self.changeState(el); |
333 |
// ui.entitiesActionsEnabled();
|
334 |
}); |
335 |
}, |
336 |
setInitClasses: function() { |
337 |
var self =this.$(); |
338 |
switch(this.initState){ |
339 |
case 'unchecked': { |
340 |
this.uncheck(self);
|
341 |
break;
|
342 |
} |
343 |
case 'prechecked': { |
344 |
self.find('span').addClass('prechecked') |
345 |
this.check(self);
|
346 |
break;
|
347 |
} |
348 |
} |
349 |
}, |
350 |
// used to be in ui.checkbox
|
351 |
changeState : function(checkbox_link) { |
352 |
$(checkbox_link).find('.snf-checkbox-unchecked, .snf-checkbox-checked').toggleClass('snf-checkbox-unchecked snf-checkbox-checked'); |
353 |
$(checkbox_link).closest('li').toggleClass('selected'); |
354 |
}, |
355 |
check : function(checkbox_link) { |
356 |
$(checkbox_link).find('span').removeClass('snf-checkbox-unchecked').addClass('snf-checkbox-checked'); |
357 |
$(checkbox_link).closest('li').addClass('selected'); |
358 |
}, |
359 |
uncheck : function(checkbox_link) { |
360 |
$(checkbox_link).find('span').removeClass('snf-checkbox-checked').addClass('snf-checkbox-unchecked'); |
361 |
$(checkbox_link).closest('li').removeClass('selected'); |
362 |
}, |
363 |
|
364 |
reset: function(area) { |
365 |
$(area).find('.snf-radio-checked').not('.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked'); |
366 |
$(area).find('.snf-radio-unchecked.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked'); |
367 |
}, |
368 |
}); |