/**
 * File menu.js.
 * Theme Backend script.
 */

(function($) {
    
    // $(document).ready(function() {
    $(function() {
        filepicker.init();
        menuicons.init();
        menustyle.init();
        templatemenu.init();
        wpNavMenu.menusChanged = false;
        console.log("Menu Scripts: loaded");
    } );

} )(jQuery);

//
// menü icons
var menuicons = new function() {

    this.init = function() {
        menuicons.initIcons();
        $(document).on('menu-item-added', menuicons.initIcons);
    }

    this.initIcons = function() {
        $('.iconselect').fontIconPicker({
            hasSearch: true,
            iconsPerPage: 400,
            theme: 'fip-grey',
        });
    }

}

//
// menü button style
var menustyle = new function() {

    this.init = function() {
        // add events
        $(document).on('change', '.menu_style .menu_style_option', function() { menustyle.selectMenuStyle(this) });
        $(document).on('change', '.menu_style .menu_size_option', function() { menustyle.selectMenuSize(this) });
    }

    this.selectMenuStyle = function(el) {
        var wrapper = $(el).closest('.menu_style');
        var value = $(el).val();
        if (value == '') $(wrapper).find('.menu_size_option').hide(); 
        else $(wrapper).find('.menu_size_option').show(); 
        menustyle.calculateValue(el);
    }
    this.selectMenuSize = function(el) {
        menustyle.calculateValue(el);
    }
    this.calculateValue = function(el) {
        var wrapper = $(el).closest('.menu_style');
        var style = $(wrapper).find('.menu_style_option').val();
        var size = $(wrapper).find('.menu_size_option').val();
        var value = style;
        if (size != "") value = style+"|"+size;
        $(wrapper).find('.menu_style_value').val(value);
    }
}

//
// menü template dropdown
var templatemenu = new function() {

    this.init = function() {
        // add events
        $(document).on('change', '.template_menu .template_enable', function() { templatemenu.toggle(this) });
        $(document).on('change', '.template_menu .template_select', function() { templatemenu.selectTemplate(this) });
        $(document).on('change', '.template_menu .template_width', function() { templatemenu.selectWidth(this) });
        $(document).on('input change', '.template_menu .template_width_custom', function() { templatemenu.calculateValue(this) });
    }

    this.selectTemplate = function(el) {
        var value = $(el).val();
        if (value == '') {
            $(el).closest('.template_menu').find('.template_width_wrap').hide();
            $(el).closest('.template_menu').find('.template_width_custom_wrap').hide();
        }
        else {
            $(el).closest('.template_menu').find('.template_width_wrap').show();
            templatemenu.selectWidth($(el).closest('.template_menu').find('.template_width'));
        }
        templatemenu.calculateValue(el);
    }
    this.selectWidth = function(el) {
        var value = $(el).val();
        if (value == 'custom') $(el).closest('.template_menu').find('.template_width_custom_wrap').show();
        else $(el).closest('.template_menu').find('.template_width_custom_wrap').hide();
        templatemenu.calculateValue(el);
    }
    this.toggle = function(el) {
        var checked =  $(el).prop('checked');
        var wrapper = $(el).parent().next();
        if (checked) {
            templatemenu.calculateValue(el);
            wrapper.stop(true,true).slideDown(400,function(){
                console.log(wrapper);
                wrapper.css('display', 'block');
            });
        }
        else {
            $(el).parent().prev().val('');
            wrapper.stop(true,true).slideUp();
        }
    }
    this.calculateValue = function(el) {
        var wrapper = $(el).closest('.template_menu');
        var slug = $(wrapper).find('.template_select').val();
        var width = $(wrapper).find('.template_width').val();
        var custom_width = $(wrapper).find('.template_width_custom').val();
        $(wrapper).find('.template_value').val(slug+"|"+width+"|"+custom_width);
    }
}
 
