customstyle.js 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. ///import core
  2. ///commands 自定义样式
  3. ///commandsName CustomStyle
  4. ///commandsTitle 自定义样式
  5. UE.plugins['customstyle'] = function() {
  6. var me = this;
  7. me.setOpt({ 'customstyle':[
  8. {tag:'h1',name:'tc', style:'font-size:32px;font-weight:bold;border-bottom:#ccc 2px solid;padding:0 4px 0 0;text-align:center;margin:0 0 20px 0;'},
  9. {tag:'h1',name:'tl', style:'font-size:32px;font-weight:bold;border-bottom:#ccc 2px solid;padding:0 4px 0 0;text-align:left;margin:0 0 10px 0;'},
  10. {tag:'span',name:'im', style:'font-size:16px;font-style:italic;font-weight:bold;line-height:18px;'},
  11. {tag:'span',name:'hi', style:'font-size:16px;font-style:italic;font-weight:bold;color:rgb(51, 153, 204);line-height:18px;'}
  12. ]});
  13. me.commands['customstyle'] = {
  14. execCommand : function(cmdName, obj) {
  15. var me = this,
  16. tagName = obj.tag,
  17. node = domUtils.findParent(me.selection.getStart(), function(node) {
  18. return node.getAttribute('label');
  19. }, true),
  20. range,bk,tmpObj = {};
  21. for (var p in obj) {
  22. if(obj[p]!==undefined)
  23. tmpObj[p] = obj[p];
  24. }
  25. delete tmpObj.tag;
  26. if (node && node.getAttribute('label') == obj.label) {
  27. range = this.selection.getRange();
  28. bk = range.createBookmark();
  29. if (range.collapsed) {
  30. //trace:1732 删掉自定义标签,要有p来回填站位
  31. if(dtd.$block[node.tagName]){
  32. var fillNode = me.document.createElement('p');
  33. domUtils.moveChild(node, fillNode);
  34. node.parentNode.insertBefore(fillNode, node);
  35. domUtils.remove(node);
  36. }else{
  37. domUtils.remove(node,true);
  38. }
  39. } else {
  40. var common = domUtils.getCommonAncestor(bk.start, bk.end),
  41. nodes = domUtils.getElementsByTagName(common, tagName);
  42. if(new RegExp(tagName,'i').test(common.tagName)){
  43. nodes.push(common);
  44. }
  45. for (var i = 0,ni; ni = nodes[i++];) {
  46. if (ni.getAttribute('label') == obj.label) {
  47. var ps = domUtils.getPosition(ni, bk.start),pe = domUtils.getPosition(ni, bk.end);
  48. if ((ps & domUtils.POSITION_FOLLOWING || ps & domUtils.POSITION_CONTAINS)
  49. &&
  50. (pe & domUtils.POSITION_PRECEDING || pe & domUtils.POSITION_CONTAINS)
  51. )
  52. if (dtd.$block[tagName]) {
  53. var fillNode = me.document.createElement('p');
  54. domUtils.moveChild(ni, fillNode);
  55. ni.parentNode.insertBefore(fillNode, ni);
  56. }
  57. domUtils.remove(ni, true);
  58. }
  59. }
  60. node = domUtils.findParent(common, function(node) {
  61. return node.getAttribute('label') == obj.label;
  62. }, true);
  63. if (node) {
  64. domUtils.remove(node, true);
  65. }
  66. }
  67. range.moveToBookmark(bk).select();
  68. } else {
  69. if (dtd.$block[tagName]) {
  70. this.execCommand('paragraph', tagName, tmpObj,'customstyle');
  71. range = me.selection.getRange();
  72. if (!range.collapsed) {
  73. range.collapse();
  74. node = domUtils.findParent(me.selection.getStart(), function(node) {
  75. return node.getAttribute('label') == obj.label;
  76. }, true);
  77. var pNode = me.document.createElement('p');
  78. domUtils.insertAfter(node, pNode);
  79. domUtils.fillNode(me.document, pNode);
  80. range.setStart(pNode, 0).setCursor();
  81. }
  82. } else {
  83. range = me.selection.getRange();
  84. if (range.collapsed) {
  85. node = me.document.createElement(tagName);
  86. domUtils.setAttributes(node, tmpObj);
  87. range.insertNode(node).setStart(node, 0).setCursor();
  88. return;
  89. }
  90. bk = range.createBookmark();
  91. range.applyInlineStyle(tagName, tmpObj).moveToBookmark(bk).select();
  92. }
  93. }
  94. },
  95. queryCommandValue : function() {
  96. var parent = domUtils.filterNodeList(
  97. this.selection.getStartElementPath(),
  98. function(node){return node.getAttribute('label')}
  99. );
  100. return parent ? parent.getAttribute('label') : '';
  101. }
  102. };
  103. //当去掉customstyle是,如果是块元素,用p代替
  104. me.addListener('keyup', function(type, evt) {
  105. var keyCode = evt.keyCode || evt.which;
  106. if (keyCode == 32 || keyCode == 13) {
  107. var range = me.selection.getRange();
  108. if (range.collapsed) {
  109. var node = domUtils.findParent(me.selection.getStart(), function(node) {
  110. return node.getAttribute('label');
  111. }, true);
  112. if (node && dtd.$block[node.tagName] && domUtils.isEmptyNode(node)) {
  113. var p = me.document.createElement('p');
  114. domUtils.insertAfter(node, p);
  115. domUtils.fillNode(me.document, p);
  116. domUtils.remove(node);
  117. range.setStart(p, 0).setCursor();
  118. }
  119. }
  120. }
  121. });
  122. };