]> _ Git - fluidbook-html5.git/commitdiff
(no commit message)
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Wed, 4 Sep 2013 08:50:05 +0000 (08:50 +0000)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Wed, 4 Sep 2013 08:50:05 +0000 (08:50 +0000)
js/libs/fluidbook/fluidbook.help.js
js/libs/fluidbook/fluidbook.js
js/libs/fluidbook/fluidbook.nav.js
js/libs/fluidbook/fluidbook.tooltip.js [new file with mode: 0644]
style/fluidbook.css

index b498efdb8416746d66781a43d816d42173a5b70a..c3276f4c4e746d83c8fb4ea778c8470d4d6b8043 100644 (file)
@@ -50,13 +50,13 @@ FluidbookHelp.prototype = {
                });\r
                var h = 40 + ($("#nav>a").length - 1) * 25;\r
                $("nav>a").each(function() {\r
-                       var text = $(this).attr('help');\r
-                       if (text == '') {\r
+                       var text = $(this).data('tooltip');\r
+                       if (text == null || text == undefined || text == '') {\r
                                return;\r
                        }\r
                        var offset = $(this).position();\r
                        var left = 30 + offset.left;\r
-                       help += '<div class="icon" style="padding-top:' + h + 'px;left:' + left + 'px;">' + $this.fluidbook.l10n.__(text) + '</div>';\r
+                       help += '<div class="icon" style="padding-top:' + h + 'px;left:' + left + 'px;">' + text + '</div>';\r
                        h -= 25;\r
                });\r
                $("#nav").transform({\r
index e75564420878df645ac4d06f712aca349389372d..9b29ed2341c2a700a46494c24a77f9bfa01f3322 100644 (file)
@@ -37,6 +37,7 @@ Fluidbook.prototype = {
                this.video = new FluidbookVideo(this);\r
                this.bookmarks = new FluidbookBookmarks(this);\r
                this.index = new FluidbookIndex(this);\r
+               this.tooltip = new FluidbookTooltip(this);\r
                this.refw = 0;\r
                this.refh = 0;\r
                this.zoom = 1;\r
index 156633ddb53fc15d2a536a044228e5d985c004c7..0700582d8e6eff6867c0587dfb42d1ee7833e2ec 100644 (file)
@@ -36,7 +36,9 @@ FluidbookNav.prototype = {
                if (className != undefined) {
                        res += ' class="' + className + '"';
                }
-               res += ' help="' + help + '"';
+               if (help!=undefined && help != '') {
+                       res += ' data-tooltip="' + this.fluidbook.l10n.__(help) + '"';
+               }
                res += '>';
                res += this.getIcon(name);
                res += '</a>';
diff --git a/js/libs/fluidbook/fluidbook.tooltip.js b/js/libs/fluidbook/fluidbook.tooltip.js
new file mode 100644 (file)
index 0000000..e370dfe
--- /dev/null
@@ -0,0 +1,35 @@
+function FluidbookTooltip(fluidbook) {
+       this.fluidbook = fluidbook;
+       this.init();
+}
+
+FluidbookTooltip.prototype = {
+       init: function() {
+               var $this = this;
+               $(document).on('mouseover', 'a[data-tooltip]', function() {
+                       var position = $(this).offset();
+                       position.top += $(this).outerHeight() + 20;
+
+                       var text = $(this).data('tooltip');
+                       var ok = $this.displayTooltip(text, position);
+                       if (ok) {
+                               $(this).one('mouseout', function() {
+                                       $this.hideTooltip();
+                               });
+                       }
+                       return true;
+               });
+               $("body").append('<div id="tooltip"></div>');
+       },
+       displayTooltip: function(tooltip, position) {
+               if (tooltip == undefined || tooltip == '') {
+                       return false;
+               }
+               position.left-=10;
+               $("#tooltip").text(tooltip).css(position).show();
+               return true;
+       },
+       hideTooltip: function() {
+               $("#tooltip").hide().text('');
+       }
+}
\ No newline at end of file
index 17dbeb6c9b891eb0570adee1609758da10c0bc9a..57736a159fc6c75599d11d72f978fc55bfe870a1 100644 (file)
@@ -1285,6 +1285,20 @@ a.button{
        position:absolute;\r
 }\r
 \r
+/* Tooltip */\r
+#tooltip{\r
+       position:absolute;\r
+       top:0px;\r
+       left:0px;\r
+       padding:5px 10px;\r
+       color:#fff;\r
+       border-radius: 5px;\r
+       background:rgba(0,0,0,0.8);\r
+       display:none;\r
+       font-size:0.8rem;\r
+       max-width: 200px;\r
+}\r
+\r
 @media all and (orientation: portrait) {  \r
        #ol{display:none;}\r
        @-ms-viewport { width: 640px; }\r