From d90868d719a4a620ff5c1f74457626c429196590 Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Sat, 20 Nov 2010 14:10:26 +0300 Subject: rework filter dialogs to use dijit.Form --- functions.js | 108 +++++++++++++++++++++-------------------------- functions.php | 9 ++-- modules/popup-dialog.php | 64 ++++++++++++---------------- modules/pref-filters.php | 54 ++++++++++++------------ prefs.js | 40 ++++++++++-------- tt-rss.css | 11 ++++- tt-rss.js | 3 ++ 7 files changed, 144 insertions(+), 145 deletions(-) diff --git a/functions.js b/functions.js index 48a9ef230..bbfd32e4e 100644 --- a/functions.js +++ b/functions.js @@ -741,26 +741,15 @@ function filterDlgCheckType(sender) { try { - var ftype = sender[sender.selectedIndex].value; - - var form = document.forms["filter_add_form"]; - - if (!form) { - form = document.forms["filter_edit_form"]; - } - - if (!form) { - console.log("filterDlgCheckType: can't find form!"); - return; - } + var ftype = sender.value; // if selected filter type is 5 (Date) enable the modifier dropbox if (ftype == 5) { - Element.show("filter_dlg_date_mod_box"); - Element.show("filter_dlg_date_chk_box"); + Element.show("filterDlg_dateModBox"); + Element.show("filterDlg_dateChkBox"); } else { - Element.hide("filter_dlg_date_mod_box"); - Element.hide("filter_dlg_date_chk_box"); + Element.hide("filterDlg_dateModBox"); + Element.hide("filterDlg_dateChkBox"); } @@ -774,20 +763,9 @@ function filterDlgCheckAction(sender) { try { - var action = sender[sender.selectedIndex].value; + var action = sender.value; - var form = document.forms["filter_add_form"]; - - if (!form) { - form = document.forms["filter_edit_form"]; - } - - if (!form) { - console.log("filterDlgCheckAction: can't find form!"); - return; - } - - var action_param = $("filter_dlg_param_box"); + var action_param = $("filterDlg_paramBox"); if (!action_param) { console.log("filterDlgCheckAction: can't find action param box!"); @@ -796,13 +774,13 @@ function filterDlgCheckAction(sender) { // if selected action supports parameters, enable params field if (action == 4 || action == 6 || action == 7) { - Element.show(action_param); + new Effect.Appear(action_param, {duration : 0.5}); if (action != 7) { - Element.show(form.action_param); - Element.hide(form.action_param_label); + Element.show(dijit.byId("filterDlg_actionParam").domNode); + Element.hide(dijit.byId("filterDlg_actionParamLabel").domNode); } else { - Element.show(form.action_param_label); - Element.hide(form.action_param); + Element.show(dijit.byId("filterDlg_actionParamLabel").domNode); + Element.hide(dijit.byId("filterDlg_actionParam").domNode); } } else { Element.hide(action_param); @@ -816,18 +794,9 @@ function filterDlgCheckAction(sender) { function filterDlgCheckDate() { try { - var form = document.forms["filter_add_form"]; - - if (!form) { - form = document.forms["filter_edit_form"]; - } + var dialog = dijit.byId("filterEditDlg"); - if (!form) { - console.log("filterDlgCheckAction: can't find form!"); - return; - } - - var reg_exp = form.reg_exp.value; + var reg_exp = dialog.attr('value').reg_exp; var query = "?op=rpc&subop=checkDate&date=" + reg_exp; @@ -835,26 +804,18 @@ function filterDlgCheckDate() { parameters: query, onComplete: function(transport) { - var form = document.forms["filter_add_form"]; - - if (!form) { - form = document.forms["filter_edit_form"]; - } - if (transport.responseXML) { var result = transport.responseXML.getElementsByTagName("result")[0]; if (result && result.firstChild) { if (result.firstChild.nodeValue == "1") { - - new Effect.Highlight(form.reg_exp, {startcolor : '#00ff00'}); - + alert(__("Date syntax appears to be correct.")); return; } } } - new Effect.Highlight(form.reg_exp, {startcolor : '#ff0000'}); + alert(__("Date syntax is incorrect.")); } }); @@ -1211,8 +1172,37 @@ function quickAddFeed() { } function quickAddFilter() { - displayDlg('quickAddFilter', '', - function () {document.forms['filter_add_form'].reg_exp.focus();}); + try { + var query = "backend.php?op=dlg&id=quickAddFilter"; + + if (dijit.byId("filterEditDlg")) + dijit.byId("filterEditDlg").destroyRecursive(); + + dialog = new dijit.Dialog({ + id: "filterEditDlg", + title: __("Create Filter"), + style: "width: 600px", + execute: function() { + if (this.validate()) { + console.log(dojo.objectToQuery(this.attr('value'))); + new Ajax.Request("backend.php", { + parameters: dojo.objectToQuery(this.attr('value')), + onComplete: function(transport) { + this.hide(); + notify_info(transport.responseText); + if (inPreferences()) { + updateFilterList(); + } + }}); + + } + }, + href: query}); + + dialog.show(); + } catch (e) { + exception_error("quickAddFilter", e); + } } function unsubscribeFeed(feed_id, title) { @@ -1408,7 +1398,7 @@ function genUrlChangeKey(feed, is_cat) { function labelSelectOnChange(elem) { try { - var value = elem[elem.selectedIndex].value; +/* var value = elem[elem.selectedIndex].value; var def = elem.getAttribute('default'); if (value == "ADD_LABEL") { @@ -1433,7 +1423,7 @@ function labelSelectOnChange(elem) { exception_error("addLabel", e); } }); - } + } */ } catch (e) { exception_error("labelSelectOnChange", e); diff --git a/functions.php b/functions.php index fe42ea43b..2dcf5d3fc 100644 --- a/functions.php +++ b/functions.php @@ -6794,23 +6794,24 @@ return true; } - function print_label_select($link, $name, $value, $style = "") { + function print_label_select($link, $name, $value, $attributes = "") { $result = db_query($link, "SELECT caption FROM ttrss_labels2 WHERE owner_uid = '".$_SESSION["uid"]."' ORDER BY caption"); print ""; diff --git a/modules/popup-dialog.php b/modules/popup-dialog.php index ad434bd9b..2f339e669 100644 --- a/modules/popup-dialog.php +++ b/modules/popup-dialog.php @@ -451,14 +451,9 @@ $active_feed_id = db_escape_string($_REQUEST["param"]); - print "".__('Create Filter').""; - print ""; - - print ""; - print ""; - print ""; + print ""; + print ""; + print ""; $result = db_query($link, "SELECT id,description FROM ttrss_filter_types ORDER BY description"); @@ -474,33 +469,36 @@ print "
"; - print ""; - print __("Date") . " "; + print ""; $filter_params = array( "before" => __("before"), "after" => __("after")); - print_select_hash("filter_date_modifier", "before", $filter_params); + print_select_hash("filter_date_modifier", "before", + $filter_params, 'dojoType="dijit.form.Select"'); print " "; - print ""; + print ""; - print ""; + print ""; print " "; print ""; - print "
" . __("on field") . " "; + print "
" . __("on field") . " "; print_select_hash("filter_type", 1, $filter_types, - 'onchange="filterDlgCheckType(this)"'); + 'onchange="filterDlgCheckType(this)" dojoType="dijit.form.Select"'); print "
"; print __("in") . " "; - print_feed_select($link, "feed_id", $active_feed_id); + print_feed_select($link, "feed_id", $active_feed_id, + 'dojoType="dijit.form.FilteringSelect"'); print "
"; @@ -508,7 +506,7 @@ print "
"; - print ""; - print ""; + print ""; print " " . __("with parameters:") . " "; - print ""; + print ""; - print_label_select($link, "action_param_label", $action_param); + print_label_select($link, "action_param_label", $action_param, + 'id="filterDlg_actionParamLabel" dojoType="dijit.form.Select"'); print ""; @@ -537,30 +536,23 @@ print "
".__("Options")."
"; print "
"; - print "
"; - - print " + print "
"; - print " + print " "; print "
"; - print "
"; - - print ""; print "
"; - print " "; - print ""; + print ""; - print "]]>"; - -// print ""; + print "
"; //return; } diff --git a/modules/pref-filters.php b/modules/pref-filters.php index 12bfd4397..28f30fa69 100644 --- a/modules/pref-filters.php +++ b/modules/pref-filters.php @@ -103,11 +103,6 @@ $filter_id = db_escape_string($_REQUEST["id"]); - header("Content-Type: text/xml"); - print ""; - print "".__('Filter Editor').""; - print ""; - print ""; - print ""; - print ""; + print ""; + print ""; + print ""; $result = db_query($link, "SELECT id,description FROM ttrss_filter_types ORDER BY description"); @@ -145,7 +140,7 @@ $date_ops_invisible = 'style="display : none"'; } - print ""; + print ""; print __("Date") . " "; $filter_params = array( @@ -153,26 +148,28 @@ "after" => __("after")); print_select_hash("filter_date_modifier", $filter_param, - $filter_params); + $filter_params, 'dojoType="dijit.form.Select"'); print " "; - print ""; + print ""; - print ""; + print ""; print " "; print ""; print "
" . __("on field") . " "; print_select_hash("filter_type", $filter_type, $filter_types, - 'onchange="filterDlgCheckType(this)"'); + 'onchange="filterDlgCheckType(this)" dojoType="dijit.form.Select"'); print "
"; print __("in") . " "; - print_feed_select($link, "feed_id", $feed_id); + print_feed_select($link, "feed_id", $feed_id, + 'dojoType="dijit.form.FilteringSelect"'); print "
"; @@ -180,14 +177,14 @@ print "
"; - print ""; $param_int_hidden = ($action_id == 7) ? "" : "display : none"; print_label_select($link, "action_param_label", $action_param, - $param_int_hidden); + "style=\"$param_int_hidden\"" . + 'id="filterDlg_actionParamLabel" dojoType="dijit.form.Select"'); print ""; @@ -221,21 +219,21 @@ print "
"; if ($enabled) { - $checked = "checked"; + $checked = "checked=\"1\""; } else { $checked = ""; } - print " + print "
"; if ($inverse) { - $checked = "checked"; + $checked = "checked=\"1\""; } else { $checked = ""; } - print " + print " "; print "
"; @@ -250,13 +248,13 @@ __('Remove').""; print "
"; - print " "; - print ""; - print "]]>
"; + print ""; return; } diff --git a/prefs.js b/prefs.js index 2309e29ce..fa4804ff4 100644 --- a/prefs.js +++ b/prefs.js @@ -288,27 +288,31 @@ function editUser(id, event) { } function editFilter(id, event) { - try { - if (!event || !event.ctrlKey) { + var query = "backend.php?op=pref-filters&subop=edit&id=" + param_escape(id); - notify_progress("Loading, please wait...", true); + if (dijit.byId("filterEditDlg")) + dijit.byId("filterEditDlg").destroyRecursive(); + + dialog = new dijit.Dialog({ + id: "filterEditDlg", + title: __("Edit Filter"), + style: "width: 600px", + execute: function() { + if (this.validate()) { + this.hide(); + new Ajax.Request("backend.php", { + parameters: dojo.objectToQuery(this.attr('value')), + onComplete: function(transport) { + updateFilterList(); + }}); + } + }, + href: query}); + + dialog.show(); - var query = "?op=pref-filters&subop=edit&id=" + - param_escape(id); - - new Ajax.Request("backend.php", { - parameters: query, - onComplete: function(transport) { - infobox_callback2(transport); - document.forms['filter_edit_form'].reg_exp.focus(); - } }); - } else if (event.ctrlKey) { - var cb = $('FICHK-' + id); - cb.checked = !cb.checked; - toggleSelectRow(cb); - } } catch (e) { exception_error("editFilter", e); @@ -1099,6 +1103,8 @@ function init() { dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.Dialog"); dojo.require("dijit.form.Button"); + dojo.require("dijit.form.Select"); + dojo.require("dijit.form.FilteringSelect"); dojo.require("dijit.form.TextBox"); dojo.require("dijit.form.ValidationTextBox"); dojo.require("dijit.form.RadioButton"); diff --git a/tt-rss.css b/tt-rss.css index 54eefc6b6..b0733d186 100644 --- a/tt-rss.css +++ b/tt-rss.css @@ -1259,7 +1259,11 @@ div.dlgSecCont { float : left; font-size : 12px; font-weight : normal; - line-height : 200%; +} + +div.dlgSecCont > * { + margin-top : 4px; + vertical-align : bottom; } div.dlgButtons { @@ -1603,3 +1607,8 @@ span.labelFixedLength { display : inline-block; width : 70%; } + +#filter_dlg_date_chk_box { + display : inline-block; +} + diff --git a/tt-rss.js b/tt-rss.js index aa23ea075..5409fe899 100644 --- a/tt-rss.js +++ b/tt-rss.js @@ -276,6 +276,9 @@ function init() { dojo.require("dojo.data.ItemFileWriteStore"); dojo.require("dijit.Tree"); dojo.require("dijit.form.Select"); + dojo.require("dijit.form.TextBox"); + dojo.require("dijit.form.ValidationTextBox"); + dojo.require("dijit.form.FilteringSelect"); dojo.require("dijit.Toolbar"); dojo.require("dijit.ProgressBar"); dojo.require("dijit.Menu"); -- cgit v1.2.3