$(document).ready(function(){
	var activeColor = '#000';
	var inActiveColor = '#999';

	$('body').children('*:last').after("<div id='feed'></div>");

	$('#feed').create('div', {'id':'feedback', 'class':'normal'}).bind('mouseover mouseout', function(){
		$(this).toggleClass('hover', 'slow');
	}).bind('click', function(){
		var overlay = $('#feed').create('div', {'id':'overlay'}).css({'height':$(document).height() + 'px', 'opacity':'0.8'}).fadeIn('slow');
		var feedBox = $('#feed').create('div', {'id':'feedBox'}).animate({'top':'160px'}, 800, function(){
			var fieldset = feedBox.create('form', {'id':'feedForm', 'method':'post'}).create('fieldset', {'id':'feedDetails'});
			var tabs = feedBox.create('ul', {'id':'tabs'});
			var preloader = $(this).create('img', {'class':'preloader', 'src':'/images/common/feedback/loader.gif', 'width':'16', 'height':'11', 'alt':''}).css('display', 'block');

			$.ajax({type: 'POST', url: '/ajax/feedback.html', dataType: 'json', success : function(result){
				preloader.css('display', 'none');

				var bsendButton = fieldset.create('div', {'class':'button'}).create('div', {'class':'greenBtn'}).create('div', {'class':'btn-font-b'}).create('a', {'title':result.translations['sendMessage'], 'href':'#'});
				bsendButton.create('span', {'class':'left'}).css('background-position', '0pt -1396px');
				bsendButton.create('span', {'class':'middle'}).css('background-position', '0pt -1354px').text(result.translations['sendMessage']);
				bsendButton.create('span', {'class':'right'}).css('background-position', '0pt -1312px');

				fieldset.create('div').create('textarea', {'id':'fDescription', 'class':'detail text', 'name':'topic[detail]'}).text(result.data['description']).focus(function(){
					if ($(this).val() == result.data['description']){
						$(this).val('');
						$(this).css('color', activeColor);
					}

					if ($(this).hasClass('error')){
						$(this).parent().removeClass('error');
						$(this).removeClass('error').val('');
					}
				}).blur(function(){
					if ($(this).val() == ''){
						$(this).val(result.data['description']);
						$(this).css('color', inActiveColor);
					}
				});

				fieldset.create('div').create('input', {'id':'fSubject', 'class':'subject text', 'type':'text', 'name':'topic[subject]', 'maxlength':'150'}).val(result.translations['shortTitle']).focus(function(){
					if ($(this).val() == result.translations['shortTitle']){
						$(this).val('');
						$(this).css('color', activeColor);
					}

					if ($(this).hasClass('error')){
						$(this).parent().removeClass('error');
						$(this).removeClass('error').val('');
					}
				}).blur(function(){
					if ($(this).val() == ''){
						$(this).val(result.translations['shortTitle']);
						$(this).css('color', inActiveColor);
					}

					if ($(this).hasClass('error')){
						$(this).parent().removeClass('error');
						$(this).removeClass('error').val('');
					}
				});

				fieldset.create('div', {'class':'halfDiv'}).create('input', {'id':'fEmail', 'class':'email text', 'type':'text', 'name':'topic[email]', 'maxlength':'90'}).val(result.translations['email']).focus(function(){
					if ($(this).val() == result.translations['email']){
						$(this).val('');
						$(this).css('color', activeColor);
					}

					if ($(this).hasClass('error')){
						$(this).parent().removeClass('error');
						$(this).removeClass('error').val('');
					}
				}).blur(function(){
					if ($(this).val() == ''){
						$(this).val(result.translations['email']);
						$(this).css('color', inActiveColor);
					}
				});

				fieldset.create('div', {'class':'halfDiv fhvid'}).create('input', {'id':'fVid', 'class':'vid text', 'type':'text', 'name':'topic[vid]', 'maxlength':'10'}).val(result.translations['vid']).focus(function(){
					if ($(this).val() == result.translations['vid']){
						$(this).val('');
						$(this).css({'color':activeColor, 'letter-spacing':'4px'});
					}

					if ($(this).hasClass('error')){
						$(this).parent().removeClass('error');
						$(this).removeClass('error').val('');
					}
				}).blur(function(){
					if ($(this).val() == ''){
						$(this).val(result.translations['vid']);
						$(this).css({'color':inActiveColor, 'letter-spacing':'0'});
					}
				});


				fieldset.create('input', {'id':'fType', 'type':'hidden', 'name':'topic[type]'}).val(result.data['name']);

				$.each(result.tabs, function(index, tab){
					var tabulate = tabs.create('li', {'class':tab['name'] + (3 == index ? ' active' : '')});
					tabulate.create('a', {'href':'#', 'title':tab['translate']}).create('strong').text(tab['translate']);

					tabulate.click(function(){
						$('li.active').removeClass('active');
						$(this).addClass('active');

						feedBox.children('h1').text(tab['title']);
						
						$('#fType').val(tab['name']);
						$('#fDescription').text(tab['description']).focus(function(){
							if ($(this).val() == tab['description']){
								$(this).val('');
								$(this).css('color', activeColor);
							}
						}).blur(function(){
							if ($(this).val() == ''){
								$(this).val(tab['title']);
								$(this).css('color', inActiveColor);
							}
						});
					});
				});

				feedBox.create('h1').text(result.data['title']);
				feedBox.create('div', {'class':'closeBtn'}).click(function(){
					feedBox.animate({'top':'-342px'}, 800);

					setInterval(function(){
						overlay.remove();
						feedBox.remove();
					}, 1000);
				});


				bsendButton.click(function(){
					var vid = $('#fVid').val() !== result.translations['vid'] ? $('#fVid').val() : '';
					var title = $('#fSubject').val() !== result.translations['shortTitle'] ? $('#fSubject').val() : '';
					var message = $('#fDescription').val() !== result.data['description'] ? $('#fDescription').val() : '';
					var email = $('#fEmail').val() != result.translations['email'] ? $('#fEmail').val() : '';
					var type = $('#fType').val();

					$.ajax({type: 'POST', url: '/ajax/feedback.html', dataType: 'json',
						data: {
							todo:'submit',
							sourceUrl:window.location.href,
							vid:vid,
							title:title,
							email:email,
							message:message,
							type:type
						},

						success : function(result){
							if (result.errors.length == 0){
								feedBox.empty();

								bsendButton = feedBox.create('div', {'class':'button'}).create('div', {'class':'greenBtn'}).create('div', {'class':'btn-font-b'}).create('a', {'title':result.translations['close'], 'href':'#'});
								bsendButton.create('span', {'class':'left'}).css('background-position', '0pt -1396px');
								bsendButton.create('span', {'class':'middle'}).css('background-position', '0pt -1354px').text(result.translations['close']);
								bsendButton.create('span', {'class':'right'}).css('background-position', '0pt -1312px');
								bsendButton.click(function(){
									feedBox.animate({'top':'-342px'}, 800);

									setInterval(function(){
										overlay.remove();
										feedBox.remove();
									}, 1000);
								});

								feedBox.animate({'height': '170px'}, 800).create('div', {'class': 'message'}).text(result.translations['passForm']);
							}
							else{
								for (var i=0, c=result.errors.length; i<c; i++){
									switch(result.errors[i]){
										case 'vid':
											$('#fVid').parent().addClass('error');
											$('#fVid').addClass('error');
										break;
										case 'title':
											$('#fSubject').parent().addClass('error');
											$('#fSubject').addClass('error');
										break;
										case 'email':
											$('#fEmail').parent().addClass('error');
											$('#fEmail').addClass('error');
										break;
										case 'message':
											$('#fDescription').parent().addClass('error');
											$('#fDescription').addClass('error');
										break;
									}
								}
							}
						}
					});
				});
			}});
		});
	});
});

(function($){
	$.validateVid = function(){

	};

	$.translation = function(text){
		return text;
	};

	$.fn.create = function(element, attributes){

            // fix for reedback - new jquery

            var obj = $(document.createElement(element));
            obj.attr(attributes);
            obj.prependTo(this);
            return obj;

            //return $(document.createElement(element)).attr(attributes).prependTo(this);
	};
})(jQuery);

