﻿///////////////////////////////////////////////////////////////////////////////
//
//  wcoPageManager.js
//
// © 2007-2010 Wco iEnterprise Solutions Pty Ltd. ALL RIGHTS RESERVED.
// This file is licensed as part of the DataPortal 3.0 Web Presence Solution, for details look here: http://www.wco.com.au
//
///////////////////////////////////////////////////////////////////////////////

HtmlMapPopupObject = function (parentObject) {
  this.parent = parentObject;
  this.mapURL = '';
  this.isOpen = false;

  var html = '<div id="popupMapLinkContainer">';
  html += '<table id="popupMapLinkBkg">';
  html += '<tr>';
  html += '<td align="center" valign="top" nowrap="true" style="width:100%;">';
  
  html += '<p id="mapLink"><a hidefocus="true" href="javascript:void(0);">VIEW MAP</a></p>';
  
  html += '</td>';
  html += '</tr>';
  html += '</table>';
  html += '</div>';

  $('#popupMapElement').append(html);

  // activate the click event to display the popup map
  $('#mapLink').click(function (e) {
	  if (!e) var e = window.event;
	  e.cancelBubble = true;
	  if (e.stopPropagation) e.stopPropagation();
      
    pageManager.titlebar.mapPopup.display();

    if ($('#mapLink a').html() == 'VIEW MAP') {
      $('#mapLink a').html('HIDE MAP');
    }
    else {
      $('#mapLink a').html('VIEW MAP');
    }
  });
}

HtmlMapPopupObject.prototype = {
  init: function (websiteData) {
    this.mapURL = websiteData.MapReference;

    var html = '<div id="popupMapContainer">';
    html += '</div>';

    $('#popupMapElement').append(html);

  },

  display: function () {
    $('#popupMapContainer').toggle("slow", createDelegate(this, this.getMap));
  },

  getMap: function () {
    if (!this.isOpen) {
      //var html = '<iframe width="300" height="300" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" style="border:solid 1px #333333;" src="http://maps.google.com.au/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Contraceptive+Services&amp;sll=-33.864472,151.20582&amp;sspn=0.011653,0.022466&amp;ie=UTF8&amp;cid=7410598644232527603&amp;ll=-33.867458,151.212516&amp;spn=0.01069,0.009441&amp;z=15&amp;output=embed"></iframe>';
      var html = '<iframe width="300" height="300" frameborder="0" scrolling="no" style="border:solid 1px #333333; margin:21px 0 0 21px; padding:0;" src="' + this.mapURL + '"></iframe>';
      $('#popupMapContainer').append(html);
      // toggle the isOpen flag so that the map is only loaded once on the first time the popup is opened
      this.isOpen = true;
    }
    else
    {
      $('#popupMapContainer').empty();
      // toggle the isOpen flag so that the map is only loaded once on the first time the popup is opened
      this.isOpen = false;
    }

  },

  hide: function () {
    $('#popupMapContainer').empty();
    $('#popupMapContainer').hide("fast");
    // toggle the isOpen flag so that the map is only loaded once on the first time the popup is opened
    this.isOpen = false;
    this.parent.resetMapLink();
  }
}


///////////////////////////////////////////////////////////////////////////////
HtmlTitleBarObject = function (parentObject) {
  this.parent = parentObject;

  var html = '<table border="0" cellpadding="0" cellspacing="0" style="width:100%; height:135px; margin:0; padding:0;">';
  html += '<tr>';
  html += '<td align="center" valign="top" style="width:100%; margin:0; padding:0;">';
  
  html += '<table id="titlebarContainer" border="0" cellpadding="0" cellspacing="0" style="position:static; width:956px; margin:0; padding:0;">';
  html += '</table>';

  html += '</td>';
  html += '</tr>';
  html += '</table>';

  $('#titlebarElement').append(html);

  this.mapPopup = new HtmlMapPopupObject(this);

}

HtmlTitleBarObject.prototype = {
  init: function (websiteData) {

    var table = $('#titlebarContainer')[0];

    // insert the titlebar contact details block
    var row = table.insertRow(-1);
    var cell = row.insertCell(-1);
    cell.id = 'titlebarContactDetails';
    cell.vAlign = 'top';
    var html = '<p class="siteContactPrimary">' + websiteData.TelephoneNo + '</p>';
    html += '<p class="siteContractAddress">' + websiteData.AddressLine1.toUpperCase() + '<br/>' + websiteData.AddressLine2.toUpperCase() + '<br/>' + websiteData.AddressLine3.toUpperCase() + '</p>';
    cell.innerHTML = html;

    // initialise the popup map
    this.mapPopup.init(websiteData);

    // insert the titlebar logotype image
    //alert(websiteData.TitlebarImage);
    if (websiteData.TitlebarImage.indexOf("/") == 0) {
      var titlebarImageClass = {
        'background-image': "url('ssl/images" + websiteData.TitlebarImage + "')",
        'background-repeat': 'no-repeat'
      };
    }
    else {
      var titlebarImageClass = {
        'background-image': "url('" + websiteData.TitlebarImage + "')",
        'background-repeat': 'no-repeat'
      };
    }
    var cell = row.insertCell(-1);
    cell.id = 'titlebarHeader';
    var html = '<img src="ssl/images/spacer.gif" style="width:754px; height:135px;" alt="" />';
    cell.innerHTML = html;
    $(cell).css(titlebarImageClass);

    // display the titlebar ui element
    $('#titlebarElement').show();
  },

  resetMapLink: function () {
    $('#mapLink a').html('VIEW MAP');
  }
}


///////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
HtmlLanguageMenuItemObject = function (parentObject, rootElement, index, ancestorData, currentData) {
  this.parent = parentObject;
  this.index = index;
  this.languageId = 'en';
  switch (index) {
    case 1:
      this.languageId = 'ch';
      break;
    case 2:
      this.languageId = 'ko';
      break;
    case 3:
      this.languageId = 'jp';
      break;
    default:
      this.languageId = 'en';
      break;
  }
  
  this.id = currentData.Id;
  this.name = currentData.Name //.toUpperCase();
  this.ancestorData = ancestorData;
  this.currentData = currentData;

  this.cell = rootElement.insertCell(-1);
  this.cell.id = 'languageItem-' + index;
  this.cell.noWrap = true;
  $(this.cell).addClass('languagebarItem');
  this.cell.innerHTML = '<p><a hidefocus="true" href="javascript:void(0);">' + this.name + '</a></p>';

  // activate the click event on each of the languagebar menu items
  $(this.cell).click(function () {
    var parts = this.id.split('-');
    var idx = new Number(parts[1]);
    pageManager.languagebar.goToLanguage(idx);
  });

  this.isSelected = false;
}
///////////////////////////////////////////////////////////////////////////////

HtmlLanguageMenuItemObject.prototype = {
  select: function () {
    this.isSelected = true;
    $(this.cell).hide();
  },

  unselect: function () {
    this.isSelected = false;
    $(this.cell).show();
  }
}
///////////////////////////////////////////////////////////////////////////////

HtmlLanguageBarObject = function (parentObject) {
  this.parent = parentObject;

  var html = '<table id="languagebarContainer">';
  html += '<tr>';
  html += '<td align="center" nowrap="true">';
  
  html += '<table id="languagebarBkg">';
  html += '<tr>';
  html += '<td align="center" nowrap="true" style="width:100%;">';
  
  html += '<table id="languagebar">';
  html += '</table>';
  
  html += '</td>';
  html += '</tr>';
  html += '</table>';
  
  html += '</td>';
  html += '</tr>';
  html += '</table>';

  $('#languageElement').append(html);

//  // activate the mouseover event on the languagebar
//  $('#languagebarBkg').mouseover(function () {
//    var css = { 'background-image':"url('ssl/images/LanguagebarBkg.png')" };
//    $('#languagebarBkg').css(css);
//  });
//  
//  // activate the mouseover event on the languagebar
//  $('#languagebarBkg').mouseout(function () {
//    var css = { 'background-image':"url('ssl/images/spacer.gif')" };
//    $('#languagebarBkg').css(css);
//  });
//  
  this.currentLanguageIdx = 0;
  this.items = new Array();
}
///////////////////////////////////////////////////////////////////////////////

HtmlLanguageBarObject.prototype = {
  init: function (websiteData, languageCollection) {
    var row = $('#languagebar')[0].insertRow(-1);

    for (var l = 0; l < languageCollection.length; l++) {
      var idx = this.items.length;
      this.items[idx] = new HtmlLanguageMenuItemObject(this, row, idx, websiteData, languageCollection[l]);
    }

  },

  goToLanguage: function (index) {
    // unselect the current language menu item
    this.items[this.currentLanguageIdx].unselect();

    // and cancel any pending dataportal request
    if (dataportal.request) {
      dataportal.cancelRequest();
    }

    //dataportal.fetchCurrentObject = function (parentClassTypeId,
    //                                          parentId,
    //                                          parentCustomObjectId,
    //                                          classTypeId,
    //                                          className,
    //                                          classId,
    //                                          objId) {
    dataportal.setCallback(createDelegate(this.parent, this.parent.loadNavigator));
    dataportal.fetchCurrentObject(this.items[index].ancestorData.ClassTypeId, this.items[index].ancestorData.Id, this.items[index].ancestorData.CustomObjectId, this.items[index].currentData.ClassTypeId, this.items[index].currentData.ClassName, this.items[index].currentData.ClassId, this.items[index].currentData.Id);

    // and select the new language menu item
    this.currentLanguageIdx = index;
    this.items[this.currentLanguageIdx].select();
  }
}
///////////////////////////////////////////////////////////////////////////////

HtmlFooterObject = function (parentObject) {
  this.parent = parentObject;

}
///////////////////////////////////////////////////////////////////////////////

HtmlFooterObject.prototype = {
  init: function (websiteData) {
    var html = '<span id="footerCopyrightNotice">' + websiteData.CopyrightNotice + '</span><span>&#160;&#160;|&#160;&#160;Website by <a href="javascript:void(0);" onclick="javascript:window.open(\'http://www.wco.com.au\', \'_blank\');" title="Opens Wco iEnterprise Solutions in a new window" hidefocus="true">Wco iEnterprise Solutions</a></span>';
    //html += ' <span>&#160;&#160;|&#160;&#160;<a href="javascript:void(0);" onclick="javascript:window.open(\'http://localhost:1148/MSC2009.SSL/Default.aspx'
    //html += ' <span>&#160;&#160;|&#160;&#160;<a href="javascript:void(0);" onclick="javascript:window.open(\'http://contraceptiveservices.com.au/SSL/Default.aspx'
    //html += ' <span>&#160;&#160;|&#160;&#160;<a href="javascript:void(0);" onclick="javascript:window.open(\'https://wic027v.server-secure.com/vs281182_secure/Default.aspx'
    //html += ' <span>&#160;&#160;|&#160;&#160;<a href="javascript:void(0);" onclick="javascript:window.open(\'http://localhost/MSC2009.SSL/Default.aspx'
    html += ' <span>&#160;&#160;|&#160;&#160;<a href="javascript:void(0);" onclick="javascript:window.open(\'http://localhost/CS2010.Web/SSL/Default.aspx'
                                                                                  + '?portalGuid=' + escape(dataportal.session.PortalGuid)
                                                                                  + '&websiteId=' + escape(dataportal.session.WebSiteId)
                                                                                  + '&userGuid=' + escape(dataportal.session.UserGuid)
                                                                                  + '&sessionId=' + escape(dataportal.session.SessionId)
                                                                                  + '&clientGuid=' + escape(dataportal.session.ClientGuid)
                                                                                  + '&clientIPAddress=' + escape(dataportal.session.ClientIPAddress)
                                                                                  + '&clientCultureName=' + escape(dataportal.session.DefaultCultureCode)
                                                                                  + '&key=00000000-0000-0000-0000-000000000000'
                                                                                  + '\', \'_blank\');" title="[Administrative use only]" hidefocus="true">Site Administration</a></span>';
    $('#footerElement').append(html);
  }
}
///////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
/*<remarks>
Name:        HtmlPageManagerObject Class
Method:      constructor
Description: Instantiates a new instance of the pageManager object, making it ready to receive and process calls to the DataPortal Web service.
Parameters:  [none]
</remarks>*/
HtmlPageManagerObject = function () {
  // remove any hard text from the display element
  $('#displayElement').empty();
  // declare the module-level fields for this object
  this.titlebar = new HtmlTitleBarObject(this);
  this.languagebar = new HtmlLanguageBarObject(this);
  this.navigator = new HtmlNavigatorObject(this);
  this.footer = new HtmlFooterObject(this);

  // comment out the instantiation of the security manager for production verions
  // until the online bookings sub-system in completed
  //this.securityManager = new HtmlSecurityManagerObject(this);

  this.websiteData = null;

  this.isInitialised = false;

}

///////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
/*<remarks>
Description: Defines the  methods of the HtmlPageManagerObject Class.
</remarks>*/
HtmlPageManagerObject.prototype = {
  /*<remarks>
  Method:      init
  Description: Initialises the object's members and runs through any required startup procedures.
  Parameters:  [none]
  </remarks>*/
  init: function () {
    this.websiteData = arguments[0];
    var childCollection = arguments[1];

    // display the titlebar object
    this.titlebar.init(this.websiteData);

    // initialise the footer element
    this.footer.init(this.websiteData);

    // initialise the languagebar element
    this.languagebar.init(this.websiteData, childCollection);

    // activate the click event to hide the popup map
    // on any background click
    $('#bodyElement').click(function () {
      pageManager.titlebar.mapPopup.hide();
      pageManager.navigator.content.closeLightbox();
    });

    // initialise the security manager object (if the object exists)
    if (this.securityManager) {
      this.securityManager.init(this.websiteData);
    }

    // and trigger the method that will cascade through the system and load
    // the ui with the default home page content in the default language
    this.languagebar.goToLanguage(0);

  },

  loadNavigator: function () {
    // retrieve the data for the home page and the set of top-level sections
    var currentObject = arguments[0];
    var childCollection = arguments[1];

    // initialise the navigator
    this.navigator.init(currentObject, childCollection);

    // now that all the ui elements have been instantiated and initialised,
    // redo the window layout to ensure all ui elements are
    // displayed in their correct positions
    if (!this.isInitialised) {
      this.onWindowResize();
    }

    // set the initialisation flag
    this.isInitialised = true;

    // display the link to the popup map and signin
    $('#popupMapElement').show();
    $('#securityElement').show();
    if (this.languagebar.items.length > 1) {
      // display the language bar
      $('#languageElement').show();
    }
    // display the footer element
    $('#footerElement').show();
    // and display the navigator
    this.navigator.start();

  },

  display: function () {

  },

  onWindowResize: function () {
    // get the document width and height values
    var w = $(window).width();
    var h = $(window).height();

    // reposition the navigator element
    var offset = $("#navigatorElement").offset();
    var newT = offset.top;
    var newL = ((w - 956) / 2);
    $("#navigatorElement").offset({ top: newT, left: newL });

    // reposition the languagebar element
    var offset = $("#languageElement").offset();
    var newT = offset.top;
    var newL = ((w - 956) / 2);
    $("#languageElement").offset({ top: newT, left: newL });

    // reposition the content element
    var offset = $("#displayElement").offset();
    var newT = offset.top;
    var newL = ((w - 956) / 2);
    $("#displayElement").offset({ top: newT, left: newL });

    // reposition the footer element
    var offset = $("#footerElement").offset();
    var newT = offset.top;
    var newL = ((w - 956) / 2);
    $("#footerElement").offset({ top: newT, left: newL });

    // reposition the popup window element
    var offset = $("#popupMapElement").offset();
    var newT = offset.top;
    var newL = (($(window).width() / 2) - 478);
    $("#popupMapElement").offset({ top: newT, left: newL });

    if (this.securityManager) {
      // reposition the popup signin element
      var offset = $("#securityElement").offset();
      var newT = offset.top;
      var newL = (($(window).width() / 2) + 478 - 90);
      $("#securityElement").offset({ top: newT, left: newL });
    }

    //window.defaultStatus = 'w = ' + w + ' : newL = ' + newL;
  }

}

