From d13b68511e55d0309c35aa38b190f356fbb23b40 Mon Sep 17 00:00:00 2001
From: Max <m.giller.dev@gmail.com>
Date: Thu, 30 Sep 2021 23:56:06 +0200
Subject: [PATCH] Added select link menu
---
editor/editor.php | 11 +++++++++++
editor/js/tools/menus/selectmenu.js | 23 ++++++++++++++++++++++-
2 files changed, 33 insertions(+), 1 deletion(-)
diff --git a/editor/editor.php b/editor/editor.php
index 5c8877b..17f0799 100644
--- a/editor/editor.php
+++ b/editor/editor.php
@@ -42,6 +42,17 @@
<textarea id="node-videos" name="node-videos"></textarea>
</div>
<div id="link-selected" class="hidden">
+ <h3 id="link-name" class="bottom-space">aud1 ↔ Sortieren</h3>
+
+ <label for="link-type">Type</label>
+ <select id="link-type" name="node-type" class="bottom-space medium-width">
+ <option value="Vorlesung">Vorlesung</option>
+ <option value="Algorithmus">Algorithmus</option>
+ <option value="Definition">Definition</option>
+ <option value="Beispiel">Beispiel</option>
+ <option value="Übung">Übung</option>
+ <option value="Kapitel">Kapitel</option>
+ </select>
</div>
</div>
</section>
diff --git a/editor/js/tools/menus/selectmenu.js b/editor/js/tools/menus/selectmenu.js
index 80dba6c..08287c4 100644
--- a/editor/js/tools/menus/selectmenu.js
+++ b/editor/js/tools/menus/selectmenu.js
@@ -25,6 +25,13 @@ const NODE_MENU = [
NODE_VIDEOS_ID,
];
+const LINK_NAME_CONNECTOR = " → ";
+const LINK_NAME_ID = "#link-name";
+const LINK_TYPE_ID = "#link-type";
+const LINK_MENU = [LINK_TYPE_ID];
+
+const MENU = [...NODE_MENU, ...LINK_MENU];
+
export class SelectMenu extends ToolMenu {
constructor() {
super();
@@ -36,12 +43,13 @@ export class SelectMenu extends ToolMenu {
{ menu: NODE_TYPE_ID, property: Graph.NODE_TYPE },
{ menu: NODE_REF_ID, property: Graph.NODE_REFERENCES },
{ menu: NODE_VIDEOS_ID, property: Graph.NODE_VIDEOS },
+ { menu: LINK_TYPE_ID, property: Graph.LINK_TYPE },
];
this.hooked = false; // Can only hook menu events once, but have to do it later, when they are loaded
}
hookMenu() {
- NODE_MENU.forEach((menu) => {
+ MENU.forEach((menu) => {
console.log(this.find(menu));
// Subscribes to change event for each menu element
this.find(menu).on("change", (e) => {
@@ -117,6 +125,7 @@ export class SelectMenu extends ToolMenu {
this.fillNode(value);
this.setContext(CONTEXT.node);
} else if (value.link) {
+ this.fillLink(value);
this.setContext(CONTEXT.link);
} else {
this.setContext(CONTEXT.nothing);
@@ -128,4 +137,16 @@ export class SelectMenu extends ToolMenu {
this.find(menu).val(node[this.toProperty(menu)]);
});
}
+
+ fillLink(link) {
+ var sourceName = link[Graph.LINK_SOURCE][Graph.NODE_LABEL];
+ var targetName = link[Graph.LINK_TARGET][Graph.NODE_LABEL];
+ this.find(LINK_NAME_ID).text(
+ sourceName + LINK_NAME_CONNECTOR + targetName
+ );
+
+ LINK_MENU.forEach((menu) => {
+ this.find(menu).val(link[this.toProperty(menu)]);
+ });
+ }
}
--
GitLab