function toggleChildMenuItemsOf(parentListItemCount)
{
    var items = $(".childMenuItemOf"+ parentListItemCount);
    if(items.length > 0 && items.first().hasClass("childMenuHidden"))
    {
        items.removeClass("childMenuHidden");
        items.addClass("childMenuShow");
    }
    else
    {
        items.removeClass("childMenuShow");
        items.addClass("childMenuHidden");
    }
}
                
                
function onReady(){
    
    return function(){
		    if($("#homeSlider").length > 0)
		    {
		        $(".slides").slick(
            				{
            					autoplay:true, 
            					pauseOnHover:false,
            					autoplaySpeed:7500,
            					dots:false
            				}
            	);
		    }
		    else
		    {
		        $(".slides").slick(
            				{
            					autoplay:true, 
            					pauseOnHover:false,
            					autoplaySpeed:7500,
            					dots:true
            				}
            	);
		    }
		    
		    $('video').bind('contextmenu', function() { return false; });
		    
		    $('.CollapseText').each(function(index){
		        var id = 1 + Math.floor(Math.random() * 100000);
		        var h2Text = $(this).find('.expander2HeaderText').first().html();
		        
		        var firstImg = $(this).find('.expanderHeaderImage').first();
		        firstImg.wrap('<div></div>');
		        var imgHead = firstImg.parent().html();
		        firstImg.unwrap();
		        
		        $(this).find('.expander2HeaderText').remove();
		        $(this).find('.expanderHeaderImage').remove();
		        $(this).wrap('<div class="expandSet1"></div>');
		        $(this).parent().prepend('<button type="button" class="btn btn-info expander" data-toggle="collapse" data-target="#'+id+'"><div clas="imgHead">'+ imgHead +'</div><div class="h2Text">'+ h2Text +'</div></button>');
		        $(this).wrap('<div id="'+ id +'" class="collapse"><div class="CollapseTextContainer"></div></div>');
		    });
		    
		    $('.CollapseText2').each(function(index){
		        var id = 1 + Math.floor(Math.random() * 100000);
		        $(this).wrap('<div class="expandSet1"></div>');
		        $(this).parent().prepend('<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#'+id+'"><strong><span><i class="fa fa-arrow-circle-right" style="font-family: FontAwesome;"></i></span>&nbsp;更多資料</strong></button>');
		        $(this).wrap('<div id="'+ id +'" class="collapse"><div class="CollapseTextContainer2"></div></div>');
		    });
		    
            $('.image-popup-fit-width').each(function( index ) {
    		         var url = $(this).find('img').first().attr('src');
    		         var indexUrl = url.indexOf('?');
    		         var classes = $(this).attr('class');
    		         
    		         var imgStr;
    		         if(indexUrl == -1)
    		         {
    		             imgStr = url;
    		         }
    		         else
    		         {
    		             imgStr = url.substring(0, indexUrl);
    		         }
    		         
    		         var innerHtml = $(this).html();
    		         
    		         var newA = $('<a data-popup-open="popup-1" href="'+imgStr+'" class="btn '+ classes +'">'+innerHtml+'</a>');
    		         $(this).replaceWith(newA);
    		         
    		         //newA.wrap('<div></div>');
                     
                     //$(this).attr('', '');
                     
                     newA.append('<div class="after"><i class="fa">&#xf00e;<i></div>');
                     
                     //var img = newA.find('img').first(); // Get my img elem
                     
                    //----- OPEN
                     newA.click(function(e) {
                         //alert($(this).parent().html());
                         
                         $('.popup-inner').html('<h2 style="color:#000 !important;"></h2><img src="' + imgStr + '" /><p><a data-popup-close="popup-1" href="#">Close</a></p><a class="popup-close" data-popup-close="popup-1" href="#">x</a>');
                
                          var targeted_popup_class = $(this).attr('data-popup-open');
                          $('[data-popup="' + targeted_popup_class + '"]').fadeIn(350);
                         
                          e.preventDefault();
                          return false;
                     });
            });
            
            
            
            //----- CLOSE
            $('[data-popup-close]').on('click', function(e)  {
                            var targeted_popup_class = jQuery(this).attr('data-popup-close');
                            $('[data-popup="' + targeted_popup_class + '"]').fadeOut(350);
                     
                            e.preventDefault();
            });
		    $('.popup').on('click', function(e)  {
                            var targeted_popup_class = $('[data-popup-close]').attr('data-popup-close');
                            $('[data-popup="' + targeted_popup_class + '"]').fadeOut(350);
                     
                            e.preventDefault();
            });
            
            youtubeVids();
            
    };  
}



  function youtubeVids() {
        var v = document.getElementsByClassName("youtube-player");
        for (var n = 0; n < v.length; n++) {
            var p = document.createElement("div");
            p.innerHTML = ytThumb(v[n].dataset.id); //id is youtube List url eg. https://www.youtube.com/watch?v=7tCTdLwJs7M&list=PLuem1zwxwvOF_T4HlG-roZR2yPL3GKwwo&index=4
            v[n].appendChild(p);
            //p.onclick = 
            $(p).on('click', function (e) {
                ytIframe(this.parentNode.dataset.id, this, this.parentNode);
            });
        }
    }
     
    function ytThumb(id) {
        //console.log("id "+ id);
        return '<div class="play-button"></div>';
    }
     
    function ytIframe(id, p, vn) {
        //console.log(''+id+', '+p+', '+vn);
        var iframe = document.createElement("iframe");
        if(id && id!=="")
        {
            iframe.setAttribute("src", id+'');
        }
        else
        {
            iframe.setAttribute("src", "https://www.youtube.com/embed?listType=playlist&list=PLuem1zwxwvOF_T4HlG-roZR2yPL3GKwwo");
        }
        
        iframe.setAttribute("frameborder", "0");
        iframe.setAttribute("id", "youtube-iframe");
        
        iframe.setAttribute("allowfullscreen", "allowfullscreen");
        iframe.setAttribute("mozallowfullscreen", "mozallowfullscreen");
        iframe.setAttribute("msallowfullscreen", "msallowfullscreen");
        iframe.setAttribute("oallowfullscreen", "oallowfullscreen");
        iframe.setAttribute("webkitallowfullscreen", "webkitallowfullscreen");

        vn.replaceChild(iframe, p);
    }


    function tabClicked(tab, url, divLoadID, selectedColor, color1, color2, color3, color4, color5, color6, color7, color8, t1, t2, t3, t4, t5, t6, t7, t8)
    {
        $('#spinner').addClass('loader');
        
        $(document).ready(function(){
            document.execCommand("Stop");
        
            $("#"+divLoadID).load(url + "/?" + Math.random()); 
            //window.location.hash = "#!";
            
            var stateObj = {url: url, div: "#"+divLoadID, title: $(tab).text() };   //limited to 34kb
            window.history.pushState(stateObj, $(tab).text(), url);
            document.title = $(tab).text();
    
            if(t1 !== null){
                t1.css("background-color", color1);
            }
            if(t2 !== null){
                t2.css("background-color", color2);
            }
            if(t3 !== null){
                t3.css("background-color", color3);
            }
            if(t4 !== null){
                t4.css("background-color", color4);
            }
            if(t5 !== null){
                t5.css("background-color", color5);
            }
            if(t6 !== null){
                t6.css("background-color", color6);
            }
            if(t7 !== null){
                t7.css("background-color", color7);
            }
            if(t8 !== null){
                t8.css("background-color", color8);
            }
            
            $(tab).parent().css("background-color", selectedColor); 
            
            sessionStorage.setItem("tabClicked", $(tab).parent().attr("id"));
            
            $('#spinner').removeClass('loader');
        });
        
        return false;
    }

    $(window).on('popstate', function (e) {
        
        document.execCommand("Stop");
        
        var state = e.originalEvent.state;
        var title = "";
        if(state != null) 
        {
            try{
                title = state.title;
            }
            catch(err)
            {
            }
        }
        
        if (state !== null) {
            
            if(title != "" && title != null)
            {
                document.title = title;
                //alert(state.div + ", " + state.url);
                if(state.div != null && state.div != "")
                {
                    $(state.div).load(state.url + "/?" + Math.random());
                    try{
                        var linkObj = $('.CustomTabs').find('a:contains("'+title+'")').first();
                        
                        //alert(linkObj.text() + ": a");
                        //alert(linkObj.parent().parent().find('div').length);
                        linkObj.parent().parent().find('div').each(function(){
                            var col = $(this).children('a').first().next().next().text();
                            $(this).css("background-color", col);
                        });
                        
                        var selectedColor = linkObj.next().text();
                        //alert($('.CustomTabs').find('a:contains("'+title+'")').first().text() + " is text"); //.parent().css("background-color", "blue !important"); 
                        linkObj.parent().css("background-color", selectedColor);
                        
                    }
                    catch(err)
                    {
                            alert(err);
                    }
                }
                else 
                {
                    location.reload();
                }
            } 
            else 
            {
                location.reload();
            }
        } else {
            
            location.reload();
        }
    });