gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-06-06 18:08:33 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

tab row refactoring WIP

Browse Source
This commit is contained in:
zadam 2020-01-15 22:11:30 +01:00
parent 7963de0abc
commit 1552c3804d
3 changed files with 18 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/public/javascripts/services/attributes.js
View File

@ -44,10 +44,10 @@ class Attributes extends Component {
activeNoteChangedListener() { activeNoteChangedListener() {
if (utils.isDesktop()) { if (utils.isDesktop()) {
this.attributes.refreshAttributes(); this.refreshAttributes();
} else { } else {
// mobile usually doesn't need attributes so we just invalidate // mobile usually doesn't need attributes so we just invalidate
this.attributes.invalidateAttributes(); this.invalidateAttributes();
} }
} }
} }

2
src/public/javascripts/services/tab_context.js
View File

@ -96,8 +96,6 @@ class TabContext extends Component {
await this.renderComponent(); // render empty page await this.renderComponent(); // render empty page
} }
} }
this.setCurrentNotePathToHash();
} }
async renderComponent(disableAutoBook = false) { async renderComponent(disableAutoBook = false) {

34
src/public/javascripts/widgets/tab_row.js
View File

@ -233,14 +233,12 @@ const TAB_ROW_TPL = `
export default class TabRowWidget extends BasicWidget { export default class TabRowWidget extends BasicWidget {
doRender() { doRender() {
const $widget = $(TAB_ROW_TPL); this.$widget = $(TAB_ROW_TPL);
this.el = $widget[0];
this.draggabillies = []; this.draggabillies = [];
this.eventListeners = {}; this.eventListeners = {};
this.setupStyleEl(); this.setupStyle();
this.setupEvents(); this.setupEvents();
this.setupDraggabilly(); this.setupDraggabilly();
this.setupNewButton(); this.setupNewButton();
@ -248,7 +246,7 @@ export default class TabRowWidget extends BasicWidget {
this.layoutTabs(); this.layoutTabs();
this.setVisibility(); this.setVisibility();
$(this.el).on('contextmenu', '.note-tab', e => { this.$widget.on('contextmenu', '.note-tab', e => {
e.preventDefault(); e.preventDefault();
const tab = $(e.target).closest(".note-tab"); const tab = $(e.target).closest(".note-tab");
@ -270,12 +268,12 @@ export default class TabRowWidget extends BasicWidget {
}); });
}); });
return $widget; return this.$widget;
} }
setupStyleEl() { setupStyle() {
this.styleEl = document.createElement('style'); this.$style = $("<style>");
this.el.appendChild(this.styleEl); this.$widget.append(this.$style);
} }
setupEvents() { setupEvents() {
@ -286,7 +284,7 @@ export default class TabRowWidget extends BasicWidget {
// ResizeObserver exists only in FF69 // ResizeObserver exists only in FF69
if (typeof ResizeObserver !== "undefined") { if (typeof ResizeObserver !== "undefined") {
new ResizeObserver(resizeListener).observe(this.el); new ResizeObserver(resizeListener).observe(this.$widget[0]);
} }
else { else {
// for older firefox // for older firefox
@ -297,15 +295,15 @@ export default class TabRowWidget extends BasicWidget {
} }
setVisibility() { setVisibility() {
this.el.style.display = "block"; this.$widget.show();
} }
get tabEls() { get tabEls() {
return Array.prototype.slice.call(this.el.querySelectorAll('.note-tab')); return Array.prototype.slice.call(this.$widget.find('.note-tab'));
} }
get tabContentEl() { get tabContentEl() {
return this.el.querySelector('.note-tab-row-content'); return this.$widget.find('.note-tab-row-content')[0];
} }
get tabContentWidths() { get tabContentWidths() {
@ -376,7 +374,7 @@ export default class TabRowWidget extends BasicWidget {
styleHTML += `.note-new-tab { transform: translate3d(${ newTabPosition }px, 0, 0) } `; styleHTML += `.note-new-tab { transform: translate3d(${ newTabPosition }px, 0, 0) } `;
styleHTML += `.tab-row-filler { transform: translate3d(${ fillerPosition }px, 0, 0) } `; styleHTML += `.tab-row-filler { transform: translate3d(${ fillerPosition }px, 0, 0) } `;
this.styleEl.innerHTML = styleHTML; this.$style.html(styleHTML);
} }
addTab(tabId) { addTab(tabId) {
@ -413,7 +411,7 @@ export default class TabRowWidget extends BasicWidget {
} }
get activeTabEl() { get activeTabEl() {
return this.el.querySelector('.note-tab[active]'); return this.$widget.find('.note-tab[active]')[0];
} }
get previousTabEl() { get previousTabEl() {
@ -512,7 +510,7 @@ export default class TabRowWidget extends BasicWidget {
if (this.isDragging) { if (this.isDragging) {
this.isDragging = false; this.isDragging = false;
this.el.classList.remove('note-tab-row-is-sorting'); this.$widget.removeClass('note-tab-row-is-sorting');
this.draggabillyDragging.element.classList.remove('note-tab-is-dragging'); this.draggabillyDragging.element.classList.remove('note-tab-is-dragging');
this.draggabillyDragging.element.style.transform = ''; this.draggabillyDragging.element.style.transform = '';
this.draggabillyDragging.dragEnd(); this.draggabillyDragging.dragEnd();
@ -542,7 +540,7 @@ export default class TabRowWidget extends BasicWidget {
this.isDragging = true; this.isDragging = true;
this.draggabillyDragging = draggabilly; this.draggabillyDragging = draggabilly;
tabEl.classList.add('note-tab-is-dragging'); tabEl.classList.add('note-tab-is-dragging');
this.el.classList.add('note-tab-row-is-sorting'); this.$widget.addClass('note-tab-row-is-sorting');
}); });
draggabilly.on('dragEnd', _ => { draggabilly.on('dragEnd', _ => {
@ -557,7 +555,7 @@ export default class TabRowWidget extends BasicWidget {
requestAnimationFrame(_ => { requestAnimationFrame(_ => {
tabEl.classList.remove('note-tab-is-dragging'); tabEl.classList.remove('note-tab-is-dragging');
this.el.classList.remove('note-tab-row-is-sorting'); this.$widget.removeClass('note-tab-row-is-sorting');
tabEl.classList.add('note-tab-was-just-dragged'); tabEl.classList.add('note-tab-was-just-dragged');