Sakurai/pdf.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Ensure that hidden popups do not use any space

Browse Source
This commit is contained in:
Tim van der Meij 2015-12-27 15:07:18 +01:00
parent ad4354c0bd
commit ae329afc03
2 changed files with 31 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
src/display/annotation_layer.js
View File

@ -321,11 +321,12 @@ var TextAnnotationElement = (function TextAnnotationElementClosure() {
if (!this.data.hasPopup) { if (!this.data.hasPopup) {
var popupElement = new PopupElement({ var popupElement = new PopupElement({
parentContainer: this.container, container: this.container,
parentTrigger: image, trigger: image,
color: this.data.color, color: this.data.color,
title: this.data.title, title: this.data.title,
contents: this.data.contents contents: this.data.contents,
hideWrapper: true
}); });
var popup = popupElement.render(); var popup = popupElement.render();
@ -437,8 +438,8 @@ var PopupAnnotationElement = (function PopupAnnotationElementClosure() {
} }
var popup = new PopupElement({ var popup = new PopupElement({
parentContainer: parentElement, container: this.container,
parentTrigger: parentElement, trigger: parentElement,
color: this.data.color, color: this.data.color,
title: this.data.title, title: this.data.title,
contents: this.data.contents contents: this.data.contents
@ -469,11 +470,12 @@ var PopupElement = (function PopupElementClosure() {
var BACKGROUND_ENLIGHT = 0.7; var BACKGROUND_ENLIGHT = 0.7;
function PopupElement(parameters) { function PopupElement(parameters) {
this.parentContainer = parameters.parentContainer; this.container = parameters.container;
this.parentTrigger = parameters.parentTrigger; this.trigger = parameters.trigger;
this.color = parameters.color; this.color = parameters.color;
this.title = parameters.title; this.title = parameters.title;
this.contents = parameters.contents; this.contents = parameters.contents;
this.hideWrapper = parameters.hideWrapper || false;
this.pinned = false; this.pinned = false;
} }
@ -490,9 +492,15 @@ var PopupElement = (function PopupElementClosure() {
var wrapper = document.createElement('div'); var wrapper = document.createElement('div');
wrapper.className = 'popupWrapper'; wrapper.className = 'popupWrapper';
var popup = this.popup = document.createElement('div'); // For Popup annotations we hide the entire section because it contains
// only the popup. However, for Text annotations without a separate Popup
// annotation, we cannot hide the entire container as the image would
// disappear too. In that special case, hiding the wrapper suffices.
this.hideElement = (this.hideWrapper ? wrapper : this.container);
this.hideElement.setAttribute('hidden', true);
var popup = document.createElement('div');
popup.className = 'popup'; popup.className = 'popup';
popup.setAttribute('hidden', true);
var color = this.color; var color = this.color;
if (color) { if (color) {
@ -508,10 +516,9 @@ var PopupElement = (function PopupElementClosure() {
title.textContent = this.title; title.textContent = this.title;
// Attach the event listeners to the trigger element. // Attach the event listeners to the trigger element.
var trigger = this.parentTrigger; this.trigger.addEventListener('click', this._toggle.bind(this));
trigger.addEventListener('click', this._toggle.bind(this)); this.trigger.addEventListener('mouseover', this._show.bind(this, false));
trigger.addEventListener('mouseover', this._show.bind(this, false)); this.trigger.addEventListener('mouseout', this._hide.bind(this, false));
trigger.addEventListener('mouseout', this._hide.bind(this, false));
popup.addEventListener('click', this._hide.bind(this, true)); popup.addEventListener('click', this._hide.bind(this, true));
popup.appendChild(title); popup.appendChild(title);
@ -566,9 +573,9 @@ var PopupElement = (function PopupElementClosure() {
if (pin) { if (pin) {
this.pinned = true; this.pinned = true;
} }
if (this.popup.hasAttribute('hidden')) { if (this.hideElement.hasAttribute('hidden')) {
this.popup.removeAttribute('hidden'); this.hideElement.removeAttribute('hidden');
this.parentContainer.style.zIndex += 1; this.container.style.zIndex += 1;
} }
}, },
@ -583,9 +590,9 @@ var PopupElement = (function PopupElementClosure() {
if (unpin) { if (unpin) {
this.pinned = false; this.pinned = false;
} }
if (!this.popup.hasAttribute('hidden') && !this.pinned) { if (!this.hideElement.hasAttribute('hidden') && !this.pinned) {
this.popup.setAttribute('hidden', true); this.hideElement.setAttribute('hidden', true);
this.parentContainer.style.zIndex -= 1; this.container.style.zIndex -= 1;
} }
} }
}; };

6
test/annotation_layer_test.css
View File

@ -43,7 +43,12 @@
position: absolute; position: absolute;
} }
.annotationLayer .popupAnnotation {
display: block !important;
}
.annotationLayer .popupWrapper { .annotationLayer .popupWrapper {
display: block !important;
position: absolute; position: absolute;
width: 20em; width: 20em;
} }
@ -57,7 +62,6 @@
border-radius: 2px; border-radius: 2px;
padding: 0.6em; padding: 0.6em;
margin-left: 5px; margin-left: 5px;
display: block !important;
font: message-box; font: message-box;
word-wrap: break-word; word-wrap: break-word;
} }