Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-30 18:05:55 +01:00
Code Issues Packages Projects Releases Activity

add frontend API method openTabWithNote, #1645

Browse Source
This commit is contained in:
zadam
2021-02-17 23:55:51 +01:00
parent 600a312b2a
commit 8e730c6ecf
24 changed files with 855 additions and 387 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
docs/frontend_api/widgets_collapsible_widget.js.html
View File

@@ -31,16 +31,25 @@ import options from "../services/options.js";
const WIDGET_TPL = `
<div class="card widget">
<div class="card-header">
<div class="card-header">
<div>
<button class="btn btn-sm widget-title" data-toggle="collapse" data-target="#[to be set]">
Collapsible Group Item
</button>
<a class="widget-help external no-arrow bx bx-info-circle"></a>
<a class="widget-toggle-button no-arrow"
title="Minimize/maximize widget"
data-toggle="collapse" data-target="#[to be set]">
<span class="widget-toggle-icon bx"></span>
<span class="widget-title">
Collapsible Group Item
</span>
</a>
<span class="widget-header-actions"></span>
</div>
<div class="widget-header-actions"></div>
<div>
<a class="widget-help external no-arrow bx bx-info-circle"></a>
</div>
</div>
<div id="[to be set]" class="collapse body-wrapper" style="transition: none; ">
@@ -66,13 +75,19 @@ export default class CollapsibleWidget extends TabAwareWidget {
// not using constructor name because of webpack mangling class names ...
this.widgetName = this.widgetTitle.replace(/[^[a-zA-Z0-9]/g, "_");
if (!options.is(this.widgetName + 'Collapsed')) {
this.$toggleButton = this.$widget.find('.widget-toggle-button');
this.$toggleIcon = this.$widget.find('.widget-toggle-icon');
const collapsed = options.is(this.widgetName + 'Collapsed');
if (!collapsed) {
this.$bodyWrapper.collapse("show");
}
this.updateToggleIcon(collapsed);
// using immediate variants of the event so that the previous collapse is not caught
this.$bodyWrapper.on('hide.bs.collapse', () => this.saveCollapsed(true));
this.$bodyWrapper.on('show.bs.collapse', () => this.saveCollapsed(false));
this.$bodyWrapper.on('hide.bs.collapse', () => this.toggleCollapsed(true));
this.$bodyWrapper.on('show.bs.collapse', () => this.toggleCollapsed(false));
this.$body = this.$bodyWrapper.find('.card-body');
@@ -94,19 +109,35 @@ export default class CollapsibleWidget extends TabAwareWidget {
}
this.$headerActions = this.$widget.find('.widget-header-actions');
this.$headerActions.append(...this.headerActions);
this.$headerActions.append(this.headerActions);
this.initialized = this.doRenderBody();
this.decorateWidget();
}
saveCollapsed(collapse) {
toggleCollapsed(collapse) {
this.updateToggleIcon(collapse);
options.save(this.widgetName + 'Collapsed', collapse.toString());
this.triggerEvent(`widgetCollapsedStateChanged`, {widgetName: this.widgetName, collapse});
}
updateToggleIcon(collapse) {
if (collapse) {
this.$toggleIcon
.addClass("bx-chevron-right")
.removeClass("bx-chevron-down")
.attr("title", "Show");
} else {
this.$toggleIcon
.addClass("bx-chevron-down")
.removeClass("bx-chevron-right")
.attr("title", "Hide");
}
}
/**
* This event is used to synchronize collapsed state of all the tab-cached widgets since they are all rendered
* separately but should behave uniformly for the user.