30 |
30 |
this.selected_action = undefined;
|
31 |
31 |
this.available_actions = [];
|
32 |
32 |
this.multi_view = synnefo.ui.main.multiple_actions_view;
|
|
33 |
|
|
34 |
this.hovered = false;
|
33 |
35 |
},
|
34 |
36 |
|
35 |
37 |
set_handlers: function() {
|
... | ... | |
37 |
39 |
storage.vms.bind("change:pending_action", function() {
|
38 |
40 |
if (!storage.vms.has_pending_actions()) {
|
39 |
41 |
self.parent.$(".actions a").removeClass("selected");
|
|
42 |
self.parent.clear_indicators();
|
40 |
43 |
}
|
41 |
|
})
|
|
44 |
});
|
42 |
45 |
|
43 |
46 |
var self = this;
|
44 |
47 |
this.parent.$(".actions a.enabled").live('click', function() {
|
45 |
48 |
self.parent.$(".actions a").removeClass("selected");
|
46 |
49 |
$(this).addClass("selected");
|
47 |
50 |
self.parent.select_action($(this).attr("id").replace("action-",""));
|
48 |
|
})
|
|
51 |
});
|
|
52 |
|
|
53 |
this.parent.$(".actions a.enabled").live({
|
|
54 |
'mouseenter': function() {
|
|
55 |
self.parent.set_indicator_for($(this).attr("id").replace("action-",""))
|
|
56 |
self.hovered = true;
|
|
57 |
},
|
|
58 |
'mouseleave': function() {
|
|
59 |
self.parent.clear_indicators();
|
|
60 |
self.hovered = false;
|
|
61 |
}
|
|
62 |
});
|
49 |
63 |
},
|
50 |
64 |
|
51 |
65 |
update_actions: function() {
|
... | ... | |
220 |
234 |
this.vm(vm).find(".spinner").hide();
|
221 |
235 |
this.vm(vm).find(".wave").hide();
|
222 |
236 |
this.vm(vm).find(".os_icon").show();
|
|
237 |
this.vm(vm).find(".action-indicator").hide();
|
223 |
238 |
|
224 |
239 |
// ancestor method
|
225 |
240 |
this.__set_vm_handlers(vm);
|
... | ... | |
243 |
258 |
}, this));
|
244 |
259 |
},
|
245 |
260 |
|
|
261 |
set_indicator_for: function(action) {
|
|
262 |
var vms = this.get_selected_vms();
|
|
263 |
_.each(vms, _.bind(function(vm){
|
|
264 |
var vmel = this.vm(vm);
|
|
265 |
vmel.find("img.spinner, img.wave, img.os_icon").hide();
|
|
266 |
vmel.find("span.action-indicator").show().removeClass().addClass(action + " action-indicator");
|
|
267 |
}, this));
|
|
268 |
},
|
|
269 |
|
|
270 |
clear_indicators: function() {
|
|
271 |
var vms = storage.vms.models;
|
|
272 |
_.each(vms, _.bind(function(vm){
|
|
273 |
var vmel = this.vm(vm);
|
|
274 |
|
|
275 |
vmel.find("img.wave").hide();
|
|
276 |
|
|
277 |
if (vm.pending_action) {
|
|
278 |
vmel.find("img.os_icon").hide();
|
|
279 |
vmel.find("span.action-indicator").show().removeClass().addClass(vm.pending_action + " action-indicator");
|
|
280 |
return;
|
|
281 |
}
|
|
282 |
|
|
283 |
if (vm.in_transition()) {
|
|
284 |
vmel.find("span.action-indicator").hide();
|
|
285 |
vmel.find("img.spinner").show();
|
|
286 |
return;
|
|
287 |
}
|
|
288 |
|
|
289 |
if (!this.actions.hovered) {
|
|
290 |
vmel.find("img.os_icon").show();
|
|
291 |
vmel.find("span.action-indicator").hide();
|
|
292 |
vmel.find("img.spinner").hide();
|
|
293 |
}
|
|
294 |
|
|
295 |
|
|
296 |
}, this));
|
|
297 |
},
|
|
298 |
|
246 |
299 |
get_vm_table_data: function(vm) {
|
247 |
300 |
var checkbox = '<input type="checkbox" class="' +
|
248 |
301 |
views.ListView.STATE_CLASSES[vm.state()].join(" ") +
|
... | ... | |
251 |
304 |
var img = '<img class="os_icon" src="'+ this.get_vm_icon_path(vm, "small") +'" />';
|
252 |
305 |
img = img + '<img src="static/icons/indicators/small/progress.gif" class="spinner" />';
|
253 |
306 |
img = img + '<img src="static/icons/indicators/medium/wave.gif" class="wave" />';
|
|
307 |
img = img + '<span class="action-indicator" />';
|
254 |
308 |
|
255 |
309 |
var name = util.truncate(vm.get('name'), 20);
|
256 |
310 |
var flavor = vm.get_flavor().details_string();
|
... | ... | |
268 |
322 |
this.sel('vm_spinner', vm.id).show();
|
269 |
323 |
this.sel('vm_wave', vm.id).hide();
|
270 |
324 |
this.sel('os_icon', vm.id).hide();
|
|
325 |
this.$(".action-indicator").hide();
|
271 |
326 |
} else {
|
272 |
327 |
this.sel('vm_spinner', vm.id).hide();
|
273 |
328 |
}
|
... | ... | |
275 |
330 |
|
276 |
331 |
// display transition animations
|
277 |
332 |
show_transition: function(vm) {
|
|
333 |
if (!this.visible()) { return };
|
278 |
334 |
var wave = this.sel('vm_wave', vm.id);
|
279 |
335 |
if (!wave.length) {
|
280 |
336 |
return
|