From 94560132ddf45a5a7c68ce520b40ecb10a6f89fe Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Sun, 21 Feb 2021 09:35:07 +0300 Subject: for the most part, deal with filter rules UI --- js/CommonFilters.js | 294 +++++++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 256 insertions(+), 38 deletions(-) (limited to 'js/CommonFilters.js') diff --git a/js/CommonFilters.js b/js/CommonFilters.js index bd6808f59..75e1fa8af 100644 --- a/js/CommonFilters.js +++ b/js/CommonFilters.js @@ -7,26 +7,17 @@ /* exported Filters */ const Filters = { - edit: function(id) { // if no id, new filter dialog - let query; - - if (!App.isPrefs()) { - query = { - op: "pref-filters", method: "edit", - feed: Feeds.getActive(), is_cat: Feeds.activeIsCat() - }; - } else { - query = {op: "pref-filters", method: "edit", id: id}; - } + edit: function(filter_id = null) { // if no id, new filter dialog const dialog = new fox.SingleUseDialog({ id: "filterEditDlg", - title: id ? __("Edit Filter") : __("Create Filter"), + title: filter_id ? __("Edit Filter") : __("Create Filter"), ACTION_TAG: 4, ACTION_SCORE: 6, ACTION_LABEL: 7, ACTION_PLUGIN: 9, PARAM_ACTIONS: [4, 6, 7, 9], + filter_info: {}, test: function() { const test_dialog = new fox.SingleUseDialog({ title: "Test Filter", @@ -116,16 +107,17 @@ const Filters = { test_dialog.show(); }, - createNewRuleElement: function(parentNode, replaceNode) { + insertRule: function(parentNode, replaceNode) { const rule = dojo.formToJson("filter_new_rule_form"); xhr.post("backend.php", {op: "pref-filters", method: "printrulename", rule: rule}, (reply) => { try { const li = document.createElement('li'); + li.addClassName("rule"); - li.innerHTML = ` - ${reply} - ${App.FormFields.hidden_tag("rule[]", rule)}`; + li.innerHTML = `${App.FormFields.checkbox_tag("", false, {onclick: 'Lists.onRowChecked(this)'})} + ${reply} + ${App.FormFields.hidden_tag("rule[]", rule)}`; dojo.parser.parse(li); @@ -139,7 +131,7 @@ const Filters = { } }); }, - createNewActionElement: function(parentNode, replaceNode) { + insertAction: function(parentNode, replaceNode) { const form = document.forms["filter_new_action_form"]; if (form.action_id.value == 7) { @@ -153,10 +145,11 @@ const Filters = { xhr.post("backend.php", { op: "pref-filters", method: "printactionname", action: action }, (reply) => { try { const li = document.createElement('li'); + li.addClassName("action"); - li.innerHTML = ` - ${reply} - ${App.FormFields.hidden_tag("action[]", action)}`; + li.innerHTML = `${App.FormFields.checkbox_tag("", false, {onclick: 'Lists.onRowChecked(this)'})} + ${reply} + ${App.FormFields.hidden_tag("action[]", action)}`; dojo.parser.parse(li); @@ -171,30 +164,84 @@ const Filters = { } }); }, - editRule: function(replaceNode, ruleStr) { + editRule: function(replaceNode, ruleStr = null) { const edit_rule_dialog = new fox.SingleUseDialog({ id: "filterNewRuleDlg", title: ruleStr ? __("Edit rule") : __("Add rule"), execute: function () { if (this.validate()) { - dialog.createNewRuleElement(App.byId("filterDlg_Matches"), replaceNode); + dialog.insertRule(App.byId("filterDlg_Matches"), replaceNode); this.hide(); } }, content: __('Loading, please wait...'), }); - const tmph = dojo.connect(edit_rule_dialog, "onShow", null, function (/* e */) { + const tmph = dojo.connect(edit_rule_dialog, "onShow", null, function () { dojo.disconnect(tmph); - xhr.post("backend.php", {op: 'pref-filters', method: 'newrule', rule: ruleStr}, (reply) => { - edit_rule_dialog.attr('content', reply); + let rule; + + if (ruleStr) { + rule = JSON.parse(ruleStr); + } else { + rule = { + reg_exp: "", + filter_type: 1, + feed_id: ["0"], + inverse: false, + }; + } + + console.log(rule, dialog.filter_info); + + xhr.json("backend.php", {op: "pref-filters", method: "editrule", ids: rule.feed_id.join(",")}, function (editrule) { + edit_rule_dialog.attr('content', + ` +
+ +
+ + +
+ +
+ +
+
+ + ${App.FormFields.select_hash("filter_type", rule.filter_type, dialog.filter_info.filter_types)} + +
+
+ + ${editrule.multiselect} + +
+
+ +
+ ${App.FormFields.button_tag(App.FormFields.icon("help") + " " + __("More info"), "", {class: 'pull-left alt-info', + onclick: "window.open('https://tt-rss.org/wiki/ContentFilters')"})} + ${App.FormFields.submit_tag(__("Save rule"), {onclick: "App.dialogOf(this).execute()"})} + ${App.FormFields.cancel_dialog_tag(__("Cancel"))} +
+ +
+ `); }); + }); edit_rule_dialog.show(); }, - editAction: function(replaceNode, actionStr) { + /*editAction: function(replaceNode, actionStr) { const edit_action_dialog = new fox.SingleUseDialog({ title: actionStr ? __("Edit action") : __("Add action"), hideOrShowActionParam: function(sender) { @@ -221,7 +268,7 @@ const Filters = { } }); - const tmph = dojo.connect(edit_action_dialog, "onShow", null, function (/* e */) { + const tmph = dojo.connect(edit_action_dialog, "onShow", null, function () { dojo.disconnect(tmph); xhr.post("backend.php", {op: 'pref-filters', method: 'newaction', action: actionStr}, (reply) => { @@ -234,22 +281,65 @@ const Filters = { }); edit_action_dialog.show(); - }, + }, */ + /*editAction: function(replaceNode, actionStr) { + const edit_action_dialog = new fox.SingleUseDialog({ + title: actionStr ? __("Edit action") : __("Add action"), + hideOrShowActionParam: function(sender) { + const action = parseInt(sender.value); + + dijit.byId("filterDlg_actionParam").domNode.hide(); + dijit.byId("filterDlg_actionParamLabel").domNode.hide(); + dijit.byId("filterDlg_actionParamPlugin").domNode.hide(); + + // if selected action supports parameters, enable params field + if (action == dialog.ACTION_LABEL) { + dijit.byId("filterDlg_actionParamLabel").domNode.show(); + } else if (action == dialog.ACTION_PLUGIN) { + dijit.byId("filterDlg_actionParamPlugin").domNode.show(); + } else if (dialog.PARAM_ACTIONS.indexOf(action) != -1) { + dijit.byId("filterDlg_actionParam").domNode.show(); + } + }, + execute: function () { + if (this.validate()) { + dialog.createNewActionElement(App.byId("filterDlg_Actions"), replaceNode); + this.hide(); + } + } + }); + + const tmph = dojo.connect(edit_action_dialog, "onShow", null, function () { + dojo.disconnect(tmph); + + xhr.post("backend.php", {op: 'pref-filters', method: 'newaction', action: actionStr}, (reply) => { + edit_action_dialog.attr('content', reply); + + setTimeout(() => { + edit_action_dialog.hideOrShowActionParam(dijit.byId("filterDlg_actionSelect").attr('value')); + }, 250); + }); + }); + + edit_action_dialog.show(); + },*/ selectRules: function (select) { Lists.select("filterDlg_Matches", select); }, selectActions: function (select) { Lists.select("filterDlg_Actions", select); }, - onRuleClicked: function (e) { - const li = e.closest('li'); - const rule = li.querySelector('input[name="rule[]"]').value + onRuleClicked: function (elem) { + + const li = elem.closest('li'); + const rule = li.querySelector('input[name="rule[]"]').value; this.editRule(li, rule); }, - onActionClicked: function (e) { - const li = e.closest('li'); - const action = li.querySelector('input[name="action[]"]').value + onActionClicked: function (elem) { + + const li = elem.closest('li'); + const action = li.querySelector('input[name="action[]"]').value; this.editAction(li, action); }, @@ -302,13 +392,141 @@ const Filters = { content: __("Loading, please wait...") }); - - const tmph = dojo.connect(dialog, 'onShow', function () { dojo.disconnect(tmph); - xhr.post("backend.php", query, function (reply) { - dialog.attr('content', reply); + const query = {op: "pref-filters", method: "edit", id: filter_id}; + + /*if (!App.isPrefs()) { + query = { + op: "pref-filters", method: "edit", + feed: Feeds.getActive(), is_cat: Feeds.activeIsCat() + }; + } else { + query = {op: "pref-filters", method: "edit", id: id}; + }*/ + + xhr.json("backend.php", query, function (filter) { + + dialog.filter_info = filter; + + const options = { + enabled: [ filter.enabled, __('Enabled') ], + match_any_rule: [ filter.match_any_rule, __('Match any rule') ], + inverse: [ filter.inverse, __('Inverse matching') ], + }; + + dialog.attr('content', + ` +
+ + ${App.FormFields.hidden_tag("op", "pref-filters")} + ${App.FormFields.hidden_tag("id", filter_id)} + ${App.FormFields.hidden_tag("method", filter_id ? "editSave" : "add")} + ${App.FormFields.hidden_tag("csrf_token", App.getInitParam('csrf_token'))} + +
+ +
+ +
+
+
+
+
+ ${__("Select")} +
+ +
${__("All")}
+
${__("None")}
+
+
+ + +
+
+
    + ${filter.rules.map((rule) => ` +
  • + ${App.FormFields.checkbox_tag("", false, "", {onclick: 'Lists.onRowChecked(this)'})} + ${rule.name} + ${App.FormFields.hidden_tag("rule[]", JSON.stringify(rule))} +
    • + `).join("")} +
+
+
+
+
+
+
+
+ ${__("Select")} +
+
${__("All")}
+
${__("None")}
+
+
+ + +
+
+
    + ${filter.actions.map((action) => ` +
  • + ${App.FormFields.checkbox_tag("", false, "", {onclick: 'Lists.onRowChecked(this)'})} + ${App.escapeHtml(action.name)} + ${App.FormFields.hidden_tag("action[]", JSON.stringify(action))} +
    • + `).join("")} +
+
+
+
+
+ +
+ +
+ ${Object.keys(options).map((name) => + ` +
+ +
+ `).join("")} +
+ + +
+ `); if (!App.isPrefs()) { const selectedText = App.getSelectedText(); -- cgit v1.2.3