@matdata/yasgui 5.18.0 → 5.19.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@matdata/yasgui",
   "description": "Yet Another SPARQL GUI",
-  "version": "5.18.0",
+  "version": "5.19.1",
   "main": "build/yasgui.min.js",
   "types": "build/ts/src/index.d.ts",
   "license": "MIT",

package/src/Tab.ts

@@ -1287,6 +1287,7 @@ export class Tab extends EventEmitter {
       createShareableLink: () => this.getShareableLink(),
       // Use global showSnippetsBar setting if it exists
       showSnippetsBar: this.yasgui.config.showSnippetsBar !== false,
+      showMapButton: false,
       requestConfig: () => {
         const processedReqConfig: YasguiRequestConfig = {
           //setting defaults

package/src/TabSettingsModal.ts

@@ -38,6 +38,7 @@ export default class TabSettingsModal {
   private settingsButton!: HTMLButtonElement;
   private themeToggleButton!: HTMLButtonElement;
   private prefixButton!: HTMLButtonElement;
+  private mapButton!: HTMLButtonElement;
   private prefixTextarea!: HTMLTextAreaElement;
   private autoCaptureCheckbox!: HTMLInputElement;
   private hamburgerMenuButton!: HTMLButtonElement;
@@ -89,6 +90,15 @@ export default class TabSettingsModal {
     controlBarEl.appendChild(this.prefixButton);
     this.prefixButton.onclick = () => this.insertPrefixesIntoQuery();
 
+    // Map button
+    this.mapButton = document.createElement("button");
+    this.mapButton.setAttribute("aria-label", "Open map");
+    this.mapButton.title = "Open map";
+    this.mapButton.innerHTML = '<i class="fas fa-map-location-dot"></i>';
+    addClass(this.mapButton, "tabContextButton", "desktopOnly");
+    controlBarEl.appendChild(this.mapButton);
+    this.mapButton.onclick = (event: MouseEvent) => this.openMapWidget(event);
+
     // Hamburger menu button and dropdown (mobile only)
     const hamburgerContainer = document.createElement("div");
     addClass(hamburgerContainer, "hamburgerContainer", "mobileOnly");
@@ -148,6 +158,15 @@ export default class TabSettingsModal {
     };
     this.hamburgerDropdown.appendChild(prefixItem);
 
+    const mapItem = document.createElement("button");
+    addClass(mapItem, "hamburgerMenuItem");
+    mapItem.innerHTML = '<i class="fas fa-map-location-dot"></i><span>Open map</span>';
+    mapItem.onclick = (event) => {
+      this.openMapWidget(event);
+      this.closeHamburgerMenu();
+    };
+    this.hamburgerDropdown.appendChild(mapItem);
+
     // Theme toggle menu item (if enabled)
     if (this.tab.yasgui.config.showThemeToggle) {
       const themeItem = document.createElement("button");
@@ -1846,6 +1865,13 @@ export default class TabSettingsModal {
     yasqe.focus();
   }
 
+  private openMapWidget(event?: MouseEvent) {
+    const yasqe = this.tab.getYasqe();
+    if (!yasqe) return;
+    const anchorPoint = event ? { x: event.clientX, y: event.clientY } : undefined;
+    yasqe.toggleMapWidget(anchorPoint);
+  }
+
   public capturePrefixesFromQuery() {
     const autoCapture = this.tab.yasgui.persistentConfig.getAutoCaptureEnabled();
     if (!autoCapture) return;

package/src/themes.scss

@@ -292,6 +292,48 @@
         border-color: var(--yasgui-border-color);
       }
     }
+
+    .yasqe_mapPopup {
+      background-color: var(--yasgui-bg-primary);
+      border-color: var(--yasgui-border-color);
+      color: var(--yasgui-text-primary);
+
+      .yasqe_mapPopup_map {
+        border-color: var(--yasgui-border-color);
+      }
+
+      .yasqe_mapPopup_geometryBtn {
+        background-color: var(--yasgui-bg-primary);
+        color: var(--yasgui-text-primary);
+        border-color: var(--yasgui-border-color);
+
+        &:hover {
+          background-color: var(--yasgui-bg-secondary);
+        }
+
+        &.active {
+          background-color: var(--yasgui-accent-color);
+          color: var(--yasgui-bg-primary);
+        }
+      }
+
+      .yasqe_mapPopup_preview {
+        background-color: var(--yasgui-bg-secondary);
+        color: var(--yasgui-text-primary);
+        border-color: var(--yasgui-border-color);
+      }
+
+      .leaflet-control-zoom a,
+      .leaflet-control-attribution {
+        background-color: var(--yasgui-bg-primary);
+        color: var(--yasgui-text-primary);
+        border-color: var(--yasgui-border-color);
+      }
+
+      .leaflet-control-zoom a:hover {
+        background-color: var(--yasgui-bg-secondary);
+      }
+    }
   }
 
   .yasqe_btn {

package/src/version.ts

@@ -1,3 +1,3 @@
 // Version information for YASGUI
 // This file is auto-generated during build - do not edit manually
-export const VERSION = "5.18.0";
+export const VERSION = "5.19.1";