basestyle.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. /**
  2. * B、I、sub、super命令支持
  3. * @file
  4. * @since 1.2.6.1
  5. */
  6. UE.plugins['basestyle'] = function(){
  7. /**
  8. * 字体加粗
  9. * @command bold
  10. * @param { String } cmd 命令字符串
  11. * @remind 对已加粗的文本内容执行该命令, 将取消加粗
  12. * @method execCommand
  13. * @example
  14. * ```javascript
  15. * //editor是编辑器实例
  16. * //对当前选中的文本内容执行加粗操作
  17. * //第一次执行, 文本内容加粗
  18. * editor.execCommand( 'bold' );
  19. *
  20. * //第二次执行, 文本内容取消加粗
  21. * editor.execCommand( 'bold' );
  22. * ```
  23. */
  24. /**
  25. * 字体倾斜
  26. * @command italic
  27. * @method execCommand
  28. * @param { String } cmd 命令字符串
  29. * @remind 对已倾斜的文本内容执行该命令, 将取消倾斜
  30. * @example
  31. * ```javascript
  32. * //editor是编辑器实例
  33. * //对当前选中的文本内容执行斜体操作
  34. * //第一次操作, 文本内容将变成斜体
  35. * editor.execCommand( 'italic' );
  36. *
  37. * //再次对同一文本内容执行, 则文本内容将恢复正常
  38. * editor.execCommand( 'italic' );
  39. * ```
  40. */
  41. /**
  42. * 下标文本,与“superscript”命令互斥
  43. * @command subscript
  44. * @method execCommand
  45. * @remind 把选中的文本内容切换成下标文本, 如果当前选中的文本已经是下标, 则该操作会把文本内容还原成正常文本
  46. * @param { String } cmd 命令字符串
  47. * @example
  48. * ```javascript
  49. * //editor是编辑器实例
  50. * //对当前选中的文本内容执行下标操作
  51. * //第一次操作, 文本内容将变成下标文本
  52. * editor.execCommand( 'subscript' );
  53. *
  54. * //再次对同一文本内容执行, 则文本内容将恢复正常
  55. * editor.execCommand( 'subscript' );
  56. * ```
  57. */
  58. /**
  59. * 上标文本,与“subscript”命令互斥
  60. * @command superscript
  61. * @method execCommand
  62. * @remind 把选中的文本内容切换成上标文本, 如果当前选中的文本已经是上标, 则该操作会把文本内容还原成正常文本
  63. * @param { String } cmd 命令字符串
  64. * @example
  65. * ```javascript
  66. * //editor是编辑器实例
  67. * //对当前选中的文本内容执行上标操作
  68. * //第一次操作, 文本内容将变成上标文本
  69. * editor.execCommand( 'superscript' );
  70. *
  71. * //再次对同一文本内容执行, 则文本内容将恢复正常
  72. * editor.execCommand( 'superscript' );
  73. * ```
  74. */
  75. var basestyles = {
  76. 'bold':['strong','b'],
  77. 'italic':['em','i'],
  78. 'subscript':['sub'],
  79. 'superscript':['sup']
  80. },
  81. getObj = function(editor,tagNames){
  82. return domUtils.filterNodeList(editor.selection.getStartElementPath(),tagNames);
  83. },
  84. me = this;
  85. //添加快捷键
  86. me.addshortcutkey({
  87. "Bold" : "ctrl+66",//^B
  88. "Italic" : "ctrl+73", //^I
  89. "Underline" : "ctrl+85"//^U
  90. });
  91. me.addInputRule(function(root){
  92. utils.each(root.getNodesByTagName('b i'),function(node){
  93. switch (node.tagName){
  94. case 'b':
  95. node.tagName = 'strong';
  96. break;
  97. case 'i':
  98. node.tagName = 'em';
  99. }
  100. });
  101. });
  102. for ( var style in basestyles ) {
  103. (function( cmd, tagNames ) {
  104. me.commands[cmd] = {
  105. execCommand : function( cmdName ) {
  106. var range = me.selection.getRange(),obj = getObj(this,tagNames);
  107. if ( range.collapsed ) {
  108. if ( obj ) {
  109. var tmpText = me.document.createTextNode('');
  110. range.insertNode( tmpText ).removeInlineStyle( tagNames );
  111. range.setStartBefore(tmpText);
  112. domUtils.remove(tmpText);
  113. } else {
  114. var tmpNode = range.document.createElement( tagNames[0] );
  115. if(cmdName == 'superscript' || cmdName == 'subscript'){
  116. tmpText = me.document.createTextNode('');
  117. range.insertNode(tmpText)
  118. .removeInlineStyle(['sub','sup'])
  119. .setStartBefore(tmpText)
  120. .collapse(true);
  121. }
  122. range.insertNode( tmpNode ).setStart( tmpNode, 0 );
  123. }
  124. range.collapse( true );
  125. } else {
  126. if(cmdName == 'superscript' || cmdName == 'subscript'){
  127. if(!obj || obj.tagName.toLowerCase() != cmdName){
  128. range.removeInlineStyle(['sub','sup']);
  129. }
  130. }
  131. obj ? range.removeInlineStyle( tagNames ) : range.applyInlineStyle( tagNames[0] );
  132. }
  133. range.select();
  134. },
  135. queryCommandState : function() {
  136. return getObj(this,tagNames) ? 1 : 0;
  137. }
  138. };
  139. })( style, basestyles[style] );
  140. }
  141. };