﻿/*
 * Fancy Jquery 404 Error Popup
 *
 * Copyright (c) 2009 FEATHERcoding - Igor Jovanovic
 * Example at: http://www.feathercoding.com/templates/fancy404error/
 * 
 * Version: 1.1 (17/03/2010)
 * Requires: jQuery v1.3+
 * 
 */

//this needs to be changed to the link to your site
var yoursitename ="http://www.disenocibernetico.com";
 
//path to this javascript file
var path = "js404/";

//CheckUrl returns false if page is 404
function CheckUrl(url)
{
	var xmlHttp = null;
	if (window.XMLHttpRequest) {
		// If IE7, Mozilla, Safari, and so on: Use native object.
		xmlHttp = new XMLHttpRequest();
	}
	else {
		if (window.ActiveXObject) {
		// ...otherwise, use the ActiveX control for IE5.x and IE6.
		xmlHttp = new ActiveXObject('MSXML2.XMLHTTP.3.0');
		}
	}
	xmlHttp.open("HEAD", url, false);
	xmlHttp.send();
	return xmlHttp.status!=404;
}
//Main code
$(document).ready(function(){
	//preloading image for smooth popup animation
	pic = new Image();
	pic.src = path+"404-bg.png";

	$("a").click(function (event) {
		//checking url and fixing IE with regex    
		if ((CheckUrl($(this).attr("href")) == false) && !($(this).attr("href").match(/^#[A-Za-z0-9-]*$/))) {
			event.preventDefault();

			$("body").append("<div id='mask'> </div>");
			$("#mask").css({"background-color":"", "display":"none", "left":"0px", "position":"absolute", "margin":"0","padding":"0","top":"0px", "z-index":"9000"});

			//Get the mask height and width
			var maskHeight = $(document).height();
			var maskWidth = $(window).width();
			//Get the window height and width
			var winHeight = $(window).height();
			var winWidth = $(window).width();

			$("#mask").css({"width":"100%","height":"100%"});
			$("#mask").fadeIn(1000);	
			$("#mask").fadeTo("slow",0.8);

			$("body").append("<div id='wrap-404'><div id='content-404'><h2>*Ooops! Page not found...</h2><p>Sorry, the page that you were looking for is no availible at this moment or has been moved! Try using search or just close this window to get back to site!</p></div><div id='search-404'><form action='http://www.google.com/search' method='get'><fieldset><input type='hidden' name='sitesearch' value="+yoursitename+" /><input type='text' maxlength='2048' name='q' value='Search...' onblur='if(this.value.length == 0) this.value=\"Search...\";' onclick='if(this.value == \"Search...\") this.value=\"\";' id='search_term' /><input type='submit' value='' /></fieldset></form></div><div id='copy-404'>&copy; 2011 <a href='http://www.disenocibernetico.com'>Diseno Cibernetico</a>. All rights reserved.</div><div id='close-404'>close X</div></div>");								 
			$("#wrap-404").css({"height":"302px", "position":"absolute", "text-align":"left", "width":"509px", "z-index":"9999"})
						  .fadeIn(2000);
			$("#wrap-404").css('top',  winHeight/2-$("#wrap-404").height()/2);
			$("#wrap-404").css('left', winWidth/2-$("#wrap-404").width()/2);

			if($.browser.msie && $.browser.version=="6.0") {
				//fixing IE6 alpha transparency problem
				$("#content-404").css({"background-image":"none", "filter":"progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='crop', src='"+pic.src+"')", "height":"168px", "padding":"94px 21px 40px 30px", "position":"relative", "width":"458px"});
				//fixing mask size problem
				$("#mask").css({"width":maskWidth,"height":maskHeight});
			}
			else {
				$("#content-404").css({"background":"transparent url("+pic.src+") no-repeat scroll 0 0", "height":"168px", "padding":"94px 21px 40px 30px", "position":"relative", "width":"458px"});
			}
			$("#content-404 h2").css({"color":"#414141", "font-family":"'Lucida Sans Unicode','Lucida Grande',sans-serif", "font-size":"30px", "font-weight":"bolder", "letter-spacing":"-1px", "margin":"0px 0px 40px 60px"});
			$("#content-404 p").css({"color":"#414141", "font-family":"'Lucida Sans Unicode','Lucida Grande',sans-serif", "font-size":"14px", "letter-spacing":"1px", "line-height":"20px", "padding":"0px 0px 0px 20px"});
			$("#wrap-404 #copy-404").css({"bottom":"10px", "color":"#414141", "font-family":"'Lucida Sans Unicode','Lucida Grande',sans-serif", "font-size":"11px", "left":"30px", "position":"absolute"});
			$("#wrap-404 #copy-404 a").css({"color":"#414141", "font-family":"'Lucida Sans Unicode','Lucida Grande',sans-serif", "font-size":"11px","text-decoration":"none"});
			$("#wrap-404 #close-404").css({"bottom":"10px", "color":"#414141", "cursor":"pointer", "font-family":"'Lucida Sans Unicode','Lucida Grande',sans-serif", "font-size":"20px", "position":"absolute", "right":"21px"});
			$("#wrap-404 #search-404").css({"color":"#414141", "font-family":"'Lucida Sans Unicode','Lucida Grande',sans-serif", "font-size":"20px", "height":"28px", "position":"absolute", "right":"21px", "top":"11px", "width":"191px"});
			$("#wrap-404 fieldset").css({"background":"transparent url("+path+"search-box.png) no-repeat scroll 0 0", "border":"0 none", "height":"28px", "margin":"0", "outline":"0 none", "padding":"0", "position":"relative", "width":"191px"});
			$("#wrap-404 input[type='text']").css({"background":"none no-repeat scroll 0 0", "border":"0 none", "color":"#999999", "font-family":"'Lucida Sans Unicode','Lucida Grande',sans-serif", "font-size":"12px", "height":"20px", "margin":"2px 0 0 5px", "padding":"3px 5px 0px 10px","width":"140px"});
			$("#wrap-404 input[type='submit']").css({"background":"transparent url("+path+"search-btn.png) no-repeat scroll 0 0", "border":"0 none", "cursor":"pointer", "height":"28px", "position":"absolute", "right":"0px", "top":"0px", "width":"30px"});
			//if close button is clicked
			$("#wrap-404 #close-404").click(function () {
				$("#mask").remove();
				$("#wrap-404").remove();
			});
			//if mask is clicked
			$("#mask").click(function () {
				$(this).remove();
				$("#wrap-404").remove();
			});
		};
	});
});
