var bIsSignIn = true;
bIsSignIn = buildElements();
attachEvents(bIsSignIn);

/** 
  * main function: build input elements
  * <param> n/a </param>
  * <return> n/a </return>
  */
function buildElements() {
    var objTags = null;
    var strInnerHTML;
    var blnIsSignIn = true;
    
    // build step1
    var strSelect = document.getElementById("step1").innerHTML;
    document.getElementById("step1").innerHTML = strSelect.substring(0, strSelect.toLowerCase().indexOf("<strong>"));
    var strSel1 = strSelect.substring(strSelect.toLowerCase().indexOf("<strong>"), strSelect.toLowerCase().indexOf("<br")); // opera is different 
    strSelect = strSelect.substring(strSelect.toLowerCase().indexOf("<br"));
    var strSel2 = strSelect.substring(strSelect.toLowerCase().indexOf("<strong>"));
    strInnerHTML = "";  
    strInnerHTML += "<div class='select_radio'><input type='radio' id='rdoPC1' name='rdoPC' value='HTM' checked /></div>";
    strInnerHTML += "<div class='select_context'>" + strSel1 + "</div>"
    strInnerHTML += "<div style='clear:both;'></div>";
    strInnerHTML += "<div class='select_radio'><input type='radio' id='rdoPC1' name='rdoPC' value='TXT' /></div>";
    strInnerHTML += "<div class='select_context'>" + strSel2 + "</div>"
    strInnerHTML += "<div style='clear:both;'></div>";        
    document.getElementById("step1").innerHTML += strInnerHTML;	
    
    // build step2
    strInnerHTML = "";  
    strInnerHTML += "<div style='padding:5px 0 8px 48px;'><input type='text' id='txtEM' name='txtEM' value='' class='main' style='display:none; width: 180px; border-style: solid; border-color: #000000; border-width: 1px;' /></div>";        
    document.getElementById("step2").innerHTML += strInnerHTML;	
        
    // build checkbox
    var intCount = 0;
    objTags = document.getElementsByTagName("DIV");
             
    for (iLoop=0; iLoop<objTags.length; iLoop++) {
        if (objTags[iLoop].className.indexOf("detail_checkbox")>0) {
            intCount++;
            objTags[iLoop].innerHTML = "<input type='checkbox' id='chkNewsletter" + intCount + "' name='chkNewsletter" + intCount + "' value='" + objTags[iLoop].id + "' />";
        }
    }

    // build submit form
    var strButtonImg;
    objTags = document.getElementsByTagName("IMG");
    
    for (iLoop=0; iLoop<objTags.length; iLoop++) {
        if (objTags[iLoop].alt.indexOf("Click submit button to subscribe the newsletters")>=0) {
            strButtonImg = objTags[iLoop].src;    
            break;
        }
    }
    
    strInnerHTML = "";
    strInnerHTML += "<form id='frmNewsletterSignup' name='frmNewsletterSignup' method='get' onsubmit='return ValidateForm(true);' action='http://newsletters.msn.com/xs-v3/insite.asp'>";
    strInnerHTML += "<input type='hidden' name='bSubmit' value='true' />";
    strInnerHTML += "<input type='hidden' name='reset' value='' />";
    strInnerHTML += "<input type='hidden' name='RE' value='http://specials.uk.msn.com/news/newsletters/confirm.aspx'>";
    strInnerHTML += "<input type='hidden' name='CN' value='UK'>";
    strInnerHTML += "<input type='radio' id='PC' name='PC' value='HTM' style='display:none;' checked>";
    strInnerHTML += "<input type='hidden' id='EM' name='EM' value=''>";    
    for (iLoop=1; iLoop<=intCount; iLoop++) {
        strInnerHTML += "<input type='checkbox' id='Newsletter" + iLoop + "' name='SNID' value='" + document.getElementById("chkNewsletter" + iLoop).value + "' style='display:none;' />";
    }
    strInnerHTML += "<input type='image' src='" + strButtonImg + "' name='submit' id='submit' />";
    strInnerHTML += "</form>";
    document.getElementById("submitform").innerHTML = strInnerHTML;
    
    // signin
    var objTags = document.getElementsByTagName("A");

    for (iLoop = 0; iLoop < objTags.length; iLoop++) {
        if (objTags[iLoop].className == "dMSNME_1") {
            document.getElementById("imgsignin").href = (objTags[iLoop].href);
            if (objTags[iLoop].innerText == "Sign In") {
                document.getElementById("signin").style.display = "block";                
                document.getElementById("txtEM").style.display = "block";
                DelCookie("login_name");
                blnIsSignIn = true;
            }
            else {
                if (GetCookie("login_name")==null) {
                    SetCookie("login_name", "anonymous");
                }
                document.getElementById("signin").style.display = "block";
                document.getElementById("EM").value = GetCookie("login_name");      
                blnIsSignIn = false;          
            }
            break;
        }
    }
    
    objTags = null;
    
    return blnIsSignIn;
}

/** 
  * main function: attach events to page elements
  * <param> n/a </param>
  * <return> n/a </return>
  */
function attachEvents(blnIsSignIn) {
    var objInput = document.getElementsByTagName("INPUT");
    
    for (iLoop=0; iLoop<objInput.length; iLoop++) {
        if (objInput[iLoop].style.display != 'none') {
            switch (objInput[iLoop].name.substring(0, 3)) {
                case "rdo":
                    objInput[iLoop].onclick = function() {
                        document.getElementById(this.name.substring(3)).value = this.value;
                    }
                    break;
                case "txt":
                    objInput[iLoop].onchange = function() {
                        document.getElementById(this.name.substring(3)).value = this.value;
                    }
                    break;
                case "chk":
                    objInput[iLoop].onclick = function() {
                        document.getElementById(this.name.substring(3)).checked = this.checked;
                    }
                    break;
                default:
                    break;
            }
        }
    }
    
    if (blnIsSignIn == true) {
        document.getElementById("imgsignin").onclick = function() {
            if (ValidateForm(false) == true) {
                document.getElementById("imgsignin").href += "&login=" + document.getElementById("txtEM").value;
                SetCookie("login_name", document.getElementById("txtEM").value);
            }
            else {
                return false;
            }
            return true;
        }
    }
    else {
        document.getElementById("imgsignin").href = "";
        document.getElementById("imgsignin").onclick = function() {
            return false;
        }
        document.getElementById("imgsignin").childNodes[0].src = document.getElementById("imgsignin_grey").childNodes[0].childNodes[0].src;
        document.getElementById("imgsignin").childNodes[0].alt = document.getElementById("imgsignin_grey").childNodes[0].childNodes[0].alt;
    }
}


/** 
  * main function: form input field validation
  * <param> checkItem: true (check newsletter items) / false (no checking on newsletter items) </param>
  * <return> true: check ok / false: check fail </return>
  */
function ValidateForm(checkItem)
{
    var bRtn = false;
    
    if (GetCookie("login_name") == null) {
	    var emailID = document.getElementById("EM").value;
	    if ((emailID==null)||(emailID=="")){
		    alert("Please enter your email address!");
		    document.getElementById("txtEM").focus();
		    return bRtn;
	    }
	    if (echeck(emailID)==false){
		    alert("Please enter a valid email address!");
		    document.getElementById("txtEM").focus();
		    return bRtn;
	    }
	}
    
    if (checkItem == true) {
        if (GetCookie("login_name") == null) {
            alert("Please sign in first!");
		    return bRtn;
        }
    	
	    var objCheck = document.getElementsByName("SNID");
	    for (iLoop=0; iLoop<objCheck.length; iLoop++) {
	        if (objCheck[iLoop].checked == true) {
	            bRtn = true;
	            break;
	        }
	    }
	    if (bRtn==false) {
	        alert("Please choose at lease one newsletter theme!");
		    return bRtn;
	    }
	}
	return true;
}

/** 
  * main function: check email id
  * <param> str: email address </param>
  * <return> true: check ok / false: check fail </return>
  */
function echeck(str)
{
	var at="@";
	var dot=".";
	var lat=str.indexOf(at);
	var lstr=str.length;
	var ldot=str.indexOf(dot);
	
	if (str.indexOf(at)==-1){
		return false
	}

	if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
		return false
	}

	if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
		return false
	}

	if (str.indexOf(at,(lat+1))!=-1){
	    return false
	}

	if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
	    return false
	}

	if (str.indexOf(dot,(lat+2))==-1){
	    return false
	}
		
	if (str.indexOf(" ")!=-1){
	    return false
	}

	return true					
}


/** 
  * main function: return the unescaped value of the cookie by offset
  * <param> offset: the position of the cookie </param>
  * <return> cookie value </return>
  */
function GetCookieVal(offset)
{
    var endstr = document.cookie.indexOf (";", offset);
    if (endstr == -1) {
        endstr = document.cookie.length;
    }
    return unescape(document.cookie.substring(offset, endstr));
}

/** 
  * main function: set cookie by name and value
  * <param> name: name of the cookie </param>
  * <param> value: value of the cookie </param>
  * <return> n/a </return>
  */
function SetCookie(name, value)
{
    var expdate = new Date();
    var argv = SetCookie.arguments;
    var argc = SetCookie.arguments.length;
    var expires = (argc > 2) ? argv[2] : null;
    var path = (argc > 3) ? argv[3] : null;
    var domain = (argc > 4) ? argv[4] : null;
    var secure = (argc > 5) ? argv[5] : false;
    
    if(expires!=null) {
        expdate.setTime(expdate.getTime() + ( expires * 1000 ));
    }
    
    document.cookie = name + "=" + escape (value) +((expires == null) ? "" : ("; expires="+ expdate.toGMTString())) +((path == null) ? "" : ("; path=" + path)) +((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : "");
}

/** 
  * main function: delete cookie by name
  * <param> name: name of the cookie </param>
  * <return> n/a </return>
  */
function DelCookie(name)
{
    var exp = new Date();
    var cval = GetCookie(name);
    
    exp.setTime (exp.getTime() - 1);
    document.cookie = name + "=" + cval + "; expires="+ exp.toGMTString();
}

/** 
  * main function: get cookie value by name
  * <param> name: name of the cookie </param>
  * <return> cookie value </return>
  */
function GetCookie(name)
{
    var arg = name + "=";
    var alen = arg.length;
    var clen = document.cookie.length;
    var i = 0;
    while (i < clen)
    {
        var j = i + alen;
        if (document.cookie.substring(i, j) == arg) {
            return GetCookieVal (j);
        }
        i = document.cookie.indexOf(" ", i) + 1;
        
        if (i == 0) break;
    }
    return null;
}