Statistics
| Branch: | Tag: | Revision:

root / snf-cyclades-app / synnefo / ui / new_ui / ui / javascripts / okeanos-ember / ember-all.js @ 49342f82

History | View | Annotate | Download (9.3 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
                this.route('create');
11
        });
12
});
13

    
14

    
15
/* Routes */
16

    
17
Synnefo.ApplicationRoute = Ember.Route.extend({
18
        model: function() {
19
                return {email: 'athina@mail.com'};
20
        },
21
        redirect: function() {
22
                //  have to set vm navigation icon full
23
                this.transitionTo('vms');
24
        },
25
});
26

    
27
Synnefo.SectionsRoute = Ember.Route.extend({
28
        modelName: undefined,
29
        model: function() {
30
                return this.store.find(this.modelName);
31
        },
32
        renderTemplate: function(controller) {
33
                this.render('snfElems', {controller: controller});
34
        },
35
        actions: {
36
                openWizard: function() {
37
                        var wizardType = this.routeName;
38
                        this.transitionTo(wizardType+'.create')
39
                }
40
        }
41
});
42

    
43
Synnefo.CreateRoute = Ember.Route.extend({
44
        model: function(){
45
                return {name: 'vm-wizard'}
46
        },
47
        renderTemplate: function(controller) {
48
                this.render('wizard',{controller: controller});
49
        }
50
});
51

    
52
Synnefo.VmsRoute = Synnefo.SectionsRoute.extend({
53
        modelName: 'vm'
54
});
55

    
56
Synnefo.NetworksRoute = Synnefo.SectionsRoute.extend({
57
        modelName: 'network'
58
});
59

    
60
Synnefo.VolumesRoute = Synnefo.SectionsRoute.extend({
61
        modelName: 'volume'
62
});
63

    
64
Synnefo.SnapshotsRoute = Synnefo.SectionsRoute.extend({
65
        modelName: 'snapshot'
66
});
67

    
68
Synnefo.ImagesRoute = Synnefo.SectionsRoute.extend({
69
        modelName: 'userImage'
70
});
71

    
72
Synnefo.VmsCreateRoute = Synnefo.CreateRoute.extend({});
73

    
74
Synnefo.NetworksCreateRoute = Synnefo.CreateRoute.extend({});
75

    
76
Synnefo.VolumesCreateRoute = Synnefo.CreateRoute.extend({});
77

    
78
Synnefo.SnapshotsCreateRoute = Synnefo.CreateRoute.extend({});
79

    
80
Synnefo.ImagesCreateRoute = Synnefo.CreateRoute.extend({});
81

    
82

    
83

    
84

    
85
/* Controllers */
86

    
87
Synnefo.ApplicationController = Ember.Controller.extend({
88
        updateCurrentPath: function() {
89
                // we need the set because ElemsController gets the value of current path in every transition
90
                Synnefo.set('currentPath', this.get('currentPath'))
91
                return this.get('currentPath');
92
        }.observes('currentPath'),
93

    
94
        pageTitle : function() {
95
                var currentPath =this.get('currentPath');
96
                if(currentPath!== 'index') return Synnefo.conf.sectors.findBy('destination', this.get('currentPath')).title;
97
                        else return 'Home';
98
        }.property('currentPath'),
99

    
100
        // name: "okeanos application",
101
});
102

    
103

    
104

    
105
Synnefo.ElemsController = Ember.ArrayController.extend({
106
        type: undefined,
107
        itemController: function(){
108
                var type = this.type;
109
                return type.substring(0, type.length - 1);
110
        }.property(),
111
        icon: function() {
112
                // should this be placed in ElemsView?
113
                return        Synnefo.conf.sectors.findBy('destination', this.get('type')).icon.replace('outline', 'full');
114
        }.property(),
115
        hasOS: function(){
116
                        if(Synnefo.get('currentPath') == "vms")
117
                                return true;
118
                        else return false;
119
        }.property(),
120
                hasTags: function(){
121
                        if(Synnefo.get('currentPath') == "vms")
122
                                return true;
123
                        else return false;
124
        }.property(),
125
});
126

    
127
Synnefo.VmsController = Synnefo.ElemsController.extend({
128
        type: 'vms'
129
});
130

    
131

    
132
Synnefo.NetworksController = Synnefo.ElemsController.extend({
133
        type: 'networks'
134
});
135

    
136
Synnefo.VolumesController = Synnefo.ElemsController.extend({
137
        type: 'volumes'
138
});
139

    
140

    
141
Synnefo.SnapshotsController = Synnefo.ElemsController.extend({
142
        type: 'snapshots'
143
});
144

    
145
Synnefo.ImagesController = Synnefo.ElemsController.extend({
146
        type: 'images'
147
});
148

    
149

    
150

    
151
Synnefo.ElemController = Ember.ObjectController.extend({
152
        needs: [],
153
        actionsList: Synnefo.conf.userActions,
154
        setAvailableActions: function() {
155
                var parent = this.needs;
156
                var self = this;
157
                return this.actionsList.filter(function(el) {
158
                        return _.contains(el['snf-components'], self.get('controllers.'+parent).type) &&( _.contains(el['enabled-status'], self.get('model.status')) || _.contains(el['enabled-status'], 'all'));
159
                })
160
        }.property(),
161
        createBtn: false,        
162
        actions: {
163
                shutdown: function(param) {
164
                        this.set('model.status', 'shutting');
165
                },
166
                destroyElement: function(param) {
167
                        var element = this.get('model');
168
                        element.deleteRecord();
169
                        element.save();
170
                }
171
        }
172
});
173

    
174
Synnefo.VmController = Synnefo.ElemController.extend({
175
        needs: ['vms']
176
});
177

    
178
Synnefo.NetworkController = Synnefo.ElemController.extend({
179
        needs: ['networks']
180
});
181

    
182
Synnefo.VolumeController = Synnefo.ElemController.extend({
183
        needs: ['volumes']
184
});
185

    
186
Synnefo.SnapshotController = Synnefo.ElemController.extend({
187
        needs: ['snapshots']
188
});
189

    
190
Synnefo.ImageController = Synnefo.ElemController.extend({
191
        needs: ['images']
192
});
193

    
194

    
195
/* Views */
196

    
197
Synnefo.NavIconView = Ember.View.extend({
198
        tagName: 'span',
199
        click: function(e) {
200
                var parentEl = this.$().parent('a');
201
                var currentEl = this.$().parents('li').siblings('li').find('a.current');
202

    
203
                ui.replaceClass(currentEl, 'full', 'outline', 'snf-');
204
                ui.replaceClass(parentEl, 'outline', 'full', 'snf-');
205
        }
206

    
207
});
208

    
209
Synnefo.NavigationView = Ember.CollectionView.extend({
210
  tagName: "ul",
211
  classNames: ['icons-nav'],
212

    
213
  content: Synnefo.conf.sectors,
214
  itemViewClass: Ember.View.extend({
215
    templateName: "navigationItem"
216
  }),
217
});
218

    
219

    
220
Synnefo.ElemView = Ember.View.extend({
221
        // templateName: 'elem',
222
        addNewBtn: false,
223
        templateName: 'snfElem',
224
        tagName: 'li',
225
        selectable: true,
226
        initSelect: 'unchecked',
227
        classNameBindings: ['status'],
228
        attributeBindings: ['data-status'],
229
        'data-status': function() {
230
                return this.status;
231
        }.property(),
232
        status: function() {
233
                return this.get('controller.status');
234
        }.property('controller.status')
235
});
236

    
237
Synnefo.ImgWrapView = Ember.View.extend({
238
        templateName: 'img-wrap',
239
        classNames: ['img-wrap'],
240
        icon: function() {
241
                var parentView = this.get('parentView');
242
                var addNewBtn = parentView.get('addNewBtn');
243
                if(addNewBtn)
244
                        return parentView.get('icon');
245
                else
246
                        return parentView.get('controller').get('parentController').get('icon');
247
        }.property()
248
});
249

    
250
Synnefo.NameView = Ember.View.extend({
251
        templateName: 'name',
252
        tagName: 'h4',
253
        name: function() {
254
                // the name may be defined inside the parent view or in its model or controller
255
                return this.get('parentView').get('controller').get('name');
256
        }.property()
257
});
258

    
259
// to be changed
260
Synnefo.ImmediateActionView = Ember.View.extend({
261
        templateName: 'actions',
262
        classNames: ['actions']
263
})
264

    
265
/* Components */
266

    
267
Synnefo.Btn1Component = Ember.Component.extend({
268
        tagName: 'a',
269
        click: function() {
270
                this.sendAction("action", this.get('param'));
271
        }
272
});
273

    
274
Synnefo.AddNewComponent = Ember.Component.extend({
275
        templateName: 'snfElem',
276
        addNewBtn: true,
277
        selectable: false,
278
        icon: function() {
279
                baseIcon = Synnefo.conf.sectors.findBy('destination', this.get('type')).icon;
280
                return        baseIcon.replace('outline', 'create-full');
281
        }.property(),
282
        tagName: 'li',
283
        status: 'add-new',
284
        classNameBindings: ['status'],
285
        attributeBindings: ['data-status, data-reveal-id'],
286
        'data-reveal-id': function(){
287
                if(addNewBtn)
288
                        return /*this.get('type').substring(0, type.length - 1)+*/'-wizard';
289
                else
290
                        return undefined;
291
        }.property(),
292
        'data-status': function() {
293
                return this.status;
294
        }.property(),
295
        name: function() {
296
                var msg = 'Create New ';
297
                var btnType = this.get('type')
298
                switch(btnType){
299
                        case 'vms':
300
                                return msg + 'Machine';
301
                        case 'networks':
302
                                return msg + 'Network';
303
                        case 'volumes':
304
                                return msg + 'Volume';
305
                        case 'snapshots':
306
                                return msg + 'Snapshot';
307
                        case 'images':
308
                                return '+ Upload New Image';
309
                }
310
        }.property(),
311
                click: function () {
312
                this.sendAction('action');
313
                }
314
});
315

    
316
Synnefo.LoginMenuComponent = Ember.Component.extend({
317
        classNames: ['login'],
318
        didInsertElement: function() {
319
                var self = this.$();
320
                self.mouseenter(function(e){
321
                self.find('ul').stop(true, true).slideDown(200);
322
            });
323
            self.mouseleave(function(e){
324
        self.find('ul').stop(true, true).slideUp(200);
325
    });
326

    
327
        }
328
});
329

    
330
Synnefo.SnfCheckboxComponent = Ember.Component.extend({
331
        tagName: 'a',
332
        classNames: ['check'],
333
        templateName: 'components/select-btn',
334
        initState: function() {
335
                return this.get('initState');
336
        }.property(),
337
        didInsertElement: function() {
338
                var el = this.$();
339
                var self =this;
340
                this.setInitClasses();
341
                el.click(function(e) {
342
            e.preventDefault();
343
            e.stopPropagation();
344
            self.changeState(el);
345
            // ui.entitiesActionsEnabled();
346
        });
347
        },
348
        setInitClasses: function() {
349
                var self =this.$();
350
                switch(this.initState){
351
                        case 'unchecked': {
352
                                this.uncheck(self);
353
                                break;
354
                        }
355
                        case 'prechecked': {
356
                                self.find('span').addClass('prechecked')
357
                                this.check(self);
358
                                break;
359
                        }
360
                }
361
        },
362
        // used to be in ui.checkbox
363
        changeState : function(checkbox_link) {
364
        $(checkbox_link).find('.snf-checkbox-unchecked, .snf-checkbox-checked').toggleClass('snf-checkbox-unchecked snf-checkbox-checked');
365
        $(checkbox_link).closest('li').toggleClass('selected');
366
    },
367
    check : function(checkbox_link) {
368
        $(checkbox_link).find('span').removeClass('snf-checkbox-unchecked').addClass('snf-checkbox-checked');
369
        $(checkbox_link).closest('li').addClass('selected');
370
    },
371
    uncheck : function(checkbox_link) {
372
        $(checkbox_link).find('span').removeClass('snf-checkbox-checked').addClass('snf-checkbox-unchecked');
373
        $(checkbox_link).closest('li').removeClass('selected');
374
    },
375

    
376
    reset: function(area) {
377
        $(area).find('.snf-radio-checked').not('.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
378
        $(area).find('.snf-radio-unchecked.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
379
    },
380
});