From 20f24bffc43f61186d1e41d6aec9a098ea19afea Mon Sep 17 00:00:00 2001
From: Stan Silvert <ssilvert@redhat.com>
Date: Wed, 2 May 2018 16:15:31 -0400
Subject: [PATCH] KEYCLOAK-7248: Fixes for IE 11 (#5182)

---
 .../theme/keycloak-preview/account/index.ftl  | 59 +++++++++----------
 .../account/resources/app/app.component.ts    |  4 +-
 .../resources/systemjs-angular-loader.js      |  5 ++
 3 files changed, 37 insertions(+), 31 deletions(-)

diff --git a/themes/src/main/resources/theme/keycloak-preview/account/index.ftl b/themes/src/main/resources/theme/keycloak-preview/account/index.ftl
index 2755da1249..b77cb05e6d 100644
--- a/themes/src/main/resources/theme/keycloak-preview/account/index.ftl
+++ b/themes/src/main/resources/theme/keycloak-preview/account/index.ftl
@@ -3,6 +3,11 @@
     <head>
         <title>${msg("accountManagementTitle")}</title>
 
+        <meta charset="UTF-8">
+        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+        <meta name="robots" content="noindex, nofollow">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        
         <script>
             var authUrl = '${authUrl}';
             var baseUrl = '${baseUrl}';
@@ -33,11 +38,6 @@
 
         <base href="${baseUrl}/">
 
-        <meta charset="UTF-8">
-        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-        <meta name="robots" content="noindex, nofollow">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-
         <link rel="icon" href="${resourceUrl}/app/assets/img/favicon.ico" type="image/x-icon"/>
 
         <!-- PatternFly -->
@@ -72,15 +72,34 @@
         <script src="${resourceUrl}/node_modules/patternfly/dist/js/patternfly.min.js"></script>
         <script src="${authUrl}/js/keycloak.js"></script>
 
+   <!-- TODO: We should save these css and js into variables and then load in
+        main.ts for better performance.  These might be loaded twice.
+        -->
+        <#if properties.styles?has_content>
+            <#list properties.styles?split(' ') as style>
+            <link href="${resourceUrl}/${style}" rel="stylesheet"/>
+            </#list>
+            <a href="../../../../../../../../keycloak-quickstarts/app-profile-jee-html5/src/main/webapp/index.html"></a>
+        </#if>
+
+        <#if properties.scripts?has_content>
+            <#list properties.scripts?split(' ') as script>
+        <script type="text/javascript" src="${resourceUrl}/${script}"></script>
+            </#list>
+        </#if>
+    </head>
+
+    <body>
+
         <script>
             var keycloak = Keycloak('${authUrl}/realms/${realm.name}/account/keycloak.json');
-            keycloak.init({onLoad: 'check-sso'}).success(function(authenticated) {
-                var loadjs = function (url,loadListener) {
+            var loadjs = function (url,loadListener) {
                     const script = document.createElement("script");
                     script.src = resourceUrl + url;
                     if (loadListener) script.addEventListener("load", loadListener);
                     document.head.appendChild(script);
                 };
+            keycloak.init({onLoad: 'check-sso'}).success(function(authenticated) {
                 loadjs("/node_modules/core-js/client/shim.min.js", function(){
                     loadjs("/node_modules/zone.js/dist/zone.min.js");
                     loadjs("/node_modules/systemjs/dist/system.src.js", function() {
@@ -97,26 +116,6 @@
         </script>
 
 
-   <!-- TODO: We should save these css and js into variables and then load in
-        main.ts for better performance.  These might be loaded twice.
-        -->
-        <#if properties.styles?has_content>
-            <#list properties.styles?split(' ') as style>
-        <link href="${resourceUrl}/${style}" rel="stylesheet"/>
-            </#list>
-    <a href="../../../../../../../../keycloak-quickstarts/app-profile-jee-html5/src/main/webapp/index.html"></a>
-        </#if>
-
-        <#if properties.scripts?has_content>
-            <#list properties.scripts?split(' ') as script>
-        <script type="text/javascript" src="${resourceUrl}/${script}"></script>
-            </#list>
-        </#if>
-        </head>
-    <body>
-
-
-
 <!-- Top Navigation -->
         <nav class="navbar navbar-pf-alt">
 
@@ -151,7 +150,7 @@
 
 <!--Top Nav -->
 
-<!-- Home Page --->
+<!-- Home Page -->
 
     <div class="cards-pf" id="welcomeScreen">
         <div class="text-center">
@@ -232,8 +231,8 @@
 
         <script>
             var winHash = window.location.hash;
-            if (winHash.startsWith('#/') && !winHash.startsWith('#/&state')) {
-                document.getElementById("welcomeScreen").style.visibility='hidden';
+            if ((winHash.indexOf('#/') == 0) && (!winHash.indexOf('#/&state') == 0)) {
+                document.getElementById("welcomeScreen").style.display='none';
             }
         </script>
 
diff --git a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/app.component.ts b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/app.component.ts
index 72a19af0e1..48ffac0154 100644
--- a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/app.component.ts
+++ b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/app.component.ts
@@ -54,7 +54,9 @@ export class AppComponent implements MenuClickListener {
                 if (navEnd.url !== '/') {
                     this.showSideNav = true;
                     var welcomeScreen = document.getElementById('welcomeScreen')
-                    if (welcomeScreen) welcomeScreen.remove();
+                    
+                    // must use removeChild() -- remove() not available on IE 11
+                    if (welcomeScreen) welcomeScreen.parentNode.removeChild(welcomeScreen);
                 }
             }
         });
diff --git a/themes/src/main/resources/theme/keycloak-preview/account/resources/systemjs-angular-loader.js b/themes/src/main/resources/theme/keycloak-preview/account/resources/systemjs-angular-loader.js
index 4d3e127369..3990219e0e 100644
--- a/themes/src/main/resources/theme/keycloak-preview/account/resources/systemjs-angular-loader.js
+++ b/themes/src/main/resources/theme/keycloak-preview/account/resources/systemjs-angular-loader.js
@@ -10,6 +10,11 @@ module.exports.translate = function(load){
 
   basePathParts.pop();
   var basePath = basePathParts.join('/');
+  
+  // basePath leaves out leading slash on IE 11
+  if (!basePath.startsWith('/')) {
+      basePath = '/' + basePath;
+  }
 
   var baseHref = document.createElement('a');
   baseHref.href = this.baseURL;