/** * Global JavaScript Definitions * * @author Matt Gifford * @copyright 2008 Timeshifting Interactive Limited * @version 1.5.9 */ var viewHandler = WebPage; var onLoadTasks = []; var onUnloadTasks = []; // Execute on load handler window.onload = function() { if (viewHandler !== WebPage) { // Extend the base page class and create the xhtml object viewHandler.inheritsFrom( WebPage ); xhtml = new viewHandler(); } else { // Create a generic page xhtml object xhtml = new WebPage(); } // Main page initialization xhtml.init(); // Execute secondary on load tasks for (var x = 0; x < onLoadTasks.length; x++) { onLoadTasks[x](); } } // Execute on unload handler window.onunload = function() { // Execute on unload tasks for (var x = 0; x < onUnloadTasks.length; x++) { onUnloadTasks[x](); } } /** * Creates a new WebPage object with methods used by all pages, can be extended to add page specific methods. * * @author Matt Gifford * @copyright 2008 Timeshifting Interactive Limited */ function WebPage() { // Step 1. Define Properties var _instance = this; this.initialized = false; this.debug = false; this.emptyFunction = function() {}; this.log = function(msg) { if (typeof(console) != 'undefined') { console.log(msg); } }; // Step 2. Define Public Methods /** * Sets up the initial page state and event handlers */ this.init = function() { this.initUserAgentBooleans(); this.initAnchors(); this.initInputButtons(); // Set class as initialized this.initialized = true; } /** * Sets up user agent booleans */ this.initUserAgentBooleans = function() { this.renderingEngine = ''; var ua = navigator.userAgent.toLowerCase(); var macintosh = (ua.indexOf("macintosh") != -1 || ua.indexOf("powerpc") != -1 || ua.indexOf("mac os x") != -1) ? 1 : 0; // Opera if (this.isPresto = !!window.opera) { this.renderingEngine = 'presto'; } // Safari, Apple WebKit, Konqueror, etc if (this.isWebKit = (ua.indexOf('applewebkit') != -1)) { this.renderingEngine = 'webkit'; } // Netscape, Mozilla, Firefox, etc if (this.isGecko = (ua.indexOf('gecko') != -1 && ua.indexOf('khtml') == -1)) { this.renderingEngine = 'gecko'; } // Internet Explorer for Windows if (this.isTrident = !!(window.attachEvent && !window.opera)) { this.renderingEngine = 'trident'; } // Macintosh this.isMac = macintosh; // Internet Explorer 5 for Windows this.isTrident5 = (this.isTrident && ua.indexOf('msie 5') != -1) ? 1 : 0; // Internet Explorer 6 for Windows this.isTrident6 = (this.isTrident && ua.indexOf('msie 6') != -1) ? 1 : 0; // Internet Explorer 7 for Windows this.isTrident7 = (this.isTrident && ua.indexOf('msie 7') != -1) ? 1 : 0; // Safari this.isSafari = (this.isWebKit && (ua.indexOf('safari') != -1)); // Safari 3 this.isSafari3 = (this.isWebKit && (ua.indexOf('safari') != -1) && window.devicePixelRatio && (ua.indexOf('mobile') == -1)); // Mobile Safari this.isMobileSafari = (this.isWebKit && (ua.indexOf('safari') != -1) && window.devicePixelRatio && (ua.indexOf('mobile') != -1)); // Firefox this.isFirefox = (this.isGecko && (navigator.vendor == "Firefox" || ua.indexOf('firefox') != -1)) ? 1 : 0; // Firefox 1.x this.isFirefox1 = (this.isGecko && navigator.vendor == "Firefox") ? 1 : 0; } /** * Adds standard event handlers to process in-page links and offsite links */ this.initAnchors = function() { var links = document.getElementsByTagName('a'); for (var x = 0; x < links.length; x++) { // 1. Make offsite links and pdfs open in a new tab/window if (/\b(offsite|pdf)\b/.exec(links[x].className)) { links[x].onclick = function() { window.open(this.href,'_blank'); return false; } } // 2. Make inpage links smooth scroll if (/\binpage\b/.exec(links[x].className)) { var url = links[x].href; var startPos = url.indexOf('#')+1; var endPos = url.length; var target = url.substring(startPos, endPos); links[x].onclick = new Function('xhtml.smoothScroll("' + target + '");'); links[x].href = 'javascript:void(1);'; } // 3. Set the active class on links to the current page if (links[x].href == window.location.toString()) { if (links[x].className.indexOf('active') == -1) { links[x].className += ' active'; } } } } /** * Adds rollover support to input[type=image] elements */ this.initInputButtons = function() { var rolloverCache = []; var inputs = document.getElementsByTagName('input'); for (var x = 0; x < inputs.length; x++) { // Check if it's an image button with a roll over if (inputs[x].type == 'image' && inputs[x].className.indexOf('hasRollover') != -1) { // 1. Add event handlers to swap the images inputs[x].onmouseover = function() { this.src = this.src.replace(/\.(gif|jpg|png)/, '-over.$1'); } inputs[x].onmouseout = function() { this.src = this.src.replace(/-over\.(gif|jpg|png)/, '.$1'); } // 2. Pre-cache the rollover image var newImage = new Image(); newImage.src = inputs[x].src.replace(/\.(gif|jpg|png)/i, '-over.$1'); rolloverCache[rolloverCache.length] = newImage; } } } /** * Scrolls the page to the specified element * * @param elementId The ID of the element to scroll to * @param elementY The Y position of element (optional, will be calculated if not specified) */ this.smoothScroll = function(elementId, elementY) { // If the elements vertical location hasn't been specificed, calculate it if (arguments.length != 2) { // Get it's offset obj = document.getElementById(elementId); obj.style.display = 'block'; // Make sure it's visible, otherwise we can't get it's location elementY = obj.offsetTop; // If its parent is relative or absolutely positioned, find it's offset and add it to the total while (obj.offsetParent) { obj = obj.offsetParent; elementY += obj.offsetTop; } // Make the scroll stop just above the target (looks nicer) elementY -= 45; if (elementY < 0) { elementY = 0; } // Check to see we're not trying to scroll off the end of the page var contentHeight = document.getElementById('page').offsetHeight; var windowHeight = (window.innerHeight ? window.innerHeight : (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)); if ( (contentHeight - windowHeight) < elementY) { elementY = (contentHeight - windowHeight); } } // Get the current window scroll position var yPos = window.scrollY ? window.scrollY : (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); // Calculate the pixels remaining to scroll and the scroll step size var distanceLeft = Math.abs(yPos - elementY); var stepSize = 100; if (distanceLeft < 400) { stepSize = 60; } if (distanceLeft < 200) { stepSize = 20; } if (distanceLeft < 50) { stepSize = 10; } // Calculate the scroll if (yPos < elementY) { // Scroll down yPos += stepSize; // Check if we're scrolled past the target if (elementY < yPos) { yPos = elementY; } } else if (elementY < yPos) { // Scroll Up yPos -= stepSize; // Check if we're scrolled past the target if (yPos < elementY) { yPos = elementY; } } // Check for less than zero if (yPos < 0) { yPos = 0; } if (elementY < 0) { elementY = 0; } // Scroll window window.scrollTo(0, yPos); // If we haven't reached the target, run the another scroll step if (yPos != elementY) { setTimeout("xhtml.smoothScroll('"+elementId+"',"+elementY+");", 10); } } /** * Toggle Detail Box * * @param id The box id * @param obj The anchor object */ this.toggleBox = function(id, obj) { switch (obj.className) { case 'expanded': obj.className = 'collapsed'; document.getElementById(id).className = 'hidden'; obj.getElementsByTagName('img')[0].src = obj.getElementsByTagName('img')[0].src.replace('collapse', 'expand'); break; default: obj.className = 'expanded'; document.getElementById(id).className = 'detailsBox'; obj.getElementsByTagName('img')[0].src = obj.getElementsByTagName('img')[0].src.replace('expand', 'collapse'); break; } } // Step 3. Define Private Methods /** * Finds the parent of the element with a node type of parentTagName * * @param element The element object to find the parent of * @param parentTagName The type of parent element to find * * @return The element's parent object of the specified type, or null if no parent of that type could be found */ function findParent(element, parentTagName) { if (element == null) { return null; } else { if ( element.nodeType == 1 && element.tagName.toLowerCase() == parentTagName.toLowerCase() ) { return element; } else { return findParent(element.parentNode, parentTagName); } } } } /** * Inherts a prototype from the specified class, updates the constructor reference * * @param parent The parent class or object * @return The inherted object */ Function.prototype.inheritsFrom = function( baseClass ) { // Inherit the base class this.prototype = new baseClass; this.prototype.constructor = this; // Add access to the base's methods this.prototype.base = {}; for (method in this.prototype) { // hasOwnProperty test is a workaround for "for..in" bug, see: http://yuiblog.com/blog/2006/09/26/for-in-intrigue/ if (typeof this.prototype[method] === 'function' && this.prototype.hasOwnProperty(method) && this.prototype[method] !== this.prototype.constructor) { this.prototype.base[method] = this.prototype[method]; } } return this; }