Disable modal on small screens

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

diff --git a/js/10-modal.js b/js/10-modal.js
index 980bab79a987ae6001413765e665d6fb7390d69c..9bf83ce71f634aad3bfb124fcba63962edb6a782 100644 (file)
--- a/js/10-modal.js
+++ b/js/10-modal.js
@@ -1,7 +1,8 @@
-var modal, hiding;
+let modal, backdrop, hiding;
 
 function show_modal () {
        modal.classList.remove('hidden');
+       backdrop.classList.remove('hidden');
        setTimeout(function (){
                document.body.classList.add('modal-open');
        }, 20);
@@ -12,20 +13,21 @@ function hide_modal () {
 }
 
 $(function() {
+       if(window.innerWidth < 768)
+               return;
        modal = $('.modal')[0];
-       $(modal).on('transitionend', function (){
+       backdrop = $('.backdrop')[0];
+       $(modal).on('transitionend', el => {
                if(!document.body.classList.contains('modal-open'))
                        modal.classList.add('hidden');
        });
-       $('.backdrop,.modal').each(function(el){
-               document.body.appendChild(el);
-       });
-       $('#solution').on('click', function (e){
+       $('.backdrop,.modal').each(el => document.body.appendChild(el) );
+       $('#solution').on('click', e => {
                show_modal();
                e.preventDefault();
        });
        $('.backdrop').on('click', hide_modal);
-       window.onkeyup = function (event) {
+       window.onkeyup = event => {
                if (event.keyCode === 27)
                        hide_modal();
        }