Merge pull request #9 from JabRef/gui-integration to add button handlers

empty click handlers for each button, 'new sibling node' and 'new child node click' handlers implemented

Author: iloveskittles82

index.html

@@ -35,10 +35,10 @@
       <a class="navbar-brand" href="#">JabMap</a>
 
       <!--Save and Load Buttons-->
-      <button class="btn btn-light me-2" type="button" data-bs-toggle="tooltip" title="Save">
+      <button id = "saveBtn" class="btn btn-light me-2" type="button" data-bs-toggle="tooltip" title="Save">
         <i class="bi bi-save"></i> Save
       </button>
-      <button class="btn btn-light me-2" type="button" data-bs-toggle="tooltip" title="Open">
+      <button id = "openBtn" class="btn btn-light me-2" type="button" data-bs-toggle="tooltip" title="Open">
         <i class="bi bi-folder2-open"></i> Open
       </button>
     </div>
@@ -47,23 +47,23 @@
     <div class="position-absolute top-50 start-50 translate-middle d-flex justify-content-center">
       <!--Button class explanation: class = "btn colortheme margin to the right (me-2)"-->
       <!--undo Button-->
-      <button class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="Undo">
+      <button id = "undoBtn" class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="Undo">
         <i class="bi bi-arrow-counterclockwise"></i>
       </button>
       <!--redo Button-->
-      <button class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="Redo">
+      <button id = "redoBtn" class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="Redo">
         <i class="bi bi-arrow-clockwise"></i>
       </button>
       <!--new topic (sibling node) Button-->
-      <button class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="New sibling node">
+      <button id = "newSiblingBtn" class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="New sibling node">
         <i class="bi bi-node-plus-fill"></i>
       </button>
       <!--new subtopic (child node) button (Icon rotated 90 degrees)-->
-      <button class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="New child node">
+      <button id = "newChildBtn" class="btn btn-secondary me-2" type="button" data-bs-toggle="tooltip" title="New child node">
         <i class="bi bi-diagram-2-fill" style="transform: rotate(-90deg); display: inline-block;"></i>
       </button>
       <!--tags button-->
-      <button class="btn btn-secondary" type="button" data-bs-toggle="tooltip" title="Tags">
+      <button id = "tagsBtn" class="btn btn-secondary" type="button" data-bs-toggle="tooltip" title="Tags">
         <i class="bi bi-tags"></i>
       </button>
     </div>

src/main.js

@@ -82,4 +82,45 @@ const options = {
     };
 // create and render mindmap
 const jm = new jsMind(options);
-jm.show(mind);
+jm.show(mind);
+
+//--- Button click handlers ---
+
+// saving
+saveBtn.onclick = function(){
+    // saving jabmaps magic here..
+}
+
+// open
+openBtn.onclick = function(){
+    // opening jabmaps magic here..
+}
+
+// undo
+undoBtn.onclick = function(){
+    // undo magic here..
+}
+
+// redo
+redoBtn.onclick = function(){
+    // redo magic here..
+}
+
+// new sibling node
+newSiblingBtn.onclick = function(){
+    if(!!jm){
+        jm.shortcut.handle_addbrother(jm, null); //call the shortcut-handler for adding a sibling node
+    }
+}
+
+// new child node
+newChildBtn.onclick = function(){
+    if(!!jm){
+        jm.shortcut.handle_addchild(jm, null); //call the shortcut-handler for adding a child node
+    }
+}
+
+// tags
+tagsBtn.onclick = function(){
+    // tags magic here..
+}