mirrors/pdf.js
1
0
Fork 0
mirror of https://github.com/mozilla/pdf.js.git synced 2025-04-20 15:18:08 +02:00
Code Activity

Implemented Comment and Check annotation. Correcting some typos in last commit

Browse source
This commit is contained in:
Saebekassebil 2011-12-21 23:22:07 +01:00
parent ca7d44c646
commit 4a661e1735
5 changed files with 96 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

3
web/images/check.svg Normal file
View file

@ -0,0 +1,3 @@
<svg height="40" width="40" xmlns="http://www.w3.org/2000/svg">
<path d="M2.379,14.729 5.208,11.899 12.958,19.648 25.877,6.733 28.707,9.561 12.958,25.308z" fill="#333333"></path>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 188 B

3
web/images/comment.svg Normal file
View file

@ -0,0 +1,3 @@
<svg height="40" width="40" xmlns="http://www.w3.org/2000/svg">
<path d="M16,5.333c-7.732,0-14,4.701-14,10.5c0,1.982,0.741,3.833,2.016,5.414L2,25.667l5.613-1.441c2.339,1.317,5.237,2.107,8.387,2.107c7.732,0,14-4.701,14-10.5C30,10.034,23.732,5.333,16,5.333z" fill="#333333"></path>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 289 B

33
web/viewer.css
View file

@ -247,6 +247,39 @@ canvas {
line-height:1.3;
}
.annotComment > div {
position: absolute;
}
.annotComment > .annotImageComment {
background: transparent url('./images/text.svg') no-repeat left top;
background-size: 75% 75%;
}
.annotComment > .annotImageCheck {
background: transparent url('./images/check.svg') no-repeat left top;
background-size: 75% 75%;
}
.annotComment > .annotImage:hover {
cursor: pointer;
opacity: 0.7;
}
.annotComment > .annotDetails {
display: none;
padding: 0.2em;
max-width: 20em;
background-color: #F1E47B;
}
.annotComment > .annotDetails > h1 {
font-weight: normal;
font-size: 1.2em;
border-bottom: 1px solid #000000;
margin: 0px;
}
/* TODO: file FF bug to support ::-moz-selection:window-inactive
so we can override the opaque grey background when the window is inactive;
see https://bugzilla.mozilla.org/show_bug.cgi?id=706209 */

42
web/viewer.js
View file

@ -475,6 +475,41 @@ var PageView = function pageView(container, content, id, pageWidth, pageHeight,
element.style.height = Math.ceil(item.height * scale) + 'px';
return element;
}
function createCommentAnnotation(type, item) {
var annotContainer = document.createElement('section');
annotContainer.className = 'annotComment';
var annotImage = createElementWithStyle('div', item);
annotImage.className = 'annotImage annotImage' + type;
var annotDetails = document.createElement('div');
annotDetails.className = 'annotDetails';
var annotTitle = document.createElement('h1');
var annotContent = document.createElement('p');
annotDetails.style.left = (Math.floor(item.x - view.x + item.width) * scale) + 'px';
annotDetails.style.top = (Math.floor(item.y - view.y) * scale) + 'px';
annotTitle.textContent = item.title;
if(!item.content) {
annotContent.style.display = 'none';
} else {
annotContent.innerHTML = item.content.replace('\n', '<br />');
annotImage.addEventListener('mouseover', function() {
this.nextSibling.style.display = 'block';
}, true);
annotImage.addEventListener('mouseout', function() {
this.nextSibling.style.display = 'none';
}, true);
}
annotDetails.appendChild(annotTitle);
annotDetails.appendChild(annotContent);
annotContainer.appendChild(annotImage);
annotContainer.appendChild(annotDetails);
return annotContainer;
}
var items = content.getAnnotations();
for (var i = 0; i < items.length; i++) {
@ -487,6 +522,13 @@ var PageView = function pageView(container, content, id, pageWidth, pageHeight,
bindLink(link, ('dest' in item) ? item.dest : null);
div.appendChild(link);
break;
case 'Text':
case 'Check':
var comment = createCommentAnnotation(item.name, item);
if(comment)
div.appendChild(comment);
break;
}
}
}