Merge pull request #684 from georchestra/themable-header

Themable Webcomponent header
georchestra · Dec 19, 2023 · 7ea5ff0 · 7ea5ff0
2 parents 8220503 + 50c7896
commit 7ea5ff0
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 4 deletions.
diff --git a/configs/localConfig.json b/configs/localConfig.json
@@ -22,7 +22,9 @@
       "height": 90,
       "url": "/header/",
       "script": "https://cdn.jsdelivr.net/gh/georchestra/header@dist/header.js",
-      "legacy": false
+      "legacy": false,
+      "logoUrl": "https://www.georchestra.org/public/georchestra-logo.svg",
+      "stylesheet": ""
     },
     "defaultMapOptions": {
       "cesium": {

diff --git a/js/plugins/Header.jsx b/js/plugins/Header.jsx
@@ -8,7 +8,11 @@
 import {useEffect} from "react";
 import { createPlugin, connect } from "@mapstore/utils/PluginsUtils";
 
-export const Header = ({url = "/header/", page = "mapstore", height = 90, ignoreIFrame = false, script = "https://cdn.jsdelivr.net/gh/georchestra/header@dist/header.js", legacy = false}) => {
+export const Header = ({url = "/header/", page = "mapstore", height = 90, ignoreIFrame = false,
+    script = "https://cdn.jsdelivr.net/gh/georchestra/header@dist/header.js",
+    legacy = false,
+    logo = "https://www.georchestra.org/public/georchestra-logo.svg",
+    stylesheet = ""}) => {
     useEffect(() => {
         const header = document.getElementById("georchestra-header");
         const headerScript = document.getElementById("georchestra-header-script");
@@ -24,6 +28,8 @@ export const Header = ({url = "/header/", page = "mapstore", height = 90, ignore
                 header.setAttribute("legacy-url", url);
                 header.setAttribute("legacy-header", legacy);
                 header.setAttribute("style", `height:${height}px`);
+                header.setAttribute("logo-url", logo);
+                header.setAttribute("stylesheet", stylesheet);
                 headerScript.src = script;
 
                 if (container) {
@@ -41,6 +47,8 @@ export default createPlugin('Header', {
         url: state.localConfig && state.localConfig.header && state.localConfig.header.url,
         height: state.localConfig && state.localConfig.header && state.localConfig.header.height,
         script: state.localConfig && state.localConfig.header && state.localConfig.header.script,
-        legacy: state.localConfig && state.localConfig.header && state.localConfig.header.legacy
+        legacy: state.localConfig && state.localConfig.header && state.localConfig.header.legacy,
+        logo: state.localConfig && state.localConfig.header && state.localConfig.header.logo,
+        stylesheet: state.localConfig && state.localConfig.header && state.localConfig.header.stylesheet
     }))(Header)
 });
diff --git a/web/src/main/resources/mapstore.properties b/web/src/main/resources/mapstore.properties
@@ -18,4 +18,4 @@
 
 datadir.location=${georchestra.extensions:},${georchestra.datadir}/mapstore
 overrides.config=../default.properties
-overrides.mappings=header.url=headerUrl,header.height=headerHeight,header.script=headerScript,header.legacy=useLegacyHeader
+overrides.mappings=header.url=headerUrl,header.height=headerHeight,header.script=headerScript,header.legacy=useLegacyHeader,header.logoUrl=logoUrl,header.stylesheet=georchestraStylesheet