| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>pulld</title> |
| |
| {%template "header.html" .%} |
| |
| <style is="custom-style" type="text/css" media="screen"> |
| :root { |
| --default-primary-color: #AA4499; |
| } |
| </style> |
| |
| <style type="text/css" media="screen"> |
| body { |
| font-family: Arial, sans-serif; |
| font-size: 15px; |
| } |
| |
| paper-toast { |
| margin: 2em; |
| } |
| |
| unit-list-sk { |
| margin: 2em; |
| display: block; |
| } |
| |
| html, body { |
| height: 100%; |
| margin: 0; |
| } |
| |
| paper-header-panel { |
| height: 100%; |
| } |
| |
| systemd-unit-status-sk { |
| display: block; |
| margin: 1em; |
| } |
| |
| #units { |
| margin-top: 2em; |
| } |
| </style> |
| </head> |
| <body> |
| <body> |
| <paper-header-panel mode=scroll> |
| {%template "titlebar.html" .%} |
| {%$hostname := .Hostname%} |
| <div id=units> |
| {%range .Units%} |
| <systemd-unit-status-sk machine="{%$hostname%}" service="{%.Status.Name%}"></systemd-unit-status-sk> |
| {%end%} |
| </div> |
| <paper-toast></paper-toast> |
| </paper-header-panel> |
| </body> |
| |
| <script type="text/javascript" charset="utf-8"> |
| (function() { |
| function loadData() { |
| sk.get("/_/list").then(JSON.parse).then(function(json) { |
| json.forEach(function(e) { |
| sk.Mailbox.send("{%$hostname%}:"+e.status.Name, e); |
| }); |
| }).catch(function(e){ |
| $$$('paper-toast').text = e; |
| $$$('paper-toast').show(); |
| }); |
| } |
| |
| loadData(); |
| document.body.addEventListener('unit-action', function(e) { |
| var params = { |
| name: e.detail.name, |
| action: e.detail.action, |
| } |
| sk.post('/_/change?'+sk.query.fromObject(params)).then(JSON.parse).then(function(json) { |
| $$$('paper-toast').text = e.detail.name + ": " + json.result; |
| $$$('paper-toast').show(); |
| loadData(); |
| }).catch(function(e) { |
| $$$('paper-toast').text = e; |
| $$$('paper-toast').show(); |
| }); |
| }); |
| })(); |
| </script> |
| </body> |
| </html> |