plugin.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. /**
  2. * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or http://ckeditor.com/license
  4. */
  5. ( function() {
  6. function setupAdvParams( element ) {
  7. var attrName = this.att;
  8. var value = element && element.hasAttribute( attrName ) && element.getAttribute( attrName ) || '';
  9. if ( value !== undefined )
  10. this.setValue( value );
  11. }
  12. function commitAdvParams() {
  13. // Dialogs may use different parameters in the commit list, so, by
  14. // definition, we take the first CKEDITOR.dom.element available.
  15. var element;
  16. for ( var i = 0; i < arguments.length; i++ ) {
  17. if ( arguments[ i ] instanceof CKEDITOR.dom.element ) {
  18. element = arguments[ i ];
  19. break;
  20. }
  21. }
  22. if ( element ) {
  23. var attrName = this.att,
  24. value = this.getValue();
  25. if ( value )
  26. element.setAttribute( attrName, value );
  27. else
  28. element.removeAttribute( attrName, value );
  29. }
  30. }
  31. var defaultTabConfig = { id: 1, dir: 1, classes: 1, styles: 1 };
  32. CKEDITOR.plugins.add( 'dialogadvtab', {
  33. requires: 'dialog',
  34. // Returns allowed content rule for the content created by this plugin.
  35. allowedContent: function( tabConfig ) {
  36. if ( !tabConfig )
  37. tabConfig = defaultTabConfig;
  38. var allowedAttrs = [];
  39. if ( tabConfig.id )
  40. allowedAttrs.push( 'id' );
  41. if ( tabConfig.dir )
  42. allowedAttrs.push( 'dir' );
  43. var allowed = '';
  44. if ( allowedAttrs.length )
  45. allowed += '[' + allowedAttrs.join( ',' ) + ']';
  46. if ( tabConfig.classes )
  47. allowed += '(*)';
  48. if ( tabConfig.styles )
  49. allowed += '{*}';
  50. return allowed;
  51. },
  52. // @param tabConfig
  53. // id, dir, classes, styles
  54. createAdvancedTab: function( editor, tabConfig, element ) {
  55. if ( !tabConfig )
  56. tabConfig = defaultTabConfig;
  57. var lang = editor.lang.common;
  58. var result = {
  59. id: 'advanced',
  60. label: lang.advancedTab,
  61. title: lang.advancedTab,
  62. elements: [ {
  63. type: 'vbox',
  64. padding: 1,
  65. children: []
  66. } ]
  67. };
  68. var contents = [];
  69. if ( tabConfig.id || tabConfig.dir ) {
  70. if ( tabConfig.id ) {
  71. contents.push( {
  72. id: 'advId',
  73. att: 'id',
  74. type: 'text',
  75. requiredContent: element ? element + '[id]' : null,
  76. label: lang.id,
  77. setup: setupAdvParams,
  78. commit: commitAdvParams
  79. } );
  80. }
  81. if ( tabConfig.dir ) {
  82. contents.push( {
  83. id: 'advLangDir',
  84. att: 'dir',
  85. type: 'select',
  86. requiredContent: element ? element + '[dir]' : null,
  87. label: lang.langDir,
  88. 'default': '',
  89. style: 'width:100%',
  90. items: [
  91. [ lang.notSet, '' ],
  92. [ lang.langDirLTR, 'ltr' ],
  93. [ lang.langDirRTL, 'rtl' ]
  94. ],
  95. setup: setupAdvParams,
  96. commit: commitAdvParams
  97. } );
  98. }
  99. result.elements[ 0 ].children.push( {
  100. type: 'hbox',
  101. widths: [ '50%', '50%' ],
  102. children: [].concat( contents )
  103. } );
  104. }
  105. if ( tabConfig.styles || tabConfig.classes ) {
  106. contents = [];
  107. if ( tabConfig.styles ) {
  108. contents.push( {
  109. id: 'advStyles',
  110. att: 'style',
  111. type: 'text',
  112. requiredContent: element ? element + '{cke-xyz}' : null,
  113. label: lang.styles,
  114. 'default': '',
  115. validate: CKEDITOR.dialog.validate.inlineStyle( lang.invalidInlineStyle ),
  116. onChange: function() {},
  117. getStyle: function( name, defaultValue ) {
  118. var match = this.getValue().match( new RegExp( '(?:^|;)\\s*' + name + '\\s*:\\s*([^;]*)', 'i' ) );
  119. return match ? match[ 1 ] : defaultValue;
  120. },
  121. updateStyle: function( name, value ) {
  122. var styles = this.getValue();
  123. var tmp = editor.document.createElement( 'span' );
  124. tmp.setAttribute( 'style', styles );
  125. tmp.setStyle( name, value );
  126. styles = CKEDITOR.tools.normalizeCssText( tmp.getAttribute( 'style' ) );
  127. this.setValue( styles, 1 );
  128. },
  129. setup: setupAdvParams,
  130. commit: commitAdvParams
  131. } );
  132. }
  133. if ( tabConfig.classes ) {
  134. contents.push( {
  135. type: 'hbox',
  136. widths: [ '45%', '55%' ],
  137. children: [ {
  138. id: 'advCSSClasses',
  139. att: 'class',
  140. type: 'text',
  141. requiredContent: element ? element + '(cke-xyz)' : null,
  142. label: lang.cssClasses,
  143. 'default': '',
  144. setup: setupAdvParams,
  145. commit: commitAdvParams
  146. } ]
  147. } );
  148. }
  149. result.elements[ 0 ].children.push( {
  150. type: 'hbox',
  151. widths: [ '50%', '50%' ],
  152. children: [].concat( contents )
  153. } );
  154. }
  155. return result;
  156. }
  157. } );
  158. } )();