emotion.js 6.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. window.onload = function () {
  2. editor.setOpt({
  3. emotionLocalization:false
  4. });
  5. emotion.SmileyPath = editor.options.emotionLocalization === true ? 'images/' : "//imgbaidu.b0.upaiyun.com/hi/";
  6. emotion.SmileyBox = createTabList( emotion.tabNum );
  7. emotion.tabExist = createArr( emotion.tabNum );
  8. initImgName();
  9. initEvtHandler( "tabHeads" );
  10. };
  11. function initImgName() {
  12. for ( var pro in emotion.SmilmgName ) {
  13. var tempName = emotion.SmilmgName[pro],
  14. tempBox = emotion.SmileyBox[pro],
  15. tempStr = "";
  16. if ( tempBox.length ) return;
  17. for ( var i = 1; i <= tempName[1]; i++ ) {
  18. tempStr = tempName[0];
  19. if ( i < 10 ) tempStr = tempStr + '0';
  20. tempStr = tempStr + i + '.gif';
  21. tempBox.push( tempStr );
  22. }
  23. }
  24. }
  25. function initEvtHandler( conId ) {
  26. var tabHeads = $G( conId );
  27. for ( var i = 0, j = 0; i < tabHeads.childNodes.length; i++ ) {
  28. var tabObj = tabHeads.childNodes[i];
  29. if ( tabObj.nodeType == 1 ) {
  30. domUtils.on( tabObj, "click", (function ( index ) {
  31. return function () {
  32. switchTab( index );
  33. };
  34. })( j ) );
  35. j++;
  36. }
  37. }
  38. switchTab( 0 );
  39. $G( "tabIconReview" ).style.display = 'none';
  40. }
  41. function InsertSmiley( url, evt ) {
  42. var obj = {
  43. src:editor.options.emotionLocalization ? editor.options.UEDITOR_HOME_URL + "dialogs/emotion/" + url : url
  44. };
  45. obj._src = obj.src;
  46. editor.execCommand( 'insertimage', obj );
  47. if ( !evt.ctrlKey ) {
  48. dialog.popup.hide();
  49. }
  50. }
  51. function switchTab( index ) {
  52. autoHeight( index );
  53. if ( emotion.tabExist[index] == 0 ) {
  54. emotion.tabExist[index] = 1;
  55. createTab( 'tab' + index );
  56. }
  57. //获取呈现元素句柄数组
  58. var tabHeads = $G( "tabHeads" ).getElementsByTagName( "span" ),
  59. tabBodys = $G( "tabBodys" ).getElementsByTagName( "div" ),
  60. i = 0, L = tabHeads.length;
  61. //隐藏所有呈现元素
  62. for ( ; i < L; i++ ) {
  63. tabHeads[i].className = "";
  64. tabBodys[i].style.display = "none";
  65. }
  66. //显示对应呈现元素
  67. tabHeads[index].className = "focus";
  68. tabBodys[index].style.display = "block";
  69. }
  70. function autoHeight( index ) {
  71. var iframe = dialog.getDom( "iframe" ),
  72. parent = iframe.parentNode.parentNode;
  73. switch ( index ) {
  74. case 0:
  75. iframe.style.height = "380px";
  76. parent.style.height = "392px";
  77. break;
  78. case 1:
  79. iframe.style.height = "220px";
  80. parent.style.height = "232px";
  81. break;
  82. case 2:
  83. iframe.style.height = "260px";
  84. parent.style.height = "272px";
  85. break;
  86. case 3:
  87. iframe.style.height = "300px";
  88. parent.style.height = "312px";
  89. break;
  90. case 4:
  91. iframe.style.height = "140px";
  92. parent.style.height = "152px";
  93. break;
  94. case 5:
  95. iframe.style.height = "260px";
  96. parent.style.height = "272px";
  97. break;
  98. case 6:
  99. iframe.style.height = "230px";
  100. parent.style.height = "242px";
  101. break;
  102. default:
  103. }
  104. }
  105. function createTab( tabName ) {
  106. var faceVersion = "?v=1.1", //版本号
  107. tab = $G( tabName ), //获取将要生成的Div句柄
  108. imagePath = emotion.SmileyPath + emotion.imageFolders[tabName], //获取显示表情和预览表情的路径
  109. positionLine = 11 / 2, //中间数
  110. iWidth = iHeight = 35, //图片长宽
  111. iColWidth = 3, //表格剩余空间的显示比例
  112. tableCss = emotion.imageCss[tabName],
  113. cssOffset = emotion.imageCssOffset[tabName],
  114. textHTML = ['<table class="smileytable">'],
  115. i = 0, imgNum = emotion.SmileyBox[tabName].length, imgColNum = 11, faceImage,
  116. sUrl, realUrl, posflag, offset, infor;
  117. for ( ; i < imgNum; ) {
  118. textHTML.push( '<tr>' );
  119. for ( var j = 0; j < imgColNum; j++, i++ ) {
  120. faceImage = emotion.SmileyBox[tabName][i];
  121. if ( faceImage ) {
  122. sUrl = imagePath + faceImage + faceVersion;
  123. realUrl = imagePath + faceImage;
  124. posflag = j < positionLine ? 0 : 1;
  125. offset = cssOffset * i * (-1) - 1;
  126. infor = emotion.SmileyInfor[tabName][i];
  127. textHTML.push( '<td class="' + tableCss + '" border="1" width="' + iColWidth + '%" style="border-collapse:collapse;" align="center" bgcolor="transparent" onclick="InsertSmiley(\'' + realUrl.replace( /'/g, "\\'" ) + '\',event)" onmouseover="over(this,\'' + sUrl + '\',\'' + posflag + '\')" onmouseout="out(this)">' );
  128. textHTML.push( '<span>' );
  129. textHTML.push( '<img style="background-position:left ' + offset + 'px;" title="' + infor + '" src="' + emotion.SmileyPath + (editor.options.emotionLocalization ? '0.gif" width="' : 'default/0.gif" width="') + iWidth + '" height="' + iHeight + '"></img>' );
  130. textHTML.push( '</span>' );
  131. } else {
  132. textHTML.push( '<td width="' + iColWidth + '%" bgcolor="#FFFFFF">' );
  133. }
  134. textHTML.push( '</td>' );
  135. }
  136. textHTML.push( '</tr>' );
  137. }
  138. textHTML.push( '</table>' );
  139. textHTML = textHTML.join( "" );
  140. tab.innerHTML = textHTML;
  141. }
  142. function over( td, srcPath, posFlag ) {
  143. td.style.backgroundColor = "#ACCD3C";
  144. $G( 'faceReview' ).style.backgroundImage = "url(" + srcPath + ")";
  145. if ( posFlag == 1 ) $G( "tabIconReview" ).className = "show";
  146. $G( "tabIconReview" ).style.display = 'block';
  147. }
  148. function out( td ) {
  149. td.style.backgroundColor = "transparent";
  150. var tabIconRevew = $G( "tabIconReview" );
  151. tabIconRevew.className = "";
  152. tabIconRevew.style.display = 'none';
  153. }
  154. function createTabList( tabNum ) {
  155. var obj = {};
  156. for ( var i = 0; i < tabNum; i++ ) {
  157. obj["tab" + i] = [];
  158. }
  159. return obj;
  160. }
  161. function createArr( tabNum ) {
  162. var arr = [];
  163. for ( var i = 0; i < tabNum; i++ ) {
  164. arr[i] = 0;
  165. }
  166. return arr;
  167. }