Implementation of layer hide

Marc-Ducret · Jan 10, 2018 · e451c7b · e451c7b
1 parent 63eef5b
commit e451c7b
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 1 deletion.
diff --git a/src/client/ts/ui/layer.ts b/src/client/ts/ui/layer.ts
@@ -166,22 +166,29 @@ export class LayerInfo {
     public name: string;
     public blur: boolean;
     public shadow: boolean;
+    public show: boolean;
 
     constructor() {
         this.name = "Layer";
         this.blur = false;
         this.shadow = false;
+        this.show = true;
     }
 
     getFilter(): string {
-        if (this.blur || this.shadow) {
+        if (this.blur || this.shadow || !this.show) {
             let s = "";
             if (this.blur) {
                 s += "blur(5px) ";
             }
+
             if (this.shadow) {
                 s += "drop-shadow(5px 5px 5px #000000) ";
             }
+
+            if (!this.show) {
+                s += "opacity(0) ";
+            }
             return s;
         } else {
             return "none";
@@ -198,13 +205,15 @@ export class LayerInfo {
         this.name = layerInfo.name;
         this.blur = layerInfo.blur;
         this.shadow = layerInfo.shadow;
+        this.show = layerInfo.show;
     }
 
     data(): Object {
         return {
             name: this.name,
             blur: this.blur,
             shadow: this.shadow,
+            show: this.show,
         };
     }
 }
diff --git a/src/client/ts/ui/layermenu.ts b/src/client/ts/ui/layermenu.ts
@@ -148,6 +148,18 @@ export function setup_layer_menu(controller: UIController, base_element: HTMLEle
                     }
                 }, "Shadow");
 
+                addButton(layer.layerInfo.show ? "visibility" : "visibility_off", function (button) {
+                    if (button.get(0).textContent == "visibility") {
+                        let info = layer.layerInfo.clone();
+                        info.show = false;
+                        controller.project.updateLayerInfo(layer, info);
+                    } else {
+                        let info = layer.layerInfo.clone();
+                        info.show = true;
+                        controller.project.updateLayerInfo(layer, info);
+                    }
+                }, "Show");
+
                 if(i > 0) {
                     addButton("call_merge", async function (button) {
                         let content = layer.getHTMLElement().toDataURL();