moved auto read only options to code/text tabs

This commit is contained in:
zadam 2022-11-18 21:27:25 +01:00
parent 6f238f5f1a
commit ae0c5a0c09
5 changed files with 63 additions and 51 deletions

View File

@ -57,4 +57,3 @@ app.on('will-quit', () => {
process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = 'true';
require('./src/www');
const options = require("./src/public/app/services/options.js");

View File

@ -4,23 +4,40 @@ import server from "../../../services/server.js";
import toastService from "../../../services/toast.js";
const TPL = `
<h4>Use vim keybindings in code notes (no ex mode)</h4>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="vim-keymap-enabled">
<label class="custom-control-label" for="vim-keymap-enabled">Enable Vim Keybindings</label>
<div>
<h4>Use vim keybindings in code notes (no ex mode)</h4>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="vim-keymap-enabled">
<label class="custom-control-label" for="vim-keymap-enabled">Enable Vim Keybindings</label>
</div>
<br/>
</div>
<br/>
<h4>Wrap lines in code notes</h4>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="line-wrap-enabled">
<label class="custom-control-label" for="line-wrap-enabled">Enable Line Wrap (change might need a frontend reload to take effect)</label>
<div>
<h4>Wrap lines in code notes</h4>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="line-wrap-enabled">
<label class="custom-control-label" for="line-wrap-enabled">Enable Line Wrap (change might need a frontend reload to take effect)</label>
</div>
<br/>
</div>
<br/>
<h4>Available MIME types in the dropdown</h4>
<div>
<h4>Automatic readonly size</h4>
<ul id="options-mime-types" style="max-height: 500px; overflow: auto; list-style-type: none;"></ul>`;
<p>Automatic readonly note size is the size after which notes will be displayed in a readonly mode (for performance reasons).</p>
<div class="form-group">
<label for="auto-readonly-size-code">Automatic readonly size (code notes)</label>
<input class="form-control" id="auto-readonly-size-code" type="number" min="0">
</div>
</div>
<div>
<h4>Available MIME types in the dropdown</h4>
<ul id="options-mime-types" style="max-height: 500px; overflow: auto; list-style-type: none;"></ul>
</div>`;
export default class CodeNotesOptions {
constructor() {
@ -32,6 +49,7 @@ export default class CodeNotesOptions {
server.put('options', opts).then(() => toastService.showMessage("Options change have been saved."));
return false;
});
this.$codeLineWrapEnabled = $("#line-wrap-enabled");
this.$codeLineWrapEnabled.on('change', () => {
const opts = { 'codeLineWrapEnabled': this.$codeLineWrapEnabled.is(":checked") ? "true" : "false" };
@ -39,12 +57,22 @@ export default class CodeNotesOptions {
return false;
});
this.$mimeTypes = $("#options-mime-types");
this.$autoReadonlySizeCode = $("#auto-readonly-size-code");
this.$autoReadonlySizeCode.on('change', () => {
const opts = { 'autoReadonlySizeCode': this.$autoReadonlySizeCode.val() };
server.put('options', opts).then(() => toastService.showMessage("Options changed have been saved."));
return false;
});
}
async optionsLoaded(options) {
this.$mimeTypes.empty();
this.$vimKeymapEnabled.prop("checked", options['vimKeymapEnabled'] === 'true');
this.$codeLineWrapEnabled.prop("checked", options['codeLineWrapEnabled'] === 'true');
this.$autoReadonlySizeCode.val(options['autoReadonlySizeCode']);
let idCtr = 1;
for (const mimeType of await mimeTypesService.getMimeTypes()) {

View File

@ -102,21 +102,6 @@ const TPL = `
</div>
</div>
<div>
<h4>Automatic readonly size</h4>
<p>Automatic readonly note size is the size after which notes will be displayed in a readonly mode (for performance reasons).</p>
<div class="form-group">
<label for="auto-readonly-size-text">Automatic readonly size (text notes)</label>
<input class="form-control" id="auto-readonly-size-text" type="number" min="0">
</div>
<div class="form-group">
<label for="auto-readonly-size-code">Automatic readonly size (code notes)</label>
<input class="form-control" id="auto-readonly-size-code" type="number" min="0">
</div>
</div>
<div>
<h4>Network connections</h4>
@ -128,7 +113,7 @@ const TPL = `
`;
export default class ProtectedSessionOptions {
export default class OtherOptions {
constructor() {
$("#options-other").html(TPL);
@ -214,24 +199,6 @@ export default class ProtectedSessionOptions {
return false;
});
this.$autoReadonlySizeText = $("#auto-readonly-size-text");
this.$autoReadonlySizeText.on('change', () => {
const opts = { 'autoReadonlySizeText': this.$autoReadonlySizeText.val() };
server.put('options', opts).then(() => toastService.showMessage("Options changed have been saved."));
return false;
});
this.$autoReadonlySizeCode = $("#auto-readonly-size-code");
this.$autoReadonlySizeCode.on('change', () => {
const opts = { 'autoReadonlySizeCode': this.$autoReadonlySizeText.val() };
server.put('options', opts).then(() => toastService.showMessage("Options changed have been saved."));
return false;
});
this.$downloadImagesAutomatically = $("#download-images-automatically");
this.$downloadImagesAutomatically.on("change", () => {
@ -281,9 +248,6 @@ export default class ProtectedSessionOptions {
this.$imageMaxWidthHeight.val(options['imageMaxWidthHeight']);
this.$imageJpegQuality.val(options['imageJpegQuality']);
this.$autoReadonlySizeText.val(options['autoReadonlySizeText']);
this.$autoReadonlySizeCode.val(options['autoReadonlySizeCode']);
const downloadImagesAutomatically = options['downloadImagesAutomatically'] === 'true';
this.$downloadImagesAutomatically.prop('checked', downloadImagesAutomatically);

View File

@ -1,4 +1,5 @@
import server from "../../../services/server.js";
import toastService from "../../../services/toast.js";
const TPL = `
<p><strong>Settings on this options tab are saved automatically after each change.</strong></p>
@ -22,6 +23,17 @@ const TPL = `
</div>
<p>You can also use this option to effectively disable TOC by setting a very high number.</p>
<div>
<h4>Automatic readonly size</h4>
<p>Automatic readonly note size is the size after which notes will be displayed in a readonly mode (for performance reasons).</p>
<div class="form-group">
<label for="auto-readonly-size-text">Automatic readonly size (text notes)</label>
<input class="form-control" id="auto-readonly-size-text" type="number" min="0" style="text-align: right;">
</div>
</div>
</form>`;
export default class TextNotesOptions {
@ -45,6 +57,15 @@ export default class TextNotesOptions {
server.put('options/minTocHeadings/' + minTocHeadings);
});
this.$autoReadonlySizeText = $("#auto-readonly-size-text");
this.$autoReadonlySizeText.on('change', () => {
const opts = { 'autoReadonlySizeText': this.$autoReadonlySizeText.val() };
server.put('options', opts).then(() => toastService.showMessage("Options changed have been saved."));
return false;
});
}
toggleBodyClass(prefix, value) {
@ -60,5 +81,6 @@ export default class TextNotesOptions {
async optionsLoaded(options) {
this.$headingStyle.val(options.headingStyle);
this.$minTocHeadings.val(options.minTocHeadings);
this.$autoReadonlySizeText.val(options.autoReadonlySizeText);
}
}

View File

@ -2,7 +2,6 @@ const { Menu, Tray } = require('electron');
const path = require('path');
const windowService = require("./window");
const optionService = require("./options");
const options = require("../public/app/services/options.js");
const UPDATE_TRAY_EVENTS = [
'minimize', 'maximize', 'show', 'hide'