/*

Javascript code for use on oliy.co.uk website
Author: Oliy Hine
Unauthorised use of this code is prohibited

*/

function displayPopupOnHashChange() {
	newHash = window.location.hash.substring(1);
	if (newHash) {
		displayPopup(newHash);
        }
}

function displayPopup(pageUrl) {
	$('#overlay').show();
	$('#popup-container').show();
	$('#popup-loading').show();
	var popupHeight = $('#popup').height() - 2;
	if (popupHeight > 0) {
		$('#popup-loading').css({ height: popupHeight + 'px' });
	}
	
	onSuccessCallBack = function(data) {
		$('#popup').html(data);
		$('#popup-loading').hide();
	}
	
	$.ajax({
		url: pageUrl,
		success: onSuccessCallBack
	});
		
	var lightboxTop = $(window).scrollTop();
	var lightboxLeft = $(window).scrollLeft();
        $('#popup-container').css({ top: lightboxTop + 'px', left: lightboxLeft + 'px' }).show();
        
        $('#overlay').css({ top: 0, left: 0, width: '100%', height: $(document).height() + 'px' });
}

function closePopup() {
	$('#overlay').hide();
	$('#popup-container').hide();
}

function loadContent(url, target)
{
	$('#' + target).load(url);
}

function serverProcessXML( xml, xsl, target, qString, relativePath )
{
	if (relativePath === undefined) {
		relativePath = "./";
	}
	
	var url = relativePath + "xmlTransform.php?xml=" + xml + "&xsl=" + xsl;
	if ( qString != null )
	{
		url = url + qString;
	}

	loadContent(url, target);
}

function showhide( id )
{
	el = document.getElementById( id );
	if ( el )
	{
		if ( el.style.display == 'none' )
		{
			el.style.display = '';
			return true;
		}
		else
		{
			el.style.display = 'none';
			return false;
		}
	}

}

function show( id )
{
	el = document.getElementById( id );
	if ( el )
	{
		el.style.display = '';
	}
}

function hide( id )
{
	el = document.getElementById( id );
	if ( el )
	{
		el.style.display = 'none';
	}
}

function highlight( id )
{
	el = document.getElementById( id );
	if ( el )
	{
	
		if ( el.style.backgroundColor != '' )
		{
			el.style.backgroundColor = '';
			el.style.border = '';
		}
		else
		{
			el.style.backgroundColor  = '#fff88f';
			el.style.border = '1px solid black';
		}
	}
}

if(window.addEventListener) {
window.addEventListener('load', function () {
  var header, menu, pageTitle, canvas, context;

  // Initialization sequence.
  function init () {
    // Find the canvas element.
    header = document.getElementById('header');
    canvas = document.getElementById('header-canvas');
    menu = document.getElementById('menu');
    pageTitle = document.getElementById('page-title');
    
    if (!canvas) {
      return;
    }

    if (!canvas.getContext) {
      return;
    }

    // Get the 2D canvas context.
    context = canvas.getContext('2d');
    if (!context) {
      return;
    }
    
    var img = new Image();
    img.onload = function() {
        //context.drawImage(img,0,0);
    };
    img.src = 'menu-background.png';
    
    context.lineWidth = 1.0;
    context.lineCap = 'round';
    context.lineJoin = 'bevel';
    context.shadowColor = 'white';
    context.shadowOffsetX = 2;
    context.shadowOffsetY = 2;
    context.shadowBlur = 8.0;
    context.strokeStyle = 'rgba(255, 255, 255, 0.1)';
    
    // Attach the mousemove event handler.
    canvas.addEventListener('mousemove', ev_mousemove, false);
    canvas.addEventListener('mousedown', onMouseDown, false);
    menu.addEventListener('mousemove', ev_mousemove, false);
    pageTitle.addEventListener('mousemove', ev_mousemove, false);
  }

  // The mousemove event handler.
  function ev_mousemove (ev) {
    var x, y;

    // Get the mouse position relative to the canvas element.
    if (ev.layerX || ev.layerX == 0) { // Firefox
      x = ev.pageX;
      y = ev.pageY;
    } else if (ev.offsetX || ev.offsetX == 0) { // Opera
      x = ev.offsetX;
      y = ev.offsetY;
    }

    drawCurve1(x, y);  
    drawCurve2(x, y);  
    
  }
  
  function drawCurve1(x, y) {
      context.beginPath();
      context.moveTo(10, 224);
      context.quadraticCurveTo(x, y, 850, -10);
      context.stroke();
  }
  
  function drawCurve2(x, y) {
  	context.beginPath();
        context.moveTo(-10, -10);
        context.quadraticCurveTo(x, y, 850, 350);
     	context.stroke();
  }
  
  function drawCurves(x, y) {
  	drawCurve1(x, y);
  	drawCurve2(x, y);
  }
  
  function onMouseDown(event) {
  	clear();
  }
  
  function clear() {
  	context.clearRect(0, 0, canvas.width, canvas.height);
  }

  init();
}, false); }

