var StyleSelecter = {
    cssList : new Array(),
    
    initialize: function() {
        this.cssList.push( "style01.css");
        this.cssList.push( "style02.css");
        this.cssList.push( "style03.css");
        this.cssList.push( "style04.css");
        this.cssList.push( "style05.css");
        this.cssList.push( "style06.css");
        this.cssList.push( "style07.css");
        this.cssList.push( "style08.css");
    
        var cookie = this.readCookie("style");
        var title = cookie;
        if( !cookie || cookie == ""){
            this.changeByDay = true;
            title = this.getPreferredStyleSheet();
        }
        
        Event.observe( window , "unload",StyleSelecter.finalize.bind( StyleSelecter )  , false);
        this.createStyle();
        this.createList();
        
        this.setActiveStyleSheet(title);
        
    },
    
    finalize : function(){
        var title = this.getActiveStyleSheet();
        var value = this.changeByDay ? "" : title ; 
        this.createCookie("style", value, 365);
        
    },
    
    createStyle : function(){
        var h = document.getElementsByTagName("head")[0];
        this.cssList.each( function( v , i ){
            var l = document.createElement("link");
            l.setAttribute("rel" , "alternate stylesheet");
            l.setAttribute("href" , "/css/" + v);
            l.setAttribute("type" , "text/css");
            l.setAttribute("media" , "screen");
            l.setAttribute("title" , v);
            
            h.appendChild( l );
        });
    },
    
    createList : function(){
        var s = $("StyleSelectMenu");
        var ss = $("SelectedStyle");
        if( !s ) return;
        
        var d = document.createElement("div");
        d.setAttribute("class" , "StyleOption");
        var a = document.createElement("a");
        a.setAttribute("href" , "javascript:StyleSelecter.setActiveStyleSheet()");
        a.innerHTML="Change by day";
        d.appendChild( a );
        s.appendChild( d );
        
        this.cssList.each( function( v , i ){
            var d = document.createElement("div");
            d.setAttribute("class" , "StyleOption");
            var a = document.createElement("a");
            a.setAttribute("href" , "javascript:StyleSelecter.setActiveStyleSheet('" + v + "')");
            a.innerHTML= v ;
            d.appendChild( a );
            s.appendChild( d );
        });
        
        Event.observe( s , "mouseout" , this.onmouseout.bind( this), true) ;
        Event.observe( s , "mouseover" , this.onmouseover.bind( this), true) ;
        Event.observe( ss , "mouseout" , this.onmouseout.bind( this), true) ;
        Event.observe( ss , "mouseover" , this.onmouseover.bind( this), true) ;
        
        this.menu = s;
        this.selectedDiv = ss;
        this.isOpen = false;
        
    },
    
    onmouseover : function( evt ) {
        if( !this.isOpen ) {
            this.openMenu();
            return;
        }
        
        clearTimeout( StyleSelecter.timerID );
        StyleSelecter.timerID = undefined;

    },

    onmouseout : function( evt ) {
        if( !this.isOpen ) return;

        StyleSelecter.timerID = setTimeout( this.closeMenu.bind( this ) , CLOSE_INTERVAL );

    },
    
    openMenu : function( evt ){
        if( this.isOpen ) return;
        if( !this.init ){
            this.menu.style.visibility = 'visible';
            this.init = true;
        }

        if( StyleSelecter.nowEffect != undefined && StyleSelecter.nowEffect.state != "finished" ){
            StyleSelecter.timerID = setTimeout( this.openMenu.bind( this ) , 20 );
            return;
        }

        if( StyleSelecter.timerID != undefined ){
            clearTimeout( StyleSelecter.timerID );
            StyleSelecter.timerID = undefined;
        }
        
        this.isOpen = true;
        this.menu.style.zIndex = 1000;
        StyleSelecter.nowEffect = new Effect.SlideDown( this.menu.id, {duration : 0.3 } );
    },
    
    closeMenu : function( evt ){
        if( !this.isOpen ) return;

        if( StyleSelecter.nowEffect != undefined && StyleSelecter.nowEffect.state != "finished" ){
            StyleSelecter.timerID = setTimeout( this.closeMenu.bind( this ) , 20 );
            return;
        }
        if( StyleSelecter.timerID != undefined ){
            clearTimeout( StyleSelecter.timerID );
            StyleSelecter.timerID = undefined;
        }

        this.isOpen = false;
        StyleSelecter.nowEffect = new Effect.SlideUp( this.menu.id, {duration : 0.3 } );

        this.menu.style.zIndex = 0;
    },
    
    setSelectedStyle : function( title){
        this.selectedDiv.innerHTML = title;
    },
    
    setActiveStyleSheet : function(title){
        this.selected = title;
        if( !title ) {
            this.changeByDay = true;
            title = this.getPreferredStyleSheet();
        }
        else{
            this.changeByDay = false;
        }
        $A(document.getElementsByTagName("link")).each( function( v , i ){
            if( v.getAttribute("rel") != "alternate stylesheet" ){
                return;
            }
            v.disabled = true;
            if( v.getAttribute("title") == title){
              v.disabled = false;
              if( StyleSelecter.changeByDay){
                  StyleSelecter.createCookie("style", title, 365);
                  StyleSelecter.changeByDay = false;
              }
            }
        });
        
        var dispTitle = this.changeByDay ? "Change by day" : title ; 
        this.setSelectedStyle( dispTitle );
        
        var value = this.changeByDay ? "" : title ; 
        this.createCookie("style", value, 365);
    },
    
    getActiveStyleSheet : function(){
        var s =$A(document.getElementsByTagName("link")).find( function( v , i ){
            if( v.getAttribute("rel") != "alternate stylesheet" ){
                return;
            }
            if( v.getAttribute("rel").indexOf("style") != -1 && 
                v.getAttribute("title") && 
                !v.disabled){
                 return true;
            }
            return false;
        });
        
        if( s ) return s.getAttribute("title");
        return null;
    },
    
    getPreferredStyleSheet : function(){
        var date = new Date();
        var days = Math.floor( date.getTime() / (60 * 60 * 24 ) );
        var m = ( this.cssList.length == 0 ? 1 : this.cssList.length );
        var index = days % m;
        return this.cssList[index];
        
    },
    
    createCookie : function(name,value,days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime()+(days*24*60*60*1000));
            var expires = "; expires="+date.toGMTString();
        }
        else expires = "";
        document.cookie = name+"="+value+expires+"; path=/";
    },

    readCookie : function(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for(var i=0;i < ca.length;i++) {
            var c = ca[i];
            while (c.charAt(0)==' ') c = c.substring(1,c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
        }
        return null;
    }

}
function initStyleSelecter() { StyleSelecter.initialize(); }
Event.observe( window , "load",initStyleSelecter  , false);