From: Stephen Cameron <stephen@cubedesigners.com>
Date: Mon, 2 Oct 2017 15:22:54 +0000 (+0200)
Subject: Done #1707 @3
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=4c3707f24c7f04ef795c4c0674c9a65c73b6c785;p=fluidbook-html5.git

Done #1707 @3
---

diff --git a/js/libs/fluidbook/fluidbook.help.js b/js/libs/fluidbook/fluidbook.help.js
index c85e96de..1a739ebe 100644
--- a/js/libs/fluidbook/fluidbook.help.js
+++ b/js/libs/fluidbook/fluidbook.help.js
@@ -64,7 +64,7 @@ FluidbookHelp.prototype = {
 				return;
 			}
 
-			var icon = $(this).find('.svg-icon');
+			var icon = $(this).find('.nav-icon');
 			var offset = icon.offset();
 			var left;
 
diff --git a/js/libs/fluidbook/fluidbook.nav.js b/js/libs/fluidbook/fluidbook.nav.js
index 217a8ec5..521bd451 100644
--- a/js/libs/fluidbook/fluidbook.nav.js
+++ b/js/libs/fluidbook/fluidbook.nav.js
@@ -304,6 +304,19 @@ FluidbookNav.prototype = {
         //     navOrder.push(navOrder.splice(localeIconIndex, 1)[0]); // Push to end of array
         // }
 
+
+        // Backwards compatibility for old "afterSearch" setting to work with new "extra" link
+        if (this.fluidbook.datas.afterSearch != '' && this.fluidbook.datas.afterSearchLink != '' && this.fluidbook.datas.themeEnableAfterSearch) {
+
+            // Only override "extra" link values if they're not already set
+            if (this.fluidbook.datas.navExtraImage == '' && this.fluidbook.datas.navExtraLink == '') {
+                this.fluidbook.datas.navExtraImage = this.fluidbook.datas.afterSearch;
+                this.fluidbook.datas.navExtraLink = this.fluidbook.datas.afterSearchLink;
+                this.fluidbook.datas.navExtraTooltip = this.fluidbook.datas.afterSearchTooltip;
+            }
+        }
+
+
         for (var i in navOrder) {
             var icon = navOrder[i];
             //var visible = hide.indexOf(icon) == -1;
@@ -428,12 +441,13 @@ FluidbookNav.prototype = {
 
                 if (navType == 'horizontalNav') {
                     navExtraImage = this.fluidbook.datas.navExtraImage;
+                    link = '<a id="' + elementID + '" data-tooltip="'+ this.fluidbook.datas.navExtraTooltip +'" href="' + this.fluidbook.datas.navExtraLink + '"><img class="nav-icon" src="data/images/' + navExtraImage + '"></a>';
+
                 } else if (navType == 'menu') {
                     navExtraImage = this.fluidbook.datas.navExtraImageMobile || this.fluidbook.datas.navExtraImage; // Fallback to desktop image
+                    link = '<a id="' + elementID + '" href="' + this.fluidbook.datas.navExtraLink + '"><img class="nav-icon" src="data/images/' + navExtraImage + '"><span class="menu-item-title">' + this.fluidbook.datas.navExtraTooltip + '</span></a>';
                 }
 
-                link = '<a id="' + elementID + '" href="' + this.fluidbook.datas.navExtraLink + '"><img src="data/images/' + navExtraImage + '"></a>';
-
                 $nav.find('ul').append('<li>' + link + '</li>');
 
 
@@ -444,10 +458,6 @@ FluidbookNav.prototype = {
             // }
         }
 
-
-        if (this.fluidbook.datas.afterSearch != '' && this.fluidbook.datas.themeEnableAfterSearch) {
-            this.setAfterSearch();
-        }
         this.setInterface();
 
         if (navType == 'menu') {
@@ -790,9 +800,7 @@ FluidbookNav.prototype = {
         $('#search').remove();
         return searchHTML;
     },
-    setAfterSearch: function () {
-        this.menu.find('ul').append('<div id="afterSearch"><div class="c interface-search">' + getSpriteIcon('interface-search') + '</div><div class="links">' + this.fluidbook.datas.links.aftersearch + '</div></div>');
-    },
+
     setInterface: function () {
 
         // Ensure we don't add interface elements more than once
diff --git a/js/libs/fluidbook/fluidbook.utils.js b/js/libs/fluidbook/fluidbook.utils.js
index 459da1e6..61bbeb0a 100644
--- a/js/libs/fluidbook/fluidbook.utils.js
+++ b/js/libs/fluidbook/fluidbook.utils.js
@@ -69,7 +69,7 @@ function getSpriteIcon(icon, attrs) {
         attrs.class += ' ' + icon;
     }
 
-    attrs.class += ' svg-icon'; // Common class for all icons
+    attrs.class += ' nav-icon svg-icon'; // Common class for all icons
 
     $.each(attrs, function (k, v) {
         a.push(k + '="' + v + '"');
diff --git a/style/mmenu/mmenu.less b/style/mmenu/mmenu.less
index 9c4725ea..2890cc81 100644
--- a/style/mmenu/mmenu.less
+++ b/style/mmenu/mmenu.less
@@ -174,6 +174,11 @@ html.mm-opening .mm-menu.mm-opened[class*=mm-pagedim]~#mm-blocker {
     height: 26px;
     vertical-align: middle;
   }
+
+  // The "extra" image in the menu
+  .nav-icon {
+    margin-right: 0;
+  }
 }
 
 #menu #menuClose { // Extra specificity needed to override MMenu RTL styles