implement embedded_mode

web/src/ui/canvas/canvas.ts

@@ -62,7 +62,10 @@ export class Canvas {
                           transition: Transition,
                           showLegendInfoboxSubject: Subject<boolean>) {
         this._width = window.innerWidth;
-        this._height = window.innerHeight - theme.hatnoteTheme.header_height;
+        this._height = settings.embedded_mode
+        ? window.innerHeight
+        : window.innerHeight - theme.hatnoteTheme.header_height;
+
         this.visDirector = theme;
         this.settings = settings
         this.showLegendInfoboxSubject = showLegendInfoboxSubject
@@ -134,7 +137,10 @@ export class Canvas {
     public windowUpdate() {
         // update canvas root dimensions
         this.width = window.innerWidth;
-        this.height = window.innerHeight - this.visDirector.hatnoteTheme.header_height;
+        this.height = this.settings.embedded_mode
+        ? window.innerHeight
+        : window.innerHeight - this.visDirector.hatnoteTheme.header_height;
+
         this._root.attr("width", this.width).attr("height", this.height);
 
         // update banner

web/src/ui/canvas/geo/geoVisualisation.ts

@@ -120,9 +120,15 @@ export class GeoVisualisation {
 
     private initWorldMapSvg(){
         const width = this.canvas.width;
-        const marginTop = this.canvas.visDirector.hatnoteTheme.header_height + 10;
+        const marginTop = this.canvas.settings.embedded_mode
+            ? 0
+            : this.canvas.visDirector.hatnoteTheme.header_height + 10;
+
         const height = this.canvas.height;
-        const carouselProgressIndicatorSafeZone = this.canvas.visDirector.hatnoteTheme.progress_indicator_y_padding + 10;
+        const carouselProgressIndicatorSafeZone = this.canvas.settings.embedded_mode
+            ? 0
+            : this.canvas.visDirector.hatnoteTheme.progress_indicator_y_padding + 10;
+
 
         // create projection
         let projection = geoEqualEarth().fitExtent([[2, marginTop + 2], [width - 2, height - 2 - carouselProgressIndicatorSafeZone ]], {type: "Sphere"})