barbass: рефакторинг скрипта

etersoft_typos.js

@@ -4,205 +4,255 @@
 *  дата: 2012-04-18
 */
 
-//////////////////////////////////////////////////////
-
-window.document.onkeydown = function(e)  {
-	if  (e.ctrlKey==1 && e.keyCode == 13)  { 
-		ETY.control_panel();
-	}
+function ETYPOS(options) {
+	this.init(options);
 }
-
-var ETY = {
-	time: 0, //время последнего запроса
+ETYPOS.prototype = {
+	//время последнего запроса
+	last_query_time: 0, 
+	//сайт обработки опечаток
 	server_url: "http://barbass.pubsandbox.eterhost.ru/typos/server.php",
-	select_text: "",
+	//текст ошибок
+	error: '',
+	//данные для отправки (сайт страницы, текст с ошибкой, комментарий, язык, броузер)
+	userdata: {
+		'url': '',
+		'text': '',
+		'comment': '',
+		'language': 'ru',
+		'oldbrowser': 0,
+	},
+	
+	init: function(options) {
+		this.options = (options) ? options : {};
 		
-	//Выделенный текст
-	get_select_text: function()  {
-		var text = String(window.getSelection()).trim().substr(0, 50);
-		if  (typeof(text) == 'undefined')  {
-			text = "";
+		if (this.options['server_url']) {
+			this.server_url = this.options['server_url'];
 		}
-		return text;
+
+		this.request = new (window.XDomainRequest || window.XMLHttpRequest);
+
+		this.userdata['oldbrowser'] = 0;//(this.request.withCredentials == undefined) ? 1 : 0;
+
 	},
 
-	control_panel: function()  {
-		if  (document.getElementById("e_typos_div").style.display == "block")  {
-			this.close();
-		}  else  {
-			this.div();
-			ETY.select_text = ETY.get_select_text();
-		}
+	/*Получаем выделенный текст*/
+	getSelectText: function() {
+		return (window.getSelection()) ? String(window.getSelection()) : '';
+	},
+	
+	/*Скрытие/показ окна*/
+	controlPanel: function() {
+		(document.querySelector(".e_typos_div").style.display == "block") ? this.closeWindow() : this.openWindow();
 	},
 
-	div: function()  {
+	/*Открытие окна*/
+	openWindow: function() {
+		var main_div = document.querySelector(".e_typos_div");
+		
 		//Определяем на какой позиции X, Y всплывет элемент
 		var top = window.pageYOffset + window.innerHeight/3;
 		var left = window.pageXOffset + window.innerWidth/3;
-		document.getElementById("e_typos_div").style.top = top + "px";
-		document.getElementById("e_typos_div").style.left = left + "px";
+		main_div.style.top = top + "px";
+		main_div.style.left = left + "px";
+		main_div.style.display = "none";
 		
-		document.getElementById("e_typos_error").style.display = "none";
-		document.getElementById("e_typos_comment").value = "";
+		main_div.querySelector(".e_typos_comment").value = "";
+		main_div.querySelector(".e_typos_message").innerHTML = "";
 	
-		document.getElementById("e_typos_div").style.display = "block";
+		main_div.style.display = "block";
 	},
 
-	close: function()  {
-		document.getElementById("e_typos_div").style.display = "none";
+	/*Закрытия окна*/
+	closeWindow: function() {
+		document.querySelector(".e_typos_div").style.display = "none";
 	},
 
-	post_data: function()  {
-		var this_url = window.location.href; //Текущая страница
-		var post_text;
-		if  (ETY.select_text == "")  {
-			post_text = ETY.get_select_text();
-		}  else  {
-			post_text = ETY.select_text;
+	/*Проверка данных перед отправкой*/
+	validateData: function() {
+		if (!this.userdata) {
+			throw new Error("Not found userdata-object!");
+			return false;
 		}
 		
-		var new_text = ETY.get_select_text();
+		if (typeof(this.userdata) != 'object') {
+			throw new Error("userdata is not object!");
+			return false;
+		}
 
-		if  (new_text != ETY.select_text && new_text.length != 0)  {
-			post_text = new_text;
+		if (this.userdata['url'] == '') {
+			this.error = "Не определен URL сайта";
+			return false;
 		}
 		
-		//Выделенный текст
-		var user_comment = document.getElementById("e_typos_comment").value.trim().substr(0, 50);
-			if  (user_comment == '')  {
-				user_comment = "";
+		if (!this.userdata['language']) {
+			this.userdata['language'] = 'ru';
+			return false;
 		}
 		
-		if  (post_text.length == 0)  {
-			this.error("red", "Вы ничего не выделили");
-		}  else if  (post_text.length < 5)  {
-			this.error("red", "Выделенный текст слишком короток");
-		}  else  if  (post_text.length > 30)  {
-			this.error("red", "Выделенный текст слишком длинный");
-		}  else  {
-			ETY.select_text = post_text;
-			//Ajax-запрос
-			this.ajax_query(this.server_url+"?e_typos_url="+this_url+"&e_typos_comment="+encodeURIComponent(user_comment)+"&e_typos_error_text="+encodeURIComponent(post_text));	
+		if (!this.userdata['text']) {
+			this.error = "Текст не выделен";
+			return false;
+		}
+		
+		if (this.userdata['text'].length < 5 || this.userdata['text'].length > 30) {
+			this.error = "Выделенный текст должен быть длиной от 5 до 30 символов (сейчас: "+this.userdata['text'].length+")";
+			return false;
+		}
+
+		if (this.userdata['comment'].length > 50) {
+			this.error = "Комментарий должен быть длиной до 30 символов (сейчас: "+this.userdata['comment'].length+")";
+			return false;
 		}
+
+		return true;
 	},
 
-	//Отправка запроса
-	ajax_query: function(url)  {
-		this.error("black", "Идет отправка данных...");
+	/*Сбор данных*/
+	postData: function() {
+		this.userdata['url'] = window.location.href;
+		this.userdata['text'] = this.getSelectText();
+		this.userdata['comment'] = (document.querySelector(".e_typos_div .e_typos_comment")) ? document.querySelector(".e_typos_div .e_typos_comment").value : '';
 		
-		var XHR = window.XDomainRequest || window.XMLHttpRequest;
-		request = new XHR;
+		try {
+			if (!this.validateData()) {
+				this.printMessage('error', this.error);
+				return false;
+			}
+		} catch(error) {alert(error);
+			this.printMessage('error', error.message);
+			return false;
+		}
 
 		//Если не поддерживаются кроссдоменные запросы
-		if  (request.withCredentials == undefined)  {
-			var old_url = window.location.href;
+		if (this.userdata['oldbrowser']) {
+			this.ajaxQueryOldBrowser();
+		} else {
+			this.ajaxQuery();
+		}
 
-			newWin = window.open(url+'&e_typos_oldbrowser=1', '_blank');
+	},
+
+	/*Создание формы с данными*/
+	formData: function() {
+		if (!FormData()) {
+			throw new Error("FormData() не поддерживается");
+			return false;
+		}
+		var form_data = new FormData();
+		for(var key in this.userdata) {
+			form_data.append(key, this.userdata[key]);
+		}
+		return form_data;
+	},
+
+	/*Отправка данных на старых броузерах*/
+	ajaxQueryOldBrowser: function() {
+		window.open(this.server_url+'?oldbrowser='+encodeURIComponent(this.userdata['oldbrowser'])+'&url='+encodeURI(this.userdata['url'])+'&comment='+encodeURIComponent(this.userdata['comment'])+'&text='+encodeURIComponent(this.userdata['text']+'&language='+encodeURIComponent(this.userdata['language'])), '_blank');
 		window.parent.focus();
 
-			this.error("green", "Спасибо за ваше внимание.");
-			window.setTimeout('ETY.close()', 2000);
+		this.printMessage("success", "Спасибо за ваше внимание");
+		//Ошибка закрытия окна!
+		var this_object = this;
+		window.setTimeout('this.closeWindow()', 2000);
+		return true;
+	},
+
+	/*Отправка запроса*/
+	ajaxQuery: function() {
+		var this_object = this;
+		
+		try {
+			var form_data = this.formData();
+		} catch (error) {
+			this.printMessage("error", error.message);
 			return false;
 		}
 
-		var result = this.timer();
-		if  (result == 0)  {
-			this.error("red", "Не отправляйте данные часто");
+		if (!this.checkTime()) {
+			this.printMessage("error", "Не отправляйте данные часто!");
 			return false;
 		} else {
-			this.time = this.now_time();
-			this.set_storage("etersoft_typos/"+window.location.hostname+"", this.time);
-		}
-	
-		request.open("POST", url, true);
-		request.onload = function()  {
-			var data = request.responseText;
-			switch (data)  {
-				case '10robot': 
-					ETY.error("red", "Есть подозрения что вы робот");
-					break;
-				case '10dataerror': 
-					ETY.error("red", "Данные некорректны");
-					break;
-				case '10siteerror': 
-					ETY.error("red", "Данный сайт не поддерживается");
-					break;
-				case '10emailerror': 
-					ETY.error("red", "Сервер не смог отправить письмо");
-					break;
-				case '10win': 
-					ETY.error("green", "Спасибо за ваше внимание.");
-					window.setTimeout('ETY.close()', 2000);
-					break;
-				case '10inserterror': 
-					ETY.error("red", "Ошибка добавления данных");
-					break;
-				case '10servererror': 
-					ETY.error("red", "На сервере произошла ошибка");
-					break;
-				default:
-					ETY.error("red", "На сервере произошла ошибка");
-					break;
-			}
-		}
-		request.onerror = function()  {
-			ETY.error("red", "Ошибка отправки данных. Повторите позже");
-			this.time = 0;
-		}
-		request.send();
-	},
-
-	error: function(color, text)  {
-		document.getElementById("e_typos_error").style.display = "block";
-		document.getElementById("e_typos_error").innerHTML = text;
-	
-		document.getElementById("e_typos_error").style.color = color;
-		document.getElementById("e_typos_error").style.borderColor = color;
-	},
-	
-	text: function(text)  {
-		document.getElementById("e_typos_user_text").style.display = "block";
-		document.getElementById("e_typos_user_text").innerHTML = "Ваш текст: "+text;
-	},
-
-	timer: function()  {
-		var sec = this.now_time();
-		var time_s = this.get_storage("etersoft_typos/"+window.location.hostname+"");
-		if  (time_s != 0)  {
-			this.time = time_s;
-		}
-	
-		if  (this.now_time() - parseFloat(this.time) < 60000)  {
-			return 0;
+			this.last_query_time = this.getTime();
+			this.setStorage("etersoft_typos/"+window.location.hostname+"", this.getTime());
+		}
+	
+		this.printMessage("attention", "Идет отправка данных...");
+	
+		this.request.open("POST", this.server_url, true);
+
+		this.request.onload = function() {
+			
+			try {
+				var response = window.JSON.parse(this_object.request.responseText);
+				
+				
+				if (response['success'] && response['message']) {
+					if (response['success'] == 'true') {
+						var success = 'success';
+					} else {
+						var success = 'error';
+					}
+					this_object.printMessage(success, response['message']);
 				} else {
-			return 1;
+					this_object.printMessage('attention', "Ошибка при получении ответа");
+				}
+			} catch (e) {
+				this_object.printMessage('error', "Ошибка при обработке ответа");
 			}
+		};
+		this.request.onerror = function() {
+			this_object.printMessage("error", "Ошибка отправки данных. Повторите позже");
+		};
+		this.request.send(form_data);
 	},
 
-	now_time: function()  {
-		var day = new Date();
-		var sec = day.getTime();
-		return sec; 
+	/*Печатаем сообщение пользователю в окно*/
+	printMessage: function(status, text) {
+		document.querySelector(".e_typos_div .e_typos_message").innerHTML = "<span class='"+status+"'>"+text+"</span>";
 	},
 	
-	get_storage: function(key) {
-		if (window['sessionStorage'] != null) {
-			if (!sessionStorage.getItem(key+"")) {
-				return 0;
-			} else {
-				var data = sessionStorage.getItem(key+"");
-				return data;
+	//Вывод текста, выделенного пользователем
+	printUserText: function(text) {
+		document.querySelector(".e_typos_div .e_typos_user_text").style.display = "block";
+		document.querySelector(".e_typos_div .e_typos_user_text").innerHTML = "Ваш текст: "+text;
+	},
+
+	/*Проверяем время, прошедшее с последнего отправления данных*/
+	checkTime: function() {return true;
+		var prev_time = (parseInt(this.getStorage("etersoft_typos/"+window.location.hostname))) ? parseInt(this.getStorage("etersoft_typos/"+window.location.hostname)) : parseInt(this.last_query_time);
+		if (isNaN(prev_time)) {
+			return true;
 		}
+
+		if ( (this.getTime() - prev_time) < 60000) {
+			return false;
+		}
+		
+		return true;
+	},
+	
+	/*Получаем текущее время*/
+	getTime: function() {
+		return new Date().getTime();
+	},
+
+	/*Получаем из sessionStorage данные*/
+	getStorage: function(key) {
+		if (window['sessionStorage']) {
+			return (sessionStorage.getItem(key)) ? sessionStorage.getItem(key) : false;
 		} else {
-			return 0;
+			return false;
 		}
 	},
 	
-	set_storage: function(key, data) {
-		if (window['sessionStorage'] != null) {
+	/*Устанавливаем в sessionStorage данные*/
+	setStorage: function(key, data) {
+		if (window['sessionStorage']) {
 			sessionStorage.setItem(key+"", data);
+			return true;
 		}
+		return false;
 	}
 
-}
-
+};