function showInStage(img)
{
    var imgStage = document.getElementById('imgStage');
    imgStage.src=img.alt;
}

function selectTab(tabIndex)
{
    var Fashion = document.getElementById('Fashion');
    var Family = document.getElementById('Family');
    var People = document.getElementById('People');
    var Events = document.getElementById('Events');
    
    deselectAllTab();
    
    switch(tabIndex)
    {
        case 0:
        {
            Fashion.className='tab-page-first-button-selected';
            LoadImages('fashion','f');
            break;
        }
        case 1:
        {
            Family.className='tab-page-button-selected';
            LoadImages('family','fa');
            break;
        }
        case 2:
        {
            People.className='tab-page-button-selected';
            LoadImages('people','p');
            break;
        }
        case 3:
        {
            Events.className='tab-page-button-selected';
            LoadImages('events','e');
            break;
        }
    }
}

function deselectAllTab()
{
    var Fashion = document.getElementById('Fashion');
    var Family = document.getElementById('Family');
    var People = document.getElementById('People');
    var Events = document.getElementById('Events');
    
   Fashion.className='tab-page-first-button';
   Family.className='tab-page-button';
   People.className='tab-page-button';
   Events.className='tab-page-button';
}

function LoadImages(directory, fileStart)
{
    for(var i=1;i<=8;i++)
    {
        var img = document.getElementById('img' + i.toString());
        img.src='images/' + directory + '/' + fileStart + i.toString() + '.jpg';
        img.alt='images/' + directory + '/' + fileStart + i.toString() + 'l.jpg';
        if(i==1) showInStage(img);
    }
}

var xmlDoc; // = new ActiveXObject("Microsoft.XMLDOM"); 
function loadXML() {
    var xmlDoc;
    var xmlFile = 'Events-Gallery.xml';
    try //Internet Explorer
  {
      xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
      xmlDoc.async = "false";
      xmlDoc.onreadystatechange = verify;

      xmlDoc.load(xmlFile);

      xmlObj = xmlDoc.documentElement;
      document.getElementById('eg1').innerHTML = xmlObj.childNodes(0).text;
      document.getElementById('eg2').innerHTML = xmlObj.childNodes(1).text;
      document.getElementById('eg3').innerHTML = xmlObj.childNodes(2).text;
      document.getElementById('eg4').innerHTML = xmlObj.childNodes(3).text;
        return;
    }
    catch (e) {
        try //Firefox, Mozilla, Opera, etc.
    {
            var xmlhttp = new window.XMLHttpRequest();
            xmlhttp.open("GET", xmlFile, false);
            xmlhttp.send(null);
            xmlDoc = xmlhttp.responseXML.documentElement;
            document.getElementById('eg1').innerHTML = xmlDoc.childNodes[1].firstChild.nodeValue;
            document.getElementById('eg2').innerHTML = xmlDoc.childNodes[3].firstChild.nodeValue;
            document.getElementById('eg3').innerHTML = xmlDoc.childNodes[5].firstChild.nodeValue;
            document.getElementById('eg4').innerHTML = xmlDoc.childNodes[7].firstChild.nodeValue;
        }
        catch (e) {
            alert(e.message);
            return;
        }
    }

}

function verify() {
    // 0 Object is not initialized 
    // 1 Loading object is loading data 
    // 2 Loaded object has loaded data 
    // 3 Data from object can be worked with 
    // 4 Object completely initialized 
    if (xmlDoc.readyState != 4) {
        return false;
    }
}