/**
 * @version    $Id$
 * @package    IT_Theme_Framework
 * @author     InnoThemes Team <support@innothemes.com>
 * @copyright  Copyright (C) 2012 InnoThemes.com. All Rights Reserved.
 * @license    GNU/GPL v2 or later http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Websites: http://www.innothemes.com
 */

(function($) {
	$.IT_TextLogo = function(params) {
		var self = this;

		// Initialize parameters
		self.params = $.extend({}, params);

		// Initialize functionality
		self.init();
	};

	$.IT_TextLogo.prototype = {
		init: function() {
			var self = this, btn = $('.it-text-logo-btn');

			self.container = btn.closest('form');
			self.fields = $('.it-text-logo-modal > .form-horizontal');

			btn.unbind('click').bind('click', function(event) {
				event.preventDefault();

				// Setup modal to customize text logo
				$.IT_TextLogo.modal = $('#' + $(this).prev().attr('id') + '-text-logo-modal').dialog({
					modal: true,
					autoOpen: false,
					draggable: false,
					resizable: false,
					dialogClass: 'jsn-master',
					width: 800,
					height: 600,
					open: function() {
						// Prepare Chosen box
						$.IT_TextLogo.modal.find('.chzn-container.chosen-box').each(function(i, e) {
							($(e).css('width') != 0 && $(e).css('width') != '0px') || $(e).css('width', '');
						});
					},
					close: function() {
						// Destroy modal to save memory
						$.IT_TextLogo.modal.dialog('destroy');

						// Re-append text logo settings fields into form so they can be saved
						self.container.append($(this).children('.form-horizontal').addClass('hidden'));

						// Get associated element
						self.element = self.element || $('#' + $.IT_TextLogo.modal.attr('id').replace('-text-logo-modal', ''));

						// Trigger change event on associated element
						self.element.trigger('change');
					}
				});

				// Get associated data
				if ($.IT_TextLogo.modal.length) {
					// Append text logo settings fields into modal so they can be edited
					$.IT_TextLogo.modal.append(self.container.children('.' + $(this).prev().attr('id') + '-settings').removeClass('hidden'));

					// Update logo text
					var preview = $.IT_TextLogo.modal.find('.it-text-logo-preview');

					preview.text($(this).prev().val());
				}

				// Show modal
				$.IT_TextLogo.modal.dialog('open');
			});

			// Handle window resize event to update modal position
			$(window).resize(function() {
				if ($.IT_TextLogo.modal) {
					$.IT_TextLogo.modal.dialog('option', 'position', 'center');
				}
			});

			// Setup event handler to disable form submission when user press Enter while editing text logo settings
			self.fields.find('input').keypress(function(event) {
				return event.keyCode != 13;
			});

			// Setup event handler to generate live preview for text logo
			self.fields.find('input, select').change($.proxy(self.preview, self)).trigger('change');

			// Append text logo settings fields into form so they can be saved
			self.container.append(self.fields.addClass('hidden'));
		},

		preview: function(event) {
			var self = this, field = event.target;

			if (!field.name) return;

			// Search for preview area
			var $thisForm = $(field);

			while (!$thisForm.hasClass('form-horizontal')) {
				$thisForm = $thisForm.parent();
			}

			var $thisPreview = $thisForm.prev().prev(), prop = $(field).attr('name').replace(/^[^\[]+\[([^\]]+)\]$/, '$1');

			switch (prop) {
				case 'font-type':
				case 'font-family':
				case 'font-google':
					var fontFamily = $(field).val();

					if (prop == 'font-type' || prop == 'font-google') {
						prop != 'font-type' || (fontFamily = $(field).next().next().next().next().val());

						if (prop == 'font-google' || $(field).val() == 'google') {
							$('head').append('<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=' + fontFamily.replace(' ', '+') + '" type="text/css" />');
						}
					}

					if (prop == 'font-type' || (prop == 'font-family' && $(field).prev().prev().val() == 'standard') || (prop == 'font-google' && $(field).prev().prev().prev().prev().val() == 'google')) {
						$thisPreview.css('font-family', prop == 'font-google' ? "'" + fontFamily + "'" : fontFamily);
					}
				break;

				case 'font-size':
				case 'font-unit':
					var	fontSize = prop == 'font-size' ? $(field).val() : $(field).prev().prev().val(),
						fontUnit = prop == 'font-unit' ? $(field).val() : $(field).next().next().val();

					$thisPreview.css('font-size', fontSize + fontUnit);
				break;

				case 'font-display':
					if ($(field).val() == 'normal') {
						$thisPreview.css({
							'font-weight': 'normal',
							'font-style': 'normal'
						});
					} else if ($(field).val() == 'italic') {
						$thisPreview.css({
							'font-weight': 'normal',
							'font-style': 'italic'
						});
					} else if ($(field).val() == 'bold') {
						$thisPreview.css({
							'font-weight': 'bold',
							'font-style': 'normal'
						});
					}
				break;

				case 'text-color':
					$thisPreview.css('color', $(field).val());
				break;

				case 'shadow-horizontal':
				case 'shadow-vertical':
				case 'shadow-blur':
				case 'shadow-color':
					var shadowHorizontal, shadowVertical, shadowBlur, shadowColor;

					if (prop == 'shadow-horizontal') {
						shadowHorizontal = $(field).val();
						shadowVertical = $(field).parent().next().children('input').val();
						shadowBlur = $(field).parent().next().next().children('input').val();
						shadowColor = $(field).parent().next().next().next().find('input').val();
					} else if (prop == 'shadow-vertical') {
						shadowHorizontal = $(field).parent().prev().children('input').val();
						shadowVertical = $(field).val();
						shadowBlur = $(field).parent().next().children('input').val();
						shadowColor = $(field).parent().next().next().find('input').val();
					} else if (prop == 'shadow-blur') {
						shadowHorizontal = $(field).parent().prev().prev().children('input').val();
						shadowVertical = $(field).parent().prev().children('input').val();
						shadowBlur = $(field).val();
						shadowColor = $(field).parent().next().find('input').val();
					} else if (prop == 'shadow-color') {
						shadowHorizontal = $(field).parent().prev().prev().prev().children('input').val();
						shadowVertical = $(field).parent().prev().prev().children('input').val();
						shadowBlur = $(field).parent().prev().children('input').val();
						shadowColor = $(field).val();
					}

					$thisPreview.css('text-shadow', shadowHorizontal + 'px ' + shadowVertical + 'px ' + shadowBlur + 'px ' + shadowColor);
				break;

				case 'padding-top':
				case 'padding-right':
				case 'padding-bottom':
				case 'padding-left':
					$thisPreview.css(prop, $(field).val() + 'px');
				break;
			}
		}
	};
})(jQuery);
