/*
 * wordProcessor: ブラウザ上で簡易文書編集機能を提供する
 * Copyright (c) 2003- Seesaa CO.,LTD. All rights reserved.
 * 
 * url: http://seesaa.jp/
 */


function wordProcessor (form_name,element_name) {
        this.form_name    = form_name;
	this.element_name = element_name;
	this.color_palette_name   = form_name + '_' + element_name + '_color_palette';
	this.emoji_palette_name   = form_name + '_' + element_name + '_emoji_palette';
	return this;
}

wordProcessor.prototype.insertTag = function (start_tag, end_tag) {
	var text_range = new textRange(document.getElementById(this.element_name));
	text_range.insertTag(start_tag, end_tag);
	var el = document.forms[this.form_name][this.element_name];
	if (typeof(previewHTML) == 'function' && el && el.id) {
	    previewHTML(el.id);
	}
}


wordProcessor.prototype.setFontDecoration = function (tag_name, style) {
	var start_tag = '<' + tag_name + ' style="' + style + ';">';
	var end_tag = '</' + tag_name + '>';
	this.insertTag(start_tag, end_tag);
}


wordProcessor.prototype.setFontBold = function () {
  //	this.setFontDecoration('span', 'font-weight:bold');
  this.insertTag('<太>', '</太>');
}


wordProcessor.prototype.setFontItalic = function () {
  //	this.setFontDecoration('span', 'font-style:italic');
  this.insertTag('<斜>', '</斜>');
}


wordProcessor.prototype.setFontUnderline = function () {
  //	this.setFontDecoration('span', 'text-decoration:underline');
  this.insertTag('<下線>', '</下線>');
}


wordProcessor.prototype.setFontStrike = function () {
  //	this.setFontDecoration('span', 'text-decoration:line-through');
  this.insertTag('<打消線>', '</打消線>');
}


wordProcessor.prototype.setFontBlockquote = function () {
  //	this.insertTag('<blockquote>', '</blockquote>');
  this.insertTag('<引用>', '</引用>');
}


wordProcessor.prototype.setFontLarge = function () {
    //this.setFontDecoration('span', 'font-size:large');
    this.insertTag('<大>','</大>');
}

wordProcessor.prototype.setFontExtraLarge = function () {
    //this.setFontDecoration('span', 'font-size:x-large');
    this.insertTag('<特大>','</特大>');
}


wordProcessor.prototype.setFontSmall = function () {
    //	this.setFontDecoration('span', 'font-size:x-small');
    this.insertTag('<小>','</小>');
}


wordProcessor.prototype.setTextAlign = function (align) {
	var start_tag = '<' + align + '>';
	var end_tag = '</' + align + '>';
	this.insertTag(start_tag, end_tag);
}


wordProcessor.prototype.createColorPaletteInnerHTML = function () {
	var layer_name = this.color_palette_name;
	var form_name = layer_name + '_form';
	var display_name = layer_name + '_display';

	var colorbox = function (color, display_form_name, display_name, editor_form_name, editor_name, layer_name) {
		var mover = 'document.' + display_form_name + '.' + display_name + '.value=\'#' + color + '\';new layerHandle(\'' + layer_name + '\').srcElement.style.color=\'#' + color + '\';';
		var str =
			'<span style="height:10px; width:10px; background: #' + color + '; display: block; float:left; cursor:default; position: relative; font-size: 2px; overflow: hidden;" ' +
			'onmouseover="' + mover + '"' +
		        'onmousedown=\'new textRange(document.' + editor_form_name + '.' + editor_name + ').insertTag("<色:#' + color + '>", "</色>");new layerHandle("' + layer_name + '").hide(); switchAllSelect("visible");\'></span>';

		// var str =
		// 	'<td bgcolor="#' + color + '">' +
		// 	'<img src="/_img/cmn/spacer.gif" width="10" height="10" hspace="0" vspace="0" border="0" ' +
		// 	'onmouseover="' + mover + '"' +
		// 	'onmousedown=\'new textRange(document.' + editor_form_name + '.' + editor_name + ').insertTag("<span style=\\\"color:#' + color + ';\\\">", "</span>");new layerHandle("' + layer_name + '").hide(); switchAllSelect("visible");\' />' +
		// 	'</td>';
		return str;
	}

	var inner_html =
		'<form name="'+ form_name + '">' +
		'<div style="background:#ffffff; border:#aaa solid 2px; width: 400px;">' +
		'<input name="' + display_name + '" style="border-color:#000; border-style:solid; border-width:1px; width:60px;" />' +
		' AaＡａあぁアァ漢字 <span style="font-weight:bold;">サンプルテキスト</span>' +
		'<table border="0" cellpadding="0" cellspacing="0">';

	var r_dt = 51.2;
	var g_dt = 51.2;
	var b_dt = 51.2;
	var r_max = 256 / r_dt;
	var g_max = 256 / g_dt;
	var b_max = 256 / b_dt;
	var rgb_list = new Array('000000', 'FF0000', '333333', '00FF00', '666666', '0000FF', '999999', 'FFFF00', 'CCCCCC', 'FF00FF', 'FFFFFF', '00FFFF');

	for ( var r = 0 ; r <= r_max ; r++ ) {
		var r_hex = (Math.floor(r * r_dt) - ( r > 0 ? 1 : 0)).toString(16);
		r_hex = "00".substring(0, 2 - r_hex.length) + r_hex;

		inner_html += '<tr><td>' +
			colorbox(rgb_list[r * 2], form_name, display_name, this.form_name, this.element_name, layer_name) +
			colorbox(rgb_list[r * 2 + 1], form_name, display_name, this.form_name, this.element_name, layer_name);

		for ( var b = 0 ; b <= b_max ; b++ ) {
			var b_hex = (Math.floor(b * b_dt) - ( b > 0 ? 1 : 0)).toString(16);
			b_hex = "00".substring(0, 2 - b_hex.length) + b_hex;

			for ( var g = 0 ; g <= g_max ; g++ ) {
				var g_hex = (Math.floor(g * g_dt) - ( g > 0 ? 1 : 0)).toString(16);
				g_hex = "00".substring(0, 2 - g_hex.length) + g_hex;
				var color = r_hex + g_hex + b_hex;
				inner_html +=
					colorbox(color.toUpperCase(), form_name, display_name, this.form_name, this.element_name, layer_name);
			}
		}
		inner_html += '</td></tr>';
	}

	inner_html += '</table><div style="text-align:center; padding:10px;" ><input type="button" value="閉じる" onclick="switchAllSelect(\'visible\');new layerHandle(\'' + layer_name + '\').hide();" /></div></div></form>';
	return inner_html;
}


wordProcessor.prototype.createPopUpColorPalette = function () {
	var lh = new createLayer(this.color_palette_name);
	var inner_html = this.createColorPaletteInnerHTML();
	lh.innerHTML(inner_html);
}

wordProcessor.prototype.createColorPaletteHTML = function () {
	var inner_html = this.createColorPaletteInnerHTML();
	var html = '<div style="display:none;" id="' + this.color_palette_name + '">' + inner_html + '</div>';
	return html;
}


wordProcessor.prototype.showColorPalette = function (e) {
	var lh = new layerHandle(this.color_palette_name);
	var eh = new eventHandle(e);
	switchAllSelect('hidden');
	lh.moveTo(eh.pageX, eh.pageY);
	lh.show();
}
var wordProcessorEmoji;
var wordProcessorEmojiLabel = {
    //'0'   : '標準・よく使う',
    '0'   : 'よく使う絵文字',
    '1'   : '顔・表情・ハート・気持ち・やじるし',
    '2'   : '動物・食べ物・飲み物',
    '3'   : '趣味・スポーツ',
    '4'   : '乗り物・建物・道具',
    '5'   : '星座・血液型・天気・星・季節',
    '6'   : 'ヘタ文字',
    '7'   : 'デコメ風絵文字',
    '0-0' : '標準',
    '0-1' : 'よく使う絵文字',
    '1-1' : '人・顔・気持ち',
    '1-2' : 'ハート・キラキラ',
    '1-3' : 'やじるし',
    '2-1' : '動物・生物',
    '2-2' : '食べ物・飲み物',
    '3-1' : '趣味',
    '3-2' : 'スポーツ',
    '3-3' : 'オシャレ',
    '4-1' : '乗り物',
    '4-2' : '建物',
    '4-3' : '道具・記号',
    '5-1' : '天気',
    '5-2' : '12星座',
    '5-3' : '血液型',
    '5-4' : '自然・季節・星',
    '6-1' : 'ヘタ文字',
    '7-1' : 'デコメ風絵文字'
};
wordProcessor.prototype.hideEmojiLabel = function() {
    var c_id = wordProcessorEmojiLabel['comitted'];
    var form_name    = wordProcessorEmoji.form_name;
    var el = document.getElementById(form_name + '-emoji-palette-label');
    el.innerHTML = wordProcessorEmojiLabel[c_id];
}
wordProcessor.prototype.showEmojiLabel = function(c_id,commit) {
    c_id = c_id + '';
    var form_name    = wordProcessorEmoji.form_name;
    var el = document.getElementById(form_name + '-emoji-palette-label');
    if (commit) wordProcessorEmojiLabel['comitted'] = c_id;
    el.innerHTML = wordProcessorEmojiLabel[c_id];
}
wordProcessor.prototype.loadEmojiPalette = function(c_id) {
    c_id = c_id + '';
    var form_name    = wordProcessorEmoji.form_name;
    var element_name = wordProcessorEmoji.element_name;
    var layer_name   = wordProcessorEmoji.emoji_palette_name;
    var emoji = new Array();
    if (! c_id) c_id = '0-0';
    if (c_id == '0-0') {
	emoji = wordProcessorEmoji.oricon_tag_json.emoji_seesaa;
    } else {
	emoji = wordProcessorEmoji.oricon_tag_json.emoji;
    }
    var html   = [];
    var sorted = new Array();
    if (c_id == '0-1') {
	var emoji_useful = wordProcessorEmoji.oricon_tag_json.emoji_useful;
	for (var i = 0; i < emoji_useful.length; i++) {
	    for (p in emoji) {
		if (emoji[p].id == emoji_useful[i]) {
		    sorted.push(p.toString());
		    break;
		}
	    }
	}
    } else {
	for (p in emoji) {
	    if (emoji[p].c_id == c_id) {
		sorted.push(p.toString());
	    }
	}
	sorted.sort(function(a,b) { return emoji[a].id - emoji[b].id });
    }
    for (i in sorted) {
	var key = sorted[i];
	if (c_id == '0-0') {
	    if (i > 175) break;
	}
	var vPx = - (16 * i);
	var imgtag = '<img src="/_common/img/spacer.gif" width="1px" height="1px" style="cursor:pointer;width:16px;height:16px;background-position: 0px ' +  vPx
	    + 'px;background-image:url(' + "'" + '/_images_o/' + c_id + '.png' + "'" + ');">';
	var tag = '<span style="" onClick="new wordProcessor(' + "'" + form_name + "'" + ",'" + element_name + "'" + 
	    ').insertTag(' + "'" + key + "'" + ",''" + ');">' +  imgtag + '</span>';
	html.push(tag);
    }

    var palette = html.join("");
    if (! wordProcessorEmoji.paletteLh.srcElement) {
	wordProcessorEmoji.paletteLh  = new createLayer(wordProcessorEmoji.emoji_palette_name);
    }

    var genPager = function(pType,cId,label) {
	if (! label) label = ' * ';
	var labelId = cId;
	if (pType == 'p') {
	    var list = cId.split('-');
	    labelId = list[0];
	}
	return '<a style="color: red" class="emoji-palette-' + pType + '" id="' + form_name + '-emoji-palette-' +  pType + '-' + cId 
	+ '" href="javascript:;" onClick="wordProcessorEmoji.loadEmojiPalette(' + "'" + cId + "'" + ');" '
	+ 'onMouseOver="wordProcessorEmoji.showEmojiLabel(' + "'" + labelId + "'" + ');" '
	+ 'onmouseOut="wordProcessorEmoji.hideEmojiLabel(' + "'" +  labelId + "'" + ');"> '
	+ label + '</a>';
    }

    var child = '';
    var p_id;
    if (c_id.match(/^0-/)) {
	//child = genPager('c','0-0') + genPager('c','0-1');
	child = genPager('c','0-1','A');
	p_id  = '0-1';
    }
    if (c_id.match(/^1-/)) {
	child = genPager('c','1-1','A') + genPager('c','1-2','B') + genPager('c','1-3','C');
	p_id  = '1-1';
    }
    if (c_id.match(/^2-/)) {
	child = genPager('c','2-1','A') + genPager('c','2-2','B');
	p_id  = '2-1';
    }
    if (c_id.match(/^3-/)) {
	child = genPager('c','3-1','A') + genPager('c','3-2','B') + genPager('c','3-3','C');	
	p_id  = '3-1';
    }
    if (c_id.match(/^4-/)) {
	child = genPager('c','4-1','A') + genPager('c','4-2','B') + genPager('c','4-3','C');	
	p_id  = '4-1';
    }
    if (c_id.match(/^5-/)) {
	child = genPager('c','5-1','A') + genPager('c','5-2','B') + genPager('c','5-3','C') + genPager('c','5-4','D');	
	p_id  = '5-1';
    }
    if (c_id.match(/^6-/)) {
	child = genPager('c','6-1','A');
	p_id  = '6-1';
    }
    if (c_id.match(/^7-/)) {
	child = genPager('c','7-1','A');
	p_id  = '7-1';
    }
    
    
    //margin-bottom: 0px;
    
    wordProcessorEmoji.paletteLh.srcElement.innerHTML = '<div style="background:#ffffff; border:#aaa solid 2px;position:absolute;"><div style="width:320px;">'
    + '<div>' 
    + '<div id="' + form_name + '-emoji-palette-label"></div>'
    + genPager('p','0-1',' <strong>1</strong> <font color="black">|</font>')
    + genPager('p','1-1',' <strong>2</strong> <font color="black">|</font>')
    + genPager('p','2-1',' <strong>3</strong> <font color="black">|</font>')
    + genPager('p','3-1',' <strong>4</strong> <font color="black">|</font>')
    + genPager('p','4-1',' <strong>5</strong> <font color="black">|</font>')
    + genPager('p','5-1',' <strong>6</strong> <font color="black">|</font>')
    + genPager('p','6-1',' <strong>7</strong> <font color="black">|</font>')
    + genPager('p','7-1',' <strong>8</strong>')
    + '</div>'
    + '<div>' + child + '</div>'
    + '<div style="clear: both;text-align: left;word-break: break-all;">' // position: absolute;
    + palette + '</div></div><div style="text-align:center;margin:5px 0px;">' + 
    '<input type="button" value="閉じる" onclick="new layerHandle(\'' + layer_name + '\').hide();"></div></div>';

    var pEl1 = document.getElementById(form_name + '-emoji-palette-p-' + c_id);    
    var pEl2 = document.getElementById(form_name + '-emoji-palette-p-' + p_id);
    var cEl = document.getElementById(form_name  + '-emoji-palette-c-' + c_id);
    if (pEl1) pEl1.style.color = 'black';
    if (pEl2) pEl2.style.color = 'black';
    if (cEl) cEl.style.color   = 'black';
    wordProcessorEmoji.showEmojiLabel(c_id,'commit');
}
wordProcessor.prototype.showEmojiPalette = function (e) {
    var req = this.createRequest();
    var url = '/_js/oricon_tag.json?';
    this.paletteEh = new eventHandle(e);
    this.paletteLh = new layerHandle(this.emoji_palette_name);
    wordProcessorEmoji = this;
    req.onreadystatechange = function() {
	if ((req.readyState == 4) && (req.status == 200)) {
	    var jsonStr = req.responseText;
	    if(navigator.userAgent.indexOf("Safari")!=-1){
		wordProcessorEmoji.oricon_tag_json = eval('(' + jsonStr + ')');
	    } else {
		wordProcessorEmoji.oricon_tag_json = !(/[^,:{}\[\]0-9.\-+Eaeflnr-u \n\r\t]/.test(jsonStr.replace(/"(\\.|[^"\\])*"/g, ''))) && eval('(' + jsonStr + ')');
            //")
	    }
	    wordProcessorEmoji.loadEmojiPalette('0-1');
	    wordProcessorEmoji.paletteLh.moveTo(wordProcessorEmoji.paletteEh.pageX, wordProcessorEmoji.paletteEh.pageY);
	    wordProcessorEmoji.paletteLh.show();
	}
    }
    req.open("GET", url,true);
    req.send(null);
}
wordProcessor.prototype.createRequest = function() {
    return window.XMLHttpRequest ? new XMLHttpRequest() : 
    (function() {
	try { return new ActiveXObject("Msxml2.XMLHTTP"); }
	catch(e) { return new ActiveXObject("Microsoft.XMLHTTP"); }
    })();
}