]> _ Git - fluidbook-html5.git/commitdiff
wait #3862 @1
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Wed, 28 Oct 2020 12:08:50 +0000 (13:08 +0100)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Wed, 28 Oct 2020 12:08:50 +0000 (13:08 +0100)
js/libs/fluidbook/fluidbook.notes.js
js/libs/fluidbook/fluidbook.tooltip.js
style/notes.less

index 1d625c529e8e8db5ef17856d23fe3356f495a30e..5c593079a196c0cffc54381ef800e0b7add82c96 100644 (file)
@@ -1,6 +1,7 @@
 function FluidbookNotes(fluidbook) {
     this.fluidbook = fluidbook;
     this.enabled = !!this.fluidbook.settings.notes;
+    this.allNotes = null;
     if (this.enabled) {
         this.init();
     }
@@ -41,7 +42,7 @@ FluidbookNotes.prototype = {
             setTimeout(function () {
                 $this.resize();
                 $this.initNotesFromStorage();
-            }, 1000);
+            }, 150);
         });
 
         $(document).on('click', '.notes-toggle', function () {
@@ -98,20 +99,11 @@ FluidbookNotes.prototype = {
 
     initNotesFromStorage: function () {
         this.clearNotes();
-        var pages = [this.fluidbook.currentPage];
-        if (!this.fluidbook.displayOnePage) {
-            if (this.currentPage === 1) {
-                pages.unshift(0);
-            } else {
-                pages.push(this.fluidbook.currentPage + 1);
-            }
-        }
-        var notes = this.getAllNotes();
+
+        var notes = this.getNotesOfPageFromStorage();
+
         var $this = this;
         $.each(notes, function (k, v) {
-            if (pages.indexOf(v.p) === -1) {
-                return;
-            }
             v.y = Math.max(0, Math.min(1, v.y));
             v.x = Math.max(0, Math.min(1, v.x));
             var w = $this.fluidbook.resize.fluidbookrect.width;
@@ -126,6 +118,29 @@ FluidbookNotes.prototype = {
         this.initNotes();
     },
 
+    getNotesOfPageFromStorage: function (page) {
+        if (page === undefined) {
+            page = this.fluidbook.currentPage;
+        }
+        var pages = [page];
+        if (!this.fluidbook.displayOnePage) {
+            if (this.currentPage === 1) {
+                pages.unshift(0);
+            } else {
+                pages.push(this.fluidbook.currentPage + 1);
+            }
+        }
+        var notes = this.getAllNotes();
+        var res = {};
+        $.each(notes, function (k, v) {
+            if (pages.indexOf(v.p) === -1) {
+                return;
+            }
+            res[k] = v;
+        });
+        return res;
+    },
+
     openMenu: function (callback) {
         this.fluidbook.menu.viewWrap(this.getView(this.fluidbook.l10n.__('all notes')), 'notes');
 
@@ -156,7 +171,20 @@ FluidbookNotes.prototype = {
         var index = '<div class="' + contentClass + '"><div class="indexView notesView"><div class="indexViewHolder">';
 
         $.each(this.getPagesWithNotes(), function (k, page) {
-            index += $this.fluidbook.menu.index.getPage(page, $this.fluidbook.displayOnePage, 300, true, false, $this.fluidbook.mobilefirst.enabled, '');
+            var thumb_notes = '<div class="notes">';
+            $.each($this.getNotesOfPageFromStorage(page), function (id, n) {
+                if (!$this.fluidbook.displayOnePage) {
+                    n.x /= 2;
+                    if (n.p % 2 === 1) {
+                        n.x += 1;
+                    }
+                }
+                var x = n.x * 100;
+                var y = n.y * 100;
+                thumb_notes += '<a href="#/page/' + (n.p) + '" class="note" style="top:' + y + '%;left:' + x + '%;" data-tooltip-hide-on-click data-tooltip="' + escapeHtml(n.c) + '"></a>';
+            });
+            thumb_notes += '</div>';
+            index += $this.fluidbook.menu.index.getPage(page, $this.fluidbook.displayOnePage, 300, true, false, $this.fluidbook.mobilefirst.enabled, thumb_notes);
         });
 
         index += '</div></div>';
@@ -256,6 +284,7 @@ FluidbookNotes.prototype = {
         })
     },
     updateNote: function (id) {
+        this.fluidbook.resize.updateFluidbookRect();
         var n = this._getNote(id);
         var e = $("#" + id);
         var t = $(e).find('textarea');
@@ -294,7 +323,10 @@ FluidbookNotes.prototype = {
     },
 
     getAllNotes: function () {
-        return this.fluidbook.cache.find('note_');
+        if (this.allNotes === null) {
+            this.allNotes = this.fluidbook.cache.find('note_');
+        }
+        return this.allNotes;
     },
 
     createNote: function (id) {
@@ -305,12 +337,14 @@ FluidbookNotes.prototype = {
         return {x: 0, y: 0, w: 0, h: 0, p: -1, c: ''};
     },
     _setNote: function (id, val) {
+        this.allNotes = null;
         this.fluidbook.cache.set(id, val);
     },
     _getNote: function (id) {
         return this.fluidbook.cache.get(id, this._defaultNote());
     },
     _unsetNote: function (id) {
+        this.allNotes = null;
         this.fluidbook.cache.unset(id);
     }
 
index 70c27e22c0a341aaec7131e88e69c7c6039bc975..321961cbc634f58c0e525656c6031169dd0550b2 100644 (file)
@@ -40,6 +40,9 @@ FluidbookTooltip.prototype = {
         $(document).on('blur', 'a[data-tooltip],a[data-keyboard-tooltip]', function (e) {
             $this.hideTooltip();
         });
+        $(document).on('click', '[data-tooltip-hide-on-click]', function () {
+            $this.hideTooltip();
+        });
 
         $("body").append('<div id="tooltip" role="tooltip"></div>');
     },
index c032ac02684229e3587db78b60d8d7ccfba1ae30..43c17a6f1d6e89ce3dd6821285d945a96430cd40 100644 (file)
@@ -14,6 +14,8 @@
   display: none;
 }
 
+@post-it: #fffe96;
+
 #notesHolder {
   position: absolute;
   top: 0;
@@ -24,7 +26,7 @@
     position: absolute;
     display: block;
     padding: 30px 0 0 15px;
-    background-color: #fffe96;
+    background-color: @post-it;
     cursor: move;
     box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.25);
 
       @margin: 10;
       left: unit(@w+@margin, px);
     }
+
+    .number {
+      width: @w;
+      top: @h;
+    }
   }
 
   &.indexView {
       width: @w*2;
       height: @h;
     }
-  }
 
+    .doubleThumb {
+      position: relative;
+
+      .notes {
+        position: absolute;
+        top: 10px;
+        left: 10px;
+        width: @w*2;
+        height: @h;
+
+        .note {
+          position: absolute;
+          width: 50px;
+          height: 50px;
+          z-index: 2;
+          display: block;
+          background-color: @post-it;
+          box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.25);
+
+        }
+      }
+    }
+  }
 }
\ No newline at end of file