empty panel, visual tweaks

ui/button.js

@@ -1,6 +1,7 @@
 class Button {
     constructor(image) {
         this.element = document.createElement("button");
+        this.element.add("shadow");
         this.element.style.backgroundImage = "url(images/" + image + ".svg)";
         this._boundClick = this._onClick.bind(this);
         this.element.addEventListener("click", this._boundClick, false);

ui/panel.js

@@ -0,0 +1,39 @@
+class Panel {
+    constructor(width, height) {
+        this._width = width;
+        this._height = height;
+        this._hidden = true;
+        this.element = document.createElement("div");
+        this.element.classList.add("shadow");
+        this.element.classList.add("hidden");
+    }
+
+    setPosition(x, y) {
+        this.element.style.position = "absolute";
+        this.element.style.top = y + "px";
+        this.element.style.left = x + "px";
+    }
+
+    toggle() {
+        if (this._hidden) {
+            this.show();
+        } else {
+            this.hide();
+        }
+    }
+    show() {
+        if (this._hidden) {
+            this.element.classList.remove("hidden");
+            this._hidden = false;
+        }
+    }
+    hide() {
+        if (!this._hidden) {
+            this.element.classList.add("hidden");
+            this._hidden = true;
+        }
+    }
+}
+
+
+export default Panel;