Added animation for slide show. (#381)

* Added animation for slide show.

frontend/src/component/photo/viewer.vue

@@ -116,6 +116,9 @@
                 if (this.interval) {
                     clearInterval(this.interval);
                     this.interval = false;
+                    
+                    const psp = this.$viewer.gallery;
+                    psp.framework.removeClass(psp.container, "slide_show");
                 }
             },
             onSlideshow() {
@@ -129,6 +132,8 @@
 
                 psp.next();
 
+                psp.framework.addClass(psp.container, "slide_show");
+
                 self.interval = setInterval(() => {
                     if (psp && typeof psp.next === "function") {
                         psp.next();

frontend/src/css/viewer.css

@@ -54,3 +54,20 @@
     -webkit-box-shadow: none;
     box-shadow: none;
 }
+
+@keyframes fadeInOut {
+    0% {
+        opacity:0;
+    }
+    30% {
+        opacity:1;
+    }
+}
+  
+.slide_show {
+    animation-name: fadeInOut;
+    animation-timing-function: ease-in-out;
+    animation-iteration-count: infinite;
+    animation-duration: 2s;
+    animation-direction: alternate;
+}