JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
6e199e3515b13543fd8ab1063cf4ab273c41037e
[ckeditor.git] / _source / plugins / showborders / plugin.js
1 /*\r
2 Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license\r
4 */\r
5 \r
6 /**\r
7  * @fileOverview The "show border" plugin. The command display visible outline\r
8  * border line around all table elements if table doesn't have a none-zero 'border' attribute specified.\r
9  */\r
10 \r
11 (function()\r
12 {\r
13         var showBorderClassName = 'cke_show_border',\r
14                 cssStyleText,\r
15                 cssTemplate =\r
16                 // TODO: For IE6, we don't have child selector support,\r
17                 // where nested table cells could be incorrect.\r
18                 ( CKEDITOR.env.ie6Compat ?\r
19                   [\r
20                         '.%1 table.%2,',\r
21                          '.%1 table.%2 td, .%1 table.%2 th,',\r
22                          '{',\r
23                                 'border : #d3d3d3 1px dotted',\r
24                          '}'\r
25                   ] :\r
26                   [\r
27                          '.%1 table.%2,',\r
28                          '.%1 table.%2 > tr > td, .%1 table.%2 > tr > th,',\r
29                          '.%1 table.%2 > tbody > tr > td, .%1 table.%2 > tbody > tr > th,',\r
30                          '.%1 table.%2 > thead > tr > td, .%1 table.%2 > thead > tr > th,',\r
31                          '.%1 table.%2 > tfoot > tr > td, .%1 table.%2 > tfoot > tr > th',\r
32                          '{',\r
33                                 'border : #d3d3d3 1px dotted',\r
34                          '}'\r
35                   ] ).join( '' );\r
36 \r
37         cssStyleText = cssTemplate.replace( /%2/g, showBorderClassName ).replace( /%1/g, 'cke_show_borders ' );\r
38 \r
39         var commandDefinition =\r
40         {\r
41                 preserveState : true,\r
42                 editorFocus : false,\r
43 \r
44                 exec : function ( editor )\r
45                 {\r
46                         this.toggleState();\r
47                         this.refresh( editor );\r
48                 },\r
49 \r
50                 refresh : function( editor )\r
51                 {\r
52                         var funcName = ( this.state == CKEDITOR.TRISTATE_ON ) ? 'addClass' : 'removeClass';\r
53                         editor.document.getBody()[ funcName ]( 'cke_show_borders' );\r
54                 }\r
55         };\r
56 \r
57         CKEDITOR.plugins.add( 'showborders',\r
58         {\r
59                 requires : [ 'wysiwygarea' ],\r
60                 modes : { 'wysiwyg' : 1 },\r
61 \r
62                 init : function( editor )\r
63                 {\r
64 \r
65                         var command = editor.addCommand( 'showborders', commandDefinition );\r
66                         command.canUndo = false;\r
67 \r
68                         if ( editor.config.startupShowBorders !== false )\r
69                                 command.setState( CKEDITOR.TRISTATE_ON );\r
70 \r
71                         editor.addCss( cssStyleText );\r
72 \r
73                         // Refresh the command on setData.\r
74                         editor.on( 'mode', function()\r
75                                 {\r
76                                         if ( command.state != CKEDITOR.TRISTATE_DISABLED )\r
77                                                 command.refresh( editor );\r
78                                 }, null, null, 100 );\r
79 \r
80                         // Refresh the command on wysiwyg frame reloads.\r
81                         editor.on( 'contentDom', function()\r
82                                 {\r
83                                         if ( command.state != CKEDITOR.TRISTATE_DISABLED )\r
84                                                 command.refresh( editor );\r
85                                 });\r
86 \r
87                         editor.on( 'removeFormatCleanup', function( evt )\r
88                                 {\r
89                                         var element = evt.data;\r
90                                         if ( editor.getCommand( 'showborders' ).state == CKEDITOR.TRISTATE_ON &&\r
91                                                 element.is( 'table' ) && ( !element.hasAttribute( 'border' ) || parseInt( element.getAttribute( 'border' ), 10 ) <= 0 ) )\r
92                                                         element.addClass( showBorderClassName );\r
93                                 });\r
94                 },\r
95 \r
96                 afterInit : function( editor )\r
97                 {\r
98                         var dataProcessor = editor.dataProcessor,\r
99                                 dataFilter = dataProcessor && dataProcessor.dataFilter,\r
100                                 htmlFilter = dataProcessor && dataProcessor.htmlFilter;\r
101 \r
102                         if ( dataFilter )\r
103                         {\r
104                                 dataFilter.addRules(\r
105                                         {\r
106                                                 elements :\r
107                                                 {\r
108                                                         'table' : function( element )\r
109                                                         {\r
110                                                                 var attributes = element.attributes,\r
111                                                                         cssClass = attributes[ 'class' ],\r
112                                                                         border = parseInt( attributes.border, 10 );\r
113 \r
114                                                                 if ( !border || border <= 0 )\r
115                                                                         attributes[ 'class' ] = ( cssClass || '' ) + ' ' + showBorderClassName;\r
116                                                         }\r
117                                                 }\r
118                                         } );\r
119                         }\r
120 \r
121                         if ( htmlFilter )\r
122                         {\r
123                                 htmlFilter.addRules(\r
124                                 {\r
125                                         elements :\r
126                                         {\r
127                                                 'table' : function( table )\r
128                                                 {\r
129                                                         var attributes = table.attributes,\r
130                                                                 cssClass = attributes[ 'class' ];\r
131 \r
132                                                         cssClass && ( attributes[ 'class' ] =\r
133                                                                       cssClass.replace( showBorderClassName, '' )\r
134                                                                                       .replace( /\s{2}/, ' ' )\r
135                                                                                                   .replace( /^\s+|\s+$/, '' ) );\r
136                                                 }\r
137                                         }\r
138                                 } );\r
139                         }\r
140                 }\r
141         });\r
142 \r
143         // Table dialog must be aware of it.\r
144         CKEDITOR.on( 'dialogDefinition', function( ev )\r
145         {\r
146                 var dialogName = ev.data.name;\r
147 \r
148                 if ( dialogName == 'table' || dialogName == 'tableProperties' )\r
149                 {\r
150                         var dialogDefinition = ev.data.definition,\r
151                                 infoTab = dialogDefinition.getContents( 'info' ),\r
152                                 borderField = infoTab.get( 'txtBorder' ),\r
153                                 originalCommit = borderField.commit;\r
154 \r
155                         borderField.commit = CKEDITOR.tools.override( originalCommit, function( org )\r
156                         {\r
157                                 return function( data, selectedTable )\r
158                                         {\r
159                                                 org.apply( this, arguments );\r
160                                                 var value = parseInt( this.getValue(), 10 );\r
161                                                 selectedTable[ ( !value || value <= 0 ) ? 'addClass' : 'removeClass' ]( showBorderClassName );\r
162                                         };\r
163                         } );\r
164 \r
165                         var advTab = dialogDefinition.getContents( 'advanced' ),\r
166                                 classField = advTab && advTab.get( 'advCSSClasses' );\r
167 \r
168                         if ( classField )\r
169                         {\r
170                                 classField.setup = CKEDITOR.tools.override( classField.setup, function( originalSetup )\r
171                                         {\r
172                                                 return function()\r
173                                                         {\r
174                                                                 originalSetup.apply( this, arguments );\r
175                                                                 this.setValue( this.getValue().replace( /cke_show_border/, '' ) );\r
176                                                         };\r
177                                         });\r
178 \r
179                                 classField.commit = CKEDITOR.tools.override( classField.commit, function( originalCommit )\r
180                                         {\r
181                                                 return function( data, element )\r
182                                                         {\r
183                                                                 originalCommit.apply( this, arguments );\r
184 \r
185                                                                 if ( !parseInt( element.getAttribute( 'border' ), 10 ) )\r
186                                                                         element.addClass( 'cke_show_border' );\r
187                                                         };\r
188                                         });\r
189                         }\r
190                 }\r
191         });\r
192 \r
193 } )();\r
194 \r
195 /**\r
196  * Whether to automatically enable the "show borders" command when the editor loads.\r
197  * (ShowBorders in FCKeditor)\r
198  * @name CKEDITOR.config.startupShowBorders\r
199  * @type Boolean\r
200  * @default true\r
201  * @example\r
202  * config.startupShowBorders = false;\r
203  */\r