Änderungen von Dokument Script

Zuletzt geändert von Daniel Herrmann am 2026/02/07 23:23

Von Version 1.1 Icon
bearbeitet von Daniel Herrmann
am 2025/03/02 09:39
Änderungskommentar: Install extension [org.xwiki.platform:xwiki-platform-annotation-ui/17.0.0]
Auf Version Icon 3.1 Icon
bearbeitet von Daniel Herrmann
am 2025/11/08 02:44
Änderungskommentar: Install extension [org.xwiki.platform:xwiki-platform-annotation-ui/17.9.0]

Zusammenfassung

Details

Icon Seiteneigenschaften
Erforderliche Rechte anwenden
... ... @@ -1,1 +1,1 @@
1 -false
1 +true
Icon XWiki.JavaScriptExtension[1]
Code
... ... @@ -766,7 +766,7 @@
766 766   } else {
767 767   // Show the bubble and fetch the annotation display in it.
768 768   var bubble = this.displayLoadingBubble(event.element().cumulativeOffset().top,
769 - event.element().cumulativeOffset().left);
769 + event.element().cumulativeOffset().left, true);
770 770   bubble.writeAttribute('id', bubbleId);
771 771   this.fetchAndShowAnnotationDetails(id, bubble);
772 772   }
... ... @@ -799,22 +799,36 @@
799 799   }.bind(this));
800 800   },
801 801  
802 - displayLoadingBubble : function(top, left) {
803 - // create an element with the form
802 + displayLoadingBubble : function(verticalCoordinate, horizontalCoordinate, hasMarker) {
803 + // create a bubble element wrapping the form
804 804   var bubble = new Element('div', {'class' : 'annotation-bubble'});
805 - // and a nice loading panel inside
805 + // Add a nice loading panel inside
806 806   bubble.insert({top : new Element('div', {'class' : 'loading'})});
807 - // and put it in the content
807 + // Position it off-screen at first, before we measure it and compute its final position
808 + bubble.style.top = verticalCoordinate + 'px';
809 + bubble.style.left = '-100%';
810 + // and insert the bubble in the content
808 808   document.body.insert({bottom : bubble});
809 - // make it hidden for the moment
810 - bubble.toggleClassName('hidden');
811 - // position it
812 - bubble.style.left = left + 'px';
813 - bubble.style.top = top + 'px';
814 - // make it visible
815 - bubble.toggleClassName('hidden');
816 816   // put this bubble in the bubbles stack
817 817   this.bubbles.push(bubble);
814 + // position the bubble
815 + // By default, we position it to the right and under the coordinates
816 + // Position it horizontally.
817 + let bubbleStyles = getComputedStyle(bubble);
818 + // The width in pixels of the annotation marker added in the text.
819 + const markerWidth = 10;
820 + let markerOffset = hasMarker ? -markerWidth : 0;
821 + let bubbleWidth = bubble.offsetWidth
822 + + parseInt(bubbleStyles.marginLeft)
823 + + parseInt(bubbleStyles.marginRight);
824 + if (horizontalCoordinate < bubbleWidth
825 + || horizontalCoordinate + markerOffset + bubbleWidth < window.innerWidth) {
826 + bubble.style.left = horizontalCoordinate + 'px';
827 + } else {
828 + // There isn't enough space on the right of the window to fit the modal, and there is enough on the left.
829 + bubble.style.left = (horizontalCoordinate + markerOffset - bubbleWidth) + 'px';
830 + bubble.toggleClassName('annotation-bubble-position-left');
831 + }
818 818  
819 819   return bubble;
820 820   },
... ... @@ -1138,7 +1138,7 @@
1138 1138   this.selectionService.highlightSelection('#FFEE99');
1139 1139   // get the position and build the loading bubble
1140 1140   var position = this.selectionService.getPositionNextToSelection();
1141 - this.createPanel = this.displayLoadingBubble(position.top, position.left);
1155 + this.createPanel = this.displayLoadingBubble(position.top, position.left, false);
1142 1142   // remove the ctrl + M listeners, so that only one dialog is displayed at one moment
1143 1143   this.unregisterAddAnnotationShortcut();
1144 1144   },
Icon XWiki.RequiredRightClass[0]
Level
... ... @@ -1,1 +1,1 @@
1 -programming
1 +wiki_admin