/* Widget customiser UI code */

var previewReader = null;
var defaultRowsCount = 6;
var rowsCount = defaultRowsCount;

var codeGeneratorAdvanced = false;

var auxScriptLocation = 'http://www.nzherald.co.nz/apps/js/';

var styleSelectors = {
	div: '#readerDiv',
	anchor: '#readerDiv li a',
	timeStamp: '#readerDiv li strong',
	masthead: '#readerDiv h1',
	mastheadLink: '#readerDiv h1 a',
	footer: '#readerDiv div.footer',
	footerLink: '#readerDiv div.footer a',
	list: '#readerDiv ul'
}
var styleCluster = {};
styleCluster[styleSelectors.div] = {
	'background-color': '#ddd',
	'border-style': 'none',
	'border-width': '0px',
	'border-color': '#000',
	'width': '270px',
	'overflow': 'hidden'
};
styleCluster[styleSelectors.anchor] = {
	'text-decoration': 'none',
	'color': '#006699',
	'font-family': 'arial',
	'font-size': '10pt',
	'font-weight': 'normal',
	'font-style': 'normal'
};
styleCluster[styleSelectors.timeStamp] = {
	/*'color': '#139549',*/
	'color': '#13a00c',
	'font-style': 'normal',
	'font-family': 'arial',
	'font-size': '9pt',
	'font-weight': 'normal',
	'text-decoration': 'underline',
	'padding-right': '1ex'
};
styleCluster[styleSelectors.masthead] = {
	'padding': '0px',
	'margin-top': '1px',
	'margin-bottom': '5px',
	'font-size': '12pt',
	'text-align': 'center',
	'letter-spacing': '1px',
	'text-decoration': 'none',
	'padding-bottom': '3px',
	'font-weight': 'bold',
	'border-bottom': function () {return '1px solid ' + getOffsetColor(styleCluster[styleSelectors.div]['background-color'])},
	'font-family': function () {return styleCluster[styleSelectors.anchor]['font-family'];},
	'color': function () {return styleCluster[styleSelectors.anchor].color;}
};
styleCluster[styleSelectors.mastheadLink] = {
	'text-decoration': 'none',
	'color': function () {return styleCluster[styleSelectors.anchor].color;}
};
styleCluster[styleSelectors.footer] = {
	'font-size': '7pt',
	'text-align': 'center',
	'letter-spacing': '1px',
	'text-decoration': 'none',
	'padding-top': '3px',
	'border-top': function () {return '1px solid ' + getOffsetColor(styleCluster[styleSelectors.div]['background-color'])},
	'font-family': function () {return styleCluster[styleSelectors.anchor]['font-family'];}
};
styleCluster[styleSelectors.footerLink] = {
	'text-decoration': 'none',
	'color': function () {return styleCluster[styleSelectors.timeStamp].color;}
};
styleCluster[styleSelectors.list] = {
	'list-style': 'none',
	'padding-left': '4px',
	'padding-right': '4px',
	'margin-left': '0px',
	'margin-top': '0px',
	'margin-bottom': '0px'
};

function getOffsetColor(xcolor) {
	var rx_str = '([0-9a-fA-F]{'+ ((xcolor.length-1)/3) +'})';
	var elen = (xcolor.length-1)/3;
	var colorstrs = xcolor.match(new RegExp('([0-9a-fA-F]{'+ elen +'})','g'));
	var colorvalues = [];
	fn = function(n) {return Math.round(n*0.85);}
	for (a in colorstrs) {
		if (colorstrs[a].length > elen) continue; // To work around the difference in regex /g handling in IE
		var v = fn(parseInt(colorstrs[a], 16)).toString(16);
		colorvalues.push(((v.length==1 && xcolor.length==7) ? '0' : '') + '' + v);
	}
	return '#' + colorvalues[0] + colorvalues[1] + colorvalues[2];
	
}

function setupDefaults() {
	// set up defaults //
	for (var sk in styleSelectors) {
		var ssk = styleSelectors[sk];
		var fIdPre = 'F_' + sk + '_';
		for (var attrName in styleCluster[ssk]) {
			var fId = fIdPre + attrName;
			$('#'+fId).val(styleCluster[ssk][attrName]);
		}
	}
}

function deref(item) {
	if (typeof(item) == 'function') return item();
	else return item;
}

function generateCode() {
	var fsel = $('#feedSelector').get(0);
	var outStr = '<!-- BEGIN NZHERALD PREGENERATED WIDGET BLOCK -->\n'
				+ (codeGeneratorAdvanced ? '<!-- Begin Script Loader -->\n' : '')
				+ '<script type="text/javascript" src="' + auxScriptLocation + 'ReaderWidget/ReaderWidget.js"><' + '/script>\n'
				+ '<script type="text/javascript" src="' + auxScriptLocation + 'JsonFeeder/JsonFeeder.js"><' + '/script>\n'
				+ '<script type="text/javascript">\n'
				+ 'var feedsource = new JsonFeeder("' + $('#feedSelector').val() + '", {"feedLink":"http://www.nzherald.co.nz/", "name":"'+ fsel.options[fsel.selectedIndex].text +'"});\n'
				+ 'var feedreader = new ReaderWidget("readerDiv", feedsource, '+ $('#F_numrows').val() +');\n' 
				+ 'window.onload = function () {feedreader.run();}\n'
				+ '<' + '/script>\n'
				+ (codeGeneratorAdvanced ? '<!-- End Script Loader -->\n<!-- Begin CSS Styles -->\n' : '')
				+ '\n<style type="text/css">\n'
				;
	
	for (var a in styleSelectors) {
		var sel = styleSelectors[a];
		outStr += '\n' + sel + ' {\n';
		for (var b in styleCluster[sel]) {
			outStr += '\t' + b + ': ' + deref(styleCluster[sel][b]) + ';\n';
		}
		outStr += '}\n';
	}
	outStr += '</style>\n' + (codeGeneratorAdvanced ? '<!-- End CSS Styles -->\n' : '');
	outStr += (codeGeneratorAdvanced ? '<!-- Begin HTML DIV -->' : '');

	var sel = $('#feedSelector').get(0);
	outStr += '\n<div id="readerDiv"><a href="http://www.nzherald.co.nz">New Zealand Herald</a></div>\n';

	outStr += (codeGeneratorAdvanced ? '<!-- End HTML DIV -->\n' : '');
	return outStr + '<!-- END NZHERALD PREGENERATED WIDGET BLOCK -->';
}


var propertyTabs = ['links', 'timestamps', 'container'];
function activatePropertyTab(n) {
	for (var i=0; i<propertyTabs.length; i++) {
		$('#' + propertyTabs[i] + 'Properties').get(0).className='inactive';
		$('#' + propertyTabs[i] + 'Trigger').get(0).className='';
	}
	$('#' + propertyTabs[n] + 'Properties').get(0).className='active';
	$('#' + propertyTabs[n] + 'Trigger').get(0).className='current';
}

function updatePreview() {
	var feedUrl = $('#feedSelector').val();
	var sel = $('#feedSelector').get(0);
	previewReader = new ReaderWidget("readerDiv", new JsonFeeder(feedUrl, {'name':sel.options[sel.selectedIndex].text, 'feedLink':'http://www.nzherald.co.nz/'}), rowsCount);
	previewReader.display(function() {updatePreviewStyles()});
}

function updatePreviewStyles() {
	for (var selector in styleCluster) {
		for (var k in styleCluster[selector]) {
			$(selector).css(k, deref(styleCluster[selector][k]));
		}
	}
	$('#F_GeneratedCode').get(0).value = generateCode();
}




function setStyleValue(selector, paramName, paramValue) {
	styleCluster[selector][paramName] = paramValue;
	updatePreviewStyles();
}

function setStyleFromElement(selector, paramName, paramElem) {
	setStyleValue(selector, paramName, $(paramElem).val());
}


$(document).ready(function() {
	$.farbtastic($('#timestampsProperties > .colorPicker').get(0), function(colorValue) {
		setStyleValue(styleSelectors.timeStamp, 'color', colorValue);})
		.setColor(styleCluster[styleSelectors.timeStamp].color);
	
	$.farbtastic($('#containerProperties > .colorPicker').get(0), function(colorValue) {
		setStyleValue(styleSelectors.div, 'background-color', colorValue);})
		.setColor(styleCluster[styleSelectors.div]['background-color']);
	
	$.farbtastic($('#linksProperties > .colorPicker').get(0), function(colorValue) {
		setStyleValue(styleSelectors.anchor, 'color', colorValue);})
		.setColor(styleCluster[styleSelectors.anchor].color);
	
	$('#feedSelector').get(0).options.selectedIndex = 0;
	setupDefaults();
	updatePreview();
});


