aboutsummaryrefslogtreecommitdiff
path: root/cmd/web/static
diff options
context:
space:
mode:
authorMitch Riedstra <mitch@riedstra.us>2021-03-04 17:54:03 -0500
committerMitch Riedstra <mitch@riedstra.us>2021-03-04 17:54:03 -0500
commiteaf02771d767e4745572d9b00e71e138ee030e60 (patch)
treefd3ac8cbe984344e6cc76d80e26ff963d8139d87 /cmd/web/static
parent17d0e3a4ef3ec0abf609a3bfe86e0429bd789583 (diff)
downloadsteam-export-eaf02771d767e4745572d9b00e71e138ee030e60.tar.gz
steam-export-eaf02771d767e4745572d9b00e71e138ee030e60.tar.xz
Switch go go 1.16 and use Embed
Diffstat (limited to 'cmd/web/static')
-rw-r--r--cmd/web/static/main.js84
-rw-r--r--cmd/web/static/style.css81
2 files changed, 165 insertions, 0 deletions
diff --git a/cmd/web/static/main.js b/cmd/web/static/main.js
new file mode 100644
index 0000000..55edf0c
--- /dev/null
+++ b/cmd/web/static/main.js
@@ -0,0 +1,84 @@
+// pretty print duration when given in seconds
+function formatDuration(dur) {
+ var out = "";
+
+ var hours = 0;
+ var minutes = 0;
+
+ if(dur > (60*60)){
+ hours = Math.trunc(dur/(60*60))
+ out = out + hours + " hours "
+ }
+
+ if(dur > 60){
+ minutes = Math.trunc((dur-(hours*60*60))/60)
+ out = out + minutes + " minutes "
+ }
+
+ seconds = Math.trunc(dur - ( (hours*60*60) + (minutes*60) ))
+ out = out + seconds + " seconds "
+
+ return out;
+}
+
+function setStatus(stat) {
+ var elem = document.getElementById("installBar");
+ var msg = document.getElementById("message");
+
+ // console.log(stat)
+
+ if(stat.Running) {
+ percent = Math.round((stat.Transferred/stat.Size)*10000)/100;
+
+ var t = Date.parse(stat.Start);
+ // var n = Date.now();
+ var elapsed = Date.now() - t;
+ var trans = (stat.Transferred/1024/1024);
+
+ console.log(trans)
+ console.log(elapsed / 1000)
+
+ var rate = Math.round(trans / (elapsed / 1000))
+
+ elem.style.width = percent + "%";
+ elem.innerHTML = percent + "%";
+ elem.style.display = "";
+
+ // in seconds
+ var eta = Math.round(((stat.Size - trans)/1024/1024) / rate);
+
+ msg.innerHTML = "Installing: " + stat.Url
+ + "\nRate: " + rate + "mb/s"
+ + "\nEta: " + formatDuration(eta);
+ msg.style.display = "";
+ }
+
+ if(!stat.Running && stat.Transferred >= 50 && stat.Error == null) {
+ elem.style.width = 100 + "%";
+ elem.innerHTML = 100 + "%";
+ msg.innerHTML = "Completed install for: " + stat.Url;
+ elem.style.display = "";
+ msg.style.display = "";
+ }
+
+ if(stat.Error != null) {
+ msg.innerHTML = "Errors encountered while installing from: \n\n"
+ + stat.Url + "\n\n" +
+ JSON.stringify(stat.Error, undefined, 2);
+ elem.style.display = "hidden";
+ msg.style.display = "";
+ }
+}
+
+function updateStatus() {
+window.fetch('/status')
+ .then(function(response){
+ return response.json();
+ }).then(function(json){
+ return setStatus(json);
+ });
+}
+
+document.addEventListener("DOMContentLoaded",function(){
+ setInterval(updateStatus, 750);
+});
diff --git a/cmd/web/static/style.css b/cmd/web/static/style.css
new file mode 100644
index 0000000..ba648e3
--- /dev/null
+++ b/cmd/web/static/style.css
@@ -0,0 +1,81 @@
+nav {
+ border-bottom: 3px solid #000;
+ padding-bottom: 10px;
+}
+a {
+ text-decoration: none;
+ color: #268bd2;
+}
+a:visited {
+ color: #d22653;
+}
+a:hover {
+ text-decoration: underline;
+}
+pre code {
+ line-height: 1.1;
+ overflow: auto;
+}
+
+code {
+ color: #9672d5;
+ font-size: .8em;
+ font-family: "Roboto Mono", "Monaco", "Lucida Console", "DejaVu Sans Mono",
+"monospace";
+}
+
+pre code {
+ color: #000;
+ background-color: #FFFFEA;
+ display: block;
+ padding: 10px;
+ border: 1px solid;
+}
+
+blockquote {
+ border-left: 4px solid #aaa;
+ padding-left: 1em;
+}
+
+body {
+ margin: 40px auto;
+ max-width: 80%;
+ line-height: 1.6;
+ font-size: 1em;
+ color: #444;
+ padding: 0 10px;
+ /* Added because some browsers don't default to white */
+ background-color: #fff;
+}
+
+img {
+ width: 100%;
+ height: auto;
+}
+
+h1,h2,h3 {
+ line-height: 1.2
+}
+
+@media screen and (min-width: 1200px) {
+ body {
+ max-width: 960px;
+ }
+}
+
+
+#status {
+ width: 100%;
+ background-color: #ddd;
+}
+
+.installBar {
+ width: 0%;
+ height: 30px;
+ /* background-color: #4CAF50; */
+ background-color: #268bd2;
+ text-align: center;
+ line-height: 30px;
+ color: white;
+}
+