tdf#124245 Polyfills and fixes for IE11

The polyfills can be removed after we drop IE11 support.

Other IE11 fixes:

Change from document.URL to window.location.pathname
because otherwise we get local Windows paths with backward
slashes.

Use clear: left; for google-donation element so it doesn't
float on top of other elements.

Don't use defer to load fuzzysort.js and prism.js.

Change-Id: I6c0143eab555c8b1fbdbde8e749a24baed2f69c8
Reviewed-on: https://gerrit.libreoffice.org/69549
Tested-by: Jenkins
Reviewed-by: himajin100000 <himajin100000@gmail.com>
Reviewed-by: Olivier Hallot <olivier.hallot@libreoffice.org>

8 files changed, 203 insertions, 94 deletions

diff --git a/Package_html_static.mk b/Package_html_static.mk
index a539298780..d1ebbbb1b3 100644
--- a/Package_html_static.mk
+++ b/Package_html_static.mk
@@ -23,6 +23,7 @@ $(eval $(call gb_Package_add_files,helpcontent2_html_static,$(LIBO_SHARE_HELP_FO
 	help2.js \
 	normalize.css \
 	paginathing.js \
+	polyfills.js \
 	prism.js \
         prism.css \
 ))
diff --git a/help3xsl/default.css b/help3xsl/default.css
index 391403e724..91b0a9adcb 100644
--- a/help3xsl/default.css
+++ b/help3xsl/default.css
@@ -349,7 +349,7 @@ h6 {
     background-color: #18A303;
     z-index: 1000;
 }
-header {    
+header {
     color: #fff;
     height: 64px;
     padding: 8px 8px 8px 16px;
@@ -793,6 +793,7 @@ li.disabled a {
         top: 0px;
         background-color: #FCFCFC;
         box-shadow: none;
+        clear: left;
     }
     .donation {
         max-width: 400px;
diff --git a/help3xsl/help.js b/help3xsl/help.js
index e806eeed4f..7789c17aea 100644
--- a/help3xsl/help.js
+++ b/help3xsl/help.js
@@ -8,7 +8,7 @@
  */
 
 // Pagination and fuzzy search
-var url = document.URL;
+var url = window.location.pathname;
 var moduleRegex = new RegExp('text\\/(\\w+)\\/');
 var regexArray = moduleRegex.exec(url);
 var currentModule = null;
diff --git a/help3xsl/help2.js b/help3xsl/help2.js
index 0003b72d82..f62105dc62 100644
--- a/help3xsl/help2.js
+++ b/help3xsl/help2.js
@@ -82,13 +82,14 @@ for (z = 0; z < n; z++) {
 /* add &DbPAR= and &System= to the links in DisplayArea div */
 /* skip for object files */
 function fixURL(module, system) {
-    var itemlink = document.getElementById("DisplayArea").getElementsByTagName("a");
+    if ((DisplayArea = document.getElementById("DisplayArea")) === null) return;
+    var itemlink = DisplayArea.getElementsByTagName("a");
     var pSystem = (system === null) ? getSystem() : system;
     var pAppl = (module === null) ? "WRITER" : module;
     var n = itemlink.length;
     for (var i = 0; i < n; i++) {
-        if (itemlink[i].getAttribute("class") != "objectfiles"){
-        setURLParam(itemlink[i], pSystem, pAppl);
+        if (itemlink[i].getAttribute("class") != "objectfiles") {
+            setURLParam(itemlink[i], pSystem, pAppl);
         }
     }
 }
@@ -203,12 +204,16 @@ if (document.body.getElementsByTagName('meta')) {
 var module = getParameterByName("DbPAR");
 var helpID = getParameterByName("HID");
 fixURL(module,system);
-var dbg = getParameterByName("Debug");
-if (dbg == null) { dbg=0; }
-document.getElementById("DEBUG").style.display = (dbg == 0) ? "none":"block";
-document.getElementById("bm_module").innerHTML ="Module is: "+module;
-document.getElementById("bm_system").innerHTML ="System is: "+system;
-document.getElementById("bm_HID").innerHTML ="HID is: "+helpID;
+
+function debugInfo(dbg) {
+    if (dbg == null) return;
+    document.getElementById("DEBUG").style.display = "block";
+    document.getElementById("bm_module").innerHTML = "Module is: "+module;
+    document.getElementById("bm_system").innerHTML = "System is: "+system;
+    document.getElementById("bm_HID").innerHTML = "HID is: "+helpID;
+}
+
+debugInfo(getParameterByName("Debug"));
 
 // Mobile devices need the modules and langs on page load
 if (Math.max(document.documentElement.clientWidth, window.innerWidth || 0) < 960) {
diff --git a/help3xsl/index2.html b/help3xsl/index2.html
index 0321b7a390..3f761885fe 100644
--- a/help3xsl/index2.html
+++ b/help3xsl/index2.html
@@ -10,61 +10,65 @@
 <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
     <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline' 'unsafe-eval' piwik.documentfoundation.org *.google.com *.googleapis.com"/>
-    <script type="text/javascript" src="help2.js"></script>
+    <script type="text/javascript" src="polyfills.js"></script>
     <script type="text/javascript" src="hid2file.js"></script>
     <script type="text/javascript" src="languages.js"></script>
+    <script type="text/javascript" src="help2.js" defer></script>
 </head>
 <body>
 <script type="text/javascript">
-    var url = window.location.href;
-    var n = url.indexOf('index.html?');
-    if (n != -1) {
-        // the URL came from LibreOffice help (F1)
-        var target = getParameterByName("Target",url);
-        var lang = existingLang(getParameterByName("Language", url));
-        var system = getParameterByName("System", url);
-        var module;
-        var defaultFile;
-        var smodule = target.substr(0, target.indexOf('/'));
-        switch (smodule) {
-            case "swriter":   {defaultFile='text/swriter/main0000.html';module="WRITER";break;}
-            case "scalc":     {defaultFile='text/scalc/main0000.html';module="CALC";break;}
-            case "schart":    {defaultFile='text/schart/main0000.html';module="CHART";break;}
-            case "simpress":  {defaultFile='text/simpress/main0000.html';module="IMPRESS";break;}
-            case "sdraw":     {defaultFile='text/sdraw/main0000.html';module="DRAW";break;}
-            case "smath":     {defaultFile='text/smath/main0000.html';module="MATH";break;}
-            case "sdatabase": {defaultFile='text/shared/explorer/database/main.html';module="BASE";break;}
-            case "sbasic":    {defaultFile='text/sbasic/shared/main0601.html';module="BASIC";break;}
-            default:          {defaultFile='text/shared/05/new_help.html';module="WRITER";break;}
-        }
-        //Special case of application F1 or menu  Help -> LibreOffice Help
-        if (target.indexOf('.uno:HelpIndex') != -1) {
-        window.location.href = lang + '/' + defaultFile + '?System=' + system + '&DbPAR=' + module;
-        }
-        var bookmark = target.slice(target.indexOf('/') + 1, target.length);
-        var file = hid2fileMap[bookmark];
-        // check first if a root bookmark @@nowidget@@ can be used
-        if (file === undefined) {
-            var b2 = bookmark.substring(0, bookmark.lastIndexOf("/")) + '/@@nowidget@@';
-            file = hid2fileMap[b2];
-        }
-        // rebuild URL
-        if (file === undefined) {
-            var newURL = lang + '/' + defaultFile + '?System=' + system + '&DbPAR=' + module;
+    // We have to wait until both the deferred help2.js and the document have loaded
+    window.addEventListener('DOMContentLoaded', function() {
+        var url = window.location.href;
+        var n = url.indexOf('index.html?');
+        if (n != -1) {
+            // the URL came from LibreOffice help (F1)
+            var target = getParameterByName("Target",url);
+            var lang = existingLang(getParameterByName("Language", url));
+            var system = getParameterByName("System", url);
+            var module;
+            var defaultFile;
+            var smodule = target.substr(0, target.indexOf('/'));
+            switch (smodule) {
+                case "swriter":   {defaultFile='text/swriter/main0000.html';module="WRITER";break;}
+                case "scalc":     {defaultFile='text/scalc/main0000.html';module="CALC";break;}
+                case "schart":    {defaultFile='text/schart/main0000.html';module="CHART";break;}
+                case "simpress":  {defaultFile='text/simpress/main0000.html';module="IMPRESS";break;}
+                case "sdraw":     {defaultFile='text/sdraw/main0000.html';module="DRAW";break;}
+                case "smath":     {defaultFile='text/smath/main0000.html';module="MATH";break;}
+                case "sdatabase": {defaultFile='text/shared/explorer/database/main.html';module="BASE";break;}
+                case "sbasic":    {defaultFile='text/sbasic/shared/main0601.html';module="BASIC";break;}
+                default:          {defaultFile='text/shared/05/new_help.html';module="WRITER";break;}
+            }
+            //Special case of application F1 or menu  Help -> LibreOffice Help
+            if (target.indexOf('.uno:HelpIndex') != -1) {
+            window.location.href = lang + '/' + defaultFile + '?System=' + system + '&DbPAR=' + module;
+            }
+            var bookmark = target.slice(target.indexOf('/') + 1, target.length);
+            var file = hid2fileMap[bookmark];
+            // check first if a root bookmark @@nowidget@@ can be used
+            if (file === undefined) {
+                var b2 = bookmark.substring(0, bookmark.lastIndexOf("/")) + '/@@nowidget@@';
+                file = hid2fileMap[b2];
+            }
+            // rebuild URL
+            if (file === undefined) {
+                var newURL = lang + '/' + defaultFile + '?System=' + system + '&DbPAR=' + module;
+            } else {
+                var indx = file.indexOf('#');
+                var bm = file.substr(indx,file.length);
+                file = file.substr(0,indx);
+                var newURL = lang + '/' + file + '?System=' + system + '&DbPAR=' + module + '&HID=' + bookmark + bm;
+            }
+            window.location.href = newURL;
         } else {
-            var indx = file.indexOf('#');
-            var bm = file.substr(indx,file.length);
-            file = file.substr(0,indx);
-            var newURL = lang + '/' + file + '?System=' + system + '&DbPAR=' + module + '&HID=' + bookmark + bm;
+            // URL came from elsewhere, direct access to webroot, we redirect to main Help page
+            var system = 'WIN';
+            if (navigator.userAgent.indexOf("Mac") != -1) system = 'MAC';
+            if (navigator.userAgent.indexOf("Linux") != -1) system = 'UNIX';
+            window.location.href = existingLang(navigator.language) + '/text/shared/05/new_help.html?&DbPAR=WRITER&System=' + system;
         }
-        window.location.href = newURL;
-    } else {
-        // URL came from elsewhere, direct access to webroot, we redirect to main Help page
-        var system = 'WIN';
-        if (navigator.userAgent.indexOf("Mac") != -1) system = 'MAC';
-        if (navigator.userAgent.indexOf("Linux") != -1) system = 'UNIX';
-        window.location.href = existingLang(navigator.language) + '/text/shared/05/new_help.html?&DbPAR=WRITER&System=' + system;
-    }
+    });
 </script>
 </body>
 </html>
diff --git a/help3xsl/online_transform.xsl b/help3xsl/online_transform.xsl
index f3b71bac9c..630aa8a938 100644
--- a/help3xsl/online_transform.xsl
+++ b/help3xsl/online_transform.xsl
@@ -94,7 +94,7 @@
 <xsl:variable name="linkpostfix" select="''"/>
 
 <!-- images for notes, tips and warnings -->
-<xsl:variable name="iconsizestyle" select="'width:40px;height=40px;'"/>
+<xsl:variable name="iconsizestyle" select="'width:40px;height:40px;'"/>
 <xsl:variable name="note_img" select="concat($img_url_prefix,'icon-themes/res/helpimg/note.svg')"/>
 <xsl:variable name="tip_img" select="concat($img_url_prefix,'icon-themes/res/helpimg/tip.svg')"/>
 <xsl:variable name="warning_img" select="concat($img_url_prefix,'icon-themes/res/helpimg/warning.svg')"/>
@@ -149,15 +149,16 @@
         <link  type="text/css" href="{$target}normalize.css" rel="Stylesheet"/>
         <link  type="text/css" href="{$target}default.css" rel="Stylesheet"/>
         <link  type="text/css" href="{$target}prism.css" rel="Stylesheet"/>
-        <script type="text/javascript" src="{$target}help2.js" defer=""/>
-        <script type="text/javascript" src="{$target}languages.js" defer=""/>
-        <script type="text/javascript" src="{$target}{$lang}/langnames.js" defer=""/>
-        <script type="text/javascript" src="{$target}fuzzysort.js" defer=""/>
-        <script type="text/javascript" src="{$target}paginathing.js" defer=""/>
-        <script type="text/javascript" src="{$target}prism.js" defer=""/>
-        <script type="text/javascript" src="{$target}{$lang}/bookmarks.js" defer=""/>
-        <script type="text/javascript" src="{$target}{$lang}/contents.js" defer=""/>
-        <script type="text/javascript" src="{$target}help.js" defer=""/>
+        <script type="text/javascript" src="{$target}polyfills.js"></script>
+        <script type="text/javascript" src="{$target}languages.js"></script>
+        <script type="text/javascript" src="{$target}fuzzysort.js"></script>
+        <script type="text/javascript" src="{$target}prism.js"></script>
+        <script type="text/javascript" src="{$target}help2.js" defer=""></script>
+        <script type="text/javascript" src="{$target}{$lang}/langnames.js" defer=""></script>
+        <script type="text/javascript" src="{$target}paginathing.js" defer=""></script>
+        <script type="text/javascript" src="{$target}{$lang}/bookmarks.js" defer=""></script>
+        <script type="text/javascript" src="{$target}{$lang}/contents.js" defer=""></script>
+        <script type="text/javascript" src="{$target}help.js" defer=""></script>
         <meta name="viewport" content="width=device-width,initial-scale=1"/>
     </head>
     <body itemscope="true" itemtype="http://schema.org/TechArticle">
diff --git a/help3xsl/paginathing.js b/help3xsl/paginathing.js
index 81edf3e0d8..cd52b3637f 100644
--- a/help3xsl/paginathing.js
+++ b/help3xsl/paginathing.js
@@ -29,31 +29,6 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-// Polyfill for .before()
-// from: https://github.com/jserz/js_piece/blob/master/DOM/ChildNode/before()/before().md
-(function (arr) {
-  arr.forEach(function (item) {
-    if (item.hasOwnProperty('before')) {
-      return;
-    }
-    Object.defineProperty(item, 'before', {
-      configurable: true,
-      enumerable: true,
-      writable: true,
-      value: function before() {
-        var argArr = Array.prototype.slice.call(arguments),
-          docFrag = document.createDocumentFragment();
-
-        argArr.forEach(function (argItem) {
-          var isNode = argItem instanceof Node;
-          docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem)));
-        });
-
-        this.parentNode.insertBefore(docFrag, this);
-      }
-    });
-  });
-})([Element.prototype, CharacterData.prototype, DocumentType.prototype]);
 
 var options = {
     perPage: 20,
diff --git a/help3xsl/polyfills.js b/help3xsl/polyfills.js
new file mode 100644
index 0000000000..ae5bc93834
--- /dev/null
+++ b/help3xsl/polyfills.js
@@ -0,0 +1,122 @@
+/* -*- Mode: C++; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*- */
+// This file can be removed, when we stop supporting IE11.
+// Polyfill for .before()
+// from: https://github.com/jserz/js_piece/blob/master/DOM/ChildNode/before()/before().md
+// Copyright (c) 2016-present, jszhou
+// MIT License
+(function (arr) {
+  arr.forEach(function (item) {
+    if (item.hasOwnProperty('before')) {
+      return;
+    }
+    Object.defineProperty(item, 'before', {
+      configurable: true,
+      enumerable: true,
+      writable: true,
+      value: function before() {
+        var argArr = Array.prototype.slice.call(arguments),
+          docFrag = document.createDocumentFragment();
+
+        argArr.forEach(function (argItem) {
+          var isNode = argItem instanceof Node;
+          docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem)));
+        });
+
+        this.parentNode.insertBefore(docFrag, this);
+      }
+    });
+  });
+})([Element.prototype, CharacterData.prototype, DocumentType.prototype]);
+// Polyfill for .startsWith()
+// from: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith#Polyfill
+if (!String.prototype.startsWith) {
+    Object.defineProperty(String.prototype, 'startsWith', {
+        value: function(search, pos) {
+            pos = !pos || pos < 0 ? 0 : +pos;
+            return this.substring(pos, pos + search.length) === search;
+        }
+    });
+}
+// Polyfill for .matches()
+// from: https://developer.mozilla.org/en-US/docs/Web/API/Element/matches#Polyfill
+if (!Element.prototype.matches) {
+  Element.prototype.matches = Element.prototype.msMatchesSelector ||
+                              Element.prototype.webkitMatchesSelector;
+}
+// Polyfill for iterable Set (IE11)
+// from: https://stackoverflow.com/a/45686452/3057764
+if (new Set([0]).size === 0) {
+    //constructor doesnt take an iterable as an argument - thanks IE
+    const BuiltinSet = Set;
+    Set = function Set(iterable) {
+        const set = new BuiltinSet();
+        if (iterable) {
+            iterable.forEach(set.add, set);
+        }
+        return set;
+    };
+    Set.prototype = BuiltinSet.prototype;
+    Set.prototype.constructor = Set;
+}
+// Polyfill for using :scope in querySelector/querySelectorAll
+// from: https://github.com/lazd/scopedQuerySelectorShim
+// Copyright (C) 2015 Larry Davis
+// This software may be modified and distributed under the terms of the BSD license.
+(function() {
+    if (!HTMLElement.prototype.querySelectorAll) {
+        throw new Error("rootedQuerySelectorAll: This polyfill can only be used with browsers that support querySelectorAll");
+    }
+    // A temporary element to query against for elements not currently in the DOM
+    // We'll also use this element to test for :scope support
+    var container = document.createElement("div");
+    // Check if the browser supports :scope
+    try {
+        // Browser supports :scope, do nothing
+        container.querySelectorAll(":scope *");
+    } catch (e) {
+        // Match usage of scope
+        var scopeRE = /^\s*:scope/gi;
+        // Overrides
+        function overrideNodeMethod(prototype, methodName) {
+            // Store the old method for use later
+            var oldMethod = prototype[methodName];
+            // Override the method
+            prototype[methodName] = function(query) {
+                var nodeList, gaveId = false, gaveContainer = false;
+                if (query.match(scopeRE)) {
+                    // Remove :scope
+                    query = query.replace(scopeRE, "");
+                    if (!this.parentNode) {
+                        // Add to temporary container
+                        container.appendChild(this);
+                        gaveContainer = true;
+                    }
+                    parentNode = this.parentNode;
+                    if (!this.id) {
+                        // Give temporary ID
+                        this.id = "rootedQuerySelector_id_" + new Date().getTime();
+                        gaveId = true;
+                    }
+                    // Find elements against parent node
+                    nodeList = oldMethod.call(parentNode, "#" + this.id + " " + query);
+                    // Reset the ID
+                    if (gaveId) {
+                        this.id = "";
+                    }
+                    // Remove from temporary container
+                    if (gaveContainer) {
+                        container.removeChild(this);
+                    }
+                    return nodeList;
+                } else {
+                    // No immediate child selector used
+                    return oldMethod.call(this, query);
+                }
+            };
+        }
+        // Browser doesn't support :scope, add polyfill
+        overrideNodeMethod(HTMLElement.prototype, "querySelector");
+        overrideNodeMethod(HTMLElement.prototype, "querySelectorAll");
+    }
+})();
+/* vim:set shiftwidth=4 softtabstop=4 expandtab cinoptions=b1,g0,N-s cinkeys+=0=break: */