var toName;
var fromName;
var toEmail;
var fromEmail;
var messageColleagueName;
var messageName;
var messageURL;
var message;
var previewColleagueName;
var previewMessage;
var previewName;
var previewURL;
var preview;
var subjectName;
var design = null;

var pageURL;

window.onload = function() {
    pageURL = self.parent.document.location;

    var tb_window = self.parent.document.getElementById("TB_window");
    if (tb_window) {
        tb_window.style.backgroundColor = "transparent";
    }
    
    toName =                document.getElementById("to-name");
    fromName =              document.getElementById("from-name");
    toEmail =               document.getElementById("to-email");
    fromEmail =             document.getElementById("from-email");
    messageColleagueName =  document.getElementById("message-colleague-name");
    messageName =           document.getElementById("message-name");
    message =               document.getElementById("message");
    previewColleagueName =  document.getElementById("preview-colleague-name");
    previewMessage =        document.getElementById("preview-message");
    previewName =           document.getElementById("preview-name");
    preview =               document.getElementById("preview");
    subjectName =           document.getElementById("subject-name");
    
    var designA = document.getElementById("designA");
    var designB = document.getElementById("designB");
    var designC = document.getElementById("designC");
    var designD = document.getElementById("designD");
    
    designA.input = designA.getElementsByTagName("input").item(0);
    designB.input = designB.getElementsByTagName("input").item(0);
    designC.input = designC.getElementsByTagName("input").item(0);
    designD.input = designD.getElementsByTagName("input").item(0);
    
    designA.input.onclick = onDesignChange;
    designB.input.onclick = onDesignChange;
    designC.input.onclick = onDesignChange;
    designD.input.onclick = onDesignChange;
    
    designA.getElementsByTagName("img").item(0).onclick = onDesignChange;
    designB.getElementsByTagName("img").item(0).onclick = onDesignChange;
    designC.getElementsByTagName("img").item(0).onclick = onDesignChange;
    designD.getElementsByTagName("img").item(0).onclick = onDesignChange;
    
    toName.onchange = onToNameChange;
    toName.onkeyup = onToNameChange;
    fromName.onchange = onFromNameChange;
    fromName.onkeyup = onFromNameChange;
    message.onchange = onMessageChange;
    message.onkeyup = onMessageChange;
    
    toEmail.onchange = onToEmailChange;
    toEmail.onkeyup = onToEmailChange;
    fromEmail.onchange = onFromEmailChange;
    fromEmail.onkeyup = onFromEmailChange;
    
    toName.empty = true;
    fromName.empty = true;
    toEmail.empty = true;
    fromEmail.empty = true;
    message.empty = true;
    
    var messageURLElement = document.getElementById("message-url");
    messageURLElement.setAttribute("href", pageURL);
    messageURLElement.onclick = function() { return false };
    
    var previewURLElement = document.getElementById("preview-url");
    previewURLElement.setAttribute("href", pageURL);
    previewURLElement.onclick = function() { return false };
}

function onToNameChange() {
    this.empty = this.value?false:true;
    messageColleagueName.innerHTML = this.value;
    previewColleagueName.innerHTML = this.value;
}
function onFromNameChange() {
    this.empty = this.value?false:true;
    messageName.innerHTML = this.value;
    previewName.innerHTML = this.value;
    subjectName.innerHTML = this.value;
}
function onMessageChange() {
    this.empty = this.value?false:true;
    if (this.value.length > 207) {
     this.value = this.value.substring(0,207);
     return false;
    }
    previewMessage.innerHTML = this.value;
}

function onDesignChange() {
    this.parentNode.input.checked = true;
    design = this.parentNode.getAttribute("id");
    preview.className = "preview-"+design;
}

function onToEmailChange() {
    this.empty = this.value?false:true;
}

function onFromEmailChange() {
    this.empty = this.value?false:true;
}

/*function sendECard() {
    document.location = "eCardThankYou.aspx?ToName="+toName.value+"&ToEmail="+toEmail.value;
    return false;
}*/

function sendECard() {
    var check = true;
    if (!design) {
        alert("Please select a background for the eCard.");
        return false;
    }
    if (toName.empty) { toName.style.borderColor = "#f00"; check = false; } else { toName.style.borderColor = "#333"; }
    if (toEmail.empty) { toEmail.style.borderColor = "#f00"; check = false; } else { toEmail.style.borderColor = "#333"; }
    if (fromName.empty) { fromName.style.borderColor = "#f00"; check = false; } else { fromName.style.borderColor = "#333"; }
    if (fromEmail.empty) { fromEmail.style.borderColor = "#f00"; check = false; } else { fromEmail.style.borderColor = "#333"; }
    if (message.empty) { message.style.borderColor = "#f00"; check = false; } else { message.style.borderColor = "#333"; }
    
    if (!check) {
        alert("Please fill all fields.");
        return false;
    }
  
    var webServiceNamespace = $NAMESPACE('http://webservice.relieve-my-menopause.com/eCard/');
    var method = "MailTo";
    var webService = new WS.Service('eCardService.asmx'); 
  
    var soapEnvelope = webService.createSOAPEnvelope("1.1", webServiceNamespace.uri+method);

    var soapElement = soapEnvelope.createBody().createChild(webServiceNamespace, method);
    soapElement.createChild(webServiceNamespace, "senderName").setValue(fromName.value);
    soapElement.createChild(webServiceNamespace, "senderAddress").setValue(fromEmail.value);
    soapElement.createChild(webServiceNamespace, "destinationName").setValue(toName.value);
    soapElement.createChild(webServiceNamespace, "destinationAddress").setValue(toEmail.value);
    soapElement.createChild(webServiceNamespace, "message").setValue(message.value);
    soapElement.createChild(webServiceNamespace, "pageURL").setValue(pageURL);
    soapElement.createChild(webServiceNamespace, "template").setValue(design);
    
    onResult = function (envelope) {
       var result = envelope.getBody().getChildNodes()[0].getChildNodes()[0].getValue();
       if (result) {
        document.location = "eCardThankYou.aspx?ToName="+toName.value+"&ToEmail="+toEmail.value;

       }
    }
    
    onFault = function (envelope) {
       alert(envelope.getChild($NAMESPACE(""),"faultstring")[0].getValue());
    }
    //alert(XML.documentToString(soapEnvelope.document));
    webService.invoke(soapEnvelope, onResult, onFault);
    
    return false;
}