further components and bootstrap initial

rust/src_webpack/src/progress.ts

@@ -0,0 +1,62 @@
+import { Controller } from "./main";
+
+class ProgressInfo{
+    displayText:string;
+    percentValue:number;
+    indeterminate:boolean;
+    constructor(displayText:string, percentValue: number, indeterminate:boolean ){
+      this.displayText = displayText
+      this.percentValue = percentValue <0 ? 0 : percentValue > 100? 100: percentValue
+      this.indeterminate = indeterminate
+    }
+  }
+
+export class ProgressView{
+  progressPane: HTMLElement;
+  progress: HTMLElement;
+  progressPaneSpan: HTMLSpanElement;
+  progresses: Map<string,ProgressInfo> = new Map;
+  progressPaneBar: HTMLDivElement;
+  constructor(controller:Controller){
+    this.progressPane = document.getElementById("progressPane") as HTMLElement;
+    this.progress = document.getElementById("progress") as HTMLElement;
+    this.progressPaneSpan = document.getElementById("progressPaneSpan") as HTMLSpanElement;
+    this.progressPaneBar = document.getElementById("progressPaneBar") as HTMLDivElement;
+    
+  }
+
+  updateView() {
+    if (this.progresses.size == 0){
+      this.progressPane.style.display = "none"
+    } else{
+      const first = this.progresses.entries().next().value![1]
+      this.progressPaneBar.setAttribute("data-label", first.displayText)
+      if (first.indeterminate){
+        this.progressPaneSpan.className = "valueIndeterminate"
+        this.progressPaneSpan.style.width = "100%"
+
+      } else {
+        this.progressPaneSpan.className = "value"
+        this.progressPaneSpan.style.width = first.percentValue+"%"
+      }
+    }
+  }
+
+  addIndeterminate(id:string, displayText:string){
+    this.progresses.set(id, new ProgressInfo(displayText,0,true))
+    this.progressPane.style.display = "block"
+    this.updateView();
+ 
+  }
+  
+  addProgress(id:string, value:number, displayText:string) {
+    this.progresses.set(id, new ProgressInfo(displayText,value, false))
+    this.progressPane.style.display = "block"
+    this.updateView();
+  }
+  removeProgress(id:string){
+    this.progresses.delete(id)
+    this.updateView();
+
+  }
+}