Add minimize() method to views

Change-Id: I2d55d0459374b678b5a4417701c9db9b57af8242
diff --git a/Changes b/Changes
index 648cc45..bd74833 100755
--- a/Changes
+++ b/Changes
@@ -20,6 +20,7 @@
         - Introduced *-latest.css/*-latest.js files for plugin
           assets.
         - Add associates() method to state objects.
+        - Add minimize() method to views.
 
         WARNING: If you relied on the former default API endpoint
           being http://localhost:9999/, this will break your
diff --git a/dev/js/spec/panelSpec.js b/dev/js/spec/panelSpec.js
index d0a9349..007b43c 100644
--- a/dev/js/spec/panelSpec.js
+++ b/dev/js/spec/panelSpec.js
@@ -64,6 +64,14 @@
       expect(btn.classList.contains("button-group")).toBeTruthy();
       expect(btn.classList.contains("versuch")).toBeTruthy();
     });
+
+    it('should be minimizable', function () {
+      var view = viewClass.create(['versuch']);
+      var e = view.element();
+      expect(e.classList.contains('show')).toBeTruthy();
+      view.minimize();
+      expect(e.classList.contains('show')).toBeFalsy();
+    });
   });
   
   describe('KorAP.Panel', function () {
diff --git a/dev/js/spec/pluginSpec.js b/dev/js/spec/pluginSpec.js
index c0d741d..cabeae9 100644
--- a/dev/js/spec/pluginSpec.js
+++ b/dev/js/spec/pluginSpec.js
@@ -201,6 +201,14 @@
       widget.resize({ height : 9 });
       expect(iframe.style.height).toEqual('9px');
     });
+
+    it('should be minimizable', function () {
+      var widget = widgetClass.create("Test", "https://example", 56);
+      var we = widget.element();
+      expect(we.classList.contains('show')).toBeTruthy();
+      widget.minimize();
+      expect(we.classList.contains('show')).toBeFalsy();
+    });
   });
 
   describe('KorAP.Plugin.Service', function () {
diff --git a/dev/js/src/plugin/widget.js b/dev/js/src/plugin/widget.js
index 707f5f0..25bc6cc 100644
--- a/dev/js/src/plugin/widget.js
+++ b/dev/js/src/plugin/widget.js
@@ -31,10 +31,14 @@
      */
     show : function () {
 
-      if (this._load)
+      if (this._load) {
+        if (this._element)
+          this._element.classList.add('show');
         return this._load;
+      }
 
       let obj = this.load();
+      this._load.classList.add("widget", "show");
       obj.setAttribute('loading', 'lazy');
 
       // Per default there should at least be a button
diff --git a/dev/js/src/view.js b/dev/js/src/view.js
index 7243837..27d1ab2 100644
--- a/dev/js/src/view.js
+++ b/dev/js/src/view.js
@@ -36,19 +36,20 @@
       return this;
     },
 
-    
     /**
      * Element of the view
      */
     element : function () {
-      if (this._element)
+      if (this._element) {
+        this._element.classList.add('show');
         return this._element;
+      };
 
       // Create panel element
       var e = document.createElement('div');
 
       var cl = e.classList;
-      cl.add('view');
+      cl.add('view', 'show');
       if (this._classes)
         cl.add.apply(cl, this._classes);
 
@@ -67,6 +68,7 @@
       e.appendChild(this.actions.element());
 
       this._element = e;
+
       return e;
     },
 
@@ -78,6 +80,16 @@
       return this._shown;
     },
 
+    
+    /**
+     * Hide the widget if shown.
+     */
+    minimize : function () {
+      if (this._element) {
+        this._element.classList.remove("show");
+      }
+    },
+
     // onClose : function () {},
 
     /**
diff --git a/dev/scss/main/panel.scss b/dev/scss/main/panel.scss
index adddf71..209e972 100644
--- a/dev/scss/main/panel.scss
+++ b/dev/scss/main/panel.scss
@@ -16,3 +16,7 @@
   display:     block;
   width:       100%;
 }
+
+div.view:not(.show) {
+  display: none;
+}
\ No newline at end of file