function getElement( id ) {
	if( document.getElementById ) // this is the way the standards work
		return document.getElementById( id );
	else if( document.all ) // this is the way old msie versions work
		return document.all[id];
	else if( document.layers ) // this is the way nn4 works
		return document.layers[id];
}
function MakeVisible( whichLayer ) {
	vis = getElement( whichLayer ).style;
	vis.display = 'block';
}

function MakeInvisible( whichLayer ) {
	vis = getElement( whichLayer ).style;
	vis.display = 'none';
}

var CurrentFrame = 0;
var LastFrame = 2;
var blockNext = false;

function UpdateHeading() {
    switch(CurrentFrame) {
        case 0:
            getElement('header-heading').innerHTML = 'Bienvenido a EduBlog';
            break;
        case 1:
            getElement('header-heading').innerHTML = 'Vas por buen camino...';
            break;
        case 2:
            getElement('header-heading').innerHTML = 'Solo una pregunta más...';
            break;
    }
}

function next_frame() {
    if (CurrentFrame == LastFrame) {
        getElement('signup-form').submit();
    } else {
        MakeInvisible('frame_'+CurrentFrame++);
        MakeVisible('btn-atras');
        if (CurrentFrame >= LastFrame) {
            MakeInvisible('btn-siguiente');
            MakeVisible('btn-termine');
        }
        MakeVisible('frame_'+CurrentFrame);
        CurrentStepHTML = getElement('pasos');
        CurrentStepHTML.innerHTML='Paso '+(CurrentFrame+1)+'/'+(LastFrame+1);
    }
    UpdateHeading();
}

function previous_frame() {
    MakeInvisible('frame_'+CurrentFrame--);
    MakeInvisible('btn-termine');
    MakeVisible('btn-siguiente');
    if (CurrentFrame <= 0) {
        MakeInvisible('btn-atras');
    }
    MakeVisible('frame_'+CurrentFrame);
    CurrentStepHTML = getElement('pasos');
    CurrentStepHTML.innerHTML='Paso '+(CurrentFrame+1)+'/'+(LastFrame+1);
    UpdateHeading();
}

function validate() {
    var error = false;
    blockNext = false;
    switch(CurrentFrame) {
        case 0:
            getElement('error-firstname').innerHTML = '';
            getElement('error-lastname').innerHTML = '';
            getElement('error-userphoto').innerHTML = '';
            getElement('error-username').innerHTML = '';
            if(!validateRequired(getElement('firstname'))) {
                getElement('error-firstname').innerHTML = 'Error, por favor ingresa tu nombre.';
                error = true;
            }
            if(!validateRequired(getElement('lastname'))) {
                getElement('error-lastname').innerHTML = 'Error, por favor ingresa tu apellido';
                error = true;
            }
            if(!validateRequired(getElement('username'))) {
                getElement('error-username').innerHTML = 'Error, por favor ingresa tu apodo';
                error = true;
            }
            blockNext = error;
            if (!error) {
                validateUsername(getElement('username').value); // next_frame() is executed here
            }
            break;
        case 1:
            getElement('error-whatdepartment').innerHTML = '';
            getElement('error-whatschool').innerHTML = '';
            getElement('error-whatyear').innerHTML = '';
            if(!validateRequiredSelect(getElement('whatdepartment'))) {
                getElement('error-whatdepartment').innerHTML = 'Error, por favor ingresa tu departamento';
                error = true;
            }
            if(!validateRequired(getElement('whatschool'))) {
                getElement('error-whatschool').innerHTML = 'Error, por favor ingresa tu escuela';
                error = true;
            }
            if(!validateRequiredSelect(getElement('whatyear'))) {
                getElement('error-whatyear').innerHTML = 'Error, por favor ingresa tu a&ntilde;o';
                error = true;
            }
            if (!error) {
                next_frame();
            }
            break;
        case 2:
            getElement('error-password').innerHTML = '';
            getElement('error-trustuser').innerHTML = '';
            if(!validatePassword(getElement('password').value, getElement('password2').value)) {
                error = true;
            }
            blockNext = error;
            if (!error) {
                validateTrustUser(getElement('trustuser').value); // next_frame() is executed here
            }
            break;
    }
}

function handUsername(result){
	var ValidationText = getElement('error-username');
	if (result != 'valid') {
		ValidationText.innerHTML='Apodo inv&aacute;lido: '+result;
	} else if (!blockNext) {
	    ValidationText.innerHTML='';
	    blockNext = false;
	    next_frame();
    }
}

function handTrustUser(result){
	var ValidationText = getElement('error-trustuser');
	if (result != 'valid') {
		ValidationText.innerHTML='No existe ese usuario';
	} else if (!blockNext) {
	    ValidationText.innerHTML='';
	    blockNext = false;
	    next_frame();
    }
}

function validateRequired(element)  {
    if (element.value && element.value != 'Ingrese texto...') {
        return true;
    }
    return false;
}

function validateRequiredSelect(element) {
    return validateRequired(element) && element.value != '-1';
}

function validatePassword(password, password2){
	var ValidationText = getElement('error-password');
	
	if (password != password2) {
	    ValidationText.innerHTML='Clave inv&aacute;lida: Las claves no son iguales';
	    return false;
    }
	
	var minLength = 6;
	if (password.length < minLength) {
		ValidationText.innerHTML='Clave inv&aacute;lida: Tu clave debe tener 6 o más car&aacute;cteres.';
		return false;
	}
	return true;
}

function validateUsername(user){
	var strDomain='';
	var ajax = new Ajax();
	return ajax.doGet(strDomain+'edublog_validate_username.php?action=validateUsername&username='+user,handUsername,'text');
}

function validateTrustUser(user){
	var strDomain='';
	var ajax = new Ajax();
	return ajax.doGet(strDomain+'edublog_validate_username.php?action=validateTrustUser&username='+user,handTrustUser,'text');
}

function Ajax() {
    this.req = null;
    this.url = null;
    this.status = null;
    this.statusText = '';
    this.method = 'GET';
    this.async = true;
    this.dataPayload = null;
    this.readyState = null;
    this.responseText = null;
    this.responseXML = null;
    this.handleResp = null;
    this.responseFormat = 'text', // 'text', 'xml', 'object'
    this.mimeType = null;
    this.headers = [];

    this.init = function() {
        var i = 0;
        var reqTry = [ 
            function() { return new XMLHttpRequest(); },
            function() { return new ActiveXObject('Msxml2.XMLHTTP') },
            function() { return new ActiveXObject('Microsoft.XMLHTTP' )} ];
              
        while (!this.req && (i < reqTry.length)) {
            try { 
                this.req = reqTry[i++]();
            }
            catch(e) {}
        }
        return true;
    };
    
    this.doGet = function(url, hand, format) {
        this.url = url;
        this.handleResp = hand;
        this.responseFormat = format || 'text';
        this.doReq();
    };
    
    this.doPost = function(url, dataPayload, hand, format) {
        this.url = url;
        this.dataPayload = dataPayload;
        this.handleResp = hand;
        this.responseFormat = format || 'text';
        this.method = 'POST';
        this.doReq();
    };
    
    this.doReq = function() {
        var self = null;
        var req = null;
        var headArr = [];
    
        if (!this.init()) {
            alert('Could not create XMLHttpRequest object.');
            return;
        }
        req = this.req;
        req.open(this.method, this.url, this.async);
        if (this.method == "POST") {
            this.req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        }
        if (this.method == 'POST') {
            req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        }
        self = this;
        req.onreadystatechange = function() {
            var resp = null;
            self.readyState = req.readyState;
            if (req.readyState == 4) {
        
                self.status = req.status;
                self.statusText = req.statusText;
                self.responseText = req.responseText;
                self.responseXML = req.responseXML;
        
                switch(self.responseFormat) {
                    case 'text':
                        resp = self.responseText;
                        break;
                    case 'xml':
                        resp = self.responseXML;
                        break;
                    case 'object':
                        resp = req;
                        break;
                }
        
                if (self.status > 199 && self.status < 300) {
                    if (!self.handleResp) {
                        alert('No response handler defined ' +
                        'for this XMLHttpRequest object.');
                        return;
                    } else {
                        return self.handleResp(resp);
                    }
                } else {
                    self.handleErr(resp);
                }
            }
        }
        req.send(this.dataPayload);
    };
    
    this.abort = function() {
        if (this.req) {
            this.req.onreadystatechange = function() { };
            this.req.abort();
            this.req = null;
        }
    };
    this.handleErr = function() {
        var errorWin;
        // Create new window and display error
        try {
            errorWin = window.open('', 'errorWin');
            errorWin.document.body.innerHTML = this.responseText;
        }
        // If pop-up gets blocked, inform user
        catch(e) {
            alert('An error occurred, but the error message cannot be' +
            ' displayed because of your browser\'s pop-up blocker.\n' +
            'Please allow pop-ups from this Web site.');
        }
    };
    this.setMimeType = function(mimeType) {
        this.mimeType = mimeType;
    };
    this.setHandlerResp = function(funcRef) {
        this.handleResp = funcRef;
    };
    this.setHandlerErr = function(funcRef) {
        this.handleErr = funcRef; 
    };
    this.setHandlerBoth = function(funcRef) {
        this.handleResp = funcRef;
        this.handleErr = funcRef;
    };
    this.setRequestHeader = function(headerName, headerValue) {
        this.headers.push(headerName + ': ' + headerValue);
    };
  
}