| <!DOCTYPE HTML> |
| <html> |
| <body> |
| <h2>Deployment</h2> |
| |
| <section> |
| <p>Deployment ID <span id="id">Loading...</span></p> |
| |
| <p>Status <span id="status">Loading...</span></p> |
| |
| <p>Actions Completed <span id="actions">Loading...</span></p> |
| |
| <p><div id="progress"></div></p> |
| <form class="form"> |
| <p> |
| <button id="expand" onClick="return showHide()">More details...</button> |
| <button id="abort" onClick="return confirmAbort()">Abort</button> |
| </p> |
| </form> |
| |
| </section> |
| |
| <div id="details" style="display:none;"></div> |
| |
| <script type="text/javascript"> |
| function showHide() { |
| var style = $('#details').is(':visible'); |
| if(style == false) { |
| $('#expand').html('Less details...'); |
| } else { |
| $('#expand').html('More details...'); |
| } |
| $('#details').toggle(); |
| return false; |
| } |
| |
| function render(command) { |
| var cmd = $.getUrlVar('cmd'); |
| $('#id').text(cmd); |
| $('#status').text(command['status']); |
| var buffer = []; |
| var i = 0; |
| buffer[i++]=command['completedActions']; |
| buffer[i++]=' of '; |
| buffer[i++]=command['totalActions']; |
| $('#actions').text(buffer.join("")); |
| var progress = command['completedActions']/command['totalActions']*100; |
| $('#progress').progressbar({ value: progress }); |
| buffer = []; |
| i = 0; |
| var actionEntries; |
| try { |
| if(command['actionEntries'].constructor.toString().indexOf('Array') == -1) { |
| actionEntries = []; |
| actionEntries[0] = command['actionEntries']; |
| } else { |
| actionEntries = command['actionEntries']; |
| } |
| for(var action in actionEntries) { |
| buffer[i++]=renderAction(actionEntries[action]['action']); |
| try { |
| buffer[i++]=renderHostStatus(actionEntries[action]['hostStatus']); |
| } catch(err) { |
| // Protect rendering code from missing data. |
| } |
| } |
| } catch(err2) { |
| // Protect rendering code from missing data. |
| } |
| $('#details').html(buffer.join("")); |
| } |
| |
| function renderAction(action) { |
| |
| var buffer = []; |
| var i = 0; |
| if(action['@type']=='scriptAction') { |
| buffer[i++] = renderScriptAction(action); |
| } else if(action['@type']=='packageAction') { |
| buffer[i++] = renderPackageAction(action); |
| } else if(action['@type']=='daemonAction') { |
| buffer[i++] = renderDaemonAction(action); |
| } |
| return buffer.join(""); |
| } |
| |
| function renderScriptAction(action) { |
| var buffer = []; |
| var i = 0; |
| buffer[i++] = "<p>Action: "; |
| buffer[i++] = action['script']; |
| buffer[i++] = " "; |
| if (action['parameters'].constructor.toString().indexOf('Array') == -1) { |
| buffer[i++] = action['parameters']; |
| } else { |
| buffer[i++] = action['parameters'].join(" "); |
| } |
| buffer[i++] = "</p>"; |
| return buffer.join(""); |
| } |
| |
| function renderPackageAction(action) { |
| var buffer = []; |
| var i = 0; |
| buffer[i++] = "<p>Action: "; |
| buffer[i++] = action['actionType']; |
| buffer[i++] = " "; |
| var list = action['packages']; |
| if(list.constructor.toString().indexOf('Array') == -1) { |
| buffer[i++] = action['packages']['name']; |
| } else { |
| for(var x in list) { |
| buffer[i++] = list[x]['name']; |
| buffer[i++] = " "; |
| } |
| } |
| buffer[i++] = "</p>"; |
| return buffer.join(""); |
| } |
| |
| function renderDaemonAction(action) { |
| console.log(action); |
| var buffer = []; |
| var i = 0; |
| buffer[i++] = "<p>Action: "; |
| buffer[i++] = action['actionType']; |
| buffer[i++] = " "; |
| buffer[i++] = action['daemon']; |
| buffer[i++] = "</p>"; |
| return buffer.join(""); |
| } |
| |
| function renderHostStatus(hostStatus) { |
| var buffer = []; |
| var i = 0; |
| if (hostStatus.constructor.toString().indexOf('Array') == -1) { |
| buffer[i++] = "<span class='block'>"+hostStatus['host']+" "+hostStatus['status']+"</span> "; |
| } else { |
| for(var hs in hostStatus) { |
| buffer[i++] = "<span class='block'>"+hostStatus[hs]['host']+" "+hostStatus[hs]['status']+"</span> "; |
| } |
| } |
| return buffer.join(""); |
| } |
| |
| function checkStatus() { |
| var cmd = $.getUrlVar('cmd'); |
| jQuery.getJSON('/v1/command/status/'+cmd, |
| function(command) { |
| render(command); |
| if(command['status']!='SUCCEEDED' && |
| command['status']!='FAILED') { |
| var timeout = setTimeout("checkStatus()",3000); |
| } |
| } |
| ) |
| .error( |
| function() { |
| var command = []; |
| command['status'] = "Unknown"; |
| command['completedActions'] = "0"; |
| command['totalActions'] = "0"; |
| render(command); |
| var timeout = setTimeout("checkStatus()",3000); |
| } |
| ); |
| } |
| |
| function confirmAbort() { |
| var question = "Abort deployment "+$.getUrlVar('cmd')+"?"; |
| if(confirm(question)) { |
| abortCommand($.getUrlVar('cmd')); |
| } |
| return false; |
| } |
| |
| function abortCommand(cmd) { |
| $.ajax({ |
| type: 'DELETE', |
| url: '/v1/controller/abort/'+cmd, |
| success: function(data) { |
| console.log(data); |
| }, |
| dataType:'json' |
| }); |
| } |
| |
| $.extend({ |
| getUrlVars: function(){ |
| var vars = [], hash; |
| var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); |
| for(var i = 0; i < hashes.length; i++) { |
| hash = hashes[i].split('='); |
| vars.push(hash[0]); |
| vars[hash[0]] = hash[1]; |
| } |
| return vars; |
| }, |
| getUrlVar: function(name){ |
| return $.getUrlVars()[name]; |
| } |
| }); |
| |
| $(document).ready(function() { |
| checkStatus(); |
| }); |
| </script> |
| </body> |
| </html> |
