]> _ Git - fluidbook-html5.git/commitdiff
Fix #1569 @3.75
authorStephen Cameron <stephen@cubedesigners.com>
Thu, 13 Jul 2017 16:53:08 +0000 (18:53 +0200)
committerStephen Cameron <stephen@cubedesigners.com>
Thu, 13 Jul 2017 16:53:08 +0000 (18:53 +0200)
js/libs/fluidbook/fluidbook.help.js
js/libs/fluidbook/fluidbook.nav.js

index 424c44da3a15101aaed80968c1e1deaa993bedc3..a1efedd52bd5dc6c6486ffa93d7a8457fc2cde88 100644 (file)
@@ -105,7 +105,7 @@ FluidbookHelp.prototype = {
        initEvents: function() {\r
                var $this = this;\r
                if (!this.fluidbook.support.isMobile) {\r
-                       $("#help").click(function(e) {\r
+                       $(document).on('click', '.icon-help', function(e) {\r
                                $this.show();\r
                                if (fluidbook.nav.menuIsOpen) {\r
                                        fluidbook.nav.menuAPI.close();\r
@@ -117,7 +117,7 @@ FluidbookHelp.prototype = {
                                return false;\r
                        }*/);\r
                } else {\r
-                       $("#help").click(function() {\r
+                       $(document).on('click', '.icon-help', function() {\r
                                $this.show();\r
                                return false;\r
                        });\r
index 4de957c2d07ebc24bcd3b612eddf686a5ac97b2b..c750de27d9508cad2b0836fbd3062a951698bee6 100644 (file)
@@ -81,9 +81,10 @@ FluidbookNav.prototype = {
     // },
     addLink: function (navType, name, href, id, title, help, before, className, showIcon) {
 
-        var $nav = this.getNavFromType(navType);
+        var $nav = this.getNavFromType(navType),
+            elementID = navType + '_' + id;
 
-        if ($nav.find('#' + id).length > 0) {
+        if ($nav.find('#' + elementID).length > 0) {
             return;
         }
         var l = $(this.getLink(name, href, id, title, help, className, showIcon, navType)),
@@ -103,7 +104,16 @@ FluidbookNav.prototype = {
         var res = '';
 
         if (id != undefined) {
-            res += ' id="' + id + '"';
+
+            // Make sure that the link gets a unique ID when it is used in both menus
+            var elementID = (navType == undefined) ? id : navType + '_' + id;
+
+            res += ' id="' + elementID + '"';
+
+            // Links may exist more than once so add a class name based on the ID
+            // This class name can be used by event handlers to handle all instances
+            // For more specific behaviour, the ID can be targeted
+            className = (className == undefined) ? 'icon-' + id : className + ' icon-' + id;
         }
         if (className != undefined) {
             res += ' class="' + className + '"';
@@ -234,26 +244,23 @@ FluidbookNav.prototype = {
 
                 }
 
-                $('#home').on('click', function () {
-                    var $this = this;
-                    fluidbook.displayLoader();
-                    setTimeout(function () {
-                        window.location = $($this).attr('href');
-                    }, 500);
-                    return false;
-                })
             } else if (icon == 'index') {
                 link = this.addLink(navType, 'interface-index', '#/index', 'index', 'overview', 'overview');
             } else if (icon == 'chapters') {
                 if (this.fluidbook.datas.displayChaptersIcon) {
                     if (this.fluidbook.datas.chaptersPage != '') {
                         link = this.addLink(navType, 'interface-chapters', '#/page/' + this.fluidbook.datas.chaptersPage, 'chapters', 'chapters', 'chapters');
-                    } else if (navType == 'menu' && this.fluidbook.datas.chapters.length > 0) {
-                        // this.addLink('nav-sommaire', '#/chapters', 'chapters', 'chapters');
-                        link = this.addLink(navType, 'interface-chapters', '', 'chapters', 'chapters', 'chapters');
+                    } else if (this.fluidbook.datas.chapters.length > 0) {
 
-                        // Get HTML for submenus (appended later)
-                        this.chaptersMenuHTML = this.makeChapterLists(this.fluidbook.datas.chapters);
+                        if (navType == 'menu') {
+                            link = this.addLink(navType, 'interface-chapters', '', 'chapters', 'chapters', 'chapters');
+
+                            // Get HTML for submenus (appended later)
+                            this.chaptersMenuHTML = this.makeChapterLists(this.fluidbook.datas.chapters);
+
+                        } else {
+                            link = this.addLink(navType, 'interface-chapters', '#/chapters', 'chapters', 'chapters', 'chapters');
+                        }
                     }
                 }
 
@@ -264,13 +271,6 @@ FluidbookNav.prototype = {
 
                     if (this.fluidbook.datas.share) {
                         link = this.addLink(navType, 'interface-share', '#/share', 'share', 'share', 'share');
-                        $("#share").click(function () {
-                            if ($this.fluidbook.datas.phonegap != 'android') {
-                                return true;
-                            }
-                            $this.fluidbook.intentShare();
-                            return false;
-                        });
                     }
 
                 } else if (navType == 'menu') {
@@ -311,85 +311,40 @@ FluidbookNav.prototype = {
                 }
 
 
-            } else if (icon == 'bookmark') {
-                if (this.fluidbook.datas.bookmark) {
-                    link = this.addLink(navType, 'interface-bookmarks', '#/bookmark', 'bookmarks', 'bookmarks', 'bookmarks');
-                    $("#bookmarks").click(function () {
-                        if (!$this.fluidbook.bookmarks.hasBookmarkedPages()) {
-                            var message = $this.fluidbook.l10n.__("you don't have any bookmarks");
-                            if ($this.fluidbook.datas.phonegap) {
-                                navigator.notification.alert(message, function () {
-                                }, $this.fluidbook.l10n.__('bookmarks'));
-                            } else {
-                                window.alert(message);
-                            }
-                            return false;
-                        }
-                    });
-                }
-            } else if (icon == 'pdf') {
-                if ($("#download").length == 0 && this.fluidbook.datas.pdf) {
-                    link = this.addLink(navType, 'interface-download', '#', 'download', 'download', 'download');
-                    $("#download").on('click', function () {
-                        $this.fluidbook.print();
-                        return false;
-                    });
-                }
-            } else if (icon == 'print') {
-                if ($("#print").length == 0 && this.fluidbook.datas.print) {
-                    link = this.addLink(navType, 'interface-print', '#', 'print', 'print', 'print');
-                    $("#print").on('click', function () {
-                        $this.fluidbook.print();
-                        return false;
-                    });
-                }
-            } else if (icon == 'lang') {
-                if (this.fluidbook.l10n.multilangEnabled) {
-                    link = this.addMultilangLink();
-                }
+            } else if (icon == 'bookmark' && this.fluidbook.datas.bookmark) {
+                link = this.addLink(navType, 'interface-bookmarks', '#/bookmark', 'bookmarks', 'bookmarks', 'bookmarks');
+
+            } else if (icon == 'pdf' && this.fluidbook.datas.pdf) {
+                link = this.addLink(navType, 'interface-download', '#', 'download', 'download', 'download');
+
+            } else if (icon == 'print' && this.fluidbook.datas.print) {
+                link = this.addLink(navType, 'interface-print', '#', 'print', 'print', 'print');
+
+            } else if (icon == 'lang' && this.fluidbook.l10n.multilangEnabled) {
+                link = this.addMultilangLink();
+
             } else if (icon == 'archives') {
                 if (this.fluidbook.datas.archivesLink != '') {
                     link = this.addLink(navType, 'nav-archives', this.fluidbook.datas.archivesLink, 'archives', '!' + this.fluidbook.datas.archivesLabel, '!' + this.fluidbook.datas.archivesLabel);
                 } else if (this.fluidbook.datas.externalArchives != '') {
                     link = this.addLink(navType, 'nav-archives', '#/archives', 'archives', '!' + this.fluidbook.datas.archivesLabel, '!' + this.fluidbook.datas.archivesLabel);
                 }
+
             } else if (icon == 'help') {
                 link = this.addLink(navType, 'interface-help', '#', 'help', 'help', 'help');
+
             } else if (icon == 'zoom' && !this.fluidbook.support.isMobile) {
                 link = this.addLink(navType, 'nav-zoomin', '#', 'zoomin', 'zoom in', 'zoom in');
                 link = this.addLink(navType, 'nav-zoomout', '#', 'zoomout', 'zoom out', 'zoom out');
 
-                $("#zoomin").click(function (e) {
-                    $this.fluidbook.desktop.clickZoom(e, 'in');
-                    return false;
-                });
-
-                $("#zoomout").click(function () {
-                    $this.fluidbook.desktop.clickZoom(e, 'out');
-                    return false;
-                });
             } else if (icon == 'fullscreen' && Modernizr.fullscreen && !DATAS.phonegap) {
-                link = this.addLink(navType, 'interface-fullscreen', '#', 'fullscreen', 'full screen', 'switch between fullscreen and normal');
-                $("#fullscreen").click(function () {
-                    $this.menuAPI.close();
-                    screenfull.toggle();
-                    return false;
-                });
+                link = this.addLink(navType, 'interface-' + icon, '#', icon, 'full screen', 'switch between fullscreen and normal');
 
             } else if (icon == 'search') {
 
                 // Only the horizontal icon menu has the search icon, which opens the main menu
                 if (this.fluidbook.datas.search && navType == 'horizontalNav') {
                     link = this.addLink(navType, 'interface-search', '#', 'searchIcon', 'search', 'search');
-                    $("#searchIcon").click(function (event) {
-                        event.preventDefault()
-
-                        if (!fluidbook.isSearchActive()) {
-                            fluidbook.initSearchHints(); // Clears menu and only displays search box
-                            $this.menuAPI.closeAllPanels(); // Make sure we're on the main panel with the search box
-                        }
-                        $this.menuAPI.open();
-                    });
                 }
 
             }
@@ -409,7 +364,7 @@ FluidbookNav.prototype = {
 
             // Insert Chapters submenus
             if (this.chaptersMenuHTML != '') {
-                $('#chapters').parent().append(this.chaptersMenuHTML);
+                $('#menu_chapters').parent().append(this.chaptersMenuHTML);
             }
 
             // Remove unwanted links from chapters menu
@@ -442,6 +397,7 @@ FluidbookNav.prototype = {
             this.menu.append(this.getMenuCloseButton());
 
             this.initMenu();
+            this.initEventHandlers();
 
             $(this.fluidbook).trigger('fluidbooknavready');
 
@@ -449,6 +405,89 @@ FluidbookNav.prototype = {
 
 
     },
+
+    initEventHandlers: function () {
+        var $this = this;
+
+        // Home icon
+        $(document).on('click', '.icon-home', function () {
+            var $this = this;
+            fluidbook.displayLoader();
+            setTimeout(function () {
+                window.location = $($this).attr('href');
+            }, 500);
+            return false;
+        });
+
+        // Search icon in horizontal menu
+        $(document).on('click', '#horizontalNav_searchIcon', function (event) {
+            event.preventDefault()
+
+            if (!fluidbook.isSearchActive()) {
+                fluidbook.initSearchHints(); // Clears menu and only displays search box
+                $this.menuAPI.closeAllPanels(); // Make sure we're on the main panel with the search box
+            }
+            $this.menuAPI.open();
+        });
+
+        // Full screen toggle
+        $(document).on('click', '.icon-fullscreen', function () {
+            // ToDo: toggle menu icon according to state
+
+            $this.menuAPI.close();
+            screenfull.toggle();
+            return false;
+        });
+
+        // Share icon
+        $(document).on('click', '.icon-share', function () {
+            if ($this.fluidbook.datas.phonegap != 'android') {
+                return true;
+            }
+            $this.fluidbook.intentShare();
+            return false;
+        });
+
+        // Download icon
+        $(document).on('click', '.icon-download', function () {
+            $this.fluidbook.print();
+            return false;
+        });
+
+        // Print icon
+        $(document).on('click', '.icon-print', function () {
+            $this.fluidbook.print();
+            return false;
+        });
+
+        // Bookmarks icon
+        $(document).on('click', '.icon-bookmarks', function () {
+            if (!$this.fluidbook.bookmarks.hasBookmarkedPages()) {
+                var message = $this.fluidbook.l10n.__("you don't have any bookmarks");
+                if ($this.fluidbook.datas.phonegap) {
+                    navigator.notification.alert(message, function () {
+                    }, $this.fluidbook.l10n.__('bookmarks'));
+                } else {
+                    window.alert(message);
+                }
+                return false;
+            }
+        });
+
+        // Zoom In icon
+        $(document).on('click', '.icon-zoomin', function (e) {
+            $this.fluidbook.desktop.clickZoom(e, 'in');
+            return false;
+        });
+
+        // Zoom Out icon
+        $(document).on('click', '.icon-zoomout', function () {
+            $this.fluidbook.desktop.clickZoom(e, 'out');
+            return false;
+        });
+
+    },
+
     addMultilangLink: function (langs) {
         var l = '<a id="localesContainer" help="!Select language" href="#/locales"><span id="locales"></span></a>';
         var flag = this.fluidbook.l10n.getActiveFlag();