rework label editor to use dijit.form validation

diff --git a/modules/pref-labels.php b/modules/pref-labels.php
index 42b1b3cd75dfd9c55c1eb2df105e3e42bcec84f2..5e0253856930a7e0358bef8ac5fabf6f4bb41d79 100644 (file)
--- a/modules/pref-labels.php
+++ b/modules/pref-labels.php
@@ -6,22 +6,17 @@
                if ($subop == "edit") {
                        $label_id = db_escape_string($_REQUEST['id']);
 
-                       header("Content-Type: text/xml");
-                       print "<dlg id=\"$subop\">";
-                       print "<title>" . __("Label Editor") . "</title>";
-                       print "<content><![CDATA[";
-
                        $result = db_query($link, "SELECT * FROM ttrss_labels2 WHERE
                                id = '$label_id' AND owner_uid = " . $_SESSION["uid"]);
 
                        $line = db_fetch_assoc($result);
 
-                       print "<form id=\"label_edit_form\" name=\"label_edit_form\"
-                               onsubmit=\"return false;\">";
+#                      print "<form id=\"label_edit_form\" name=\"label_edit_form\"
+#                              onsubmit=\"return false;\">";
 
-                       print "<input type=\"hidden\" name=\"id\" value=\"$label_id\">";
-                       print "<input type=\"hidden\" name=\"op\" value=\"pref-labels\">";
-                       print "<input type=\"hidden\" name=\"subop\" value=\"save\">";
+                       print "<input dojoType=\"dijit.form.TextBox\" style=\"display : none\" name=\"id\" value=\"$label_id\">";
+                       print "<input dojoType=\"dijit.form.TextBox\" style=\"display : none\" name=\"op\" value=\"pref-labels\">";
+                       print "<input dojoType=\"dijit.form.TextBox\" style=\"display : none\" name=\"subop\" value=\"save\">";
 
                        print "<div class=\"dlgSec\">".__("Caption")."</div>";
 
@@ -32,8 +27,9 @@
 
                        print "<span class=\"labelColorIndicator\" id=\"label-editor-indicator\" style='color : $fg_color; background-color : $bg_color'>&alpha;</span>";
 
-                       print "<input style=\"font-size : 18px\" name=\"caption\" 
-                               onkeypress=\"return filterCR(event, editLabelSave)\"
+                       print "<input style=\"font-size : 16px\" name=\"caption\" 
+                               dojoType=\"dijit.form.ValidationTextBox\"
+                               required=\"true\"
                                value=\"".htmlspecialchars($line['caption'])."\">";
 
                        print "</div>";
@@ -47,12 +43,16 @@
 
                        print "<tr><td style='padding-right : 10px'>";
 
-                       print "<input type=\"hidden\" name=\"fg_color\" value=\"$fg_color\">";
-                       print "<input type=\"hidden\" name=\"bg_color\" value=\"$bg_color\">";
+                       print "<input dojoType=\"dijit.form.TextBox\" 
+                               style=\"display : none\" id=\"labelEdit_fgColor\"
+                               name=\"fg_color\" value=\"$fg_color\">";
+                       print "<input dojoType=\"dijit.form.TextBox\" 
+                               style=\"display : none\" id=\"labelEdit_bgColor\"
+                               name=\"bg_color\" value=\"$bg_color\">";
 
                        print "<div dojoType=\"dijit.ColorPalette\">
                                <script type=\"dojo/method\" event=\"onChange\" args=\"fg_color\">
-                                       document.forms['label_edit_form'].fg_color.value = fg_color;
+                                       dijit.byId(\"labelEdit_fgColor\").attr('value', fg_color);
                                        $('label-editor-indicator').setStyle({color: fg_color});
                                </script>
                        </div>";
@@ -62,7 +62,7 @@
 
                        print "<div dojoType=\"dijit.ColorPalette\">
                                <script type=\"dojo/method\" event=\"onChange\" args=\"bg_color\">
-                                       document.forms['label_edit_form'].bg_color.value = bg_color;
+                                       dijit.byId(\"labelEdit_bgColor\").attr('value', bg_color);
                                        $('label-editor-indicator').setStyle({backgroundColor: bg_color});
                                </script>
                        </div>";
@@ -71,16 +71,15 @@
                        print "</td></tr></table>";
                        print "</div>";
 
-                       print "</form>";
+#                      print "</form>";
 
                        print "<div class=\"dlgButtons\">";
-                       print "<button onclick=\"return editLabelSave()\">".
+                       print "<button onclick=\"dijit.byId('labelEditDlg').execute()\">".
                                __('Save')."</button>";
-                       print "<button onclick=\"return closeInfoBox()\">".
+                       print "<button onclick=\"dijit.byId('labelEditDlg').hide()\">".
                                __('Cancel')."</button>";
                        print "</div>";
 
-                       print "]]></content></dlg>";
                        return;
                }
 

diff --git a/prefs.js b/prefs.js
index bcfd40603f523713ab5fbd9c247a3c807044f61e..2309e29ce9d9b49e14a9563e7f2b3bc6ab7e1a19 100644 (file)
--- a/prefs.js
+++ b/prefs.js
@@ -1100,6 +1100,7 @@ function init() {
                dojo.require("dijit.Dialog");
                dojo.require("dijit.form.Button");
                dojo.require("dijit.form.TextBox");
+               dojo.require("dijit.form.ValidationTextBox");
                dojo.require("dijit.form.RadioButton");
                dojo.require("dijit.form.Select");
                dojo.require("dijit.Toolbar");
@@ -1956,16 +1957,38 @@ function editCat(id, item, event) {
 
 function editLabel(id, event) {
        try {
-               var query = "?op=pref-labels&subop=edit&id=" +
+               var query = "backend.php?op=pref-labels&subop=edit&id=" +
                        param_escape(id);
 
-               notify_progress("Loading, please wait...", true);
+               if (dijit.byId("labelEditDlg"))
+                       dijit.byId("labelEditDlg").destroyRecursive();
+
+               dialog = new dijit.Dialog({
+                       id: "labelEditDlg",
+                       title: __("Label Editor"),
+                       style: "width: 600px",
+                       execute: function() {
+                               if (this.validate()) {
+                                       var caption = this.attr('value').id;
+                                       var caption = this.attr('value').caption;
+                                       var fg_color = this.attr('value').fg_color;
+                                       var bg_color = this.attr('value').bg_color;
+                                       var query = dojo.objectToQuery(this.attr('value'));
+
+                                       dijit.byId('labelTree').setNameById(id, caption);
+                                       setLabelColor(id, fg_color, bg_color);
+                                       this.hide();
+
+                                       new Ajax.Request("backend.php", {
+                                               parameters: query,
+                                               onComplete: function(transport) {
+                                                       updateFilterList();     
+                                       } });
+                               }
+                       },
+                       href: query});
 
-               new Ajax.Request("backend.php", {
-                       parameters: query,
-                       onComplete: function(transport) {
-                               infobox_callback2(transport);
-                       } });
+               dialog.show();
 
        } catch (e) {
                exception_error("editLabel", e);