var emoji = (function(window, $) {
	//用于存储表情的键与值
	var emotionsMap = {};

	var emojiData = [{
		face: [
		    {
				icon: "→_→",
				class: "face_1 face icon_0"
			}, {
				icon: "[微笑]",
				class: "face_1 face icon_1"
			}, {
				icon: "[嘻嘻]",
				class: "face_1 face icon_2"
			}, {
				icon: "[哈哈]",
				class: "face_1 face icon_3"
			}, {
				icon: "[爱你]",
				class: "face_1 face icon_4"
			}, {
				icon: "[挖鼻]",
				class: "face_1 face icon_5"
			}, {
				icon: "[吃惊]",
				class: "face_1 face icon_6"
			}, {
				icon: "[晕]",
				class: "face_1 face icon_7"
			}, {
				icon: "[泪]",
				class: "face_1 face icon_8"
			}, {
				icon: "[馋嘴]",
				class: "face_1 face icon_9"
			}, {
				icon: "[抓狂]",
				class: "face_1 face icon_10"
			}, {
				icon: "[哼]",
				class: "face_1 face icon_11"
			}, {
				icon: "[可爱]",
				class: "face_1 face icon_12"
			}, {
				icon: "[怒]",
				class: "face_1 face icon_13"
			}, {
				icon: "[汗]",
				class: "face_1 face icon_14"
			}, {
				icon: "[害羞]",
				class: "face_1 face icon_15"
			}, {
				icon: "[困]",
				class: "face_1 face icon_16"
			}, {
				icon: "[钱]",
				class: "face_1 face icon_17"
			}, {
				icon: "[偷笑]",
				class: "face_1 face icon_18"
			}, {
				icon: "[笑cry]",
				class: "face_1 face icon_19"
			}, {
				icon: "[doge]",
				class: "face_1 face icon_20"
			}, {
				icon: "[喵喵]",
				class: "face_1 face icon_21"
			}, {
				icon: "[酷]",
				class: "face_1 face icon_22"
			}, {
				icon: "[衰]",
				class: "face_1 face icon_23"
			}, {
				icon: "[闭嘴]",
				class: "face_1 face icon_24"
			}, {
				icon: "[鄙视]",
				class: "face_1 face icon_25"
			}, {
				icon: "[色]",
				class: "face_1 face icon_26"
			}, {
				icon: "[鼓掌]",
				class: "face_1 face icon_27"
			}, {
				icon: "[悲伤]",
				class: "face_2 face icon_0"
			}, {
				icon: "[思考]",
				class: "face_2 face icon_1"
			}, {
				icon: "[生病]",
				class: "face_2 face icon_2"
			}, {
				icon: "[亲亲]",
				class: "face_2 face icon_3"
			}, {
				icon: "[怒骂]",
				class: "face_2 face icon_4"
			}, {
				icon: "[太开心]",
				class: "face_2 face icon_5"
			}, {
				icon: "[白眼]",
				class: "face_2 face icon_6"
			}, {
				icon: "[右哼哼]",
				class: "face_2 face icon_7"
			}, {
				icon: "[左哼哼]",
				class: "face_2 face icon_8"
			}, {
				icon: "[嘘]",
				class: "face_2 face icon_9"
			}, {
				icon: "[委屈]",
				class: "face_2 face icon_10"
			}, {
				icon: "[吐]",
				class: "face_2 face icon_11"
			}, {
				icon: "[可怜]",
				class: "face_2 face icon_12"
			}, {
				icon: "[睡]",
				class: "face_2 face icon_13"
			}, {
				icon: "[挤眼]",
				class: "face_2 face icon_14"
			}, {
				icon: "[失望]",
				class: "face_2 face icon_15"
			}, {
				icon: "[顶]",
				class: "face_2 face icon_16"
			}, {
				icon: "[疑问]",
				class: "face_1 face icon_17"
			}, {
				icon: "[困]",
				class: "face_2 face icon_18"
			}, {
				icon: "[感冒]",
				class: "face_2 face icon_19"
			}, {
				icon: "[拜拜]",
				class: "face_2 face icon_20"
			}, {
				icon: "[黑线]",
				class: "face_2 face icon_21"
			}, {
				icon: "[阴险]",
				class: "face_2 face icon_22"
			}, {
				icon: "[互粉]",
				class: "face_2 face icon_23"
			}, {
				icon: "[心]",
				class: "face_2 face icon_24"
			}, {
				icon: "[伤心]",
				class: "face_2 face icon_25"
			}, {
				icon: "[猪头]",
				class: "face_2 face icon_26"
			}, {
				icon: "[熊猫]",
				class: "face_2 face icon_27"
			}
		]
	}, {
		face: [
		    {
				icon: "[兔子]",
				class: "face_3 face icon_0"
			}, {
				icon: "[握手]",
				class: "face_3 face icon_1"
			}, {
				icon: "[作揖]",
				class: "face_3 face icon_2"
			}, {
				icon: "[赞]",
				class: "face_3 face icon_3"
			}, {
				icon: "[耶]",
				class: "face_3 face icon_4"
			}, {
				icon: "[good]",
				class: "face_3 face icon_5"
			}, {
				icon: "[弱]",
				class: "face_3 face icon_6"
			}, {
				icon: "[NO]",
				class: "face_3 face icon_7"
			}, {
				icon: "[ok]",
				class: "face_3 face icon_8"
			}, {
				icon: "[haha]",
				class: "face_3 face icon_9"
			}, {
				icon: "[来]",
				class: "face_3 face icon_10"
			}, {
				icon: "[威武]",
				class: "face_3 face icon_11"
			}, {
				icon: "[鲜花]",
				class: "face_3 face icon_12"
			}, {
				icon: "[钟]",
				class: "face_3 face icon_13"
			}, {
				icon: "[浮云]",
				class: "face_3 face icon_14"
			}, {
				icon: "[飞机]",
				class: "face_3 face icon_15"
			}, {
				icon: "[月亮]",
				class: "face_1 face icon_16"
			}, {
				icon: "[太阳]",
				class: "face_3 face icon_17"
			}, {
				icon: "[微风]",
				class: "face_3 face icon_18"
			}, {
				icon: "[下雨]",
				class: "face_3 face icon_19"
			}, {
				icon: "[给力]",
				class: "face_3 face icon_20"
			}, {
				icon: "[神马]",
				class: "face_3 face icon_21"
			}, {
				icon: "[围观]",
				class: "face_3 face icon_22"
			}, {
				icon: "[话筒]",
				class: "face_3 face icon_23"
			}, {
				icon: "[奥特曼]",
				class: "face_3 face icon_24"
			}, {
				icon: "[草泥马]",
				class: "face_3 face icon_25"
			}, {
				icon: "[萌]",
				class: "face_3 face icon_26"
			}, {
				icon: "[囧]",
				class: "face_3 face icon_27"
			}, {
                icon: "[织]",
                class: "face_4 face icon_0"
            }, {
                icon: "[礼物]",
                class: "face_4 face icon_1"
            }, {
                icon: "[喜]",
                class: "face_4 face icon_2"
            }, {
                icon: "[围脖]",
                class: "face_4 face icon_3"
            }, {
                icon: "[音乐]",
                class: "face_4 face icon_4"
            }, {
                icon: "[绿丝带]",
                class: "face_4 face icon_5"
            }, {
                icon: "[蛋糕]",
                class: "face_4 face icon_6"
            }, {
                icon: "[蜡烛]",
                class: "face_4 face icon_7"
            }, {
                icon: "[干杯]",
                class: "face_4 face icon_8"
            }, {
                icon: "[男孩儿]",
                class: "face_4 face icon_9"
            }, {
                icon: "[女孩儿]",
                class: "face_4 face icon_10"
            }, {
                icon: "[肥皂]",
                class: "face_4 face icon_11"
            }, {
                icon: "[照相机]",
                class: "face_4 face icon_12"
            }, {
                icon: "[浪]",
                class: "face_4 face icon_13"
            }, {
                icon: "[沙尘暴]",
                class: "face_4 face icon_14"
            }
		]
	}];


	//插入表情
	$.fn.insertText = function(text) {
		this.each(function() {

			if (this.tagName !== 'INPUT' && this.tagName !== 'TEXTAREA') {
				return;
			}
			if (document.selection) {
				this.focus();
				var cr = document.selection.createRange();
				cr.text = text;
				cr.collapse();
				cr.select();
			} else if (this.selectionStart !== undefined) {
				var start = this.selectionStart;
				var end = this.selectionEnd;
				this.value = this.value.substring(0, start) + text + this.value.substring(end, this.value.length);
				this.selectionStart = this.selectionEnd = start + text.length;
			} else {
				this.value += text;
			}
		});

		return this;
	};
	//编译表情
	$.fn.parseEmotion = function() {

		// if(! categories){
		//   parsingArray = $(this);
		//   loadEmotions();
		// }else if(categories.length == 0){
		//   parsingArray = parsingArray.add($(this));
		// }else{
		$(this).each(function() {

			var $this = $(this);
			var html = $this.html();

			html = html.replace(/<.*?>/g, function($1) {
				$1 = $1.replace('[', '[');
				$1 = $1.replace(']', ']');
				return $1;
			}).replace(/\[[^\[\]]*?\]/g, function($1) {
				var url = emotionsMap[$1];
				if (url) {
					return '<i class="' + url + '"></i>';
				}
				return $1;
			});

			$this.html(html);
		});
		//}
		return this;
	};

	var action = {};

	action.insert =  function($this) {
		var $parent = $this.parent();
		var $insert = $($this.data('insert'));

		if ($this.hasClass('face-on')) {
			if ($this.hasClass('active')) {
				$this.removeClass('active');
			} else {
				$this.addClass('active');
			}

			$parent.next('.face-main').toggle();
			return;
		}

		var mainDom = $('<div class="face-main"></div>')
		var boxDom = $('<div class="face-main-box"></div>');
		var tabDom = $('<ul class="nav-tab-face selfclear"></ul>');

		$.each(emojiData, function(i, v) {
			var $tabFace = $('<div class="content-tab-face selfclear clearfix" >');
			$tabFace.appendTo(boxDom);
			$.each(v.face, function(itm, itmVal) {
				var $face = $('<i data-face="' + itmVal.icon + '" class="' + itmVal.class + '"></i>');
					$face.appendTo($tabFace);
			});
			var $tabBtn =  $('<li><a class="face-tabs-btn" href="javascript:;"></a></li>');
			$tabBtn.appendTo(tabDom);	
			if (0 === i) {
				$tabFace.addClass('current');
				$tabBtn.addClass('current');
			}
		});


		mainDom.append(tabDom).append(boxDom).show();
		$parent.after(mainDom);
		$this.addClass('face-on');

		//点击插入内容
		boxDom.on("click", ".face", function() {
			$insert.insertText($(this).data("face"));
		});
	}

	action.parse = function (data) {
        return data.replace(/<.*?>/g, function($1) {
            $1 = $1.replace('[', '[');
            $1 = $1.replace(']', ']');
            return $1;
        }).replace(/\[[^\[\]]*?\]/g, function($1) {
            var url = emotionsMap[$1];
            if (url) {
                return '<i class="' + url + '"></i>';
            }
            return $1;
        });
    };

	//主入口
	action.init = function() {
		$.each(emojiData, function(i, v) {
			$.each(v.face, function(itm, itmVal) {
				emotionsMap[itmVal.icon] = itmVal.class;
			});
		})

		$(document).on("click", '.face-tabs-btn', function(e) {
	        e.preventDefault();
	        var parent = $(this).parent();
	        var index = parent.index();
	        var tabBox = parent.parent().next();

	        tabBox.find('.content-tab-face').eq(index)
	        	.addClass('current').siblings()
	        	.removeClass('current');

	        parent.addClass('current').siblings().removeClass('current');
	    });


		$(document).on("click",function(e){ 
			var target = $(e.target); 
			if((target.closest(".face-main").length == 0) && (target.closest(".face-icon").length == 0)) { 
				$(".face-main").hide(); 
			} 
		});
	};

	return action;
})(window, jQuery);