Statistics
| Branch: | Tag: | Revision:

root / ui / static / synnefo.js @ c26f1ccc

History | View | Annotate | Download (20 kB)

1
var flavors = [], images = [], servers = [], disks = [], cpus = [], ram = [];
2
var changes_since = 0, deferred = 0, update_request = false, load_request = false, pending_actions = [];
3
var API_URL = "/api/v1.1";
4

    
5
function ISODateString(d){
6
    //return a date in an ISO 8601 format using UTC. 
7
    //do not include time zone info (Z) at the end
8
    //taken from the Mozilla Developer Center 
9
    function pad(n){ return n<10 ? '0'+n : n }
10
    return  d.getUTCFullYear()+ '-' +
11
                        pad(d.getUTCMonth()+1) + '-' +
12
                        pad(d.getUTCDate()) + 'T' +
13
                        pad(d.getUTCHours()) + ':' +
14
                        pad(d.getUTCMinutes()) + ':' +
15
                        pad(d.getUTCSeconds()) +'Z'
16
}
17

    
18
function parse_error(responseText){
19
        var errors = [];
20
        if (responseText.length == 0){
21
                errors[0] = {'code': 503};
22
        } else {
23
                responseObj = JSON.parse(responseText);
24
                //console.info(inp);
25
                for (var err in responseObj){
26
                        errors[errors.length] = responseObj[err];
27
                }
28
        }
29
        return errors;
30
}
31

    
32
// indexOf prototype for IE
33
if (!Array.prototype.indexOf) {
34
  Array.prototype.indexOf = function(elt /*, from*/) {
35
    var len = this.length;
36
    var from = Number(arguments[1]) || 0;
37
    from = (from < 0)
38
         ? Math.ceil(from)
39
         : Math.floor(from);
40
    if (from < 0)
41
      from += len;
42

    
43
    for (; from < len; from++) {
44
      if (from in this &&
45
          this[from] === elt)
46
        return from;
47
    }
48
    return -1;
49
  };
50
}
51

    
52

    
53
function update_confirmations(){
54
    // hide all confirm boxes to begin with
55
    $('div.confirm_single').hide();
56
    $('div.confirm_multiple').hide();
57
   
58
        // standard view only
59
        if ($.cookie("list") != '1') { 
60
                for (i=0;i<pending_actions.length;i++){
61
            // show single confirms
62
                        $("div.machine#"+pending_actions[i][1]+' .confirm_single').show();        
63
                }                
64
        }
65

    
66
        // if more than one pending action show multiple confirm box
67
        if (pending_actions.length>1 || $.cookie("list") == '1' && pending_actions.length == 1){ 
68
                $('div.confirm_multiple span.actionLen').text(pending_actions.length);
69
                $('div.confirm_multiple').show();
70
        }
71
}
72

    
73
function list_view() {
74
        changes_since = 0; // to reload full list
75
        pending_actions = []; // clear pending actions
76
        update_confirmations();
77
        clearTimeout(deferred);        // clear old deferred calls
78
        try {
79
                update_request.abort(); // cancel pending ajax updates
80
                load_request.abort();
81
        }catch(err){}
82
    $.cookie("list", '1'); // set list cookie
83
        
84
        uri = $("#list").attr("href");
85
    load_request = $.ajax({
86
        url: uri,
87
        type: "GET",
88
        timeout: TIMEOUT,
89
        dataType: "html",
90
        error: function(jqXHR, textStatus, errorThrown) {                                                
91
                        return false;
92
                },
93
        success: function(data, textStatus, jqXHR) {
94
                        $("a#standard")[0].className += ' activelink';
95
                        $("a#list")[0].className = '';
96
                        $("div#machinesview").html(data);
97
                }
98
        });
99
    
100
    return false;
101
}
102

    
103
function standard_view() {
104
        changes_since = 0; // to reload full list
105
        pending_actions = []; // clear pending actions
106
        update_confirmations();
107
        clearTimeout(deferred);        // clear old deferred calls
108
        try {
109
                update_request.abort() // cancel pending ajax updates
110
                load_request.abort();
111
        }catch(err){}        
112
    $.cookie("list", '0');
113
        
114
    uri = $("a#standard").attr("href");
115
    load_request = $.ajax({
116
        url: uri,
117
        type: "GET",
118
        timeout: TIMEOUT,
119
        dataType: "html",
120
        error: function(jqXHR, textStatus, errorThrown) {                                                
121
                        return false;
122
                },
123
        success: function(data, textStatus, jqXHR) {
124
                        $("a#list")[0].className += ' activelink';
125
                        $("a#standard")[0].className = '';
126
                        $("div#machinesview").html(data);
127
                }
128
        });        
129

    
130
    return false;
131
}
132

    
133
function choose_view() {
134
    if ($.cookie("list")=='1') {
135
        list_view();
136
    } else {
137
        standard_view();
138
    }
139
}
140

    
141
function toggleMenu() {
142
    var primary = $("ul.css-tabs li a.primary");
143
    var secondary = $("ul.css-tabs li a.secondary");
144
    var all = $("ul.css-tabs li a");                        
145
    var toggled = $('ul.css-tabs li a.current').hasClass('secondary');
146
    
147
    // if anything is still moving, do nothing
148
    if ($(":animated").length) {
149
        return;
150
    } 
151
    
152
    // nothing is current to begin with
153
    $('ul.css-tabs li a.current').removeClass('current');
154
    
155
    // move stuff around
156
    all.animate({top:'30px'}, {complete: function() { 
157
        $(this).hide();
158
        if (toggled) {
159
            primary.show();
160
            primary.animate({top:'9px'}, {complete: function() {
161
                $('ul.css-tabs li a.primary#machines').addClass('current');
162
                $('a#machines').click();                                   
163
            }});
164
        } else {
165
            secondary.show();
166
            secondary.animate({top:'9px'}, {complete: function() {
167
                $('ul.css-tabs li a.secondary#files').addClass('current');
168
                $('a#files').click();                                                                           
169
            }});
170
        }                                              
171
    }});
172
    
173
    // rotate arrow icon
174
    if (toggled) {
175
        $("#arrow").rotate({animateAngle: (0), bind:[{"click":function(){toggleMenu()}}]});
176
        $("#arrow").rotateAnimation(0);                    
177
    } else {
178
        $("#arrow").rotate({animateAngle: (-180), bind:[{"click":function(){toggleMenu()}}]});
179
        $("#arrow").rotateAnimation(-180);
180
    }            
181
}
182

    
183
// confirmation overlay generation
184
function confirm_action(action_string, action_function, serverIDs, serverNames) {
185
    if (serverIDs.length == 1){
186
        $("#yes-no h3").text('You are about to ' + action_string + ' vm ' + serverNames[0]);
187
    } else if (serverIDs.length > 1){
188
        $("#yes-no h3").text('You are about to ' + action_string + ' ' + serverIDs.length + ' machines');
189
    } else {
190
        return false;
191
    }
192
    // action confirmation overlay
193
    var triggers = $("a#confirmation").overlay({
194
            // some mask tweaks suitable for modal dialogs
195
            mask: {
196
                    color: '#ebecff',
197
                    opacity: '0.9'
198
            },
199
        top: 'center',
200
        load: false
201
    });
202
    // yes or no?
203
    var buttons = $("#yes-no button").click(function(e) {
204
            // get user input
205
            var yes = buttons.index(this) === 0;
206
        //close the confirmation window
207
        $("a#confirmation").overlay().close(); 
208
        // return true=yes or false=no
209
        if (yes) {
210
            action_function(serverIDs);
211
        }
212
    });
213
    $("a#confirmation").data('overlay').load();
214
    return false;
215
}
216

    
217
// get and show a list of running and terminated machines
218
function update_vms(interval) {
219
    try{ console.info('updating machines'); } catch(err){}
220
        var uri= API_URL + '/servers/detail';
221
        
222
        if (changes_since != 0)
223
                uri+='?changes-since='+changes_since
224
                
225
    update_request = $.ajax({
226
        url: uri,
227
        type: "GET",
228
        timeout: TIMEOUT,
229
        dataType: "json",
230
        error: function(jqXHR, textStatus, errorThrown) {
231
                        // don't forget to try again later
232
                        if (interval) {
233
                                clearTimeout(deferred);        // clear old deferred calls
234
                                deferred = setTimeout(update_vms,interval,interval);
235
                        }
236
                        // as for now, just show an error message
237
                        try { console.info('update_vms errback:' + jqXHR.status ) } catch(err) {}
238
                        ajax_error(jqXHR.status, undefined, 'Update VMs', jqXHR.responseText);                                                
239
                        return false;
240
                        },
241
        success: function(data, textStatus, jqXHR) {
242
                        // create changes_since string if necessary
243
                        if (jqXHR.getResponseHeader('Date') != null){
244
                                changes_since_date = new Date(jqXHR.getResponseHeader('Date'));
245
                                changes_since = ISODateString(changes_since_date);
246
                        }
247
                        
248
                        if (interval) {
249
                                clearTimeout(deferred);        // clear old deferred calls
250
                                deferred = setTimeout(update_vms,interval,interval);
251
                        }
252
                        
253
                        if (jqXHR.status == 200 || jqXHR.status == 203) {
254
                                try {
255
                                        servers = data.servers.values;
256
                                } catch(err) { ajax_error('400', undefined, 'Update VMs', jqXHR.responseText);}
257
                                update_machines_view(data);
258
                        } else if (jqXHR.status != 304){
259
                                try { console.info('update_vms callback:' + jqXHR.status ) } catch(err) {}
260
                                //ajax_error(jqXHR.status, undefined, 'Update VMs', jqXHR.responseText);                                        
261
                        }
262
                        return false;
263
        }
264
    });
265
    return false;
266
}
267

    
268
// get and show a list of available standard and custom images
269
function update_images() { 
270
    $.ajax({
271
        url: API_URL + '/images/detail',
272
        type: "GET",
273
        //async: false,
274
        dataType: "json",
275
        timeout: TIMEOUT,
276
        error: function(jqXHR, textStatus, errorThrown) { 
277
                    ajax_error(jqXHR.status, undefined, 'Update Images', jqXHR.responseText);
278
                    },
279
        success: function(data, textStatus, jqXHR) {
280
            try {
281
                                images = data.images.values;
282
                                update_wizard_images();
283
                        } catch(err){
284
                                ajax_error("NO_IMAGES");
285
                        }
286
        }
287
    });
288
    return false;
289
}
290

    
291
function update_wizard_images() {
292
        if ($("ul#standard-images li").toArray().length + $("ul#custom-images li").toArray().length == 0) {
293
                $.each(images, function(i,image){
294
                        var img = $('#image-template').clone().attr("id","img-"+image.id).fadeIn("slow");
295
                        img.find("label").attr('for',"img-radio-" + image.id);
296
                        img.find(".image-title").text(image.name);
297
            if (image.metadata) {
298
                if (image.metadata.values.description != undefined) {
299
                    img.find(".description").text(image.metadata.values.description);
300
                }
301
                if (image.metadata.values.size != undefined) {
302
                                img.find(".size").text(image.metadata.values.size);
303
                }
304
            }
305
                        img.find("input.radio").attr('id',"img-radio-" + image.id);
306
                        if (i==0) img.find("input.radio").attr("checked","checked"); 
307
                        img.find("img.image-logo").attr('src','static/os_logos/'+image_tags[image.id]+'.png');
308
            if (image.metadata) {
309
                if (image.metadata.values.serverId != undefined) {
310
                    img.appendTo("ul#custom-images");
311
                } else {
312
                    img.appendTo("ul#standard-images");
313
                }
314
            } else {
315
                img.appendTo("ul#standard-images");
316
            }
317
                });
318
        }        
319
}
320

    
321
function update_wizard_flavors(){
322
        // sliders for selecting VM flavor
323
        $("#cpu:range").rangeinput({min:0,
324
                                                           value:0,
325
                                                           step:1,
326
                                                           progress: true,
327
                                                           max:cpus.length-1});
328
        
329
        $("#storage:range").rangeinput({min:0,
330
                                                           value:0,
331
                                                           step:1,
332
                                                           progress: true,
333
                                                           max:disks.length-1});
334

    
335
        $("#ram:range").rangeinput({min:0,
336
                                                           value:0,
337
                                                           step:1,
338
                                                           progress: true,
339
                                                           max:ram.length-1});
340
        $("#small").click();
341
        
342
        // update the indicators when sliding
343
        $("#cpu:range").data().rangeinput.onSlide(function(event,value){
344
                $("#cpu-indicator")[0].value = cpus[Number(value)];
345
        });
346
        $("#cpu:range").data().rangeinput.change(function(event,value){
347
                $("#cpu-indicator")[0].value = cpus[Number(value)];                                
348
                $("#custom").click();                                
349
        });                        
350
        $("#ram:range").data().rangeinput.onSlide(function(event,value){
351
                $("#ram-indicator")[0].value = ram[Number(value)];
352
        });
353
        $("#ram:range").data().rangeinput.change(function(event,value){
354
                $("#ram-indicator")[0].value = ram[Number(value)];                                
355
                $("#custom").click();
356
        });                        
357
        $("#storage:range").data().rangeinput.onSlide(function(event,value){
358
                $("#storage-indicator")[0].value = disks[Number(value)];
359
        });
360
        $("#storage:range").data().rangeinput.change(function(event,value){
361
                $("#storage-indicator")[0].value = disks[Number(value)];                                
362
                $("#custom").click();
363
        });                                
364
}
365

    
366
Array.prototype.unique = function () {
367
        var r = new Array();
368
        o:for(var i = 0, n = this.length; i < n; i++)
369
        {
370
                for(var x = 0, y = r.length; x < y; x++)
371
                {
372
                        if(r[x]==this[i])
373
                        {
374
                                continue o;
375
                        }
376
                }
377
                r[r.length] = this[i];
378
        }
379
        return r;
380
}
381

    
382
// get and configure flavor selection
383
function update_flavors() { 
384
    $.ajax({
385
        url: API_URL + '/flavors/detail',
386
        type: "GET",
387
        //async: false,
388
        dataType: "json",
389
        timeout: TIMEOUT,
390
        error: function(jqXHR, textStatus, errorThrown) { 
391
            try {
392
                                ajax_error(jqXHR.status, undefined, 'Update Flavors', jqXHR.responseText);
393
                        } catch (err) {
394
                                ajax_error(err);
395
                        }
396
        },
397
        success: function(data, textStatus, jqXHR) {
398
            flavors = data.flavors.values;
399
            $.each(flavors, function(i, flavor) {
400
                cpus[i] = flavor['cpu'];
401
                disks[i] = flavor['disk'];
402
                ram[i] = flavor['ram'];
403
            });
404
            cpus = cpus.unique();
405
            disks = disks.unique();
406
            ram = ram.unique();
407
                        update_wizard_flavors();
408
        }
409
    });
410
    return false;
411
}
412

    
413
// return flavorRef from cpu, disk, ram values
414
function identify_flavor(cpu, disk, ram){
415
    for (i=0;i<flavors.length;i++){
416
        if (flavors[i]['cpu'] == cpu && flavors[i]['disk']==disk && flavors[i]['ram']==ram) {
417
            return flavors[i]['id']
418
        }
419
    }
420
    return 0;
421
}
422

    
423
// return flavor entry from flavorRef
424
function get_flavor(flavorRef) {
425
    for (i=0;i<flavors.length;i++){
426
        if (flavors[i]['id'] == flavorRef) {
427
            return flavors[i];
428
        }
429
    }
430
    return 0;
431
}
432

    
433

    
434
// update the actions in list view
435
function updateActions() {
436
        var states = [];
437
        var on = [];
438
        var checked = $("table.list-machines tbody input[type='checkbox']:checked");
439
        // disable all actions to begin with
440
        for (action in actions) {
441
                $("#action-" + action).removeClass('enabled');
442
        }
443

    
444
        // are there multiple machines selected?
445
        if (checked.length>1)
446
                states[0] = 'multiple';
447
        
448
        // check the states of selected machines
449
        checked.each(function(i,checkbox) {
450
                states[states.length] = checkbox.className;
451
                var ip = $("#" + checkbox.id.replace('input-','') + ".ip span.public").text();
452
                if (ip.replace('undefined','').length)
453
                        states[states.length] = 'network';
454
        });
455

    
456
        // decide which actions should be enabled
457
        for (a in actions) {
458
                var enabled = false;
459
                for (var s =0; s<states.length; s++) {
460
                        if (actions[a].indexOf(states[s]) != -1 ) {
461
                                enabled = true;
462
                        } else {
463
                                enabled = false;
464
                                break;
465
                        }
466
                }
467
                if (enabled)
468
                        on[on.length]=a;
469
        }
470
        // enable those actions
471
        for (action in on) {
472
                $("#action-" + on[action]).addClass('enabled');
473
        }
474
}
475

    
476
//create server action
477
function create_vm(machineName, imageRef, flavorRef){
478
    var payload = {
479
        "server": {
480
            "name": machineName,
481
            "imageRef": imageRef,
482
            "flavorRef" : flavorRef,
483
            "metadata" : {
484
                "My Server Name" : machineName
485
            }
486
        }
487
    };
488
        var uri = API_URL + '/servers';
489

    
490
    $.ajax({
491
    url: uri,
492
    type: "POST",
493
        contentType: "application/json",
494
    dataType: "json",    
495
    data: JSON.stringify(payload),
496
    timeout: TIMEOUT,
497
    error: function(jqXHR, textStatus, errorThrown) { 
498
                ajax_error(jqXHR.status, undefined, 'Create VM', jqXHR.responseText);
499
           },
500
    success: function(data, textStatus, jqXHR) {
501
                if ( jqXHR.status == '202') {
502
                    ajax_success("CREATE_VM_SUCCESS", data.server.adminPass);                   
503
                } else {
504
                    ajax_error(jqXHR.status, undefined, 'Create VM', jqXHR.responseText);
505
                }
506
            }
507
    });
508
}
509

    
510
// reboot action
511
function reboot(serverIDs){
512
        if (!serverIDs.length){
513
                //ajax_success('DEFAULT');
514
                return false;
515
        }        
516
    // ajax post reboot call
517
    var payload = {
518
        "reboot": {"type" : "HARD"}
519
    };
520
    var serverID = serverIDs.pop();
521
        
522
        $.ajax({
523
                url: API_URL + '/servers/' + serverID + '/action',
524
                type: "POST",
525
                contentType: "application/json",
526
                dataType: "json",
527
                data: JSON.stringify(payload),
528
                timeout: TIMEOUT,
529
                error: function(jqXHR, textStatus, errorThrown) {
530
                    display_failure(jqXHR.status, serverID, 'Reboot', jqXHR.responseText)
531
                                },
532
                success: function(data, textStatus, jqXHR) {
533
                                        if ( jqXHR.status == '202') {
534
                        try {
535
                            console.info('rebooted ' + serverID);
536
                        } catch(err) {}
537
                                                // indicate that the action succeeded
538
                                                display_success(serverID);
539
                                                // continue with the rest of the servers
540
                                                reboot(serverIDs);
541
                                        } else {
542
                                                ajax_error(jqXHR.status, serverID, 'Reboot', jqXHR.responseText);
543
                                        }
544
                                }
545
    });
546

    
547
    return false;
548
}
549

    
550
// shutdown action
551
function shutdown(serverIDs) {
552
        if (!serverIDs.length){
553
                //ajax_success('DEFAULT');
554
                return false;
555
        }
556
    // ajax post shutdown call
557
    var payload = {
558
        "shutdown": {"timeout" : "5"}
559
    };   
560

    
561
        var serverID = serverIDs.pop()
562
    $.ajax({
563
            url: API_URL + '/servers/' + serverID + '/action',
564
            type: "POST",
565
                contentType: "application/json",
566
            dataType: "json",
567
        data: JSON.stringify(payload),
568
        timeout: TIMEOUT,
569
        error: function(jqXHR, textStatus, errorThrown) { 
570
                    display_failure(jqXHR.status, serverID, 'Shutdown', jqXHR.responseText)
571
                    },
572
        success: function(data, textStatus, jqXHR) {
573
                    if ( jqXHR.status == '202') {
574
                                                try {
575
                            console.info('suspended ' + serverID);
576
                        } catch(err) {}
577
                                                // indicate that the action succeeded
578
                                                display_success(serverID);
579
                                                // continue with the rest of the servers                        
580
                        shutdown(serverIDs);
581
                    } else {
582
                        ajax_error(jqXHR.status, serverID, 'Shutdown', jqXHR.responseText);
583
                    }
584
                }             
585
    });
586

    
587
    return false;    
588
}
589

    
590
// destroy action
591
function destroy(serverIDs) {
592
        if (!serverIDs.length){
593
                //ajax_success('DEFAULT');
594
                return false;
595
        }
596
    // ajax post destroy call can have an empty request body
597
    var payload = {};   
598

    
599
        serverID = serverIDs.pop()
600
    $.ajax({
601
            url: API_URL + '/servers/' + serverID,
602
            type: "DELETE",
603
                contentType: "application/json",
604
            dataType: "json",
605
        data: JSON.stringify(payload),
606
        timeout: TIMEOUT,
607
        error: function(jqXHR, textStatus, errorThrown) { 
608
                    display_failure(jqXHR.status, serverID, 'Destroy', jqXHR.responseText)
609
                    },
610
        success: function(data, textStatus, jqXHR) {
611
                    if ( jqXHR.status == '204') {
612
                                                try {
613
                            console.info('destroyed ' + serverID);
614
                        } catch (err) {}
615
                                                // indicate that the action succeeded
616
                                                display_success(serverID);
617
                                                // continue with the rest of the servers
618
                        destroy(serverIDs);
619
                    } else {
620
                        ajax_error(jqXHR.status, serverID, 'Destroy', jqXHR.responseText);
621
                    }
622
                }             
623
    });
624

    
625
    return false;    
626
}
627

    
628
// start action
629
function start(serverIDs){
630
        if (!serverIDs.length){
631
                //ajax_success('DEFAULT');
632
                return false;
633
        }        
634
    // ajax post start call
635
    var payload = {
636
        "start": {"type" : "NORMAL"}
637
    };   
638

    
639
        var serverID = serverIDs.pop()
640
    $.ajax({
641
        url: API_URL + '/servers/' + serverID + '/action',
642
        type: "POST",
643
                contentType: "application/json",
644
        dataType: "json",
645
        data: JSON.stringify(payload),
646
        timeout: TIMEOUT,
647
        error: function(jqXHR, textStatus, errorThrown) { 
648
                    display_failure(jqXHR.status, serverID, 'Start', jqXHR.responseText)
649
                    },
650
        success: function(data, textStatus, jqXHR) {
651
                    if ( jqXHR.status == '202') {
652
                                            try {
653
                            console.info('started ' + serverID);
654
                        } catch(err) {}
655
                                                // indicate that the action succeeded
656
                                                display_success(serverID);
657
                                                // continue with the rest of the servers                                                
658
                        start(serverIDs);
659
                    } else {
660
                        ajax_error(jqXHR.status, serverID, 'Start', jqXHR.responseText);
661
                    }
662
                }
663
    });
664

    
665
    return false;
666
}
667

    
668
// show the welcome screen
669
function showWelcome() {
670
    $("#emptymachineslist").fadeIn("slow");
671
    $("#createbody").fadeIn("slow");
672
    $("#createcontainer").addClass('emptycreatecontainer')
673
    $("#create").addClass('emptycreate')
674
    $("#view-select").fadeOut("fast");
675
}
676

    
677
// hide the welcome screen
678
function hideWelcome() {
679
    $("#emptymachineslist").fadeOut("fast");
680
    $("#createbody").fadeOut("fast");
681
    $("#createcontainer").removeClass('emptycreatecontainer')
682
    $("#create").removeClass('emptycreate')
683
    $("#view-select").fadeIn("fast");
684
}
685