c8d16b00f6afc74198b9133c8e93e3896384754f.svn-base 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198
  1. /**
  2. * Created with JetBrains PhpStorm.
  3. * User: xuheng
  4. * Date: 12-12-19
  5. * Time: 下午4:55
  6. * To change this template use File | Settings | File Templates.
  7. */
  8. (function () {
  9. var title = $G("J_title"),
  10. caption = $G("J_caption"),
  11. sorttable = $G("J_sorttable"),
  12. autoSizeContent = $G("J_autoSizeContent"),
  13. autoSizePage = $G("J_autoSizePage"),
  14. tone = $G("J_tone"),
  15. me,
  16. preview = $G("J_preview");
  17. var editTable = function () {
  18. me = this;
  19. me.init();
  20. };
  21. editTable.prototype = {
  22. init:function () {
  23. var colorPiker = new UE.ui.ColorPicker({
  24. editor:editor
  25. }),
  26. colorPop = new UE.ui.Popup({
  27. editor:editor,
  28. content:colorPiker
  29. });
  30. title.checked = editor.queryCommandState("inserttitle") == -1;
  31. caption.checked = editor.queryCommandState("insertcaption") == -1;
  32. me.createTable(title.checked, caption.checked);
  33. me.setAutoSize();
  34. me.setColor(me.getColor());
  35. domUtils.on(title, "click", me.titleHanler);
  36. domUtils.on(caption, "click", me.captionHanler);
  37. domUtils.on(sorttable, "click", me.sorttableHanler);
  38. domUtils.on(autoSizeContent, "click", me.autoSizeContentHanler);
  39. domUtils.on(autoSizePage, "click", me.autoSizePageHanler);
  40. domUtils.on(tone, "click", function () {
  41. colorPop.showAnchor(tone);
  42. });
  43. domUtils.on(document, 'mousedown', function () {
  44. colorPop.hide();
  45. });
  46. colorPiker.addListener("pickcolor", function () {
  47. me.setColor(arguments[1]);
  48. colorPop.hide();
  49. });
  50. colorPiker.addListener("picknocolor", function () {
  51. me.setColor("");
  52. colorPop.hide();
  53. });
  54. },
  55. createTable:function (hasTitle, hasCaption) {
  56. var arr = [];
  57. arr.push("<table id='J_example'>");
  58. if (hasCaption) {
  59. arr.push("<caption>" + lang.captionName + "</caption>")
  60. }
  61. if (hasTitle) {
  62. arr.push("<tr>");
  63. for (var j = 0; j < 5; j++) {
  64. arr.push("<th>" + lang.titleName + "</th>")
  65. }
  66. arr.push("</tr>");
  67. }
  68. for (var i = 0; i < 6; i++) {
  69. arr.push("<tr>");
  70. for (var k = 0; k < 5; k++) {
  71. arr.push("<td>" + lang.cellsName + "</td>")
  72. }
  73. arr.push("</tr>");
  74. }
  75. arr.push("</table>");
  76. preview.innerHTML = arr.join("");
  77. },
  78. titleHanler:function () {
  79. var example = $G("J_example"),
  80. frg=document.createDocumentFragment(),
  81. color = domUtils.getComputedStyle(domUtils.getElementsByTagName(example, "td")[0], "border-color");
  82. if (title.checked) {
  83. example.insertRow(0);
  84. for (var i = 0, node; i < 5; i++) {
  85. node = document.createElement("th");
  86. node.innerHTML = lang.titleName;
  87. frg.appendChild(node);
  88. }
  89. example.rows[0].appendChild(frg);
  90. } else {
  91. domUtils.remove(example.rows[0]);
  92. }
  93. me.setColor(color);
  94. },
  95. captionHanler:function () {
  96. var example = $G("J_example");
  97. if (caption.checked) {
  98. var row = document.createElement('caption');
  99. row.innerHTML = lang.captionName;
  100. example.insertBefore(row, example.firstChild);
  101. } else {
  102. domUtils.remove(domUtils.getElementsByTagName(example, 'caption')[0]);
  103. }
  104. },
  105. sorttableHanler:function(){
  106. var example = $G("J_example"),
  107. row = example.rows[0];
  108. if (sorttable.checked) {
  109. for(var i = 0,cell;cell = row.cells[i++];){
  110. var span = document.createElement("span");
  111. span.innerHTML = "^";
  112. cell.appendChild(span);
  113. }
  114. } else {
  115. var spans = domUtils.getElementsByTagName(example,"span");
  116. utils.each(spans,function(span){
  117. span.parentNode.removeChild(span);
  118. })
  119. }
  120. },
  121. autoSizeContentHanler:function () {
  122. var example = $G("J_example");
  123. example.removeAttribute("width");
  124. },
  125. autoSizePageHanler:function () {
  126. var example = $G("J_example");
  127. var tds = example.getElementsByTagName(example, "td");
  128. utils.each(tds, function (td) {
  129. td.removeAttribute("width");
  130. });
  131. example.setAttribute('width', '100%');
  132. },
  133. getColor:function () {
  134. var start = editor.selection.getStart(), color,
  135. cell = domUtils.findParentByTagName(start, ["td", "th", "caption"], true);
  136. color = domUtils.getComputedStyle(cell, "border-color");
  137. if (!color) color = "#DDDDDD";
  138. return color;
  139. },
  140. setColor:function (color) {
  141. var example = $G("J_example"),
  142. arr = domUtils.getElementsByTagName(example, "td").concat(
  143. domUtils.getElementsByTagName(example, "th"),
  144. domUtils.getElementsByTagName(example, "caption")
  145. );
  146. tone.value = color;
  147. utils.each(arr, function (node) {
  148. node.style.borderColor = color;
  149. });
  150. },
  151. setAutoSize:function () {
  152. var me = this;
  153. autoSizePage.checked = true;
  154. me.autoSizePageHanler();
  155. }
  156. };
  157. new editTable;
  158. dialog.onok = function () {
  159. editor.__hasEnterExecCommand = true;
  160. var checks = {
  161. title:"inserttitle deletetitle",
  162. caption:"insertcaption deletecaption",
  163. sorttable:"enablesort disablesort"
  164. };
  165. editor.fireEvent('saveScene');
  166. for(var i in checks){
  167. var cmds = checks[i].split(" "),
  168. input = $G("J_" + i);
  169. if(input["checked"]){
  170. editor.queryCommandState(cmds[0])!=-1 &&editor.execCommand(cmds[0]);
  171. }else{
  172. editor.queryCommandState(cmds[1])!=-1 &&editor.execCommand(cmds[1]);
  173. }
  174. }
  175. editor.execCommand("edittable", tone.value);
  176. autoSizeContent.checked ?editor.execCommand('adaptbytext') : "";
  177. autoSizePage.checked ? editor.execCommand("adaptbywindow") : "";
  178. editor.fireEvent('saveScene');
  179. editor.__hasEnterExecCommand = false;
  180. };
  181. })();