source: trunk/plugins/Forms/forms.js @ 893

Last change on this file since 893 was 893, checked in by ray, 11 years ago
  • #1079 Plugin DynamicCSS lists Xinha internal CSS
  • #1080 Some plugins leave behind stylesheet links in fullpage mode
  • Property svn:keywords set to LastChangedDate LastChangedRevision LastChangedBy HeadURL Id
File size: 12.7 KB
Line 
1// Form plugin for Xinha
2// Distributed under the same terms as HTMLArea itself.
3// This notice MUST stay intact for use (see license.txt).
4
5
6function Forms(editor) {
7  this.editor = editor;
8  var cfg = editor.config;
9  var bl = Forms.btnList;
10  var self = this;
11  // register the toolbar buttons provided by this plugin
12  var toolbar = ["linebreak"];
13  for (var i = 0; i < bl.length; ++i) {
14    var btn = bl[i];
15    if (!btn) {
16      toolbar.push("separator");
17    } else {
18      var id = btn[0];
19      if (i<3)
20        cfg.registerButton(id, this._lc(btn[1]), editor.imgURL("ed_" + btn[0] + ".gif", "Forms"), false,
21             function(editor, id) {
22               // dispatch button press event
23               self.buttonPress(editor, id);
24             });
25      else
26        cfg.registerButton(id, this._lc(btn[1]), editor.imgURL("ed_" + btn[0] + ".gif", "Forms"), false,
27             function(editor, id) {
28               // dispatch button press event
29               self.buttonPress(editor, id);
30             },"form");
31      toolbar.push(id);
32    }
33  }
34  // add a new line in the toolbar
35  cfg.toolbar.push(toolbar);
36}
37
38Forms._pluginInfo = {
39  name          : "Forms",
40  origin        : "version: 1.0, by Nelson Bright, BrightWork, Inc., http://www.brightworkweb.com",
41  version       : "2.0",
42  developer     : "Udo Schmal",
43  developer_url : "",
44  sponsor       : "L.N.Schaffrath NeueMedien",
45  sponsor_url   : "http://www.schaffrath-neuemedien.de/",
46  c_owner       : "Udo Schmal & Schaffrath-NeueMedien",
47  license       : "htmlArea"
48};
49
50// the list of buttons added by this plugin
51Forms.btnList = [
52  // form properties button
53  null, // separator
54  ["form",        "Form"],
55  null, // separator
56  // form elements
57  ["textarea",    "Textarea"],
58  ["select",      "Selection Field"],
59  ["checkbox",    "Checkbox"],
60  ["radio",       "Radio Button"],
61  ["text",        "Text Field"],
62  ["password",    "Password Field"],
63  ["file",        "File Field"],
64  ["button",      "Button"],
65  ["submit",      "Submit Button"],
66  ["reset",       "Reset Button"],
67  ["image",       "Image Button"],
68  ["hidden",      "Hidden Field"],
69  ["label",       "Label"],
70  ["fieldset",    "Field Set"]
71  ];
72
73Forms.prototype._lc = function(string) {
74    return Xinha._lc(string, 'Forms');
75};
76
77Forms.prototype.onGenerate = function() {
78  this.editor.addEditorStylesheet(_editor_url + 'plugins/Forms/forms.css');
79};
80
81Forms.prototype.buttonPress = function(editor,button_id, node) {
82  function optionValues(text,value) {
83    this.text = text;
84    this.value = value;
85  }
86  var outparam = new Object();
87  var type = button_id;
88  var sel = editor._getSelection();
89  var range = editor._createRange(sel);
90  if (button_id=="form") { //Form
91    // see if selection is inside an existing 'form' tag
92    var pe = editor.getParentElement();
93    var frm = null;
94    while (pe && (pe.nodeType == 1) && (pe.tagName.toLowerCase() != 'body')) {
95      if(pe.tagName.toLowerCase() == "form") {
96        frm = pe;
97        break;
98      } else
99        pe = pe.parentNode;
100    }
101    if (frm) {
102      outparam.f_name = frm.name;
103      outparam.f_action = frm.action;
104      outparam.f_method = frm.method;
105      outparam.f_enctype = frm.enctype;
106      outparam.f_target = frm.target;
107    } else {;
108      outparam.f_name = "";
109      outparam.f_action = "";
110      outparam.f_method = "";
111      outparam.f_enctype = "";
112      outparam.f_target = "";
113    }
114    editor._popupDialog("plugin://Forms/form", function(param) {
115      if (param) {
116        if(frm) {
117          frm.name = param["f_name"];
118          frm.setAttribute("action", param["f_action"]);
119          frm.setAttribute("method", param["f_method"]);
120          frm.setAttribute("enctype",param["f_enctype"]);
121          frm.setAttribute("target", param["f_target"]);
122        } else {
123          frm = '<form name="' + param["f_name"] + '"';
124          if (param["f_action"] != "") frm += ' action="' + param["f_action"] + '"';
125          if (param["f_method"] != "") frm += ' method="' + param["f_method"] + '"';
126          if (param["f_enctype"] != "") frm += ' enctype="' + param["f_enctype"] + '"';
127          if (param["f_target"] != "") frm += ' target="' + param["f_target"] + '"';
128          frm += '>';
129          editor.surroundHTML(frm, '&nbsp;</form>');
130        }
131      }
132    }, outparam);
133
134  } else { // form element (checkbox, radio, text, password, textarea, select, button, submit, reset, image, hidden)
135    var tagName = "";
136    // see if selection is an form element
137    if (typeof node == "undefined") {
138      node = editor.getParentElement();
139      var tag = node.tagName.toLowerCase()
140      if (node && (tag == "legend")) {
141        node = node.parentElement;
142        tag = node.tagName.toLowerCase();
143      }
144      if (node && !(tag == "textarea" || tag == "select" || tag == "input" || tag == "label" || tag == "fieldset"))
145        node = null;
146    }
147
148    if(node) {
149      type = node.tagName.toLowerCase();
150      outparam.f_name = node.name;
151      tagName = node.tagName;
152      if (type == "input") {
153        outparam.f_type = node.type;
154        type = node.type;
155      }
156      switch (type) {
157        case "textarea":
158          outparam.f_cols = node.cols;
159          outparam.f_rows = node.rows;
160          outparam.f_text = node.innerHTML;
161          outparam.f_wrap = node.getAttribute("wrap");
162          outparam.f_readOnly = node.getAttribute("readOnly");
163          outparam.f_disabled = node.getAttribute("disabled");
164          outparam.f_tabindex = node.getAttribute("tabindex");
165          outparam.f_accesskey = node.getAttribute("accesskey");
166          break;
167        case "select":
168          outparam.f_size = parseInt(node.size);
169          outparam.f_multiple = node.getAttribute("multiple");
170          outparam.f_disabled = node.getAttribute("disabled");
171          outparam.f_tabindex = node.getAttribute("tabindex");
172          var a_options = new Array();
173          for (var i=0; i<=node.options.length-1; i++) {
174            a_options[i] = new optionValues(node.options[i].text, node.options[i].value);
175          }
176          outparam.f_options = a_options;
177          break;
178        case "text":
179        case "password":
180          outparam.f_value = node.value;
181          outparam.f_size = node.size;
182          outparam.f_maxLength = node.maxLength;
183          outparam.f_readOnly = node.getAttribute("readOnly");
184          outparam.f_disabled = node.getAttribute("disabled");
185          outparam.f_tabindex = node.getAttribute("tabindex");
186          outparam.f_accesskey = node.getAttribute("accesskey");
187          break;
188        case "hidden":
189          outparam.f_value = node.value;
190          break;
191        case "submit":
192        case "reset":
193          outparam.f_value = node.value;
194          outparam.f_disabled = node.getAttribute("disabled");
195          outparam.f_tabindex = node.getAttribute("tabindex");
196          outparam.f_accesskey = node.getAttribute("accesskey");
197          break;
198        case "checkbox":
199        case "radio":
200          outparam.f_value = node.value;
201          outparam.f_checked = node.checked;
202          outparam.f_disabled = node.getAttribute("disabled");
203          outparam.f_tabindex = node.getAttribute("tabindex");
204          outparam.f_accesskey = node.getAttribute("accesskey");
205          break;
206        case "button":
207          outparam.f_value = node.value;
208          outparam.f_onclick = node.getAttribute("onclick");
209          outparam.f_disabled = node.getAttribute("disabled");
210          outparam.f_tabindex = node.getAttribute("tabindex");
211          outparam.f_accesskey = node.getAttribute("accesskey");
212          break;
213        case "image":
214          outparam.f_value = node.value;
215          outparam.f_src = node.src;
216          outparam.f_disabled = node.getAttribute("disabled");
217          outparam.f_tabindex = node.getAttribute("tabindex");
218          outparam.f_accesskey = node.getAttribute("accesskey");
219          break;
220        case "file":
221          outparam.f_disabled = node.getAttribute("disabled");
222          outparam.f_tabindex = node.getAttribute("tabindex");
223          outparam.f_accesskey = node.getAttribute("accesskey");
224          break;
225        case "label":
226          outparam.f_text = node.innerHTML;
227          outparam.f_for = node.getAttribute("for");
228          outparam.f_accesskey = node.getAttribute("accesskey");
229          break;
230        case "fieldset":
231          if(node.firstChild.tagName.toLowerCase()=="legend")
232            outparam.f_text = node.firstChild.innerHTML;
233          else
234            outparam.f_text = "";
235          break;
236      }
237    } else {
238      outparam.f_name = "";
239      switch (button_id) {
240        case "textarea":
241        case "select":
242        case "label":
243        case "fieldset":
244          tagName = button_id;
245          break;
246        default:
247          tagName = "input";
248          outparam.f_type = button_id;
249          break;
250      }
251      outparam.f_options = "";
252      outparam.f_cols = "20";
253      outparam.f_rows = "4";
254      outparam.f_multiple = "false";
255      outparam.f_value = "";
256      outparam.f_size = "";
257      outparam.f_maxLength = "";
258      outparam.f_checked = "";
259      outparam.f_src = "";
260      outparam.f_onclick = "";
261      outparam.f_wrap = "";
262      outparam.f_readOnly = "false";
263      outparam.f_disabled = "false";
264      outparam.f_tabindex = "";
265      outparam.f_accesskey = "";
266      outparam.f_for = "";
267      outparam.f_text = "";
268      outparam.f_legend = "";
269    }
270    editor._popupDialog("plugin://Forms/" + tagName + ".html", function(param) {
271      if (param) {
272        if(param["f_cols"])
273          if (isNaN(parseInt(param["f_cols"],10)) || parseInt(param["f_cols"],10) <= 0)
274            param["f_cols"] = "";
275        if(param["f_rows"])
276          if(isNaN(parseInt(param["f_rows"],10)) || parseInt(param["f_rows"],10) <= 0)
277            param["f_rows"] = "";
278        if(param["f_size"])
279          if(isNaN(parseInt(param["f_size"],10)) || parseInt(param["f_size"],10) <= 0)
280            param["f_size"] = "";
281        if(param["f_maxlength"])
282          if(isNaN(parseInt(param["f_maxLength"],10)) || parseInt(param["f_maxLength"],10) <= 0)
283            param["f_maxLength"] = "";
284        if(node) {
285          //prepare existing Element
286          for (field in param) {
287            //alert(field.substring(2,20) + '=' + param[field]);  //to be silent! by htanaka
288            if ((field=="f_text") || (field=="f_options") || (field=="f_onclick") || (field=="f_checked"))continue;
289            if (param[field] != "")
290              node.setAttribute(field.substring(2,20), param[field]);
291            else
292              node.removeAttribute(field.substring(2,20));
293          }
294          if (type == "textarea") {
295            node.innerHTML = param["f_text"];
296          } else if(type == "select") {
297            node.options.length = 0;
298            var optionsList =  param["f_options"];
299            for (i=0; i<= optionsList.length-1; i++) {
300              node.options[i] = new Option(optionsList[i].text, optionsList[i].value)
301            }
302          } else if(type == "label") {
303            node.innerHTML = param["f_text"];
304          } else if(type == "fieldset") {
305            if(outparam.f_text != "") {
306              if(node.firstChild.tagName.toLowerCase()=="legend")
307                node.firstChild.innerHTML = param["f_text"];
308            } else {}// not implemented jet
309          } else if((type == "checkbox") || (type == "radio")) { //input
310              if(param["f_checked"]!="")
311                node.checked = true;
312              else
313                node.checked = false;
314          } else {
315            if(param["f_onclick"]){
316              node.onclick = "";
317              if(param["f_onclick"]!="")
318                node.onclick = param["f_onclick"];
319            }
320          }
321        } else {
322          //create Element
323          var text = "";
324          for (field in param) {
325            if (!param[field]) continue;
326            if ((param[field]=="") || (field=="f_text")|| (field=="f_options"))continue;
327            text += " " + field.substring(2,20) + '="' + param[field] + '"';
328          }
329
330          if(type == "textarea") {
331            text = '<textarea' + text + '>' + param["f_text"] + '</textarea>';
332          } else if(type == "select") {
333            text = '<select' + text + '>';
334            var optionsList =  param["f_options"];
335            for (i=0; i<= optionsList.length-1; i++) {
336              text += '<option value="'+optionsList[i].value+'">'+optionsList[i].text+'</option>';
337            }
338            text += '</select>';
339          } else if(type == "label") {
340            text = '<label' + text + '>' + param["f_text"] + '</label>';
341          } else if(type == "fieldset") {
342            text = '<fieldset' + text + '>';
343            if (param["f_legend"] != "") text += '<legend>' + param["f_text"] + '</legend>';
344            text += '</fieldset>';
345          } else {
346            text = '<input type="'+type+'"' + text + '>';
347          }
348          editor.insertHTML(text);
349        }
350      }
351    }, outparam);
352  }
353};
Note: See TracBrowser for help on using the repository browser.