Add final touches

src/page/image-viewer/image-viewer.html.ts

@@ -1,4 +1,4 @@
-import { html } from '../../model/misc';
+import { html } from '../../framework/model/misc';
 import cancel from '../../static/icons/cancel.svg';
 
 import './image-viewer.scss';
@@ -6,6 +6,6 @@ import './image-viewer.scss';
 export const generate = (): html => `
     <section id="image-viewer">
         <div id="container"></div>
-        <img id="cancel" src="${cancel}" alt="cancel"/>
+        <img tabindex="0" id="cancel" src="${cancel}" alt="cancel"/>
     </section>
 `;

src/page/image-viewer/image-viewer.scss

@@ -1,8 +1,7 @@
-@import '../../style/vars';
-@import '../../style/mixins';
+@use '../../style/include' as *;
 
 @include responsive() using ($vars) {
-  #image-viewer {
+  section#image-viewer {
     @include center-children();
     display: none;
     position: fixed;

src/page/image-viewer/image-viewer.ts

@@ -1,7 +1,7 @@
 import { PageElement } from '../../framework/page-element';
 
 import { generate } from './image-viewer.html';
-import { PageEvent, PageEventType } from '../../framework/page-event';
+import { PageEvent, PageEventType } from '../../framework/events/page-event';
 import { createElement } from '../../framework/helper/create-element';
 
 export class PageImageViewer extends PageElement {
@@ -11,24 +11,19 @@ export class PageImageViewer extends PageElement {
   }
 
   protected handleEvent(event: PageEvent, parent: PageElement) {
-    if (event.type !== PageEventType.onLoad) {
-      return;
-    }
+    if (event.type === PageEventType.onLoad) {
+      document.body.addEventListener('keydown', this.handleKeydown.bind(this));
 
-    document.body.addEventListener('keydown', this.handleKeydown.bind(this));
-
-    const media = Array.prototype.slice.call(
-      parent.element.querySelectorAll('img, video')
-    );
-
-    media
-      .filter(
-        (e: HTMLElement) =>
-          e.parentElement !== this.element && !e.classList.contains('no-open')
-      )
-      .forEach(
-        (e: HTMLImageElement) => (e.onclick = this.handleClick.bind(this))
+      const media = Array.prototype.slice.call(
+        parent.element.querySelectorAll('img')
       );
+
+      media
+        .filter((e: HTMLElement) => e.parentElement !== this.element)
+        .forEach(
+          (e: HTMLImageElement) => (e.onclick = this.handleClick.bind(this))
+        );
+    }
   }
 
   private handleClick(event: Event) {