var EXPO = EXPO || {}; //isolated namespace
//общий для всех страниц модуль Функционал общий для всех страниц
// module requires JQuery library
// protection against duplication of a module code
if (EXPO.profile){
	console.warn('WARNING: EXPO.profile is already defined!');
}else{

	EXPO.profile = (function() {
	// variables
		var that = {};
		that.settings = {
			updateFormClass:'update-profile-form'
		}; //default module setting
		//language object
		that.lang ={};
	//dependences

	//private
		// factory for on page form objects
			function Forms(){};
			// methods to perform ajax responses to send and receive data from the server
			Forms.prototype = {
				// ajax request realization
				getajax: function (dataToSend) {
					var self = this;
					if(!dataToSend){
						dataToSend = '';
					}
					$.ajax({
						type: 'POST',
	//					dataType: "json",
						url: self.ajaxPath,
						data:dataToSend,
						processData: false,
						contentType: false,
						success: function(data) {
							self.pullHandler(data);
							$('#wait-ajax').fadeOut();
						}
					});

				},
				// check if there exists custom data manipulation handler and evaluate it
				pushData: function (data, formName) {
					var handler = this.pushHandler,
						formData = data;
					if(typeof formData != "string"){
						this.formData =formData;
					}else{
						this.formData = JSON.parse('{"' + decodeURI(formData).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g,'":"') + '"}');
					}
					this.formId = formName;

					if(typeof handler == 'function'){
						// if particular data change required
						handler(data);
						$('#wait-ajax').show();
					} else{
						this.getajax(data);
						$('#wait-ajax').show();
					}
					console.log('formData type');
					console.log(typeof formData);



				},
				pullData: function (data) {
					var handler = this.pullHandler;
					if(typeof handler == 'function'){
						handler(data);
					} else{
						throw{
							name: 'Error',
							message: " handler function for processing response after form submit not defined, please define it!"
						};
					}


				},
				// method to fulfill edited inputs with new content
				fulfillInputs: function () {
					var self = this;
					for (input in self.formData) {
						if($('#id_'+input, $('#'+self.formId)).length > 0){
							$('#id_'+input, $('#'+self.formId)).value(self.formData[input]);
						}
						if($('#static-'+input).length > 0){
							$('#static-'+input).html
						}
					}
				}
			};
			Forms.factory = function (type, ajaxpath) {
				var constr = type,
					newForm;
				if (typeof Forms[constr] !== 'function'){
					throw{
						name: 'Error',
						message: constr + "doesen't exist"
					};
				}
				if(typeof Forms[constr].prototype.pushData !== "function"){
					Forms[constr].prototype = new Forms();
				}
				newForm = new Forms[constr](ajaxpath);
				return newForm;
			};

			//# constructors for each indivivdual form
			// please add functionality for new profile forms here
			// pushHandler is for ajax to server, pullHandler for ajax from it. Data is the response information from server
			// name of each method is equal 'id' attribute of <form/> element on the page.

			Forms.home_form = function (path) {
				var self = this;
				this.pullHandler = function (data) {
					if (data.success){
						var country = $('#s2id_id_country').find('.select2-chosen').text(),
							city = $('#s2id_id_city').find('.select2-chosen').text();
						$('#static-home-country').text(country);
						$('#static-home-city').text(city);
						$('.p-editable').removeClass('pe-current');
					}
				};
				this.ajaxPath = path;

			};
			Forms.name_form = function (path) {
				var self = this;
				this.pullHandler = function (data) {
					if (data.success){
						$('#static-name-value').text($('#id_last_name').val()+' '+$('#id_first_name').val());
						$('.p-editable').removeClass('pe-current');
					}
				};
				this.ajaxPath = path;

			};
			Forms.work_form = function (path) {
				var self = this;
				this.pullHandler = function (data) {
					if (data.success){
						var company = $('#s2id_id_company').find('.select2-chosen').text();
						$('#static-work-value').html($('#id_position').val()+' '+EXPO.profile.lang.workIn+' <a href="'+data.url+'">"'+ company+'"</a>');

						$('.p-editable').removeClass('pe-current');
					}
				};
				this.ajaxPath = path;

			};
			Forms.about_company_form = function (path) {
				this.pullHandler = function (data) {
					if (data.success){
						window.location.reload();
					}
				};
				this.ajaxPath = path;

			};
			Forms.social_form = function (path) {
				this.pullHandler = function (data) {
					if (data.success){
						window.location.reload();
					}
				};
				this.ajaxPath = path;

			};
			Forms.phone_form = function (path) {
				var self = this;
				this.pullHandler = function (data) {
					if (data.success){
						$('#static-phone-value').text($('#id_phone')[0].value);

						$('.p-editable').removeClass('pe-current');

					}
				};
				this.ajaxPath = path;

			};
			Forms.web_page_form = function (path) {
				var self = this;
				this.pullHandler = function (data) {
					if (data.success){
						var userLink = $('#id_web_page').val();
						$('#static-web-page-value').attr('href',userLink).text(userLink);
						$('.p-editable').removeClass('pe-current');
					}
				};

				this.ajaxPath = path;

			};
			Forms.about_form = function (path) {
				var self = this;
				this.pullHandler = function (data) {
					if (data.success){
						$('#static-about-value').text($('#id_about').val());
						$('.p-editable').removeClass('pe-current');
					}
				};
				$('#id_about').on('keypress', function (e) {
					var keycode = (e.keyCode ? e.keyCode : e.which);
					if(keycode == '13'){
						return false;
					}

				});
				this.ajaxPath = path;

			};
			Forms.social_form = function (path) {
				var self = this,
					$img, imgSrc, $input, inputValue;
				this.pullHandler = function (data) {
					if (data.success){

						for (item in self.formData) {
							$input =  $('#id_'+item);
							if($.trim(self.formData[item]) != '' && $input.length){
								$img = $('#img-'+item);
								if($img.length){
									inputValue = $.trim($input.val());
									if ($img.parent('a').length){
										$img.parent('a').attr('href',inputValue);
										imgSrc = $img.attr('src').replace('_hover','');
										$img.attr('src',imgSrc);
	//									$('.p-editable').removeClass('pe-current');
									}else {
										imgSrc = $img.attr('src').replace('_hover','');
										$img.attr('src',imgSrc);
										$img.wrap('<a href="'+inputValue+'" target="_blank"></a>');
	//									$('.p-editable').removeClass('pe-current');
									}
								}
							}else if($input.length){
								$img = $('#img-'+item);
								if ($img.parent('a').length){
									imgSrc = $img.attr('src').replace('.png','_hover.png');
									$img.attr('src',imgSrc);
									$img.unwrap();
								}

							}

						}
						$('.p-editable').removeClass('pe-current');
					}
				};
				this.ajaxPath = path;

			};
			Forms.avatar_form = function (path) {
				var self = this,
					$input = $('#id_avatar'),
					$editPhoto = $('#pic-edit-photo'),
					$pickBlock = $('#pick-block'),
					$form,
					$avatar = $('.pic_block img');
				this.pullHandler = function (data) {
					if (data.success){

						if($avatar.length){
							$avatar.attr('src', data.url);
						}else{
							$pickBlock.removeClass('add_pic_block').addClass('pic_block');
							$('.add-wrapper', $pickBlock).remove();
							$('<img/>').attr('src', data.url).prependTo($pickBlock);
						}
	//					$('#static-about-value').text($('#id_about').val());
						$('.p-editable').removeClass('pe-current');
					}
				};
				this.pushHandler = function(data){
					if(typeof data != 'string'){
						self.getajax(data);
						$('#wait-ajax').show();
					}else{
						$form = $('#'+self.formId);
						$form.off('submit');
						$form.trigger('submit');
					}
				};
				$input.on('change', function () {
					$(this).parents('form').submit();
				});
				$editPhoto.on('click', function () {
					$input.trigger('click');
				});
	//			pick-block
				this.ajaxPath = path;
			}

		$(function () {

		});

	// methods
		//инициализация общих свойств
		that.init = function(options) {
			$.extend(this.lang, options.lang);
			options.lang = null;
			$.extend(this.settings, options);

			var self = this,
				initMaskedInput = function (inputId) {
					var maskList = $.masksSort($.masksLoad("/static/client/js/plugins/inputmask/phone-codes.json"), ['#'], /[0-9]|#/, "mask"),
					maskOpts = {
						inputmask: {
							definitions: {
								'#': {
									validator: "[0-9]",
									cardinality: 1
								}
							},
							//clearIncomplete: true,
							showMaskOnHover: false,
							autoUnmask: true
						},
						match: /[0-9]/,
						replace: '#',
						list: maskList,
						listKey: "mask",
						onMaskChange: function(maskObj, determined) {
							$(this).attr("placeholder", $(this).inputmask("getemptymask"));
						}
					},
					selector = '#'+inputId;

					$(selector).attr('placeholder', '+_(___)___-__-__');
					$(selector).inputmasks(maskOpts);

				};
			this.forms = {};
			$(function () {
				//start of document.ready

				// <selectbox> styling with 3-rd party libs
				$('#'+self.settings.selectBox[0].id).select2({
					width: 'element'
				});

				$('#'+self.settings.selectBox[1].id).select2({
					width: 'element',
					placeholder: self.settings.selectBox[1].placeholder,
					maximumSelectionSize: 3
				});

				$('#'+self.settings.selectBox[2].id).select2({
					placeholder: self.settings.selectBox[2].placeholder,
					width: 'element',
					ajax: {

						url: self.settings.selectBox[2].path,
						dataType: "json",
						quietMillis: 200,

						data: function(term, page, country){
							var country = $('#'+self.settings.selectBox[0].id).val();
							return {term: term,
								page: page,
								country: country};
						},

						results: function (data) {
							var results = [];
							$.each(data, function(index, item){
								results.push({
									id: item.id,
									text: item.label
								});
							});
							return {results: results};
						}
					},
					initSelection : function(element, callback) {
						var id=	$(element).val();
						var text = $(element).attr('data-init-text');
						callback({id: id, text:text});

					}

				});

				$('#'+self.settings.selectBox[3].id).select2({
					placeholder: self.settings.selectBox[3].placeholder,
					width: '200px',
					minimumInputLength: 1,
					ajax: {

						url: self.settings.selectBox[3].path,
						dataType: "json",
						quietMillis: 200,

						data: function(term, page, country){
							return {term: term,
								page: page};
						},

						results: function (data) {
							var results = [];
							$.each(data, function(index, item){
								results.push({
									id: item.id,
									text: item.label
								});
							});
							return {results: results};
						}
					},
					initSelection : function(element, callback) {
						var id=	$(element).val();
						var text = $(element).attr('data-init-text');
						callback({id: id, text:text});

					}

				});

	//			$('#'+ self.settings.phoneBox);
				// make mask on phone field input
				initMaskedInput(self.settings.phoneBox);
				//forms init
				$('.'+self.settings.updateFormClass).each(function () {
					var formName = $(this).attr('id'),
						path = $(this).attr('action'),
						inputData;

					//make and initialize form objects
					self.forms[formName] = Forms.factory(formName,path);

					// submit events handler
					$(this).off('submit');
					$(this).on('submit', function () {
						//check if formData is supported
						if ( window.FormData && ("upload" in ($.ajaxSettings.xhr())) ){
							inputData = new FormData(this);
							self.forms[formName].pushData(inputData, formName);
						} else {
							inputData = $(this).serialize();
							self.forms[formName].pushData(inputData, formName);
						}

						return false;
					});

				});
			});



		};
		return that;
	}());
}