﻿// ******************************************************************
// Created JavaScript Functions
// ******************************************************************
document.getElementsByClassName = function(cl) 
{
    var retnode = [];
    var myclass = new RegExp('\\b'+cl+'\\b');
    var elem = this.getElementsByTagName('*');
    for (var i = 0; i < elem.length; i++) {
        var classes = elem[i].className;
        if (myclass.test(classes)) retnode.push(elem[i]);
    }
    return retnode;
}; 



function DoOnLoad() 
{
    //alert(document.location);
    divOurPortfolioContainer = document.getElementById("div_ourportfoliocontainer");
    divOurPortfolio = document.getElementById("div_ourportfolio");
    divUpDownArrows = document.getElementById("div_updownarrows");
    if (divOurPortfolio) MoveOurPortfolio();
    divHShowPane = document.getElementById("div_hshowpane");
}


// Moving portfolio up and down in a div
// Also showing details of work when a client's logo clicked

var divOurPortfolioContainer;
var divUpDownArrows;
var divOurPortfolio;
var posTop = 150;
var dir = "up";
var shouldStop = false;

function MoveOurPortfolio() 
{
    if (dir == "up" && !shouldStop)
    {
        posTop = posTop - 4;
        divOurPortfolio.style.marginTop = posTop + "px";
        if (posTop < -140) dir = "down";
    }
    
    if (dir == "down" && !shouldStop)
    {
        posTop = posTop + 4;
        divOurPortfolio.style.marginTop = posTop + "px";
        if (posTop > 40 ) dir = "up";
    }
    
    setTimeout("MoveOurPortfolio()",100);
}

function StopMoving()
{
    shouldStop = true;
}
function StartMoving()
{
    shouldStop = false;
}
function GoUp()
{
    dir = "up";
}
function GoDown()
{
    dir = "down";
}

var divPortfolioDtls;

function ShowPDtls(pId)
{
    divPortfolioDtls = document.getElementById(pId);

    divUpDownArrows.style.display = "none";
    divOurPortfolio.style.display = "none";
    divOurPortfolioContainer.style.borderRight = "solid 1px Silver";
    divPortfolioDtls.style.display = "block";
}

function HidePDtls()
{
    divPortfolioDtls.style.display = "none";
    divUpDownArrows.style.display = "block";
    divOurPortfolio.style.display = "block";
}


// General - Roll image

function RollImage(elm,imgName)
{
    elm.src = "Images/" + imgName;
}
function RollImageBack(elm,imgName)
{
    elm.src = "Images/" + imgName;
}


// When 'More >>' button clicked show the following message
// while the services pages are not ready
function DivLinkClicked(elmt,msg)
{
    alert("We are currently updating our \n\n\'" + msg + "\'\n\npage.\n\nPlease visit us again.\n\nThank You.");
//    elmt.innerHTML='We are updating our services pages.<br />Please visit us again.';
//    elmt.style.backgroundImage = "none";
}
function DivLinkMouseOut(elmt)
{
    elmt.innerHTML='More &gt;&gt;';
    elmt.style.backgroundImage = "url('Images/link_background.gif')";


}


// E_mail well formedness check
function IsWellFormedEMail(emailStr)
{
    var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i
    if (filter.test(emailStr))
        return true;
    else
        return false;
    return false;
}

// Is empty check
function IsEmpty(inpStr)
{
    if (inpStr.length < 1)
        return true;
    else
        return false;
    return false;
}


// Clean form values for Contact page
function CleanEnquire()
{
    document.getElementById("FullName").value = "";
    document.getElementById("Company").value = "";
    document.getElementById("EMail").value = "";
    document.getElementById("Phone").value = "";
    document.getElementById("PostCode").value = "";
    document.getElementById("CurrentWebsite").value = "";
    document.getElementById("Subject").value = "0";
    document.getElementById("HowDidYouHear").value = "0";
    document.getElementById("Message").value = "";
}



//***********************************
// Vertical scrolling functions
//***********************************
var varVPos = 0;
var targetVPos = 0;
var currentVPos = 0;
function ScrollToElement(elmID) {
    varVPos = currentVPos = document.documentElement.scrollTop;
    targetVPos = findVPos(document.getElementById(elmID));
    DoScroll();
}
function ScrollToVPos(vPos) {
    varVPos = currentVPos = document.documentElement.scrollTop;
    targetVPos = vPos;
    DoScroll();
}
function DoScroll() {
    if (targetVPos > currentVPos) {
        varVPos = varVPos + 30;
        if (varVPos > targetVPos) varVPos = targetVPos;
    }
    if (targetVPos < currentVPos) {
        varVPos = varVPos - 30;
        if (varVPos < targetVPos) varVPos = targetVPos;
    }

    document.documentElement.scrollTop = varVPos;
    if (varVPos == targetVPos) return;
    
    setTimeout('DoScroll()',5);
}
// Find an element's vertical position
function findVPos(oElement) {
    if( typeof( oElement.offsetParent ) != 'undefined' ) {
        for( var posY = 0; oElement; oElement = oElement.offsetParent ) {
            posY += oElement.offsetTop;
        }
        return posY;
    } else {
        return oElement.y;
    }
}



// Find an element's vertical and horizantal position
function findPosition( oElement ) 
{
  if( typeof( oElement.offsetParent ) != 'undefined' ) {
    for( var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent ) {
      posX += oElement.offsetLeft;
      posY += oElement.offsetTop;
    }
    return [ posX, posY ];
  } else {
    return [ oElement.x, oElement.y ];
  }
}


// Get query string
var queryStringParam = new Array();
function GetQueryString() {
    var query = window.location.search.substring(1);

    if (!query || query == "") return;

    var params = query.split('&');
    for (var i = 0; i < params.length; i++) {
        var pos = params[i].indexOf('=');
        if (pos > 0) {
            var key = params[i].substring(0, pos);
            var val = params[i].substring(pos + 1);
            queryStringParam[key] = val;
        }
    }
} 


//***********************************
// Web Developers Resources Scripts
//***********************************

// Register event for left side menu
var divMenuElements;
function RegisterEvents() 
{
    divMenuElements = document.getElementsByClassName("div_menu");
    for (i = 0; i < divMenuElements.length; i++)
        divMenuElements[i].onclick = divMenuClick;
}

function divMenuClick() 
{
    for (i = 0; i < divMenuElements.length; i++) {        
        document.getElementById("info_" + divMenuElements[i].id).style.display = "none";
    }
    document.getElementById("info_menu_00" ).style.display = "none";
    document.getElementById("info_" + this.id).style.display = "block";
}


function CallWebDevelopersResourcesPage() {
    var sPath = window.location.pathname;
    var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
    location.href = "Web-Developers-Resources.html?contentID=" + sPage;
}



// *****************
// AJAX Scripts
// *****************   

function CreateXMLHttpRequest(){
    var xhr = null;
    try { xhr = new XMLHttpRequest(); }
    catch(err) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); }
    return xhr;
}

// -------------------------------------------------
// Enquire (Customer is enquiring about VS services)
// -------------------------------------------------
function Enquire() {    
    xhr = CreateXMLHttpRequest();
    url = "AjaxRequestHandler.ashx";
    
    // Get input
    fullName = document.getElementById("FullName");
    company = document.getElementById("Company");
    email = document.getElementById("EMail");
    phone = document.getElementById("Phone");
    postCode = document.getElementById("PostCode");
    currentWebsite = document.getElementById("CurrentWebsite");
    subject = document.getElementById("Subject");
    howDidYouHear = document.getElementById("HowDidYouHear");
    message = document.getElementById("Message");

    // Validete input
    if (IsEmpty(fullName.value) || !IsWellFormedEMail(email.value) || IsEmpty(message.value) )
    {
        fullName.style.borderColor = "Silver";
        email.style.borderColor = "Silver";
        message.style.borderColor = "Silver";
        if (IsEmpty(fullName.value)) fullName.style.borderColor = "Red";
        if (!IsWellFormedEMail(email.value)) email.style.borderColor = "Red";
        if (IsEmpty(message.value)) message.style.borderColor = "Red";
        divErrMsgContact = document.getElementById("div_errmsg_contact");
        divErrMsgContact.innerHTML = "Please fill in highlited field(s).";
        return;
    }

    // Submit the request
    params = "Function=Enquire&FullName=" + fullName.value + "&Company=" + company.value + "&EMail=" + email.value + "&Phone=" + phone.value + 
        "&PostCode=" + postCode.value + "&CurrentWebsite=" + currentWebsite.value + "&Subject=" + subject.value + "&HowDidYouHear=" + howDidYouHear.value + "&Message=" + message.value;
    xhr.open("POST", url, true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.setRequestHeader("Content-length", params.length);
    xhr.setRequestHeader("Connection", "close");
    xhr.onreadystatechange = function() { ApplyEnquire(xhr);};
    xhr.send(params);
    
    document.getElementById("td_EnquireButtons").innerHTML = '<div id="btn_SubmitEnquire" class="div_link1">Submit</div>';
    document.getElementById("div_errmsg_contact").innerHTML = "Sending message... Please wait.";
}

function ApplyEnquire(xhr) {
    // Check that the response was received successfully.
    if (xhr.readyState === 4) {
        if (xhr.status == 200) {
            response = xhr.responseText;
            divErrMsgContact = document.getElementById("div_errmsg_contact");
            if (divErrMsgContact) {
                if (response == "ok")
                {
                    divErrMsgContact.innerHTML = "Message sent. Thank you.";
                    document.getElementById("td_EnquireButtons").innerHTML = '<div id="btn_SubmitEnquire" class="div_link1" onclick="location.href=\'Contact.html\'">Reset</div>';
                }
                else
                {
                    document.getElementById("td_EnquireButtons").innerHTML = '<div id="btn_SubmitEnquire" class="div_link1" onclick="location.href=\'Contact.html\'">Reset</div>';
                    divErrMsgContact.innerHTML = "We are experiencing a problem with our message server. Please try later or send us an e-mail. Thank you. " + response;
                }
            }
        }
    }
}



