﻿       
(function($) {

    $.fn.casino = function(options) {


        
        // get all submenus and append to parent of main div
        $.each($("ul.mainNav li > ul"), function() {
            if($(this).hasClass("active")) {
                $(this).clone().appendTo("#navigation");
            } else {
                $(this).clone().hide().appendTo("#navigation");
            }
            $(this).remove();
        });
        
        // insert image to parent of selected category
        $.each($("ul.mainNav li a"), function() {
            if($(this).hasClass("active")) {
               // $(this).after("<img id='mainNavImg' src='Img/nav-item-dot.gif' alt='' style='margin-left:3px;vertical-align:-2px'>");
            }
        });


        // set onclick event for links
        $.each($("ul.mainNav li > a"), function(i, val) {  
            $(this).wrapInner("<span></span>");
            var self = $(this);
            $(this).click(function() {
                if($("#secNavToNav"+i).length > 0) {

                    // set class 'active' for clicked link 
                    $(this).attr("class", "active");                            // $(this).attr("class")+
                    $("#mainNavImg").remove();
                   // $(this).after("<img id='mainNavImg' src='Img/nav-item-dot.gif' alt='' style='margin-left:3px;vertical-align:-2px'>");
                    $(this).parent().siblings().children().attr("class", "");   // not 100% solution

                    // toggle submenu with animation
                    if($(".secNav.active").length > 0) {
                        var selfActive = $(".secNav.active");
                        $(selfActive).animate({marginLeft: '-=171px'/*, opacity: 0*/},1000);
                        
                        $("#pnlContent").fadeOut(1000, function(){
                            $(this).html("<div id=\"pnlContentLoading\"><img src=\"Img/icon-loading.gif\" alt=\"Loading...\"></div>").fadeIn(1000);
                            $(selfActive).css("marginLeft","75px")/*.css("opacity","100")*/.hide().attr("class", "secNav");
                            
                            $("#secNavToNav"+i).css("width","161px").css("marginLeft","246px")/*.css("opacity","0")*/.show().attr("class", "secNav active").animate({marginLeft: '-=171px'/*, opacity: 100*/},1000,'',function() {
                                // get html code
                                $.ajax({
                                  url: 'GetContentPane.aspx',
                                  data: 'CatID=' + $(self).getUrlParam("CatID") + '&paneID=1', 
                                  dataType: 'html',
                                  success: function (code) {
                                    $("#pnlContentLoading").fadeOut(1000, function() {
                                        $(this).empty();
                                        $("#pnlContent").hide().html(code).fadeIn(1000);
                                    });
                                    
                                  }
                                });
                            });

                        });
                    } else {
                        $("#pnlContent").fadeOut(1000, function(){
                            $(this).html("<div id=\"pnlContentLoading\"><img src=\"Img/icon-loading.gif\" alt=\"Loading...\"></div>").fadeIn(1000);
                            $("#secNavToNav"+i).css("width","161px").css("marginLeft","246px")/*.css("opacity","0")*/.show().attr("class", "secNav active").animate({marginLeft: '-=171px'/*, opacity: 100*/},1000,'',function() {
                                // get html code
                                $("#pnlContent").fadeOut(1000, function() {
                                    $.ajax({
                                      url: 'GetContentPane.aspx',
                                      data: 'CatID=' + $(self).getUrlParam("CatID") + '&paneID=1', 
                                      dataType: 'html',
                                      success: function (code) {
                                        $("#pnlContentLoading").fadeOut(1000, function() {
                                            $(this).empty();
                                            $("#pnlContent").hide().html(code).fadeIn(1000);
                                        });
                                                                                
                                      }
                                    });
                                });
                            });

                        });
                    }
                    return false;
                } else {
                    return true;
                }
            });
        });
    };
})(jQuery);