/* global blocek_config, CKFinder, Sentry */

import cookies from 'js-cookie';

function openAdmin(e) {
   var url = $(this).attr('href');

   if (!url) {
      return false;
   }

   var $dialog = $('#wpjToolbar_dialog'),
      $iframe = false;

   $dialog.find('iframe').each(function() {
      if ($(this).attr('src') == url) {
         $iframe = $(this);
         $iframe.css('display', 'block');
      } else {
         $(this).css('display', 'none');
      }
   });

   if ($iframe === false) {
      $iframe = $('<iframe>');
      $iframe.attr('src', url);
      $('.wpjToolbar_dialog').append($iframe);

      $dialog
         .on('hide.bs.modal', function(e) {
            var refresh = !$iframe[0].contentWindow.document.intact;
            if (refresh) {
               window.location = window.location;
            }
         })
         .modal();
      /*title: $(this).data("title"),*/

      var first = true;
      $iframe.on('load', function() {
         if (first) {
            this.contentWindow.document.intact = true;
            first = false;
         }

         // prida classu rychupr pokud je pouzita rychla uprava
         $(this.contentWindow.document)
            .find('body')
            .addClass('rychupr');

         this.contentWindow.closeWindow = closeWindow;
      });
   } else {
      $dialog.modal('show');
   }

   return false;
}

function closeWindow() {
   $('#wpjToolbar_dialog').modal('hide');
}

function wpjSEODebug(on) {
   var alertInfo = '';

   alertInfo += '<span>SEO popis</span>' + $('meta[name="description"]').attr('content') + '<hr>';
   alertInfo += '<span>Titulek</span>' + $('title').text() + '<hr>';
   alertInfo += '<span>H1</span>' + $('h1').text() + '<hr>';
   if ($('link[rel="canonical"]').length) {
      alertInfo += '<span>Canonical URL</span>' + $('link[rel="canonical"]').attr('href') + '<hr>';
   }
   alertInfo += '<span>Meta robots</span>' + $('meta[name="robots"]').attr('content');

   if (on) {
      // boxik pro hlasky
      $('body').append('<div id="wpjSEODbgr"></div>');
      var dbgr = $('#wpjSEODbgr');
      dbgr.html(alertInfo);
   } else {
      $('#wpjSEODbgr').remove();
   }
}

window.wpjSEODebug = wpjSEODebug;

let currentComponentInfo = null, componentFreeze = false;

$('body').on('keydown', function(e) {
   if ((e.code === 'KeyC' || e.code === 'KeyK') && e.altKey) {
      $('[data-debug="Components"]').trigger('click');
   }
})

function wpjComponentsDebug(on) {
   if (on) {
      // boxik pro hlasky
      let $body = $('body');
      $body.append('<div id="wpjSEODbgr"></div>');
      const $dbgr = $('#wpjSEODbgr');

      $body.on('keydown.toolbar', function(e) {
         if (!currentComponentInfo) {
            return;
         }

         if (e.code === 'KeyF') {
            componentFreeze = !componentFreeze;
         }

         if (e.code === 'KeyT') {
            window.location.replace(currentComponentInfo.template_file);
         }

         if (e.code === 'KeyP' || e.code === 'KeyC') {
            window.location.replace(currentComponentInfo.class_file);
         }
      })

      $body.addClass('wpj-debug-components').on('mousemove.toolbar keydown.toolbar', function(event) {
         let info = currentComponentInfo;
         if (!componentFreeze && event.type === 'mousemove') {
            currentComponentInfo = info = $(event.target).closest('[data-component-info]').data('component-info');
         }
         var alertInfo = '';
         if (info) {
            alertInfo += `
                <span>Name - Class</span>${info.name} - ${info.class}<hr>
                <span>Template</span>${info.template}<hr>
                <span>Entrypoints</span>${info.entrypoints.join(', ')}<hr>
                <span>Versions</span>Current: ${info.shop.version} (twig: ${info.shop.template}, ts: ${info.shop.js}, scss: ${info.shop.css}), Latest: ${info.latest_version}<hr>
                <span>Props</span>${info.props}<hr>
                <span>Attributes</span>${info.attributes}<hr>
                <span>HotKeys</span> (F)reeze: ${componentFreeze?'1':'0'}, open (C)lass, open (T)emplate
            `;
         }
         $dbgr.html(alertInfo);
      })
   } else {
      $('#wpjSEODbgr').remove();
      $('body').removeClass('wpj-debug-components').off('mousemove.toolbar').off('keydown.toolbar');
   }
}

window.wpjComponentsDebug = wpjComponentsDebug;

window.wpjSymfonyToolbarDebug = function(on) {
   // pass
}

window.blocekHandler = {
   enabled: false,
   loadedCount: 0,
   scriptCount: 0,
   $button: null,
   timer: null,
   init: function() {
      this.$button = $('#blocekEdit');
      if (this.contentIsEditable()) {
         this.$button.show();
         var me = this;
         this.$button.find('a').on('click', function() {
            if (!$(this).hasClass('loading') && !$(this).hasClass('error')) {
               me.enable();
            }
            return false;
         });
      }
   },

   contentIsEditable: function() {
      return $('[data-blocek-editable]').length;
   },

   enable: function() {
      if (!this.enabled) {
         this.$button.find('a').addClass('loading');
         this.startTimeOut();
         jQuery.cachedScript = function(url, success, watchLoad = false) {
            if (watchLoad) {
               window.blocekHandler.handlePreLoad();
            }
            var options = {
               dataType: 'script',
               cache: true,
               url: url,
               success: function() {
                  if (typeof success === 'function') {
                     success();
                  }
                  if (watchLoad) {
                     window.blocekHandler.handleLoading(url);
                  }
               },
               error: function(err) {
                  if (watchLoad) {
                     window.blocekHandler.handleError(err);
                  }
               }
            };

            return jQuery.ajax(options);
         };

         $('head').append(
            '<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap&subset=latin-ext" rel="stylesheet">'
         );

         $.cachedScript('/common/static/wpj/wpj.blocek.js?1' + blocek_config.version, function() {
            fetch("/_blocek/settings/").then(r => r.json()).then(response => {
               wpj.blocek.config = { ...wpj.blocek.config, ...response.data };
               wpj.blocek.config = { ...wpj.blocek.config, ...blocek_config };
               $.cachedScript(blocek_config.bundleUrl ? blocek_config.bundleUrl : '/web/blocek/bundle' + blocek_config.version + '.js', undefined, true);
            });
         }, true);

         $.cachedScript('/web/bundles/cksourceckfinder/ckfinder/ckfinder.js', function() {
            CKFinder.config({ connectorPath: '/ckfinder/connector' });
            CKFinder.basePath = '/web/bundles/cksourceckfinder/ckfinder/';
         }, true);
         // Set CKEditor4 base path
         window.CKEDITOR_BASEPATH = '/ckeditor/';
         $.cachedScript('/ckeditor/ckeditor.js', undefined, true);
         $.cachedScript(
            'https://maps.googleapis.com/maps/api/js?key=AIzaSyATr7a_ArAMgvJKPQp62dsYkyrWfTvQypc&libraries=places&language=cs&location=49.743755,15.338649&radius=333000'
         );
      } else if (this.enabled) {
         this.handleStartEdit();
      }
   },
   startTimeOut: function() {
      this.timer = setTimeout(function() {
         window.blocekHandler.handleError(new Error('Blocek loading has timed-out'));
      }, 30000);
   },
   stopTimeOut: function() {
      if (this.timer !== null) {
         clearTimeout(this.timer);
      }
   },
   handlePreLoad: function() {
      this.scriptCount = this.scriptCount + 1;
   },
   handleLoading: function(url = null, error = false) {
      this.loadedCount = this.loadedCount + 1;
      var percent = (this.loadedCount * 100) / this.scriptCount;
      this.$button.find('.wpjtoolbar-progress').width(`${percent}%`);
   },
   handleBlocekLoaded: function() {
      this.enabled = true;
      this.handleStartEdit();
      this.stopTimeOut();
      this.$button.find('a').removeClass('loading');
   },
   handleStartEdit: function() {
      try {
          wpj.blocek.startEdit();
          this.stopTimeOut();
      } catch (e) {
         this.handleError(e);
      }
   },
   handleError: function(error) {
      this.enabled = false;
      this.$button.find('a').addClass('error');
      this.$button.find('a').removeClass('loading');
      Sentry.captureException(error);

      if (!$('.wpjtoolbar-error').length) {
         const $errorMessage = `<div class="wpjtoolbar-error"><p>Jejda, něco se nepovedlo. Zkuste stránku načíst znovu.</p></div>`;
         $('body').append($errorMessage);
      }
   }
};

$(document).ready(function() {
   var $wpjToolbar = $('#wpj-header');
   var $toolbarToggler = $('[data-wpjtoolbar-toggler]');

   $('body').on('touchstart', function() {
      $('#blocekEdit').hide();
   });

   $toolbarToggler.click(function() {
      $wpjToolbar.toggleClass('wpjtoolbar-hidden');
      var opened = $wpjToolbar.hasClass('wpjtoolbar-hidden');
      cookies.set('adminToolbarHidden', opened ? 1 : 0, { path: '/', expires: 30 });
   });

   if (cookies.get('adminToolbarHidden') === '1') {
      $wpjToolbar.toggleClass('wpjtoolbar-hidden', true);
   }

   $wpjToolbar.show();

   $('[data-edit_button]').click(openAdmin);

   function initDebug(debugType) {
      if (cookies.get(debugType) === '1') {
         $('[name=' + debugType + ']').prop('checked', 'checked');
         window[debugType](true);
      }
   }

   initDebug('wpjSEODebug');

   initDebug('wpjSymfonyToolbarDebug');

   $('[data-debug]').change(function() {
      var debugType = 'wpj' + $(this).data('debug') + 'Debug';
      var checked = $(this).prop('checked');
      cookies.set(debugType, checked ? 1 : 0, { path: '/', expires: 30 });
      window[debugType](checked);
   });

   window.blocekHandler.init();

   if (window.location.href.includes('inlineEditable=1')) {
      window.blocekHandler.enable();
      // remove "inlineEditable" from url
      var params = new URLSearchParams(window.location.search);
      params.delete('inlineEditable');
      if (window.history.replaceState) {
         window.history.replaceState(Object.fromEntries(params.entries()), null, '?' + params.toString());
      }
   }

   if (window.location.hash.includes('#noedit')) {
      $('#wpj-header').hide();
   }

   $("[data-wpjClearCache]").click(function () {
      cookies.set('skip_cache', 1, { path: '/', expires: 1 });
      location.reload();
   });
});