From 0c0af99bb762a040df8e9a36f69d78179004c802 Mon Sep 17 00:00:00 2001
From: Stephen Cameron <stephen@cubedesigners.com>
Date: Wed, 6 Sep 2017 19:07:37 +0200
Subject: [PATCH] Done #1647 @2

---
 js/libs/fluidbook/fluidbook.nav.js | 34 ++++++++++++++++++++++++++----
 style/nav-horizontal.less          |  7 ++++++
 2 files changed, 37 insertions(+), 4 deletions(-)

diff --git a/js/libs/fluidbook/fluidbook.nav.js b/js/libs/fluidbook/fluidbook.nav.js
index 67507ba5..d80ff7cf 100644
--- a/js/libs/fluidbook/fluidbook.nav.js
+++ b/js/libs/fluidbook/fluidbook.nav.js
@@ -259,16 +259,16 @@ FluidbookNav.prototype = {
 
 
         // All possible icons and default ordering
-        var all = "index,chapters,search,friend,print,bookmark,archives,basket,fullscreen,sound,3d,help,lang".split(",");
+        var all = "extra,index,chapters,search,friend,print,bookmark,archives,basket,fullscreen,sound,3d,help,lang".split(",");
         // var hide = array_diff(all, this.fluidbook.datas.navOrder); // Array of icons that aren't in the navOrder list and should be hidden
         // var loop = [].concat(this.fluidbook.datas.navOrder).concat(hide);
         var loop = this.fluidbook.datas.navOrder;
         var localeIconIndex;
 
         // If the locales icon is included, it should always be placed last in the list for formatting reasons
-        if ((localeIconIndex = loop.indexOf('lang')) !== -1) {
-            loop.push(loop.splice(localeIconIndex, 1)[0]); // Push to end of array
-        }
+        // if ((localeIconIndex = loop.indexOf('lang')) !== -1) {
+        //     loop.push(loop.splice(localeIconIndex, 1)[0]); // Push to end of array
+        // }
 
         for (var e in loop) {
             var icon = loop[e];
@@ -398,6 +398,32 @@ FluidbookNav.prototype = {
                     link = this.addLink(navType, 'interface-search', '#', 'searchIcon', 'search', 'search');
                 }
 
+            } else if (icon == 'extra') {
+
+                if (this.fluidbook.datas.navExtraImage == '' || this.fluidbook.datas.navExtraLink == '') {
+                    continue;
+                }
+
+                var id = 'extra',
+                    $nav = this.getNavFromType(navType),
+                    elementID = navType + '_' + id,
+                    navExtraImage;
+
+                if ($nav.find('#' + elementID).length > 0) {
+                    continue;
+                }
+
+                if (navType == 'horizontalNav') {
+                    navExtraImage = this.fluidbook.datas.navExtraImage;
+                } 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 src="data/images/' + navExtraImage + '"></a>';
+
+                $nav.find('ul').append('<li>' + link + '</li>');
+
+
             }
 
             // if (!visible) {
diff --git a/style/nav-horizontal.less b/style/nav-horizontal.less
index 55ab26cf..551b49f6 100644
--- a/style/nav-horizontal.less
+++ b/style/nav-horizontal.less
@@ -38,6 +38,13 @@
       }
     }
   }
+
+  // Optional extra image
+  &_extra {
+    img {
+      vertical-align: middle;
+    }
+  }
 }
 
 #iconList {
-- 
2.39.5