export default class Monitor {

  constructor() {
    this.HTMLObject = this.createWrapper();
    this.outputs = [];
  }

  out(t, v) {
    t = t-1;
    if (!this.outputs[t]) {
      console.warn("Monitor > no output #" + t);
      return false;
    }
    this.outputs[t].innerHTML = v;
  }

  newOutput(title) {
    let e = this.createOutput(title);
    let v = e.getElementsByTagName("SPAN")[0];
    this.outputs.push(v);
    this.HTMLObject.appendChild(e);
    return this.outputs.length;
  }

  createWrapper() {
    let e = document.createElement("DIV");
    e.setAttribute("id", "monitorWrapper");
    document.getElementsByTagName("body")[0].appendChild(e);
    return e;
  }

  createOutput(title) {
    title = this.sanitize(title);

    let e = document.createElement("DIV");
    e.setAttribute("class", "monitor");
    e.setAttribute("id", title);

    let head = document.createElement("H3");
    head.innerHTML = title;
    e.appendChild(head);

    let val = document.createElement("SPAN");
    val.innerHTML = "---";
    e.appendChild(val);

    return e;
  }

  sanitize(s) {
   return s.replace(/\W/g, '');
  }

}

@@ -110,10 +110,10 @@
 s = 
-%5B%5D
+%7B%7D
 ;%0A  
@@ -133,21 +133,8 @@
 ) %7B%0A
-    t = t-1;%0A
     
@@ -201,14 +201,19 @@
 put 
-#
+'
 %22 + t
+ +%22'%22
 );%0A 
@@ -294,24 +294,58 @@
 ut(title) %7B%0A
+    title = this.sanitize(title);%0A
     let e = 
@@ -437,16 +437,19 @@
 puts
-.push(v)
+%5Btitle%5D = v
 ;%0A  
@@ -493,16 +493,28 @@
  return 
+Object.keys(
 this.out
@@ -517,16 +517,17 @@
 .outputs
+)
 .length;
@@ -715,24 +715,24 @@
 urn e;%0A  %7D%0A%0A
+
   createOutp
@@ -747,43 +747,8 @@
 ) %7B%0A
-    title = this.sanitize(title);%0A%0A
     

Monitor now holds outputs as an object (keys) instead of using an array