JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
vanilla ckeditor-3.0
[ckeditor.git] / _source / plugins / showblocks / plugin.js
diff --git a/_source/plugins/showblocks/plugin.js b/_source/plugins/showblocks/plugin.js
new file mode 100644 (file)
index 0000000..6a5ebc2
--- /dev/null
@@ -0,0 +1,153 @@
+/*\r
+Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.\r
+For licensing, see LICENSE.html or http://ckeditor.com/license\r
+*/\r
+\r
+/**\r
+ * @fileOverview The "showblocks" plugin. Enable it will make all block level\r
+ *               elements being decorated with a border and the element name\r
+ *               displayed on the left-right corner.\r
+ */\r
+\r
+(function()\r
+{\r
+       var cssTemplate = '.%2 p,'+\r
+               '.%2 div,'+\r
+               '.%2 pre,'+\r
+               '.%2 address,'+\r
+               '.%2 blockquote,'+\r
+               '.%2 h1,'+\r
+               '.%2 h2,'+\r
+               '.%2 h3,'+\r
+               '.%2 h4,'+\r
+               '.%2 h5,'+\r
+               '.%2 h6'+\r
+               '{'+\r
+                       'background-repeat: no-repeat;'+\r
+                       'border: 1px dotted gray;'+\r
+                       'padding-top: 8px;'+\r
+                       'padding-left: 8px;'+\r
+               '}'+\r
+\r
+               '.%2 p'+\r
+               '{'+\r
+                       '%1p.png);'+\r
+               '}'+\r
+\r
+               '.%2 div'+\r
+               '{'+\r
+                       '%1div.png);'+\r
+               '}'+\r
+\r
+               '.%2 pre'+\r
+               '{'+\r
+                       '%1pre.png);'+\r
+               '}'+\r
+\r
+               '.%2 address'+\r
+               '{'+\r
+                       '%1address.png);'+\r
+               '}'+\r
+\r
+               '.%2 blockquote'+\r
+               '{'+\r
+                       '%1blockquote.png);'+\r
+               '}'+\r
+\r
+               '.%2 h1'+\r
+               '{'+\r
+                       '%1h1.png);'+\r
+               '}'+\r
+\r
+               '.%2 h2'+\r
+               '{'+\r
+                       '%1h2.png);'+\r
+               '}'+\r
+\r
+               '.%2 h3'+\r
+               '{'+\r
+                       '%1h3.png);'+\r
+               '}'+\r
+\r
+               '.%2 h4'+\r
+               '{'+\r
+                       '%1h4.png);'+\r
+               '}'+\r
+\r
+               '.%2 h5'+\r
+               '{'+\r
+                       '%1h5.png);'+\r
+               '}'+\r
+\r
+               '.%2 h6'+\r
+               '{'+\r
+                       '%1h6.png);'+\r
+               '}';\r
+\r
+       var cssTemplateRegex = /%1/g, cssClassRegex = /%2/g;\r
+\r
+       var commandDefinition =\r
+       {\r
+               preserveState : true,\r
+\r
+               exec : function ( editor )\r
+               {\r
+                       this.toggleState();\r
+                       this.refresh( editor );\r
+               },\r
+\r
+               refresh : function( editor )\r
+               {\r
+                       var funcName = ( this.state == CKEDITOR.TRISTATE_ON ) ? 'addClass' : 'removeClass';\r
+                       editor.document.getBody()[ funcName ]( 'cke_show_blocks' );\r
+               }\r
+       };\r
+\r
+       CKEDITOR.plugins.add( 'showblocks',\r
+       {\r
+               requires : [ 'wysiwygarea' ],\r
+\r
+               init : function( editor )\r
+               {\r
+                       var command = editor.addCommand( 'showblocks', commandDefinition );\r
+                       command.canUndo = false;\r
+\r
+                       if ( editor.config.startupOutlineBlocks )\r
+                               command.setState( CKEDITOR.TRISTATE_ON );\r
+\r
+                       editor.addCss( cssTemplate\r
+                               .replace( cssTemplateRegex, 'background-image: url(' + CKEDITOR.getUrl( this.path ) + 'images/block_' )\r
+                               .replace( cssClassRegex, 'cke_show_blocks ' ) );\r
+\r
+                       editor.ui.addButton( 'ShowBlocks',\r
+                               {\r
+                                       label : editor.lang.showBlocks,\r
+                                       command : 'showblocks'\r
+                               });\r
+\r
+                       // Refresh the command on setData.\r
+                       editor.on( 'mode', function()\r
+                               {\r
+                                       if ( command.state != CKEDITOR.TRISTATE_DISABLED )\r
+                                               command.refresh( editor );\r
+                               });\r
+\r
+                       // Refresh the command on setData.\r
+                       editor.on( 'contentDom', function()\r
+                               {\r
+                                       if ( command.state != CKEDITOR.TRISTATE_DISABLED )\r
+                                               command.refresh( editor );\r
+                               });\r
+               }\r
+       });\r
+} )();\r
+\r
+/**\r
+ * Whether to automaticaly enable the "show block" command when the editor\r
+ * loads.\r
+ * @type Boolean\r
+ * @default false\r
+ * @example\r
+ * config.startupOutlineBlocks = true;\r
+ */\r
+CKEDITOR.config.startupOutlineBlocks = false;\r