JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
3be5c3b6606936a5cb16f76a19112d433f09deea
[ckeditor.git] / _source / plugins / forms / 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  * @file Forms Plugin\r
8  */\r
9 \r
10 CKEDITOR.plugins.add( 'forms',\r
11 {\r
12         init : function( editor )\r
13         {\r
14                 var lang = editor.lang;\r
15 \r
16                 editor.addCss(\r
17                         'form' +\r
18                         '{' +\r
19                                 'border: 1px dotted #FF0000;' +\r
20                                 'padding: 2px;' +\r
21                         '}\n' );\r
22 \r
23                 editor.addCss(\r
24                         'img.cke_hidden' +\r
25                         '{' +\r
26                                 'background-image: url(' + CKEDITOR.getUrl( this.path + 'images/hiddenfield.gif' ) + ');' +\r
27                                 'background-position: center center;' +\r
28                                 'background-repeat: no-repeat;' +\r
29                                 'border: 1px solid #a9a9a9;' +\r
30                                 'width: 16px !important;' +\r
31                                 'height: 16px !important;' +\r
32                         '}' );\r
33 \r
34                 // All buttons use the same code to register. So, to avoid\r
35                 // duplications, let's use this tool function.\r
36                 var addButtonCommand = function( buttonName, commandName, dialogFile )\r
37                 {\r
38                         editor.addCommand( commandName, new CKEDITOR.dialogCommand( commandName ) );\r
39 \r
40                         editor.ui.addButton( buttonName,\r
41                                 {\r
42                                         label : lang.common[ buttonName.charAt(0).toLowerCase() + buttonName.slice(1) ],\r
43                                         command : commandName\r
44                                 });\r
45                         CKEDITOR.dialog.add( commandName, dialogFile );\r
46                 };\r
47 \r
48                 var dialogPath = this.path + 'dialogs/';\r
49                 addButtonCommand( 'Form',                       'form',                 dialogPath + 'form.js' );\r
50                 addButtonCommand( 'Checkbox',           'checkbox',             dialogPath + 'checkbox.js' );\r
51                 addButtonCommand( 'Radio',                      'radio',                dialogPath + 'radio.js' );\r
52                 addButtonCommand( 'TextField',          'textfield',    dialogPath + 'textfield.js' );\r
53                 addButtonCommand( 'Textarea',           'textarea',             dialogPath + 'textarea.js' );\r
54                 addButtonCommand( 'Select',                     'select',               dialogPath + 'select.js' );\r
55                 addButtonCommand( 'Button',                     'button',               dialogPath + 'button.js' );\r
56                 addButtonCommand( 'ImageButton',        'imagebutton',  CKEDITOR.plugins.getPath('image') + 'dialogs/image.js' );\r
57                 addButtonCommand( 'HiddenField',        'hiddenfield',  dialogPath + 'hiddenfield.js' );\r
58 \r
59                 // If the "menu" plugin is loaded, register the menu items.\r
60                 if ( editor.addMenuItems )\r
61                 {\r
62                         editor.addMenuItems(\r
63                                 {\r
64                                         form :\r
65                                         {\r
66                                                 label : lang.form.menu,\r
67                                                 command : 'form',\r
68                                                 group : 'form'\r
69                                         },\r
70 \r
71                                         checkbox :\r
72                                         {\r
73                                                 label : lang.checkboxAndRadio.checkboxTitle,\r
74                                                 command : 'checkbox',\r
75                                                 group : 'checkbox'\r
76                                         },\r
77 \r
78                                         radio :\r
79                                         {\r
80                                                 label : lang.checkboxAndRadio.radioTitle,\r
81                                                 command : 'radio',\r
82                                                 group : 'radio'\r
83                                         },\r
84 \r
85                                         textfield :\r
86                                         {\r
87                                                 label : lang.textfield.title,\r
88                                                 command : 'textfield',\r
89                                                 group : 'textfield'\r
90                                         },\r
91 \r
92                                         hiddenfield :\r
93                                         {\r
94                                                 label : lang.hidden.title,\r
95                                                 command : 'hiddenfield',\r
96                                                 group : 'hiddenfield'\r
97                                         },\r
98 \r
99                                         imagebutton :\r
100                                         {\r
101                                                 label : lang.image.titleButton,\r
102                                                 command : 'imagebutton',\r
103                                                 group : 'imagebutton'\r
104                                         },\r
105 \r
106                                         button :\r
107                                         {\r
108                                                 label : lang.button.title,\r
109                                                 command : 'button',\r
110                                                 group : 'button'\r
111                                         },\r
112 \r
113                                         select :\r
114                                         {\r
115                                                 label : lang.select.title,\r
116                                                 command : 'select',\r
117                                                 group : 'select'\r
118                                         },\r
119 \r
120                                         textarea :\r
121                                         {\r
122                                                 label : lang.textarea.title,\r
123                                                 command : 'textarea',\r
124                                                 group : 'textarea'\r
125                                         }\r
126                                 });\r
127                 }\r
128 \r
129                 // If the "contextmenu" plugin is loaded, register the listeners.\r
130                 if ( editor.contextMenu )\r
131                 {\r
132                         editor.contextMenu.addListener( function( element )\r
133                                 {\r
134                                         if ( element && element.hasAscendant( 'form', true ) && !element.isReadOnly() )\r
135                                                 return { form : CKEDITOR.TRISTATE_OFF };\r
136                                 });\r
137 \r
138                         editor.contextMenu.addListener( function( element )\r
139                                 {\r
140                                         if ( element && !element.isReadOnly() )\r
141                                         {\r
142                                                 var name = element.getName();\r
143 \r
144                                                 if ( name == 'select' )\r
145                                                         return { select : CKEDITOR.TRISTATE_OFF };\r
146 \r
147                                                 if ( name == 'textarea' )\r
148                                                         return { textarea : CKEDITOR.TRISTATE_OFF };\r
149 \r
150                                                 if ( name == 'input' )\r
151                                                 {\r
152                                                         switch( element.getAttribute( 'type' ) )\r
153                                                         {\r
154                                                                 case 'button' :\r
155                                                                 case 'submit' :\r
156                                                                 case 'reset' :\r
157                                                                         return { button : CKEDITOR.TRISTATE_OFF };\r
158 \r
159                                                                 case 'checkbox' :\r
160                                                                         return { checkbox : CKEDITOR.TRISTATE_OFF };\r
161 \r
162                                                                 case 'radio' :\r
163                                                                         return { radio : CKEDITOR.TRISTATE_OFF };\r
164 \r
165                                                                 case 'image' :\r
166                                                                         return { imagebutton : CKEDITOR.TRISTATE_OFF };\r
167 \r
168                                                                 default :\r
169                                                                         return { textfield : CKEDITOR.TRISTATE_OFF };\r
170                                                         }\r
171                                                 }\r
172 \r
173                                                 if ( name == 'img' && element.data( 'cke-real-element-type' ) == 'hiddenfield' )\r
174                                                         return { hiddenfield : CKEDITOR.TRISTATE_OFF };\r
175                                         }\r
176                                 });\r
177                 }\r
178 \r
179                 editor.on( 'doubleclick', function( evt )\r
180                         {\r
181                                 var element = evt.data.element;\r
182 \r
183                                 if ( element.is( 'form' ) )\r
184                                         evt.data.dialog = 'form';\r
185                                 else if ( element.is( 'select' ) )\r
186                                         evt.data.dialog = 'select';\r
187                                 else if ( element.is( 'textarea' ) )\r
188                                         evt.data.dialog = 'textarea';\r
189                                 else if ( element.is( 'img' ) && element.data( 'cke-real-element-type' ) == 'hiddenfield' )\r
190                                         evt.data.dialog = 'hiddenfield';\r
191                                 else if ( element.is( 'input' ) )\r
192                                 {\r
193                                         switch ( element.getAttribute( 'type' ) )\r
194                                         {\r
195                                                 case 'button' :\r
196                                                 case 'submit' :\r
197                                                 case 'reset' :\r
198                                                         evt.data.dialog = 'button';\r
199                                                         break;\r
200                                                 case 'checkbox' :\r
201                                                         evt.data.dialog = 'checkbox';\r
202                                                         break;\r
203                                                 case 'radio' :\r
204                                                         evt.data.dialog = 'radio';\r
205                                                         break;\r
206                                                 case 'image' :\r
207                                                         evt.data.dialog = 'imagebutton';\r
208                                                         break;\r
209                                                 default :\r
210                                                         evt.data.dialog = 'textfield';\r
211                                                         break;\r
212                                         }\r
213                                 }\r
214                         });\r
215         },\r
216 \r
217         afterInit : function( editor )\r
218         {\r
219                 var dataProcessor = editor.dataProcessor,\r
220                         htmlFilter = dataProcessor && dataProcessor.htmlFilter,\r
221                         dataFilter = dataProcessor && dataProcessor.dataFilter;\r
222 \r
223                 // Cleanup certain IE form elements default values.\r
224                 if ( CKEDITOR.env.ie )\r
225                 {\r
226                         htmlFilter && htmlFilter.addRules(\r
227                         {\r
228                                 elements :\r
229                                 {\r
230                                         input : function( input )\r
231                                         {\r
232                                                 var attrs = input.attributes,\r
233                                                         type = attrs.type;\r
234                                                 // Old IEs don't provide type for Text inputs #5522\r
235                                                 if ( !type )\r
236                                                         attrs.type = 'text';\r
237                                                 if ( type == 'checkbox' || type == 'radio' )\r
238                                                         attrs.value == 'on' && delete attrs.value;\r
239                                         }\r
240                                 }\r
241                         } );\r
242                 }\r
243 \r
244                 if ( dataFilter )\r
245                 {\r
246                         dataFilter.addRules(\r
247                         {\r
248                                 elements :\r
249                                 {\r
250                                         input : function( element )\r
251                                         {\r
252                                                 if ( element.attributes.type == 'hidden' )\r
253                                                         return editor.createFakeParserElement( element, 'cke_hidden', 'hiddenfield' );\r
254                                         }\r
255                                 }\r
256                         } );\r
257                 }\r
258         },\r
259         requires : [ 'image', 'fakeobjects' ]\r
260 } );\r
261 \r
262 if ( CKEDITOR.env.ie )\r
263 {\r
264         CKEDITOR.dom.element.prototype.hasAttribute = function( name )\r
265         {\r
266                 var $attr = this.$.attributes.getNamedItem( name );\r
267 \r
268                 if ( this.getName() == 'input' )\r
269                 {\r
270                         switch ( name )\r
271                         {\r
272                                 case 'class' :\r
273                                         return this.$.className.length > 0;\r
274                                 case 'checked' :\r
275                                         return !!this.$.checked;\r
276                                 case 'value' :\r
277                                         var type = this.getAttribute( 'type' );\r
278                                         return type == 'checkbox' || type == 'radio' ? this.$.value != 'on' : this.$.value;\r
279                         }\r
280                 }\r
281 \r
282                 return !!( $attr && $attr.specified );\r
283         };\r
284 }\r