| <!-- The <instance-status-sk> custom element declaration. |
| |
| Polls the backend for how long the instance has been running, which it |
| displays in a human friendly manner, and also presents a button to restart |
| the instance. |
| |
| Attributes: |
| None. |
| |
| Events: |
| None. |
| |
| Methods: |
| None. |
| --> |
| <link rel="stylesheet" href="/res/common/css/md.css" type="text/css" media="all"> |
| |
| <dom-module id="instance-status-sk"> |
| <style> |
| form { |
| display: inline-block; |
| margin-left: 0.5em; |
| margin-right: 1em; |
| } |
| |
| a { |
| color: white; |
| text-decoration: none; |
| border: solid white 1px; |
| border-radius: 3px; |
| padding: 0.6em 1.2em; |
| margin: 0.6em; |
| text-transform: uppercase; |
| } |
| |
| a:hover { |
| opacity: 0.5; |
| } |
| </style> |
| <template> |
| <content> |
| Your instance has been running <span id=duration></span>. |
| <form id=form action="./instanceStatus" method="post" accept-charset="utf-8"> |
| <button type="submit">Restart Instance</button> |
| <a href="/instanceNew" title="Start a new instance.">New</a> |
| </form> |
| </content> |
| </template> |
| </dom-module> |
| |
| <script> |
| Polymer({ |
| is: "instance-status-sk", |
| |
| ready: function() { |
| this.async(this._updateDuration.bind(this), 1000); |
| window.setInterval(function() { |
| this._updateDuration(); |
| }.bind(this), 60*1000); |
| this.$.form.action = this._correctedOrigin() + "instanceStatus"; |
| }, |
| |
| _updateDuration: function() { |
| if (!this.classList.contains("hidden")) { |
| sk.get(this._correctedOrigin() + "instanceStatus").then(JSON.parse).then(function(json){ |
| this.$.duration.innerText = sk.human.diffDate(json.started*1000); |
| }.bind(this)); |
| } |
| }, |
| |
| _correctedOrigin: function() { |
| // TODO(jcgregorio) Extract from here and app.html into a common code file. |
| // Since we always use relative URLs, i.e. "./foo" we need to make |
| // sure the base URL ends with a "/". |
| var origin = window.location.href; |
| if (origin[origin.length-1] != "/") { |
| origin += "/"; |
| } |
| return origin; |
| }, |
| |
| }); |
| </script> |