first for filter frontend overhaul
This commit is contained in:
Andrew Dolgov
parent
d6de021ae6
commit
be91355c20
|
|
@ -861,7 +861,7 @@ class Pref_Filters extends Handler_Protected {
|
|||
print "<section>";
|
||||
|
||||
print "<select name='action_id' dojoType='fox.form.Select'
|
||||
onchange='Filters.filterDlgCheckAction(this)'>";
|
||||
onchange='Filters.hideOrShowActionParam(this)'>";
|
||||
|
||||
$res = $this->pdo->query("SELECT id,description FROM ttrss_filter_actions
|
||||
ORDER BY name");
|
||||
|
|
|
|||
|
|
@ -5,224 +5,7 @@
|
|||
/* global __, App, Article, Lists, fox */
|
||||
/* global xhr, dojo, dijit, Notify, Feeds */
|
||||
|
||||
const Filters = {
|
||||
filterDlgCheckAction: function(sender) {
|
||||
const action = sender.value;
|
||||
|
||||
const action_param = App.byId("filterDlg_paramBox");
|
||||
|
||||
if (!action_param) {
|
||||
console.log("filterDlgCheckAction: can't find action param box!");
|
||||
return;
|
||||
}
|
||||
|
||||
// if selected action supports parameters, enable params field
|
||||
if (action == 4 || action == 6 || action == 7 || action == 9) {
|
||||
Element.show(action_param);
|
||||
|
||||
Element.hide(dijit.byId("filterDlg_actionParam").domNode);
|
||||
Element.hide(dijit.byId("filterDlg_actionParamLabel").domNode);
|
||||
Element.hide(dijit.byId("filterDlg_actionParamPlugin").domNode);
|
||||
|
||||
if (action == 7) {
|
||||
Element.show(dijit.byId("filterDlg_actionParamLabel").domNode);
|
||||
} else if (action == 9) {
|
||||
Element.show(dijit.byId("filterDlg_actionParamPlugin").domNode);
|
||||
} else {
|
||||
Element.show(dijit.byId("filterDlg_actionParam").domNode);
|
||||
}
|
||||
|
||||
} else {
|
||||
Element.hide(action_param);
|
||||
}
|
||||
},
|
||||
createNewRuleElement: 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.innerHTML = `<input dojoType='dijit.form.CheckBox' type='checkbox' onclick='Lists.onRowChecked(this)'>
|
||||
<span onclick='App.dialogOf(this).editRule(this)'>${reply}</span>
|
||||
${App.FormFields.hidden_tag("rule[]", rule)}`;
|
||||
|
||||
dojo.parser.parse(li);
|
||||
|
||||
if (replaceNode) {
|
||||
parentNode.replaceChild(li, replaceNode);
|
||||
} else {
|
||||
parentNode.appendChild(li);
|
||||
}
|
||||
} catch (e) {
|
||||
App.Error.report(e);
|
||||
}
|
||||
});
|
||||
},
|
||||
createNewActionElement: function(parentNode, replaceNode) {
|
||||
const form = document.forms["filter_new_action_form"];
|
||||
|
||||
if (form.action_id.value == 7) {
|
||||
form.action_param.value = form.action_param_label.value;
|
||||
} else if (form.action_id.value == 9) {
|
||||
form.action_param.value = form.action_param_plugin.value;
|
||||
}
|
||||
|
||||
const action = dojo.formToJson(form);
|
||||
|
||||
xhr.post("backend.php", { op: "pref-filters", method: "printactionname", action: action }, (reply) => {
|
||||
try {
|
||||
const li = document.createElement('li');
|
||||
|
||||
li.innerHTML = `<input dojoType='dijit.form.CheckBox' type='checkbox' onclick='Lists.onRowChecked(this)'>
|
||||
<span onclick='App.dialogOf(this).editAction(this)'>${reply}</span>
|
||||
${App.FormFields.hidden_tag("action[]", action)}`;
|
||||
|
||||
dojo.parser.parse(li);
|
||||
|
||||
if (replaceNode) {
|
||||
parentNode.replaceChild(li, replaceNode);
|
||||
} else {
|
||||
parentNode.appendChild(li);
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
App.Error.report(e);
|
||||
}
|
||||
});
|
||||
},
|
||||
addFilterRule: function(replaceNode, ruleStr) {
|
||||
const dialog = new fox.SingleUseDialog({
|
||||
id: "filterNewRuleDlg",
|
||||
title: ruleStr ? __("Edit rule") : __("Add rule"),
|
||||
execute: function () {
|
||||
if (this.validate()) {
|
||||
Filters.createNewRuleElement(App.byId("filterDlg_Matches"), replaceNode);
|
||||
this.hide();
|
||||
}
|
||||
},
|
||||
content: __('Loading, please wait...'),
|
||||
});
|
||||
|
||||
const tmph = dojo.connect(dialog, "onShow", null, function (/* e */) {
|
||||
dojo.disconnect(tmph);
|
||||
|
||||
xhr.post("backend.php", {op: 'pref-filters', method: 'newrule', rule: ruleStr}, (reply) => {
|
||||
dialog.attr('content', reply);
|
||||
});
|
||||
});
|
||||
|
||||
dialog.show();
|
||||
},
|
||||
addFilterAction: function(replaceNode, actionStr) {
|
||||
const dialog = new fox.SingleUseDialog({
|
||||
title: actionStr ? __("Edit action") : __("Add action"),
|
||||
execute: function () {
|
||||
if (this.validate()) {
|
||||
Filters.createNewActionElement(App.byId("filterDlg_Actions"), replaceNode);
|
||||
this.hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const tmph = dojo.connect(dialog, "onShow", null, function (/* e */) {
|
||||
dojo.disconnect(tmph);
|
||||
|
||||
xhr.post("backend.php", {op: 'pref-filters', method: 'newaction', action: actionStr}, (reply) => {
|
||||
dialog.attr('content', reply);
|
||||
});
|
||||
});
|
||||
|
||||
dialog.show();
|
||||
},
|
||||
test: function(params) {
|
||||
|
||||
const dialog = new fox.SingleUseDialog({
|
||||
title: "Test Filter",
|
||||
results: 0,
|
||||
limit: 100,
|
||||
max_offset: 10000,
|
||||
getTestResults: function (params, offset) {
|
||||
params.method = 'testFilterDo';
|
||||
params.offset = offset;
|
||||
params.limit = dialog.limit;
|
||||
|
||||
console.log("getTestResults:" + offset);
|
||||
|
||||
xhr.json("backend.php", params, (result) => {
|
||||
try {
|
||||
if (result && dialog && dialog.open) {
|
||||
dialog.results += result.length;
|
||||
|
||||
console.log("got results:" + result.length);
|
||||
|
||||
App.byId("prefFilterProgressMsg").innerHTML = __("Looking for articles (%d processed, %f found)...")
|
||||
.replace("%f", dialog.results)
|
||||
.replace("%d", offset);
|
||||
|
||||
console.log(offset + " " + dialog.max_offset);
|
||||
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
const tmp = dojo.create("table", { innerHTML: result[i]});
|
||||
|
||||
App.byId("prefFilterTestResultList").innerHTML += tmp.innerHTML;
|
||||
}
|
||||
|
||||
if (dialog.results < 30 && offset < dialog.max_offset) {
|
||||
|
||||
// get the next batch
|
||||
window.setTimeout(function () {
|
||||
dialog.getTestResults(params, offset + dialog.limit);
|
||||
}, 0);
|
||||
|
||||
} else {
|
||||
// all done
|
||||
|
||||
Element.hide("prefFilterLoadingIndicator");
|
||||
|
||||
if (dialog.results == 0) {
|
||||
App.byId("prefFilterTestResultList").innerHTML = `<tr><td align='center'>
|
||||
${__('No recent articles matching this filter have been found.')}</td></tr>`;
|
||||
App.byId("prefFilterProgressMsg").innerHTML = "Articles matching this filter:";
|
||||
} else {
|
||||
App.byId("prefFilterProgressMsg").innerHTML = __("Found %d articles matching this filter:")
|
||||
.replace("%d", dialog.results);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else if (!result) {
|
||||
console.log("getTestResults: can't parse results object");
|
||||
Element.hide("prefFilterLoadingIndicator");
|
||||
Notify.error("Error while trying to get filter test results.");
|
||||
} else {
|
||||
console.log("getTestResults: dialog closed, bailing out.");
|
||||
}
|
||||
} catch (e) {
|
||||
App.Error.report(e);
|
||||
}
|
||||
});
|
||||
},
|
||||
content: `
|
||||
<div>
|
||||
<img id='prefFilterLoadingIndicator' src='images/indicator_tiny.gif'>
|
||||
<span id='prefFilterProgressMsg'>Looking for articles...</span>
|
||||
</div>
|
||||
|
||||
<ul class='panel panel-scrollable list list-unstyled' id='prefFilterTestResultList'></ul>
|
||||
|
||||
<footer class='text-center'>
|
||||
<button dojoType='dijit.form.Button' type='submit' class='alt-primary'>${__('Close this window')}</button>
|
||||
</footer>
|
||||
`
|
||||
});
|
||||
|
||||
dojo.connect(dialog, "onShow", null, function (/* e */) {
|
||||
dialog.getTestResults(params, 0);
|
||||
});
|
||||
|
||||
dialog.show();
|
||||
},
|
||||
const Filters = {
|
||||
edit: function(id) { // if no id, new filter dialog
|
||||
let query;
|
||||
|
||||
|
|
@ -235,15 +18,228 @@ const Filters = {
|
|||
query = {op: "pref-filters", method: "edit", id: id};
|
||||
}
|
||||
|
||||
console.log('Filters.edit', query);
|
||||
|
||||
xhr.post("backend.php", query, function (reply) {
|
||||
try {
|
||||
const dialog = new fox.SingleUseDialog({
|
||||
id: "filterEditDlg",
|
||||
title: id ? __("Edit Filter") : __("Create Filter"),
|
||||
test: function () {
|
||||
Filters.test(this.attr('value'));
|
||||
test: function() {
|
||||
const test_dialog = new fox.SingleUseDialog({
|
||||
title: "Test Filter",
|
||||
results: 0,
|
||||
limit: 100,
|
||||
max_offset: 10000,
|
||||
getTestResults: function (params, offset) {
|
||||
params.method = 'testFilterDo';
|
||||
params.offset = offset;
|
||||
params.limit = test_dialog.limit;
|
||||
|
||||
console.log("getTestResults:" + offset);
|
||||
|
||||
xhr.json("backend.php", params, (result) => {
|
||||
try {
|
||||
if (result && test_dialog && test_dialog.open) {
|
||||
test_dialog.results += result.length;
|
||||
|
||||
console.log("got results:" + result.length);
|
||||
|
||||
App.byId("prefFilterProgressMsg").innerHTML = __("Looking for articles (%d processed, %f found)...")
|
||||
.replace("%f", test_dialog.results)
|
||||
.replace("%d", offset);
|
||||
|
||||
console.log(offset + " " + test_dialog.max_offset);
|
||||
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
const tmp = dojo.create("table", { innerHTML: result[i]});
|
||||
|
||||
App.byId("prefFilterTestResultList").innerHTML += tmp.innerHTML;
|
||||
}
|
||||
|
||||
if (test_dialog.results < 30 && offset < test_dialog.max_offset) {
|
||||
|
||||
// get the next batch
|
||||
window.setTimeout(function () {
|
||||
test_dialog.getTestResults(params, offset + test_dialog.limit);
|
||||
}, 0);
|
||||
|
||||
} else {
|
||||
// all done
|
||||
|
||||
Element.hide("prefFilterLoadingIndicator");
|
||||
|
||||
if (test_dialog.results == 0) {
|
||||
App.byId("prefFilterTestResultList").innerHTML = `<tr><td align='center'>
|
||||
${__('No recent articles matching this filter have been found.')}</td></tr>`;
|
||||
App.byId("prefFilterProgressMsg").innerHTML = "Articles matching this filter:";
|
||||
} else {
|
||||
App.byId("prefFilterProgressMsg").innerHTML = __("Found %d articles matching this filter:")
|
||||
.replace("%d", test_dialog.results);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else if (!result) {
|
||||
console.log("getTestResults: can't parse results object");
|
||||
Element.hide("prefFilterLoadingIndicator");
|
||||
Notify.error("Error while trying to get filter test results.");
|
||||
} else {
|
||||
console.log("getTestResults: dialog closed, bailing out.");
|
||||
}
|
||||
} catch (e) {
|
||||
App.Error.report(e);
|
||||
}
|
||||
});
|
||||
},
|
||||
content: `
|
||||
<div>
|
||||
<img id='prefFilterLoadingIndicator' src='images/indicator_tiny.gif'>
|
||||
<span id='prefFilterProgressMsg'>Looking for articles...</span>
|
||||
</div>
|
||||
|
||||
<ul class='panel panel-scrollable list list-unstyled' id='prefFilterTestResultList'></ul>
|
||||
|
||||
<footer class='text-center'>
|
||||
<button dojoType='dijit.form.Button' type='submit' class='alt-primary'>${__('Close this window')}</button>
|
||||
</footer>
|
||||
`
|
||||
});
|
||||
|
||||
const tmph = dojo.connect(test_dialog, "onShow", null, function (/* e */) {
|
||||
dojo.disconnect(tmph);
|
||||
|
||||
test_dialog.getTestResults(dialog.attr('value'), 0);
|
||||
});
|
||||
|
||||
test_dialog.show();
|
||||
},
|
||||
hideOrShowActionParam: function(sender) {
|
||||
const action = sender.value;
|
||||
|
||||
const action_param = App.byId("filterDlg_paramBox");
|
||||
|
||||
if (!action_param) {
|
||||
console.log("hideOrShowActionParam: can't find action param box!");
|
||||
return;
|
||||
}
|
||||
|
||||
// if selected action supports parameters, enable params field
|
||||
if (action == 4 || action == 6 || action == 7 || action == 9) {
|
||||
Element.show(action_param);
|
||||
|
||||
Element.hide(dijit.byId("filterDlg_actionParam").domNode);
|
||||
Element.hide(dijit.byId("filterDlg_actionParamLabel").domNode);
|
||||
Element.hide(dijit.byId("filterDlg_actionParamPlugin").domNode);
|
||||
|
||||
if (action == 7) {
|
||||
Element.show(dijit.byId("filterDlg_actionParamLabel").domNode);
|
||||
} else if (action == 9) {
|
||||
Element.show(dijit.byId("filterDlg_actionParamPlugin").domNode);
|
||||
} else {
|
||||
Element.show(dijit.byId("filterDlg_actionParam").domNode);
|
||||
}
|
||||
|
||||
} else {
|
||||
Element.hide(action_param);
|
||||
}
|
||||
},
|
||||
createNewRuleElement: 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.innerHTML = `<input dojoType='dijit.form.CheckBox' type='checkbox' onclick='Lists.onRowChecked(this)'>
|
||||
<span onclick='App.dialogOf(this).editRule(this)'>${reply}</span>
|
||||
${App.FormFields.hidden_tag("rule[]", rule)}`;
|
||||
|
||||
dojo.parser.parse(li);
|
||||
|
||||
if (replaceNode) {
|
||||
parentNode.replaceChild(li, replaceNode);
|
||||
} else {
|
||||
parentNode.appendChild(li);
|
||||
}
|
||||
} catch (e) {
|
||||
App.Error.report(e);
|
||||
}
|
||||
});
|
||||
},
|
||||
createNewActionElement: function(parentNode, replaceNode) {
|
||||
const form = document.forms["filter_new_action_form"];
|
||||
|
||||
if (form.action_id.value == 7) {
|
||||
form.action_param.value = form.action_param_label.value;
|
||||
} else if (form.action_id.value == 9) {
|
||||
form.action_param.value = form.action_param_plugin.value;
|
||||
}
|
||||
|
||||
const action = dojo.formToJson(form);
|
||||
|
||||
xhr.post("backend.php", { op: "pref-filters", method: "printactionname", action: action }, (reply) => {
|
||||
try {
|
||||
const li = document.createElement('li');
|
||||
|
||||
li.innerHTML = `<input dojoType='dijit.form.CheckBox' type='checkbox' onclick='Lists.onRowChecked(this)'>
|
||||
<span onclick='App.dialogOf(this).editAction(this)'>${reply}</span>
|
||||
${App.FormFields.hidden_tag("action[]", action)}`;
|
||||
|
||||
dojo.parser.parse(li);
|
||||
|
||||
if (replaceNode) {
|
||||
parentNode.replaceChild(li, replaceNode);
|
||||
} else {
|
||||
parentNode.appendChild(li);
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
App.Error.report(e);
|
||||
}
|
||||
});
|
||||
},
|
||||
addFilterRule: function(replaceNode, ruleStr) {
|
||||
const add_dialog = new fox.SingleUseDialog({
|
||||
id: "filterNewRuleDlg",
|
||||
title: ruleStr ? __("Edit rule") : __("Add rule"),
|
||||
execute: function () {
|
||||
if (this.validate()) {
|
||||
dialog.createNewRuleElement(App.byId("filterDlg_Matches"), replaceNode);
|
||||
this.hide();
|
||||
}
|
||||
},
|
||||
content: __('Loading, please wait...'),
|
||||
});
|
||||
|
||||
const tmph = dojo.connect(add_dialog, "onShow", null, function (/* e */) {
|
||||
dojo.disconnect(tmph);
|
||||
|
||||
xhr.post("backend.php", {op: 'pref-filters', method: 'newrule', rule: ruleStr}, (reply) => {
|
||||
add_dialog.attr('content', reply);
|
||||
});
|
||||
});
|
||||
|
||||
add_dialog.show();
|
||||
},
|
||||
addFilterAction: function(replaceNode, actionStr) {
|
||||
const add_dialog = new fox.SingleUseDialog({
|
||||
title: actionStr ? __("Edit action") : __("Add action"),
|
||||
execute: function () {
|
||||
if (this.validate()) {
|
||||
dialog.createNewActionElement(App.byId("filterDlg_Actions"), replaceNode);
|
||||
this.hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const tmph = dojo.connect(add_dialog, "onShow", null, function (/* e */) {
|
||||
dojo.disconnect(tmph);
|
||||
|
||||
xhr.post("backend.php", {op: 'pref-filters', method: 'newaction', action: actionStr}, (reply) => {
|
||||
add_dialog.attr('content', reply);
|
||||
});
|
||||
});
|
||||
|
||||
add_dialog.show();
|
||||
},
|
||||
selectRules: function (select) {
|
||||
Lists.select("filterDlg_Matches", select);
|
||||
|
|
@ -255,13 +251,13 @@ const Filters = {
|
|||
const li = e.closest('li');
|
||||
const rule = li.querySelector('input[name="rule[]"]').value
|
||||
|
||||
Filters.addFilterRule(li, rule);
|
||||
this.addFilterRule(li, rule);
|
||||
},
|
||||
editAction: function (e) {
|
||||
const li = e.closest('li');
|
||||
const action = li.querySelector('input[name="action[]"]').value
|
||||
|
||||
Filters.addFilterAction(li, action);
|
||||
this.addFilterAction(li, action);
|
||||
},
|
||||
removeFilter: function () {
|
||||
const msg = __("Remove filter?");
|
||||
|
|
@ -281,10 +277,10 @@ const Filters = {
|
|||
}
|
||||
},
|
||||
addAction: function () {
|
||||
Filters.addFilterAction();
|
||||
this.addFilterAction();
|
||||
},
|
||||
addRule: function () {
|
||||
Filters.addFilterRule();
|
||||
this.addFilterRule();
|
||||
},
|
||||
deleteAction: function () {
|
||||
App.findAll("#filterDlg_Actions li[class*=Selected]").forEach(function (e) {
|
||||
|
|
@ -326,7 +322,7 @@ const Filters = {
|
|||
|
||||
const rule = {reg_exp: selectedText, feed_id: [feed_id], filter_type: 1};
|
||||
|
||||
Filters.addFilterRule(null, dojo.toJson(rule));
|
||||
dialog.addFilterRule(null, dojo.toJson(rule));
|
||||
|
||||
} else {
|
||||
|
||||
|
|
@ -346,7 +342,7 @@ const Filters = {
|
|||
|
||||
const rule = {reg_exp: title, feed_id: [feed_id], filter_type: 1};
|
||||
|
||||
Filters.addFilterRule(null, dojo.toJson(rule));
|
||||
dialog.addFilterRule(null, dojo.toJson(rule));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue