/*******************************************************************************

* KindEditor - WYSIWYG HTML Editor for Internet

* Copyright (C) 2006-2011 kindsoft.net

*

* @author Roddy <luolonghao@gmail.com>

* @site http://www.kindsoft.net/

* @licence http://www.kindsoft.net/license.php

*******************************************************************************/



KindEditor.plugin('emoticons', function(K) {

	var self = this, name = 'emoticons',

		path = (self.emoticonsPath || self.pluginsPath + 'emoticons/images/'),

		allowPreview = self.allowPreviewEmoticons === undefined ? true : self.allowPreviewEmoticons,

		currentPageNum = 1;

	self.clickToolbar(name, function() {

		var rows = 5, cols = 9, total = 135, startNum = 0,

			cells = rows * cols, pages = Math.ceil(total / cells),

			colsHalf = Math.floor(cols / 2),

			wrapperDiv = K('<div class="ke-plugin-emoticons"></div>'),

			elements = [],

			menu = self.createMenu({

				name : name,

				beforeRemove : function() {

					removeEvent();

				}

			});

		menu.div.append(wrapperDiv);

		var previewDiv, previewImg;

		if (allowPreview) {

			previewDiv = K('<div class="ke-preview"></div>').css('right', 0);

			previewImg = K('<img class="ke-preview-img" src="' + path + startNum + '.gif" />');

			wrapperDiv.append(previewDiv);

			previewDiv.append(previewImg);

		}

		function bindCellEvent(cell, j, num) {

			if (previewDiv) {

				cell.mouseover(function() {

					if (j > colsHalf) {

						previewDiv.css('left', 0);

						previewDiv.css('right', '');

					} else {

						previewDiv.css('left', '');

						previewDiv.css('right', 0);

					}

					previewImg.attr('src', path + num + '.gif');

					K(this).addClass('ke-on');

				});

			} else {

				cell.mouseover(function() {

					K(this).addClass('ke-on');

				});

			}

			cell.mouseout(function() {

				K(this).removeClass('ke-on');

			});

			cell.click(function(e) {

				self.insertHtml('<img src="' + path + num + '.gif" border="0" alt="" />').hideMenu().focus();

				e.stop();

			});

		}

		function createEmoticonsTable(pageNum, parentDiv) {

			var table = document.createElement('table');

			parentDiv.append(table);

			if (previewDiv) {

				K(table).mouseover(function() {

					previewDiv.show('block');

				});

				K(table).mouseout(function() {

					previewDiv.hide();

				});

				elements.push(K(table));

			}

			table.className = 'ke-table';

			table.cellPadding = 0;

			table.cellSpacing = 0;

			table.border = 0;

			var num = (pageNum - 1) * cells + startNum;

			for (var i = 0; i < rows; i++) {

				var row = table.insertRow(i);

				for (var j = 0; j < cols; j++) {

					var cell = K(row.insertCell(j));

					cell.addClass('ke-cell');

					bindCellEvent(cell, j, num);

					var span = K('<span class="ke-img"></span>')

						.css('background-position', '-' + (24 * num) + 'px 0px')

						.css('background-image', 'url(' + path + 'static.gif)');

					cell.append(span);

					elements.push(cell);

					num++;

				}

			}

			return table;

		}

		var table = createEmoticonsTable(currentPageNum, wrapperDiv);

		function removeEvent() {

			K.each(elements, function() {

				this.unbind();

			});

		}

		var pageDiv;

		function bindPageEvent(el, pageNum) {

			el.click(function(e) {

				removeEvent();

				table.parentNode.removeChild(table);

				pageDiv.remove();

				table = createEmoticonsTable(pageNum, wrapperDiv);

				createPageTable(pageNum);

				currentPageNum = pageNum;

				e.stop();

			});

		}

		function createPageTable(currentPageNum) {

			pageDiv = K('<div class="ke-page"></div>');

			wrapperDiv.append(pageDiv);

			for (var pageNum = 1; pageNum <= pages; pageNum++) {

				if (currentPageNum !== pageNum) {

					var a = K('<a href="javascript:;">[' + pageNum + ']</a>');

					bindPageEvent(a, pageNum);

					pageDiv.append(a);

					elements.push(a);

				} else {

					pageDiv.append(K('@[' + pageNum + ']'));

				}

				pageDiv.append(K('@&nbsp;'));

			}

		}

		createPageTable(currentPageNum);

	});

});

