Make JS a bit simpler

[plack-app-gruntmaster.git] / js / 10-modal.js

diff --git a/js/10-modal.js b/js/10-modal.js
index 30da26750d149e2fcb210fcab835605cb53c4861..d930f44ef0b6b3f956f0076b8055295c8f73de1e 100644 (file)
--- a/js/10-modal.js
+++ b/js/10-modal.js
@@ -1,30 +1,34 @@
-;(function(){
-       'use strict';
+let modal, backdrop, hiding;
 
-       function show_modal () {
-               $('.modal').removeClass('hidden');
-               setTimeout(function (){
-                       $('body').addClass('modal-open');
-               }, 20);
-       }
+function show_modal () {
+       modal.classList.remove('hidden');
+       backdrop.classList.remove('hidden');
+       setTimeout(function (){
+               document.body.classList.add('modal-open');
+       }, 20);
+}
 
-       function hide_modal () {
-               $('body').removeClass('modal-open');
-               $('.modal').one('transitionend', function (){
-                       $('.modal').addClass('hidden');
-               });
-       }
+function hide_modal () {
+       document.body.classList.remove('modal-open');
+}
 
-       $( document ).ready(function() {
-               $('.backdrop,.modal').detach().appendTo('body');
-               $('#solution').on('click', function (e){
+$(function() {
+       modal = q('.modal');
+       backdrop = q('.backdrop');
+       $(modal).on('transitionend', el => {
+               if(!document.body.classList.contains('modal-open'))
+                       modal.classList.add('hidden');
+       });
+       $('.backdrop,.modal').each(el => document.body.appendChild(el) );
+       $('#solution').on('click', e => {
+               if(window.matchMedia("(min-width: 768px)").matches){
                        show_modal();
                        e.preventDefault();
-               });
-               $('.backdrop').on('click', hide_modal);
-               window.onkeyup = function (event) {
-                       if (event.keyCode === 27)
-                               hide_modal();
                }
        });
-})();
+       $('.backdrop').on('click', hide_modal);
+       window.onkeyup = event => {
+               if (event.keyCode === 27)
+                       hide_modal();
+       }
+});