network map less clutterd by switching off alteri labels #64

fhstp · Dec 13, 2021 · ba22df7 · ba22df7
1 parent 7088b45
commit ba22df7
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 0 deletions.
diff --git a/src/components/NetworkMap.vue b/src/components/NetworkMap.vue
@@ -118,6 +118,7 @@
           @click="clickAlter(mark.d)"
         />
         <text
+          v-if="alteriNames"
           class="textbg"
           :x="mark.x"
           :y="mark.y"
@@ -128,6 +129,7 @@
           {{ (mark.d.deceased ? SYMBOL_DECEASED : "") + mark.d.name }}
         </text>
         <text
+          v-if="alteriNames"
           :x="mark.x"
           :y="mark.y"
           :text-anchor="mark.x < 0 ? 'end' : 'start'"
@@ -328,6 +330,7 @@ export default defineComponent({
       clickAlter,
       alteriMarks,
       connectionMarks,
+      alteriNames: computed(() => store.state.view.alteriNames),
       showHorizons: computed(() => store.state.view.horizons),
       connections: computed(() => store.state.view.connections),
       Sectors,

diff --git a/src/components/SideMenu.vue b/src/components/SideMenu.vue
@@ -98,6 +98,14 @@
           <span v-if="connections">Verbindungen aus</span>
           <span v-else>Verbindungen ein</span>
         </button>
+
+        <button class="button" @click.stop="toggleAlteriNames">
+          <span class="icon">
+            <font-awesome-icon icon="font" />
+          </span>
+          <span v-if="alteriNames">Kontaktnamen aus</span>
+          <span v-else>Kontaktnamen ein</span>
+        </button>
       </div>
 
       <a href="http://www.easynwk.com/" target="_blank">Über die easyNWK</a>
@@ -178,6 +186,7 @@ export default defineComponent({
     };
 
     const connections = computed(() => store.state.view.connections);
+    const alteriNames = computed(() => store.state.view.alteriNames);
 
     return {
       menuOpen,
@@ -205,6 +214,11 @@ export default defineComponent({
         if (connections.value) store.commit("view/disable", "connections");
         else store.commit("view/enable", "connections");
       },
+      alteriNames,
+      toggleAlteriNames: () => {
+        if (alteriNames.value) store.commit("view/disable", "alteriNames");
+        else store.commit("view/enable", "alteriNames");
+      },
     };
   },
 });

diff --git a/src/main.ts b/src/main.ts
@@ -33,6 +33,7 @@ import {
   faRedo,
   faChartBar,
   faRss,
+  faFont,
   faTrashAlt,
   faInfoCircle,
   faCheck,
@@ -60,6 +61,7 @@ library.add(
   faRedo,
   faChartBar,
   faRss,
+  faFont,
   faTrashAlt,
   faInfoCircle,
   faCheck

diff --git a/src/store/viewOptionsModule.ts b/src/store/viewOptionsModule.ts
@@ -5,6 +5,7 @@ export interface ViewOptionsFlags {
   anonymized: boolean;
   horizons: boolean;
   connections: boolean;
+  alteriNames: boolean;
   statistics: boolean;
 }
 
@@ -19,6 +20,7 @@ export function initViewOptionsState(): ViewOptionsState {
     anonymized: false,
     horizons: true,
     connections: true,
+    alteriNames: true,
     statistics: false,
 
     selected: new Set<number>(),