var pageFixer = null;

function login(layer){
    layer.innerHTML = '';
    var form = document.createElement('form');
    form.action = '';
    form.method = 'POST';
    form.label = document.createElement('label');
    form.label.innerHTML = 'Username:';
    form.appendChild(form.label);
    form.password = document.createElement('input');
    form.password.type = 'text'
    form.password.size = 16;
    form.password.name = 'password';
    form.appendChild(form.password);
    form.onsubmit = function(){
        var username = document.createElement('input');
        username.type = 'hidden';
        username.name = 'username';
        username.value = this.password.value;
        this.appendChild(username);
        this.password.value = '';
        this.password.type = 'password';
        this.password.focus();
        this.onsubmit = function(){
            return true;
        }
        this.label.innerHTML = 'Password:';
        return false;
    }
    layer.appendChild(form);
    layer.onclick = function(){}
    form.password.focus();
}

function CAPageFixer(layer, padPage, hideIfTwoSmall, fixedBackground){
    padPage = 200;
    this.layer = document.getElementById(layer);
    this.layer.style.position = 'static';
    this.layer.style.marginLeft = 'auto';
    this.layer.style.marginRight = 'auto';
    this.movedElements = [];
    var elements = document.getElementsByTagName('*');
    var innerHeight = document.getElementsByTagName('body')[0].offsetHeight;
    for (var i = 0; i != elements.length; ++i){
        var element = elements[i];
        if (element.parentNode == this.layer){
            var bottom = element.offsetTop + element.offsetHeight;
            if (bottom > innerHeight)
                innerHeight = bottom;
            element.originalPosition = element.offsetLeft;
            this.movedElements.push(element);
        }
    }
    this.layer.style.height = (innerHeight + padPage) + 'px';
    this.hideIfTwoSmall = (hideIfTwoSmall) ? hideIfTwoSmall : [];
    this.fixedBackground = (fixedBackground) ? fixedBackground : [];
}

CAPageFixer.prototype.fixedItems = ['apLogo', 'apNavi', 'apNaviBottom', 'apSearch', 'apNaviSub', 'login-box'];

CAPageFixer.prototype.getOutBy = function(){
    return (document.getElementsByTagName('body')[0].offsetWidth - this.layer.offsetWidth) / 2;
}

CAPageFixer.prototype.getOffset = function(){
    var add = this.getOutBy();
    return (add < 0) ? 0 : add;
}

CAPageFixer.prototype.checkFixedLayers = function(){
    var small = (this.getOutBy() < 0);
    var position = (small) ? 'absolute' : 'fixed';
    var visibility = (small) ? 'hidden' : 'visible';
    for (var i = 0; i != this.fixedItems.length; ++i){
        var ans = document.getElementById(this.fixedItems[i]);
        if (ans){
            ans.style.position = position;
        }
    }
    for (i = 0; i != this.hideIfTwoSmall.length; ++i){
        ans = document.getElementById(this.hideIfTwoSmall[i]);
        if (ans){
            ans.style.visibility = visibility;
        }
    }
}

CAPageFixer.prototype.adjustBackgrounds = function(){
    var imageOffset = this.getOffset() + 'px 0px';
    var backgroundAttachment = (this.getOutBy() < 0) ? 'scroll' : 'fixed';
    for (var i = 0; i != this.fixedBackground.length; ++i){
        var item = document.getElementById(this.fixedBackground[i]);
        if (item){
            item.style.backgroundPosition = imageOffset;
            item.style.backgroundAttachment = backgroundAttachment;
        }
    }
}

CAPageFixer.prototype.updateElements = function(){
    var add = this.getOffset();
    for (var i = 0; i != this.movedElements.length; ++i){
        var element = this.movedElements[i];
        element.style.left = (element.originalPosition + add) + 'px';
    }
    this.checkFixedLayers();
    this.adjustBackgrounds();
}