* add actions dropdown to toggle combined mode

* hide 'toggle widescreen' menu item when in combined mode
 * unify some mode toggling code in App
This commit is contained in:
Andrew Dolgov 2022-02-24 21:07:53 +03:00
parent bd0af3ae9e
commit 806b46d0c4
2 changed files with 45 additions and 35 deletions

View File

@ -238,6 +238,13 @@
<div dojoType="fox.form.DropDownButton" class="action-button" title="<?= __('Actions...') ?>"> <div dojoType="fox.form.DropDownButton" class="action-button" title="<?= __('Actions...') ?>">
<span><i class="material-icons">menu</i></span> <span><i class="material-icons">menu</i></span>
<div dojoType="dijit.Menu" style="display: none"> <div dojoType="dijit.Menu" style="display: none">
<script type='dojo/method' event='onOpen' args='evt,a,b,c'>
const ws = this.getChildren().find((m) => m.id == 'qmcToggleWidescreen');
if (ws)
ws.attr('hidden', !!App.isCombinedMode());
</script>
<div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcPrefs')"><?= __('Preferences...') ?></div> <div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcPrefs')"><?= __('Preferences...') ?></div>
<div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcSearch')"><?= __('Search...') ?></div> <div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcSearch')"><?= __('Search...') ?></div>
<div dojoType="dijit.MenuItem" disabled="1"><?= __('Feed actions:') ?></div> <div dojoType="dijit.MenuItem" disabled="1"><?= __('Feed actions:') ?></div>
@ -248,7 +255,9 @@
<div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcCatchupAll')"><?= __('Mark as read') ?></div> <div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcCatchupAll')"><?= __('Mark as read') ?></div>
<div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcShowOnlyUnread')"><?= __('(Un)hide read feeds') ?></div> <div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcShowOnlyUnread')"><?= __('(Un)hide read feeds') ?></div>
<div dojoType="dijit.MenuItem" disabled="1"><?= __('Other actions:') ?></div> <div dojoType="dijit.MenuItem" disabled="1"><?= __('Other actions:') ?></div>
<div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcToggleWidescreen')"><?= __('Toggle widescreen mode') ?></div> <div dojoType="dijit.MenuItem" id="qmcToggleWidescreen" onclick="App.onActionSelected('qmcToggleWidescreen')">
<?= __('Toggle widescreen mode') ?></div>
<div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcToggleCombined')"><?= __('Toggle combined mode') ?></div>
<div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcHKhelp')"><?= __('Keyboard shortcuts help') ?></div> <div dojoType="dijit.MenuItem" onclick="App.onActionSelected('qmcHKhelp')"><?= __('Keyboard shortcuts help') ?></div>
<?php <?php

View File

@ -286,7 +286,18 @@ const App = {
}, },
isCombinedMode: function() { isCombinedMode: function() {
return this.getInitParam("combined_display_mode"); return !!this.getInitParam("combined_display_mode");
},
setCombinedMode: function(combined) {
const value = combined ? "true" : "false";
xhr.post("backend.php", {op: "rpc", method: "setpref", key: "COMBINED_DISPLAY_MODE", value: value}, () => {
this.setInitParam("combined_display_mode",
!this.getInitParam("combined_display_mode"));
Article.close();
Headlines.renderAgain();
})
}, },
getActionByHotkeySequence: function(sequence) { getActionByHotkeySequence: function(sequence) {
const hotkeys_map = this.getInitParam("hotkeys"); const hotkeys_map = this.getInitParam("hotkeys");
@ -797,7 +808,7 @@ const App = {
this.setLoadingProgress(50); this.setLoadingProgress(50);
this._widescreen_mode = this.getInitParam("widescreen"); this._widescreen_mode = this.getInitParam("widescreen");
this.setWidescreen(this._widescreen_mode); this.setWideScreenMode(this.isWideScreenMode(), true);
Headlines.initScrollHandler(); Headlines.initScrollHandler();
@ -882,7 +893,22 @@ const App = {
} }
} }
}, },
setWidescreen: function(wide) { isWideScreenMode: function() {
return !!this._widescreen_mode;
},
setWideScreenMode: function(wide, quiet = false) {
if (this.isCombinedMode() && !quiet) {
alert(__("Widescreen is not available in combined mode."));
return;
}
// reset stored sizes because geometry changed
Cookie.set("ttrss_ci_width", 0);
Cookie.set("ttrss_ci_height", 0);
this._widescreen_mode = wide;
const article_id = Article.getActive(); const article_id = Article.getActive();
const headlines_frame = App.byId("headlines-frame"); const headlines_frame = App.byId("headlines-frame");
const content_insert = dijit.byId("content-insert"); const content_insert = dijit.byId("content-insert");
@ -1201,31 +1227,13 @@ const App = {
} }
}; };
this.hotkey_actions["toggle_widescreen"] = () => { this.hotkey_actions["toggle_widescreen"] = () => {
if (!this.isCombinedMode()) { this.setWideScreenMode(!this.isWideScreenMode());
this._widescreen_mode = !this._widescreen_mode;
// reset stored sizes because geometry changed
Cookie.set("ttrss_ci_width", 0);
Cookie.set("ttrss_ci_height", 0);
this.setWidescreen(this._widescreen_mode);
} else {
alert(__("Widescreen is not available in combined mode."));
}
}; };
this.hotkey_actions["help_dialog"] = () => { this.hotkey_actions["help_dialog"] = () => {
this.hotkeyHelp(); this.hotkeyHelp();
}; };
this.hotkey_actions["toggle_combined_mode"] = () => { this.hotkey_actions["toggle_combined_mode"] = () => {
const value = this.isCombinedMode() ? "false" : "true"; App.setCombinedMode(!App.isCombinedMode());
xhr.post("backend.php", {op: "rpc", method: "setpref", key: "COMBINED_DISPLAY_MODE", value: value}, () => {
this.setInitParam("combined_display_mode",
!this.getInitParam("combined_display_mode"));
Article.close();
Headlines.renderAgain();
})
}; };
this.hotkey_actions["toggle_cdm_expanded"] = () => { this.hotkey_actions["toggle_cdm_expanded"] = () => {
const value = this.getInitParam("cdm_expanded") ? "false" : "true"; const value = this.getInitParam("cdm_expanded") ? "false" : "true";
@ -1294,17 +1302,10 @@ const App = {
Feeds.toggleUnread(); Feeds.toggleUnread();
break; break;
case "qmcToggleWidescreen": case "qmcToggleWidescreen":
if (!this.isCombinedMode()) { App.setWideScreenMode(!App.isWideScreenMode());
this._widescreen_mode = !this._widescreen_mode; break;
case "qmcToggleCombined":
// reset stored sizes because geometry changed App.setCombinedMode(!App.isCombinedMode());
Cookie.set("ttrss_ci_width", 0);
Cookie.set("ttrss_ci_height", 0);
this.setWidescreen(this._widescreen_mode);
} else {
alert(__("Widescreen is not available in combined mode."));
}
break; break;
case "qmcHKhelp": case "qmcHKhelp":
this.hotkeyHelp() this.hotkeyHelp()