From a0bbad37c79939126419c46db96518a58449e433 Mon Sep 17 00:00:00 2001
From: Daniel Garcia Briseno <94071409+dgarciabriseno@users.noreply.github.com>
Date: Mon, 26 Feb 2024 16:37:11 -0500
Subject: [PATCH] Fix some instances of embedded helioviewer (#537)

* fix embed page

* patches for embed
---
 resources/js/HelioviewerClient.js |  9 ++++-
 resources/js/UI/ImageScale.js     | 58 +++++++++++++++++++------------
 2 files changed, 44 insertions(+), 23 deletions(-)

diff --git a/resources/js/HelioviewerClient.js b/resources/js/HelioviewerClient.js
index 63e35e27b..5285a09c1 100644
--- a/resources/js/HelioviewerClient.js
+++ b/resources/js/HelioviewerClient.js
@@ -42,9 +42,16 @@ var HelioviewerClient = Class.extend(
      * @description Checks browser support for various features used in Helioviewer
      */
     _checkBrowser: function () {
+        let localStorageSupport = true;
+        try {
+            localStorageSupport = ('localStorage' in window) && window['localStorage'] !== null;
+        } catch (e) {
+            localStorageSupport = false;
+        }
+
         // Base support
         $.extend($.support, {
-            "localStorage" : ('localStorage' in window) && window['localStorage'] !== null,
+            "localStorage" : localStorageSupport,
             "nativeJSON"   : typeof (JSON) !== "undefined",
             "video"        : !!document.createElement('video').canPlayType,
             "h264"         : false,
diff --git a/resources/js/UI/ImageScale.js b/resources/js/UI/ImageScale.js
index 83b1b0576..8e3e93dd3 100644
--- a/resources/js/UI/ImageScale.js
+++ b/resources/js/UI/ImageScale.js
@@ -236,13 +236,24 @@ var ImageScale = Class.extend(
              Helioviewer.userSettings.get("state.containerY") <= ( $('#hv-header').height() || 0 ) ||
              Helioviewer.userSettings.get("state.containerY") >= this.container.parent().height()-this.container.height()
             ) {
-                this.containerX = this.container.parent().width()*0.66 - this.container.width()/2; //center the earth container
-	            this.containerY = $('#earth-button').position().top + $('#scale').position().top + this.container.height();
-                this.container.css({
-                    'position' : 'absolute',
-                    'top'      : this.containerY+'px',
-                    'left'     : this.containerX+'px'
-                });
+                if (outputType == 'embed') {
+                    this.containerX = 15;
+                    this.containerY = this.container.parent().height() - this.container.height() - 15;
+                    this.container.css({
+                        'position' : 'absolute',
+                        'top'      : this.containerY+'px',
+                        'left'     : this.containerX+'px'
+                    });
+                } else {
+                    this.containerX = this.container.parent().width()*0.66 - this.container.width()/2; //center the earth container
+                    this.containerY = $('#earth-button').position().top + $('#scale').position().top + this.container.height();
+                    this.container.css({
+                        'position' : 'absolute',
+                        'top'      : this.containerY+'px',
+                        'left'     : this.containerX+'px'
+                    });
+                }
+                
             }
         }else{// minimal helioviewer
             var dm = $('#date-manager-container');
@@ -317,21 +328,24 @@ var ImageScale = Class.extend(
         if ( parseInt(Helioviewer.userSettings.get("state.scaleX")) == 0 ||
              parseInt(Helioviewer.userSettings.get("state.scaleY")) == 0 ) {
 
-
-            if (outputType != 'minimal'){
-
-	            this.containerX = this.container.parent().width()*0.66 - this.container.width()/2; //center the earth container
-	            this.containerY = $('#earth-button').position().top + $('#scale').position().top + this.container.height();
-	            this.scale = false;
-
-	        }else{
-                var sc = $('#scale');
-                this.containerX = sc.position().left + (sc.outerWidth()/2) - this.container.width()/2; //center the earth container
-	            this.containerY = sc.position().top - this.container.height() - 3;
-		        //this.containerX = this.container.parent().width() - 150;
-		        //this.containerY = this.container.parent().height() - 100;
-		        this.scale = true;
-	        }
+            switch(outputType) {
+                case "minimal":
+                    var sc = $('#scale');
+                    this.containerX = sc.position().left + (sc.outerWidth()/2) - this.container.width()/2; //center the earth container
+                    this.containerY = sc.position().top - this.container.height() - 3;
+                    this.scale = true;
+                    break;
+                case "embed":
+                    this.scale = false;
+                    this.containerX = 15;
+                    this.containerY = this.container.parent().height() - this.container.height() - 15;
+                    break;
+                default:
+                    this.containerX = this.container.parent().width()*0.66 - this.container.width()/2; //center the earth container
+                    this.containerY = $('#earth-button').position().top + $('#scale').position().top + this.container.height();
+                    this.scale = false;
+                    break;
+            }
         }
 
         this.scaleContainerDragTo(this.containerX, this.containerY);