var previewPopup;
var activeMarkupPopupTab;
var activeMarkupPopupPage;
var htmlCode = false;
var cssCode = false;
hljs.initHighlightingOnLoad();
var uri = new URI(document.location);
var action = uri.getData('action');
var type = uri.getData('type');
var nextPage;
var prevPage;
window.addEvent('domready', function() {
	activeMarkupPopupPage = defaultPage;

	if(activeMarkupPopupPage) {
		if(action == 'html') {
			initPrevNextLinks();
			loadCodePage(pathUrl + activeMarkupPopupPage, 'html');
		}
		else if(action == 'css') {
			initPrevNextLinks();
			loadCode(pathUrl + defaultCss, 'css');
		}
		else {
			initPrevNextLinks();
			loadPreview(pathUrl + activeMarkupPopupPage);
		}
	}
	frameHeight();
	initLinks();
})

window.addEvent('resize', function() {
	frameHeight();
});

function frameHeight() {
	var height;
	if(window.innerHeight) {
		height = window.innerHeight;
	} else {
		height = document.documentElement.clientHeight;
	}
	var iframe = $('iframe');
	if(iframe) {
		iframe.setStyle('height', height - 115 + 'px');
	}
	$$('#html-code-container pre').setStyle('height', height - 115 + 'px');
	$$('#css-code-container pre').setStyle('height', height - 115 + 'px');
}

function initLinks() {
	var html = $('html');
	var css = $('css');
	var preview = $('preview');
	html.addEvent('click', function() {
		action = html.getProperty('id');
		loadCodePage(pathUrl + activeMarkupPopupPage, 'html');
		return false;
	});
	/* if email template we haven't any css files */
	if(type != 'emailtemplate')
	{
		css.addEvent('click', function() {
			action = css.getProperty('id');
			loadCode(pathUrl + defaultCss, 'css');
			return false;
		});
	}

	preview.addEvent('click', function() {
		action = preview.getProperty('id');
		loadPreview(pathUrl + activeMarkupPopupPage);
		return false;
	});
}

function initPrevNextLinks() {
	var prevL = $('prev-page');
	var nextL = $('next-page');
	var enabled = true;
	if(pathUrl.indexOf('dotschools') != -1)
	{
		var count = 4;
		var page = {
			'index.htm':1,
			'step2.htm':2,
			'thanks.htm':3,
			'step3.htm':4
		};
		var source = {
			1: 'index.htm',
			2: 'step2.htm',
			3: 'thanks.htm',
			4: 'step3.htm'
		};

		var titles = {
			1: 'Dotschools: Home Page',
			2: 'Dotschools: Browse Page',
			3: 'Dotschools: Content Page',
			4: 'Dotschools: Form Page'
		};
	}
	else if(pathUrl.indexOf('iqn') != -1)
	{
		var count = 4;
		var page = {
			'index.htm':1,
			'businesscards.htm':2,
			'landing.htm':3,
			'content.htm':4
		};
		var source = {
			1: 'index.htm',
			2: 'businesscards.htm',
			3: 'landing.htm',
			4: 'content.htm'
		};

		var titles = {
			1: 'IQualifyNow: Home Page',
			2: 'IQualifyNow: Browse Page',
			3: 'IQualifyNow: Landing Page',
			4: 'IQualifyNow: Form Page'
		};
	}
	else if(pathUrl.indexOf('centurysales') != -1)
	{
		var count = 2;
		var page = {
			'index.htm':1,
			'property_details.htm':2
		};
		var source = {
			1: 'index.htm',
			2: 'property_details.htm'
		};

		var titles = {
			1: 'Century Sales: Home Page',
			2: 'Century Sales: Content Page'
		};
	}
	else if(pathUrl.indexOf('garofalo') != -1)
	{
		var count = 2;
		var page = {
			'index.htm':1,
			'content.htm':2
		};
		var source = {
			1: 'index.htm',
			2: 'content.htm'
		};

		var titles = {
			1: 'Garofalo: Home Page',
			2: 'Garofalo: Content Page'
		};
	}
	else if(pathUrl.indexOf('rightbanners') != -1 || pathUrl.indexOf('becomesanta') != -1 || pathUrl.indexOf('albers') != -1 || pathUrl.indexOf('oooferton') != -1 || pathUrl.indexOf('reprezent') != -1 || pathUrl.indexOf('potedemel') != -1 || pathUrl.indexOf('smashingmagazine') != -1)
	{
		prevL.addClass('hidden');
		nextL.addClass('hidden');
		enabled = false;
	}
	if(type == 'emailtemplate')
	{
		/* for email templates code where no css file */
		$('css').getParent().dispose();
	}
	if(enabled){
		var curPage = parseInt(page[activeMarkupPopupPage]);
	}
	else
	{
		var curPage = false;
	}

	if(curPage)
	{
		if(curPage < 1)
		{
			curPage = 1;
		}
		else if(curPage > count)
		{
			curPage = count;
		}
	}

	if(prevL && nextL && enabled) {
		prevL.addEvent('click', function() {
			if(curPage <= 1)
			{
				curPage = count;
			}
			else
			{
				curPage--;
			}
			$$('div.hold2 h1').set('html', titles[curPage]);
			activeMarkupPopupPage = source[curPage];
			if(action == 'html')
			{
				loadCodePage(pathUrl + source[curPage], 'html');
			}
			else if(action == 'css')
			{
				loadCode(pathUrl + activeMarkupPopupPage, 'css');
			}
			else
			{
				loadPreview(pathUrl + source[curPage]);
			}
			return false;
		});
		nextL.addEvent('click', function() {
			if(curPage >= count)
			{
				curPage = 1;
			}
			else
			{
				curPage++;
			}
			$$('div.hold2 h1').set('html', titles[curPage]);
			activeMarkupPopupPage = source[curPage];
			if(action == 'html') {
				loadCodePage(pathUrl + source[curPage], 'html');
			}
			else if(action == 'css') {
				loadCode(pathUrl + activeMarkupPopupPage, 'css');
			}
			else {
				loadPreview(pathUrl + source[curPage]);
			}
			return false;
		});
	}
}

function loadPreview(url) {
	var iframe = $('iframe');
	var htmlCodeContainer = $('html-code-container');
	var cssCodeContainer = $('css-code-container');
	if(iframe && htmlCodeContainer && cssCodeContainer) {
		iframe.addClass('hidden');
		iframe.setProperty('src', url);
		htmlCodeContainer.addClass('hidden');
		cssCodeContainer.addClass('hidden');
		iframe.removeClass('hidden');
		setActiveMarkupPopupTab('preview');
	}
}

function loadCodePage(url, type) {
	setTimeout(function(){
		var ajaxLoader = $('ajax-loader');
		if(ajaxLoader) {
			ajaxLoader.removeClass('hidden');
		}
		new Request.HTMLWITHJS({
			url: url,
			evalScripts: false,
			onSuccess: function(resp1,resp2,response,resp4) {
				var codeContainer = $(type + '-code-container');
				if(codeContainer) {
					var code = escape(response);
					codeContainer.set('html', '<pre><code id="' + type + '-code" class="' + type + '">' + code + '</code></pre>');
					hljs.highlightBlock($(type + '-code'));
					if(type == 'html') {
						htmlCode = true;
					}
					else {
						cssCode = true;
					}
					showCode(type);
				}
			},
			onComplete: function(response) {
				if(ajaxLoader) {
					ajaxLoader.addClass('hidden');
				}
			}
		}).send();
	}, 200);
}

function loadCode(url, type) {
	setTimeout(function(){
		if(!showCode(type)) {
			var ajaxLoader = $('ajax-loader');
			if(ajaxLoader) {
				ajaxLoader.removeClass('hidden');
			}
			new Request({
				url: url,
				onSuccess: function(response) {
					var codeContainer = $(type + '-code-container');
					if(codeContainer) {
						var code = escape(response);
						codeContainer.set('html', '<pre><code id="' + type + '-code" class="' + type + '">' + code + '</code></pre>');
						hljs.highlightBlock($(type + '-code'));
						if(type == 'html') {
							htmlCode = true;
						}
						else {
							cssCode = true;
						}
						showCode(type);
					}
				},
				onComplete: function() {
					if(ajaxLoader) {
						ajaxLoader.addClass('hidden');
					}
				}
			}).send();
		}
	}, 200);
}

function showCode(type) {
	var iframe = $('iframe');
	var htmlCodeContainer = $('html-code-container');
	var cssCodeContainer = $('css-code-container');
	if(iframe && htmlCodeContainer && cssCodeContainer) {
		if(type == 'html') {
			if(!htmlCode) return false;
			htmlCode = true;
			cssCodeContainer.addClass('hidden');
			iframe.addClass('hidden');
			htmlCodeContainer.removeClass('hidden');
		}
		else {
			if(!cssCode) return false;
			cssCode = true;
			htmlCodeContainer.addClass('hidden');
			iframe.addClass('hidden');
			cssCodeContainer.removeClass('hidden');
		}
	}
	frameHeight();
	setActiveMarkupPopupTab(type);
	return true;
}

function escape(value) {
	return value.replace(/&/gm, '&amp;').replace(/</gm, '&lt;').replace(/>/gm, '&gt;');
}

function setActiveMarkupPopupTab(tabId) {
	var tab = $(tabId);
	if(tab) {
		if(activeMarkupPopupTab) {
			activeMarkupPopupTab.removeClass('active');
		}
		activeMarkupPopupTab = tab;
		activeMarkupPopupTab.addClass('active');
	}
};
String.implement(
{
	stripScriptLink: function(option){
		var scripts = '';
		var text = this.replace(/<script.*src=["|']([^"']*)["|'][^>]*><\/script>/gi, function(){
			Asset.javascript(arguments[1]);
					return '';
		});
		text = text.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi, function(){
			scripts += arguments[1] + '\n';
			return '';
		});
		if (option === true) $exec(scripts);
		else if ($type(option) == 'function') option(scripts, text);
		return text;
	}
});
Request.HTMLWITHJS = new Class ( {
	Extends: Request.HTML,
	success: function(text){
		var options = this.options;
		var response = this.response;
		text.stripScriptLink(function(script){
			response.javascript = script;
		});
		response.html = text;
		var temp = this.processHTML(response.html);
		response.tree = temp.childNodes;
		response.elements = temp.getElements('*');
		if(options.filter) response.tree = response.elements.filter(options.filter);
		if (options.update) document.id(options.update).empty().set('html', response.html);
		else if (options.append) document.id(options.append).adopt(temp.getChildren());
		if (options.evalScripts) $exec(response.javascript);
		this.onSuccess(response.tree, response.elements, response.html, response.javascript);
	}
});