;(function ( $, window, document, undefined ) {
  'use strict';

  // ======================================================
  if ( !$.PXLRTHEME ) {
    $.PXLRTHEME = {};
  }
  // ======================================================


  // ======================================================
  // PXLRTHEME MEGA MENU
  // ======================================================
  $.PXLRTHEME.megamenu = function( el ){
    var base  = this;

    // Access to jQuery and DOM versions of element
    base.$el  = $(el);
    base.el   = el;

    // Add a reverse reference to the DOM object
    base.$el.data( "PXLRTHEME.megamenu" , base );

    base.init = function () {

      var _timeout  = 0,
          _menu     = base.$el;

      _menu.on('click', '.is-mega', function(){
        base.flush( $(this) );
        base.depends( _menu );
      });

      _menu.on( 'mouseup', '.menu-item-bar', function(){
        clearTimeout( _timeout );
        _timeout = setTimeout( function(){ base.depends(); }, 50 );
      });

      _menu.on('change', '.is-width', function(){
        var _this       = $(this),
            _container  = _this.closest('.rox-mega-menu');

        if( _this.val() == 'custom' || _this.val() == 'natural' ) {
          _container.find('.mega-depend-position').removeClass('hidden');
        } else {
          _container.find('.mega-depend-position').addClass('hidden');
        }

        if( _this.val() == 'custom' ) {
          _container.find('.mega-depend-width').removeClass('hidden');
        } else {
          _container.find('.mega-depend-width').addClass('hidden');
        }
      });

      $('.is-width').trigger('change');

      base.depends();
    };

    base.depends = function(){

      var _menu = base.$el;

      _menu.find('.is-mega').each(function (){
        base.flush( $(this) );
      });

      // clear all mega columns
      $('li', _menu).removeClass('active-mega-column').removeClass('active-sub-mega-column');

      // add columns for mega menu
      var nextDepth = $('.active-mega-menu', _menu).nextUntil('.menu-item-depth-0', 'li');
      nextDepth.closest('li.menu-item-depth-1').addClass('active-mega-column');
      nextDepth.closest('li:not(.menu-item-depth-1)').addClass('active-sub-mega-column');
    };

    base.flush = function( _el ){
      if( _el.is(':checked') ){
        _el.closest('li').addClass('active-mega-menu');
        _el.closest('li').find('.field-mega-width').removeClass('hidden');
      }else{
        _el.closest('li').find('.field-mega-width').addClass('hidden');
        _el.closest('li').removeClass('active-mega-menu');
      }
    };

    // Run initializer
    base.init();
  };
  $.fn.PXLRTHEME_megamenu = function () {
    return this.each(function () {
      new $.PXLRTHEME.megamenu( this );
    });
  };
  // ======================================================



  // ======================================================
  // PXLRTHEME ICON SELECTOR
  // ======================================================
  $.fn.PXLRTHEME_icon = function() {
    var _iconDialog   = $('#icon-dialog'),
        _iconOverlay  = $('#icon-overlay'),
        _iconInsert   = _iconDialog.find('#icon-insert'),
        _iconLoad     = _iconDialog.find('#icon-load'),
        _iconSearch   = _iconDialog.find('#icon-search'),
        _iconSelected = false,
        _iconsLoaded  = false,
        _iconRemove,
        _iconParent,
        _iconValue,
        _iconDialogHeight,
        _iconPreview;

    $(document.body).on('click', '.icon-add', function( e ){

      e.preventDefault();

      // set vars
      _iconDialogHeight = ( $(window).height() <= 700 ) ? 500 : 700;
      _iconParent       = $(this).parent();
      _iconPreview      = _iconParent.find('.icon-preview');
      _iconRemove       = _iconParent.find('.icon-remove');
      _iconValue        = _iconParent.find('.icon-value');

      _iconDialog.dialog({
        dialogClass: 'wp-dialog rox-icon-dialog',
        width: 1000,
        height: _iconDialogHeight,
        closeOnEscape: true,
        create: function(){
          $('.ui-dialog-titlebar-close').addClass('ui-button');
        },
        open: function() {
          _iconLoad.height( parseInt( _iconDialogHeight - 210 ) );
          _iconOverlay.show();
        },
        close: function() {
          _iconOverlay.hide();
        },
        resize: function( event, ui ) {
          _iconLoad.height( parseInt( ui.size.height - 210 ) );
        }
      });

      if( _iconsLoaded === false ){

        $.ajax({
          type  : 'POST',
          url   : ajaxurl,
          data  : { action: 'rox-icons' },
          success : function( data ) {

            _iconLoad.html( data );
            _iconLoad.find('a').each( function(){
              var _this = $(this),
                  _data = _this.data('ro-icon');

              _this.click( function( e ){
                e.preventDefault();
                if( _this.is('.active-icon') ){
                  _this.removeClass('active-icon');
                  _iconSelected = false;
                }else{
                  _this.addClass('active-icon').siblings().removeClass('active-icon');
                  _iconSelected = _data;
                }

              });
            });
            _iconsLoaded = true;

          }
        });

      }


      _iconSearch.keyup( function(){
        var input = $(this),
            val   = input.val(),
            list  = _iconLoad.find('a');

        list.each(function() {
          var _this = $(this);

          if ( _this.data('ro-icon').search( new RegExp(val, "i") ) < 0 ) {
            _this.hide();
          } else {
            _this.show();
          }

        });
      });


      _iconInsert.click( function( e ) {
        e.preventDefault();
        if ( _iconSelected !== false ){

          // preview
          _iconPreview.removeClass('hidden');
          _iconPreview.find('span').removeAttr('class').addClass( _iconSelected.substr( 0,2 ) + ' ' + _iconSelected );

          // value
          _iconValue.val( _iconSelected ).trigger('keyup');

          // remove icon class
          _iconRemove.removeClass('hidden');

          // close dialog
          _iconDialog.dialog( 'close' );
        }
      });



    });

    // clear
    $(document.body).on('click', '.icon-remove', function(e){
      e.preventDefault();
      var _remove = $(this),
          _parent = _remove.parent();

      _parent.find('.icon-preview').addClass('hidden');
      _parent.find('.icon-value').val('');
      _remove.addClass('hidden');
    });

    _iconOverlay.click( function( e ) {
      e.preventDefault();
      _iconOverlay.hide();
      _iconDialog.dialog( 'close' );
    });

  };
  // ======================================================

  // ======================================================
  
  $(document).ready( function(){
    $('#menu-to-edit').PXLRTHEME_megamenu();
    $('.rox-icon-select').PXLRTHEME_icon();
  });

})( jQuery, window, document );