/* ---------------------------------------------------------
   My New jQuery Plugin
   Author: Tim Kinnane www.owlandfox.com
   Pattern by: Tim Kinnane www.owlandfox.com
   Version: 1.0 2 Nov 2010
   Description: 
--------------------------------------------------------- */
(function($){
	// Initialise - applied to the element that plugin is run on
	$.fn.jloTextControl = function(options) {
		var opts = $.extend(true, {}, $.fn.jloTextControl.defaults, options); // combine passed in args with defaults
		var count = $(this).length; // how many elements being used
		var collection = $(this); // store elements collection for getting index of current for suffix
		return this.each(function() { // apply to all jquery elements in selector and return self for chaining
			var o = $.extend({}, opts, $(this).data()); // Extend passed options with any preexisting data
			var myself = $(this); // for easy access to self
			o.before.call(this); // do anything needed prior to init
			myself.children().remove();
			myself.empty(); // clear anything in the element first, just in case
			myself.addClass(o.className).css(o.css); // add class and css from options 
			var idsuffix = (count > 1) ? "-"+collection.index(this) : ""; // use numbered suffix for id'ing multiple elements
			if(myself.attr('id') == "") myself.attr("id", o.id+idsuffix); // if no id set, use id from defaults
			myself.data(o); // store all current options in element data
			//if (o.addLabel) myself.prepend($('<label>'+o.title+'</label>')); // add a label to element if required
			/* CUSTOM FUNCTIONALITY HERE ---------------------------------------------------------------> */
			
			var inputContainer = $('<div />').addClass('input-container');
			var textInput = $('<input type="text" />');
			textInput.keyup(function() {
				var value = $(this).val();
				myself.data('chainTo').text(value);
				myself.data('updated').call(myself, value);
			});
			textInput.attr({
				name: o.id+"-input",
				id: o.id+"-input"
			}).addClass("text-input").val(o.startText);
			inputContainer.append(textInput);
			myself.prepend(inputContainer);
			if (o.addLabel) inputContainer.prepend($('<label>'+o.title+'</label>'));
			
			var fontSize = $('<div />').jloFontSize();
			var positioner = $('<div />').jloPositioner();
			var fontSelect = $('<div />').jloFontSelect();
			var colours = $('<div />').jloColours();
			myself.append(fontSize);
			myself.append(fontSelect);
			myself.append(positioner);
			myself.append(colours);
			
			var newLayer = $('<span />')
			$('#layout').append(newLayer);
			newLayer.jloLayer({
				css: {
					"left": o.startx + 'px',
					"top": o.starty + 'px',
					"font-size": fontSize.data('starting') + fontSize.data('units'),
					"font-family": fontSelect.data('selected'),
					"color": colours.data('selected').hex
				},
				chainTo: myself
			}).text(o.startText);
			
			// attach layer to controls and trigger selection to set data on attached layer
			myself.chainTo(newLayer);
			fontSize.chainTo(newLayer).jloFontSizeSet();
			positioner.chainTo(newLayer);
			fontSelect.chainTo(newLayer).jloFontSelectSet();
			colours.chainTo(newLayer).jloColoursSet()
			
			myself.click(function() {
				var myself = $(this);
				myself.addClass('selected').show();
				myself.parent().show(); // show parent and self, because control click could have been externally triggered while hidden
				myself.parent().siblings().hide();
				myself.siblings().removeClass('selected').hide();
			});
			
			/* END CUSTOM FUNCTIONALITY <---------------------------------------------------------------- */
			myself.bind('click', function() { myself.data('clicked').call(this) }); // call custom function for after its clicked
			if(o.chainClick){myself.bind('click',function(e,bc){bc?bc.push(this):bc=[this];$(myself.data('chainTo')).each(function(){if($(bc).index(this)<0)$(this).triggerHandler('click',[bc])})})}; // my super function to tie click events together
			if (o.focus) myself.focus(); // focus on self
			o.after.call(this);
		});
	}
	$.fn.jloTextControl.defaults = {
		/* CUSTOM PROPERTIES AND METHODS */
		
		startText: "Sample",
		startx: 10,
		starty: 10,
		
		/* PATTERN DEFAULTS... */
		id: 'text-control',
		className: 'layer-controls',
		title: 'Input Text',

		addLabel: true,
		css: {}, // default style object
		chainTo: [], // array of elements that this plugin is attached to - allows chaining events from one to the next
		chainClick: true, // will fire click event on chained elements when it is clicked
		before: function() {}, // function to call before initialising elements
		after: function() {}, // function to call when initialised
		clicked: function() {}, // function to call after click event processed
		updated: function() {}, // function to call when something is updated
		error: function() {}, // function to call when an error occurs
		removed: function() {}, // function to call if plugin element removed
		debug: false, // do or don't do debuging type stuff
		focus: false // grab focus on self after init
	}
})(jQuery); // ALL DONE