/* begin Page */

/* Generated with Artisteer version 2.2.0.17981, file checksum is 39472EAE. */

var artEventHelper = {
	'bind': function(obj, evt, fn) {
		if (obj.addEventListener)
			obj.addEventListener(evt, fn, false);
		else if (obj.attachEvent)
			obj.attachEvent('on' + evt, fn);
		else
			obj['on' + evt] = fn;
	}
};

var userAgent = navigator.userAgent.toLowerCase();
var browser = {
	version: (userAgent.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/) || [])[1],
	safari: /webkit/.test(userAgent) && !/chrome/.test(userAgent),
	chrome: /chrome/.test(userAgent),
	opera: /opera/.test(userAgent),
	msie: /msie/.test(userAgent) && !/opera/.test(userAgent),
	mozilla: /mozilla/.test(userAgent) && !/(compatible|webkit)/.test(userAgent)
};

var artLoadEvent = (function() {
	

	var list = [];

	var done = false;
	var ready = function() {
		if (done) return;
		done = true;
		for (var i = 0; i < list.length; i++)
			list[i]();
	};

	if (document.addEventListener && !browser.opera)
		document.addEventListener('DOMContentLoaded', ready, false);

	if (browser.msie && window == top) {
		(function() {
			try {
				document.documentElement.doScroll('left');
			} catch (e) {
				setTimeout(arguments.callee, 10);
				return;
			}
			ready();
		})();
	}

	if (browser.opera) {
		document.addEventListener('DOMContentLoaded', function() {
			for (var i = 0; i < document.styleSheets.length; i++) {
				if (document.styleSheets[i].disabled) {
					setTimeout(arguments.callee, 10);
					return;
				}
			}
			ready();
		}, false);
	}

	if (browser.safari) {
		var numStyles;
		(function() {
			if (document.readyState != 'loaded' && document.readyState != 'complete') {
				setTimeout(arguments.callee, 10);
				return;
			}
			if ('undefined' == typeof numStyles) {
				numStyles = document.getElementsByTagName('style').length;
				var links = document.getElementsByTagName('link');
				for (var i = 0; i < links.length; i++) {
					numStyles += (links[i].getAttribute('rel') == 'stylesheet') ? 1 : 0;
				}
				if (document.styleSheets.length != numStyles) {
					setTimeout(arguments.callee, 0);
					return;
				}
			}
			ready();
		})();
	}

	artEventHelper.bind(window, 'load', ready);

	return ({
		add: function(f) {
			list.push(f);
		}
	})
})();

(function() {
	// fix ie blinking
	var m = document.uniqueID && document.compatMode && !window.XMLHttpRequest && document.execCommand;
	try { if (!!m) { m('BackgroundImageCache', false, true); } }
	catch (oh) { };
})();

function xGetElementsByClassName(clsName, parentEle, tagName) {
	var elements = null;
	var found = [];
	var s = String.fromCharCode(92);
	var re = new RegExp('(?:^|' + s + 's+)' + clsName + '(?:$|' + s + 's+)');
	if (!parentEle) parentEle = document;
	if (!tagName) tagName = '*';
	elements = parentEle.getElementsByTagName(tagName);
	if (elements) {
		for (var i = 0; i < elements.length; ++i) {
			if (elements[i].className.search(re) != -1) {
				found[found.length] = elements[i];
			}
		}
	}
	return found;
}

var styleUrlCached = null;
function GetStyleUrl() {
	if (null == styleUrlCached) {
		var ns;
		styleUrlCached = '';
		ns = document.getElementsByTagName('link');
		for (var i = 0; i < ns.length; i++) {
			var l = ns[i];
			if (l.href && /template\.css(\?.*)?$/.test(l.href)) {
				return styleUrlCached = l.href.replace(/template\.css(\?.*)?$/, '');
			}
		}

		ns = document.getElementsByTagName('style');
		for (var i = 0; i < ns.length; i++) {
			var matches = new RegExp('import\\s+"([^"]+\\/)template\\.css"').exec(ns[i].innerHTML);
			if (null != matches && matches.length > 0)
				return styleUrlCached = matches[1];
		}
	}
	return styleUrlCached;
}

function fixPNG(element) {
	if (/MSIE (5\.5|6).+Win/.test(navigator.userAgent)) {
		var src;
		if (element.tagName == 'IMG') {
			if (/\.png$/.test(element.src)) {
				src = element.src;
				element.src = GetStyleUrl() + '../images/spacer.gif';
			}
		}
		else {
			src = element.currentStyle.backgroundImage.match(/url\("(.+\.png)"\)/i);
			if (src) {
				src = src[1];
				element.runtimeStyle.backgroundImage = 'none';
			}
		}
		if (src) element.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "')";
	}
}

function artHasClass(el, cls) {
    return (el && el.className && (' ' + el.className + ' ').indexOf(' ' + cls + ' ') != -1);
}/* end Page */

/* begin Menu */
function Insert_Separators() {
	var menus = xGetElementsByClassName("art-menu", document);
	for (var i = 0; i < menus.length; i++) {
		var menu = menus[i];
		var childs = menu.childNodes;
		var listItems = [];
		for (var j = 0; j < childs.length; j++) {
			var el = childs[j];
			if (String(el.tagName).toLowerCase() == "li") listItems.push(el);
		}
		for (var j = 0; j < listItems.length - 1; j++) {
			var span = document.createElement('span');
			span.className = 'art-menu-separator';
			var li = document.createElement('li');
			li.appendChild(span);
			listItems[j].parentNode.insertBefore(li, listItems[j].nextSibling);
		}
	}
}
artLoadEvent.add(Insert_Separators);

function Menu_IE6Setup() {
	var isIE6 = navigator.userAgent.toLowerCase().indexOf("msie") != -1
    && navigator.userAgent.toLowerCase().indexOf("msie 7") == -1;
	if (!isIE6) return;
	var aTmp2, i, j, oLI, aUL, aA;
	var aTmp = xGetElementsByClassName("art-menu", document, "ul");
	for (i = 0; i < aTmp.length; i++) {
		aTmp2 = aTmp[i].getElementsByTagName("li");
		for (j = 0; j < aTmp2.length; j++) {
			oLI = aTmp2[j];
			aUL = oLI.getElementsByTagName("ul");
			if (aUL && aUL.length) {
				oLI.UL = aUL[0];
				aA = oLI.getElementsByTagName("a");
				if (aA && aA.length)
					oLI.A = aA[0];
				oLI.onmouseenter = function() {
					this.className += " art-menuhover";
					this.UL.className += " art-menuhoverUL";
					if (this.A) this.A.className += " art-menuhoverA";
				};
				oLI.onmouseleave = function() {
					this.className = this.className.replace(/art-menuhover/, "");
					this.UL.className = this.UL.className.replace(/art-menuhoverUL/, "");
					if (this.A) this.A.className = this.A.className.replace(/art-menuhoverA/, "");
				};
			}
		}
	}
}
artLoadEvent.add(Menu_IE6Setup);
/* end Menu */

/* begin Button */
function artButtonsSetupJsHover(className) {
	var tags = ["input", "a", "button"];
	for (var j = 0; j < tags.length; j++){
		var buttons = xGetElementsByClassName(className, document, tags[j]);
		for (var i = 0; i < buttons.length; i++) {
			var button = buttons[i];
			if (!button.tagName || !button.parentNode) return;
			if (!artHasClass(button.parentNode, 'art-button-wrapper')) {
				if (!artHasClass(button, 'art-button')) button.className += ' art-button';
				var wrapper = document.createElement('span');
				wrapper.className = "art-button-wrapper";
				if (artHasClass(button, 'active')) wrapper.className += ' active';
				var spanL = document.createElement('span');
				spanL.className = "l";
				spanL.innerHTML = " ";
				wrapper.appendChild(spanL);
				var spanR = document.createElement('span');
				spanR.className = "r";
				spanR.innerHTML = " ";
				wrapper.appendChild(spanR);
				button.parentNode.insertBefore(wrapper, button);
				wrapper.appendChild(button);
			}
			artEventHelper.bind(button, 'mouseover', function(e) {
				e = e || window.event;
				wrapper = (e.target || e.srcElement).parentNode;
				wrapper.className += " hover";
			});
			artEventHelper.bind(button, 'mouseout', function(e) {
				e = e || window.event;
				button = e.target || e.srcElement;
				wrapper = button.parentNode;
				wrapper.className = wrapper.className.replace(/hover/, "");
				if (!artHasClass(button, 'active')) wrapper.className = wrapper.className.replace(/active/, "");
			});
			artEventHelper.bind(button, 'mousedown', function(e) {
				e = e || window.event;
				button = e.target || e.srcElement;
				wrapper = button.parentNode;
				if (!artHasClass(button, 'active')) wrapper.className += " active";
			});
			artEventHelper.bind(button, 'mouseup', function(e) {
				e = e || window.event;
				button = e.target || e.srcElement;
				wrapper = button.parentNode;
				if (!artHasClass(button, 'active')) wrapper.className = wrapper.className.replace(/active/, "");
			});
		}
	}
}
artLoadEvent.add(function() { artButtonsSetupJsHover("art-button"); });
/* end Button */



artLoadEvent.add(function() {
  artButtonsSetupJsHover("button");
  artButtonsSetupJsHover("readon");
});


/* Photoshuffler  */


  //
  // CSS Linked Photo Shuffler v1.1 by
  //   Carl Camera
  //   http://iamacamera.org 
  //
  // SetOpacity Function and inpiration from Photo Fade by
  //   Richard Rutter
  //   http://clagnut.com
  //
  // License: Creative Commons Attribution 2.5  License
  //   http://creativecommons.org/licenses/by/2.5/
  //

  // Customize your photo shuffle settings
  // 
  // * Surround the target <img /> with an anchor <a> and <div>. 
  //   specify unique id= in all three
  // * The first and final photo displayed is in the html <img> tag
  // * The image array contains paths to photos you want in the rotation. 
  //   If you want the first photo in the rotation, then it's best to
  //   put it as the final array image.  All photos must be same dimension
  // * The Href array contains the link you want associated with each image
  //   each image must have a corresponding link.
  // * The rotations variable specifies how many times to repeat array.
  //   images. zero is a valid rotation value.

  var gblPhotoShufflerDivId = "photodiv";
  var gblPhotoShufflerImgId = "photoimg";
  var gblPhotoShufflerAnchorId = "photoanchor";
  var gblImg = new Array(
    "/images/stories/Sponsors/sponsor_1.png",
    "/images/stories/Sponsors/sponsor_4.png",
    "/images/stories/Sponsors/sponsor_2.png",
    "/images/stories/Sponsors/sponsor_5.png",
    "/images/stories/Sponsors/sponsor_6.png",
    "/images/stories/Sponsors/sponsor_7.png",
    "/images/stories/Sponsors/sponsor_8.png",
    "/images/stories/Sponsors/sponsor_9.png",
    "/images/stories/Sponsors/sponsor_10.png",
    "/images/stories/Sponsors/sponsor_3.png",
    "/images/stories/Sponsors/sponsor_11.png",
    "/images/stories/Sponsors/sponsor_12.png",
    "/images/stories/Sponsors/sponsor_13.png",
    "/images/stories/Sponsors/sponsor_14.png"
    );
  var gblHref = new Array(
    "http://www.sportsmanswarehouse.co.za",
    "http://www.mylife.org.za",
    "http://www.dpvwatch.co.za",
    "http://www.parkercottage.co.za",
    "http://www.redsofa.co.za",
    "http://www.straatwerk.org.za",
    "http://www.touaregtents.co.za",
    "http://www.virginactive.co.za",
	"#",
    "http://www.interaction-design.co.za",
	"http://www.mannabay.com",
	"http://www.bagraimsattorneys.co.za/",
	"http://www.dhl.co.za/",
	"http://www.vidaecaffe.com/"
    );
  var gblPauseSeconds = 1;
  var gblFadeSeconds = .35;
  var gblRotations = 100;

  // End Customization section
  
  var gblDeckSize = gblImg.length;
  var gblOpacity = 100;
  var gblOnDeck = 0;
  var gblStartImg;
  var gblStartHref;
  var gblImageRotations = gblDeckSize * (gblRotations+1);

  /*window.onload = photoShufflerLaunch;*/
  
  function photoShufflerLaunch()
  {
  	var theimg = document.getElementById(gblPhotoShufflerImgId);
        gblStartImg = theimg.src; // save away to show as final image
  	var theanchor = document.getElementById(gblPhotoShufflerAnchorId);
        gblStartHref = theimg.href; // save away to show as final image

	document.getElementById(gblPhotoShufflerDivId).style.backgroundImage='url(' + gblImg[gblOnDeck] + ')';
	setTimeout("photoShufflerFade()",gblPauseSeconds*1000);
  }

  function photoShufflerFade()
  {
  	var theimg = document.getElementById(gblPhotoShufflerImgId);
	
  	// determine delta based on number of fade seconds
	// the slower the fade the more increments needed
        var fadeDelta = 100 / (30 * gblFadeSeconds);

	// fade top out to reveal bottom image
	if (gblOpacity < 2*fadeDelta ) 
	{
	  gblOpacity = 100;
	  // stop the rotation if we're done
	  if (gblImageRotations < 1) return;
	  photoShufflerShuffle();
	  // pause before next fade
          setTimeout("photoShufflerFade()",gblPauseSeconds*1000);
	}
	else
	{
	  gblOpacity -= fadeDelta;
	  setOpacity(theimg,gblOpacity);
	  setTimeout("photoShufflerFade()",30);  // 1/30th of a second
	}
  }

  function photoShufflerShuffle()
  {
	var thediv = document.getElementById(gblPhotoShufflerDivId);
	var theimg = document.getElementById(gblPhotoShufflerImgId);
	var theanchor = document.getElementById(gblPhotoShufflerAnchorId);
	
	// copy div background-image to img.src
	theimg.src = gblImg[gblOnDeck];
	theanchor.href = gblHref[gblOnDeck];
	theanchor.target = "_new";
	window.status = gblHref[gblOnDeck]; // updates status bar (optional)
	// set img opacity to 100
	setOpacity(theimg,100);

        // shuffle the deck
	gblOnDeck = ++gblOnDeck % gblDeckSize;
	// decrement rotation counter
	if (--gblImageRotations < 1)
	{
	  // insert start/final image if we're done
	  gblImg[gblOnDeck] = gblStartImg;
	  gblHref[gblOnDeck] = gblStartHref;
	}

	// slide next image underneath
	thediv.style.backgroundImage='url(' + gblImg[gblOnDeck] + ')';
  }

function setOpacity(obj, opacity) {
  opacity = (opacity == 100)?99.999:opacity;
  
  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";
  
  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;

  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;

  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
}

/* drag and drop*/

function addEventSimple(obj,evt,fn) {
	if (obj.addEventListener)
		obj.addEventListener(evt,fn,false);
	else if (obj.attachEvent)
		obj.attachEvent('on'+evt,fn);
}

function removeEventSimple(obj,evt,fn) {
	if (obj.removeEventListener)
		obj.removeEventListener(evt,fn,false);
	else if (obj.detachEvent)
		obj.detachEvent('on'+evt,fn);
}

dragDrop = {
	keyHTML: '<a href="#" class="keyLink">#</a>',
	keySpeed: 10, // pixels per keypress event
	initialMouseX: undefined,
	initialMouseY: undefined,
	startX: undefined,
	startY: undefined,
	dXKeys: undefined,
	dYKeys: undefined,
	draggedObject: undefined,
	initElement: function (element) {
		if (typeof element == 'string')
			element = document.getElementById(element);
		//element.onmousedown = dragDrop.startDragMouse;
		//element.innerHTML += dragDrop.keyHTML;
		//var links = element.getElementsByTagName('a');
		//var lastLink = links[links.length-1];
		//lastLink.relatedElement = element;
		//lastLink.onclick = dragDrop.startDragKeys;
	},
	startDragMouse: function (e) {
		dragDrop.startDrag(this);
		var evt = e || window.event;
		dragDrop.initialMouseX = evt.clientX;
		dragDrop.initialMouseY = evt.clientY;
		addEventSimple(document,'mousemove',dragDrop.dragMouse);
		addEventSimple(document,'mouseup',dragDrop.releaseElement);
		return false;
	},
	startDragKeys: function () {
		dragDrop.startDrag(this.relatedElement);
		dragDrop.dXKeys = dragDrop.dYKeys = 0;
		addEventSimple(document,'keydown',dragDrop.dragKeys);
		addEventSimple(document,'keypress',dragDrop.switchKeyEvents);
		this.blur();
		return false;
	},
	startDrag: function (obj) {
		if (dragDrop.draggedObject)
			dragDrop.releaseElement();
		dragDrop.startX = obj.offsetLeft;
		dragDrop.startY = obj.offsetTop;
		dragDrop.draggedObject = obj;
		obj.className += ' dragged';
	},
	dragMouse: function (e) {
		var evt = e || window.event;
		var dX = evt.clientX - dragDrop.initialMouseX;
		var dY = evt.clientY - dragDrop.initialMouseY;
		dragDrop.setPosition(dX,dY);
		return false;
	},
	dragKeys: function(e) {
		var evt = e || window.event;
		var key = evt.keyCode;
		switch (key) {
			case 37:	// left
			case 63234:
				dragDrop.dXKeys -= dragDrop.keySpeed;
				break;
			case 38:	// up
			case 63232:
				dragDrop.dYKeys -= dragDrop.keySpeed;
				break;
			case 39:	// right
			case 63235:
				dragDrop.dXKeys += dragDrop.keySpeed;
				break;
			case 40:	// down
			case 63233:
				dragDrop.dYKeys += dragDrop.keySpeed;
				break;
			case 13: 	// enter
			case 27: 	// escape
				dragDrop.releaseElement();
				return false;
			default:
				return true;
		}
		dragDrop.setPosition(dragDrop.dXKeys,dragDrop.dYKeys);
		if (evt.preventDefault) // also solves problem in Saf; keypress part of default ???
			evt.preventDefault();
		return false;
	},
	setPosition: function (dx,dy) {
		dragDrop.draggedObject.style.left = dragDrop.startX + dx + 'px';
		dragDrop.draggedObject.style.top = dragDrop.startY + dy + 'px';
	},
	switchKeyEvents: function () {
 
		// for Opera and Safari 1.3
 
		removeEventSimple(document,'keydown',dragDrop.dragKeys);
		removeEventSimple(document,'keypress',dragDrop.switchKeyEvents);
		addEventSimple(document,'keypress',dragDrop.dragKeys);
	},
	releaseElement: function() {
		removeEventSimple(document,'mousemove',dragDrop.dragMouse);
		removeEventSimple(document,'mouseup',dragDrop.releaseElement);
		removeEventSimple(document,'keypress',dragDrop.dragKeys);
		removeEventSimple(document,'keypress',dragDrop.switchKeyEvents);
		removeEventSimple(document,'keydown',dragDrop.dragKeys);
		dragDrop.draggedObject.className = dragDrop.draggedObject.className.replace(/dragged/,'');
		dragDrop.draggedObject = null;
	}
}
 
function init() {
	dragDrop.initElement('test');
	/*dragDrop.initElement(document.getElementById('test2'));*/
}

/*
window.onload = photoShufflerLaunch;
window.onload = function () {
	if (self.init)
		{init();}
}
*/

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

/* new bounce */
/*chrome bounce*/


/*load events*/
//addLoadEvent(browserball.init);
addLoadEvent(photoShufflerLaunch);
addLoadEvent(function () {
	if (self.init)
		{init();}
});