/**
 * layout.js 
 *
 * Copyright (C) Artis Inc. | http://www.artisj.com/
*/

var Base = {
    addEvent: function(node,evt,func){
        if(node.addEventListener){
            node.addEventListener(evt,func,false);	
        } else if(node.attachEvent){
            node.attachEvent("on"+evt,func);	
        }
    },
    bind: function(){
        var args=[];
        if(arguments){
            for(var i=0,n=arguments.length;i<n;i++){
                args.push(arguments[i]);
            }
        }
        var object=args.shift();
        var func=args.shift();
        return function(event) {
            return func.apply(object,[event||window.event].concat(args));
        }
    }
};

var Data = {
    width: 0,
    height: 0
};


var Layout = function(){
    this.maxSize = 1050;
    this.minSize = 800;
    this.per = 100;
    this.delay = 33;
    this.wrapper = document.getElementById("g-wrapper");
    this.mainOut = document.getElementById("main-out");
    this.wp = document.getElementById("wrapper");
    this.gatherFlag = true;

    if( this.wp ){
    	this.getNodes();
    }

    this.resize();
    Base.addEvent(window,"resize", Base.bind( this,this.resize )); 

};

Layout.prototype = {
    resize: function(){
        this.getSize();

	if( Data.width < this.minSize ){
            this.wrapper.className = "gnavi-wrapper-min";
            this.mainOut.className = "min-width";
            this.gatherFlag = false;
        } else if( Data.width < this.maxSize ){
            this.wrapper.className = "gnavi-wrapper";
            this.mainOut.className = "min-width";
            this.gatherFlag = false;
	} else {
            this.wrapper.className = "gnavi-wrapper";
            this.mainOut.className = "";
            this.gatherFlag = true;
	}
        if( this.wp ){
            this.enterFrame();
        }
    },
    enterFrame: function(){
        this.newColumn.box.style.height = "auto";
        this.columnRanking.box.style.height = "auto";
        this.evaTech.box.style.height = "auto";
        this.praGuide.box.style.height = "auto";

        if( this.gatherFlag ){
            this.gatherBoxHeight( this.newColumn.box, this.columnRanking.box );
            this.gatherBoxHeight( this.evaTech.box, this.praGuide.box );
        }
    },
    getNodes: function(){
        this.newColumn = document.getElementById("new-column");
        this.columnRanking = document.getElementById("column-ranking");
        this.evaTech = document.getElementById("eva-tech");
        this.praGuide = document.getElementById("pra-guide");

        this.newColumn.box = this.getChildBox( this.newColumn );
        this.columnRanking.box = this.getChildBox( this.columnRanking );
        this.evaTech.box = this.getChildBox( this.evaTech );
        this.praGuide.box = this.getChildBox( this.praGuide );
    },
    getChildBox: function( node ){
        var box;
        var nodes = node.getElementsByTagName("div");
        for( var i = 0, n = nodes.length; i < n; i++ ){
            var reg = /(?:^|\s)area-contents(?:$|\s)/;
            if( reg.test( nodes[i].className ) ){
                box = nodes[i];
            }
        }
        return box;
    },
    gatherBoxHeight: function( nodeA, nodeB ){
        var hA = (document.all) ? nodeA.offsetHeight : nodeA.clientHeight;
        var hB = (document.all) ? nodeB.offsetHeight : nodeB.clientHeight;
        if( hA > hB ){
            nodeB.style.height = nodeA.style.height = hA - 20 + "px";
        } else if( hB > hA ){
            nodeA.style.height = nodeB.style.height = hB - 20 + "px";
        }
    },
    getSize: function(){
        if( document.all ){
            Data.width = document.body.clientWidth;
            Data.height = document.body.clientHeight;
        } else {
            Data.width = innerWidth;
            Data.height = innerHeight;
        }
    }
};

(function(){ Base.addEvent(window,"load",function(){ new Layout(); }); })();

