var api = null;
var display = {};

function randomPWD(count) {
    var s = [
        'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z',
        'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z',
        1,2,3,4,5,6,7,8,9,0,'-','_','@','#','$'
    ];
    var code = '';
    for(var i=0; i<count; i++) {
        code += s[(Math.random()*s.length)|0];
    }
    return code;
}

function forJSON(json, call) {
    var result = [];
    for(var n in json) {
        var r = call(n, json[n]);
        r!==undefined && result.push(r);
    }
    return result;
}

function TRIM(s) {
    return s ? s.trim() : '';
}

function SPLIT(s) {
    return s ? s.trim().split(/\s+/) : [];
}

function JOIN(a, e) {
    var r = [];
    if(a.length) {
        r.push(a[0]);
        for(var i=1; i<a.length; i++) {
            r.push(e);
            r.push(a[i]);
        }
    }
    return r;
}

function _login_(port, user, pass, ok_cb, err_cb) {
    api = new eppAPI.default('/'+port);
    api.login(user, pass, function(code, data) {
        code==='1000' ? ok_cb(user, pass, data.kind, data.acl) : err_cb();
    });
}

function switchPage(id) {
    display.page.style.display = "none";
    display.page = document.querySelector('#page'+id);
    display.page.style.display = "block";
}

function switchContent(name, state) {
    display.content.style.display = "none";
    display.content = display.page.querySelector('#'+name);
    if(state===null) state = display.content.component.getInitialState();
    if(state===undefined) state = {};
    display.content.component.setState(state);
    display.content.style.display = "block";
}

function switchMenu() {
    display.menu.nextElementSibling.style.display = "none";
    display.menu.querySelector('span').className = "";
    display.menu = this;
    display.menu.nextElementSibling.style.display = "block";
    display.menu.querySelector('span').className = "open";
}

function _ok_(user, pass, kind, acl) {
    display.account = {
        user: user,
        pass: pass,
        kind: kind,
        acl : acl
    };

    switchPage({
        user: 'UserContent',
        admin: 'AdminContent'
    }[kind]);

    var menu = display.page.querySelectorAll('#menu>h3');
    for(var i=0; i<menu.length; i++) {
        if(menu[i].nextElementSibling.style.display.toLowerCase()==="block") display.menu = menu[i];
    }

    var content = display.page.querySelectorAll('#pages>div');
    for(var i=0; i<content.length; i++) {
        if(content[i].style.display.toLowerCase()==="block") display.content = content[i];
    }
    display.content.component.setState(display.content.component.getInitialState());

    var helloUser = document.querySelector('#helloUser');
    helloUser.innerHTML = user;
}

/******************************************************************************/

window.onload = function() {
    ['Login', 'UserContent', 'AdminContent'].forEach(function(id) {
        var page = document.querySelector('#page'+id);
        if(page.style.display.toLowerCase()==="block") display.page = page;

        var menu = page.querySelectorAll('#menu>h3');
        for(var i=0; i<menu.length; i++) {
            menu[i].addEventListener('click', switchMenu.bind(menu[i]), false);
        }

        var content = page.querySelectorAll('#pages>div');
        for(var i=0; i<content.length; i++) {
            content[i].component = ReactDOM.render(display.html[content[i].id], content[i]);
        }
    });

    var selectPort = document.querySelector('#selectPort');
    selectPort.component = ReactDOM.render(display.html['selectPort'], selectPort);
};

/******************************************************************************/

function login() {
    var username = document.querySelector('#username').value.trim();
    var password = document.querySelector('#password').value.trim();
    var registry = ['18080', '10403', '10405'];

    function _login() {
        var port = registry.pop();

        function _ok(user, pass, kind, acl) {
            switch(kind) {
            case 'user':
                var p = acl.port;
                if(!p || !p.length) break;
                if(port!==p[0]) {
                    registry.push(p[0]);
                    break;
                }

                var selectPort = document.querySelector('#selectPort');
                selectPort.component.setState({selected:p[0], port:p});
            case 'admin':
                _ok_(user, pass, kind, acl);
                return;
            }
            _login();
        }

        port ? _login_(port, username, password, _ok, _login)
             : alert('用户名或者密码错误');
    }

    _login();
}

function logout() {
    api.logout(function(code) {
        delete display.account;
        switchPage('Login');
    });
}