From 63ab82a07674afbee383d5dec16220c25405f266 Mon Sep 17 00:00:00 2001 From: zadam Date: Wed, 1 May 2019 23:06:18 +0200 Subject: [PATCH] tabs wip --- .../javascripts/services/note_context.js | 30 ++++++------ .../javascripts/services/note_detail.js | 19 ++++++-- .../javascripts/services/note_detail_text.js | 5 +- src/views/details/file.ejs | 18 ++++---- src/views/details/image.ejs | 16 +++---- .../details/protected_session_password.ejs | 4 +- src/views/details/relation_map.ejs | 22 ++++----- src/views/details/render.ejs | 6 +-- src/views/details/search.ejs | 8 ++-- src/views/tabs.ejs | 18 ++++---- src/views/title.ejs | 46 +++++++++---------- 11 files changed, 100 insertions(+), 92 deletions(-) diff --git a/src/public/javascripts/services/note_context.js b/src/public/javascripts/services/note_context.js index a7bad322d..76ecb3dfc 100644 --- a/src/public/javascripts/services/note_context.js +++ b/src/public/javascripts/services/note_context.js @@ -1,17 +1,19 @@ -import treeService from "./tree"; -import protectedSessionHolder from "./protected_session_holder"; -import server from "./server"; -import bundleService from "./bundle"; -import attributeService from "./attributes"; -import treeUtils from "./tree_utils"; -import utils from "./utils"; -import noteDetailCode from "./note_detail_code"; -import noteDetailText from "./note_detail_text"; -import noteDetailFile from "./note_detail_file"; -import noteDetailImage from "./note_detail_image"; -import noteDetailSearch from "./note_detail_search"; -import noteDetailRender from "./note_detail_render"; -import noteDetailRelationMap from "./note_detail_relation_map"; +import treeService from "./tree.js"; +import protectedSessionHolder from "./protected_session_holder.js"; +import server from "./server.js"; +import bundleService from "./bundle.js"; +import attributeService from "./attributes.js"; +import treeUtils from "./tree_utils.js"; +import utils from "./utils.js"; +import noteDetailCode from "./note_detail_code.js"; +import noteDetailText from "./note_detail_text.js"; +import noteDetailFile from "./note_detail_file.js"; +import noteDetailImage from "./note_detail_image.js"; +import noteDetailSearch from "./note_detail_search.js"; +import noteDetailRender from "./note_detail_render.js"; +import noteDetailRelationMap from "./note_detail_relation_map.js"; + +const $noteTabsContainer = $("#note-tab-container"); const componentClasses = { 'code': noteDetailCode, diff --git a/src/public/javascripts/services/note_detail.js b/src/public/javascripts/services/note_detail.js index 592df4271..1d737690f 100644 --- a/src/public/javascripts/services/note_detail.js +++ b/src/public/javascripts/services/note_detail.js @@ -44,11 +44,22 @@ async function reload() { } async function switchToNote(noteId) { - if (getActiveNoteId() !== noteId) { + if (Object.keys(noteContexts).length === 0) { + const tabContent = $("#note-tab-content-template").clone(); + + tabContent.removeAttr('id'); + tabContent.attr('data-note-id', noteId); + + $noteTabsContainer.append(tabContent); + + noteContexts[noteId] = new NoteContext(noteId); + } + + //if (getActiveNoteId() !== noteId) { await saveNotesIfChanged(); await loadNoteDetail(noteId); - } + //} } function getActiveNoteContent() { @@ -60,7 +71,7 @@ function onNoteChange(func) { } async function saveNotesIfChanged() { - for (const ctx of noteContexts) { + for (const ctx of Object.values(noteContexts)) { await ctx.saveNoteIfChanged(); } @@ -103,7 +114,7 @@ function getActiveContext() { } function showTab(noteId) { - for (const ctx of noteContexts) { + for (const ctx of Object.values(noteContexts)) { ctx.$noteTab.toggle(ctx.noteId === noteId); } } diff --git a/src/public/javascripts/services/note_detail_text.js b/src/public/javascripts/services/note_detail_text.js index 1cb9b49f3..7a351038a 100644 --- a/src/public/javascripts/services/note_detail_text.js +++ b/src/public/javascripts/services/note_detail_text.js @@ -8,6 +8,7 @@ class NoteDetailText { * @param {NoteContext} ctx */ constructor(ctx) { + this.ctx = ctx; this.$component = ctx.$noteTab.find('.note-detail-text'); this.textEditor = null; @@ -48,11 +49,11 @@ class NoteDetailText { } } - this.textEditor.isReadOnly = await isReadOnly(); + this.textEditor.isReadOnly = await this.isReadOnly(); this.$component.show(); - this.textEditor.setData(noteDetailService.getActiveNote().content); + this.textEditor.setData(this.ctx.note.content); } getContent() { diff --git a/src/views/details/file.ejs b/src/views/details/file.ejs index bb983ddd4..bfb801cd6 100644 --- a/src/views/details/file.ejs +++ b/src/views/details/file.ejs @@ -1,32 +1,32 @@ -
- +
+
- + - + - + - +
Note ID:
Original file name:
File type:
File size:
Preview: -

+                

             
- +   - +
diff --git a/src/views/details/image.ejs b/src/views/details/image.ejs index 68862109f..30a510cc4 100644 --- a/src/views/details/image.ejs +++ b/src/views/details/image.ejs @@ -1,28 +1,28 @@ -
+
Original file name: - +     File type: - +     File size: - +

- +     - +

-
- +
+
\ No newline at end of file diff --git a/src/views/details/protected_session_password.ejs b/src/views/details/protected_session_password.ejs index 5cb534a81..ded06fbff 100644 --- a/src/views/details/protected_session_password.ejs +++ b/src/views/details/protected_session_password.ejs @@ -1,8 +1,8 @@ -
+
- +
diff --git a/src/views/details/relation_map.ejs b/src/views/details/relation_map.ejs index b7b7a5b52..78ba95b0d 100644 --- a/src/views/details/relation_map.ejs +++ b/src/views/details/relation_map.ejs @@ -1,5 +1,5 @@ -
- + style="right: 100px;">
+ class="relation-map-zoom-in btn icon-button jam jam-search-plus" + title="Zoom In"> + class="relation-map-zoom-out btn icon-button jam jam-search-minus" + title="Zoom Out">
-
-
+
+
\ No newline at end of file diff --git a/src/views/details/render.ejs b/src/views/details/render.ejs index 8734c369d..a184bb045 100644 --- a/src/views/details/render.ejs +++ b/src/views/details/render.ejs @@ -1,9 +1,9 @@ -
-
+
+

This help note is shown because this note of type Render HTML doesn't have required relation to function properly.

Render HTML note type is used for scripting. In short, you have a HTML code note (optionally with some JavaScript) and this note will render it. To make it work, you need to define a relation (in Attributes dialog) called "renderNote" pointing to the HTML note to render. Once that's defined you can click on the "play" button to render.

-
+
\ No newline at end of file diff --git a/src/views/details/search.ejs b/src/views/details/search.ejs index a180f2958..8b66193c7 100644 --- a/src/views/details/search.ejs +++ b/src/views/details/search.ejs @@ -1,15 +1,15 @@ -
-
+
<% include title.ejs %> -
+
-
+
-
-
+
+
-
+
<% include details/search.ejs %> @@ -42,13 +42,13 @@ <% include details/protected_session_password.ejs %> -
+
-
+
- +
\ No newline at end of file diff --git a/src/views/title.ejs b/src/views/title.ejs index ae594a408..0f298a4fe 100644 --- a/src/views/title.ejs +++ b/src/views/title.ejs @@ -1,53 +1,49 @@ -
+
- + - +
- + title="Render"> - + title="Execute (Ctrl+Enter)">
    -