Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
C
coopwire-hypothesis
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
孙灵跃 Leon Sun
coopwire-hypothesis
Commits
2269088f
Commit
2269088f
authored
Apr 07, 2022
by
Robert Knight
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
s/Pdf/PDF
Adapt to current naming conventions for identifiers.
parent
0a82f13c
Changes
3
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
39 additions
and
39 deletions
+39
-39
pdf.js
src/annotator/anchoring/pdf.js
+8
-8
highlighter.js
src/annotator/highlighter.js
+4
-4
highlighter-test.js
src/annotator/test/highlighter-test.js
+27
-27
No files found.
src/annotator/anchoring/pdf.js
View file @
2269088f
...
@@ -17,7 +17,7 @@ import { TextQuoteAnchor } from './types';
...
@@ -17,7 +17,7 @@ import { TextQuoteAnchor } from './types';
*/
*/
/**
/**
* @typedef P
df
TextRange
* @typedef P
DF
TextRange
* @prop {number} pageIndex
* @prop {number} pageIndex
* @prop {object} anchor
* @prop {object} anchor
* @prop {number} anchor.start - Start character offset within the page's text
* @prop {number} anchor.start - Start character offset within the page's text
...
@@ -55,7 +55,7 @@ const pageTextCache = new Map();
...
@@ -55,7 +55,7 @@ const pageTextCache = new Map();
* to speed up re-anchoring an annotation that was previously anchored in the
* to speed up re-anchoring an annotation that was previously anchored in the
* current session.
* current session.
*
*
* @type {Map<string, P
df
TextRange>}
* @type {Map<string, P
DF
TextRange>}
*/
*/
const
quotePositionCache
=
new
Map
();
const
quotePositionCache
=
new
Map
();
...
@@ -99,7 +99,7 @@ function getNodeTextLayer(node) {
...
@@ -99,7 +99,7 @@ function getNodeTextLayer(node) {
*
*
* @return {PDFViewer}
* @return {PDFViewer}
*/
*/
function
getP
df
Viewer
()
{
function
getP
DF
Viewer
()
{
// @ts-ignore - TS doesn't know about PDFViewerApplication global.
// @ts-ignore - TS doesn't know about PDFViewerApplication global.
return
PDFViewerApplication
.
pdfViewer
;
return
PDFViewerApplication
.
pdfViewer
;
}
}
...
@@ -115,7 +115,7 @@ function getPdfViewer() {
...
@@ -115,7 +115,7 @@ function getPdfViewer() {
* @return {Promise<PDFPageView>}
* @return {Promise<PDFPageView>}
*/
*/
async
function
getPageView
(
pageIndex
)
{
async
function
getPageView
(
pageIndex
)
{
const
pdfViewer
=
getP
df
Viewer
();
const
pdfViewer
=
getP
DF
Viewer
();
let
pageView
=
pdfViewer
.
getPageView
(
pageIndex
);
let
pageView
=
pdfViewer
.
getPageView
(
pageIndex
);
if
(
!
pageView
||
!
pageView
.
pdfPage
)
{
if
(
!
pageView
||
!
pageView
.
pdfPage
)
{
...
@@ -153,7 +153,7 @@ async function getPageView(pageIndex) {
...
@@ -153,7 +153,7 @@ async function getPageView(pageIndex) {
* Return true if the document has selectable text.
* Return true if the document has selectable text.
*/
*/
export
async
function
documentHasText
()
{
export
async
function
documentHasText
()
{
const
viewer
=
getP
df
Viewer
();
const
viewer
=
getP
DF
Viewer
();
let
hasText
=
false
;
let
hasText
=
false
;
for
(
let
i
=
0
;
i
<
viewer
.
pagesCount
;
i
++
)
{
for
(
let
i
=
0
;
i
<
viewer
.
pagesCount
;
i
++
)
{
const
pageText
=
await
getPageTextContent
(
i
);
const
pageText
=
await
getPageTextContent
(
i
);
...
@@ -206,7 +206,7 @@ function getPageTextContent(pageIndex) {
...
@@ -206,7 +206,7 @@ function getPageTextContent(pageIndex) {
* @return {Promise<number>} - Offset of page's text within document text
* @return {Promise<number>} - Offset of page's text within document text
*/
*/
async
function
getPageOffset
(
pageIndex
)
{
async
function
getPageOffset
(
pageIndex
)
{
const
viewer
=
getP
df
Viewer
();
const
viewer
=
getP
DF
Viewer
();
if
(
pageIndex
>=
viewer
.
pagesCount
)
{
if
(
pageIndex
>=
viewer
.
pagesCount
)
{
/* istanbul ignore next - This should never be triggered */
/* istanbul ignore next - This should never be triggered */
throw
new
Error
(
'Invalid page index'
);
throw
new
Error
(
'Invalid page index'
);
...
@@ -236,7 +236,7 @@ async function getPageOffset(pageIndex) {
...
@@ -236,7 +236,7 @@ async function getPageOffset(pageIndex) {
* @return {Promise<PageOffset>}
* @return {Promise<PageOffset>}
*/
*/
async
function
findPageByOffset
(
offset
)
{
async
function
findPageByOffset
(
offset
)
{
const
viewer
=
getP
df
Viewer
();
const
viewer
=
getP
DF
Viewer
();
let
pageStartOffset
=
0
;
let
pageStartOffset
=
0
;
let
pageEndOffset
=
0
;
let
pageEndOffset
=
0
;
...
@@ -387,7 +387,7 @@ function stripSpaces(str) {
...
@@ -387,7 +387,7 @@ function stripSpaces(str) {
async
function
anchorQuote
(
quoteSelector
,
positionHint
)
{
async
function
anchorQuote
(
quoteSelector
,
positionHint
)
{
// Determine which pages to search and in what order. If we have a position
// Determine which pages to search and in what order. If we have a position
// hint we'll try to use that. Otherwise we'll just search all pages in order.
// hint we'll try to use that. Otherwise we'll just search all pages in order.
const
pageCount
=
getP
df
Viewer
().
pagesCount
;
const
pageCount
=
getP
DF
Viewer
().
pagesCount
;
const
pageIndexes
=
Array
(
pageCount
)
const
pageIndexes
=
Array
(
pageCount
)
.
fill
(
0
)
.
fill
(
0
)
.
map
((
_
,
i
)
=>
i
);
.
map
((
_
,
i
)
=>
i
);
...
...
src/annotator/highlighter.js
View file @
2269088f
...
@@ -13,7 +13,7 @@ const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
...
@@ -13,7 +13,7 @@ const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
* A `<hypothesis-highlight>` element in the page's text layer
* A `<hypothesis-highlight>` element in the page's text layer
* @return {HTMLCanvasElement|null}
* @return {HTMLCanvasElement|null}
*/
*/
function
getP
df
Canvas
(
highlightEl
)
{
function
getP
DF
Canvas
(
highlightEl
)
{
// This code assumes that PDF.js renders pages with a structure like:
// This code assumes that PDF.js renders pages with a structure like:
//
//
// <div class="page">
// <div class="page">
...
@@ -51,14 +51,14 @@ function getPdfCanvas(highlightEl) {
...
@@ -51,14 +51,14 @@ function getPdfCanvas(highlightEl) {
* An element that wraps the highlighted text in the transparent text layer
* An element that wraps the highlighted text in the transparent text layer
* above the PDF.
* above the PDF.
*/
*/
function
drawHighlightsAboveP
df
Canvas
(
highlightEls
)
{
function
drawHighlightsAboveP
DF
Canvas
(
highlightEls
)
{
if
(
highlightEls
.
length
===
0
)
{
if
(
highlightEls
.
length
===
0
)
{
return
;
return
;
}
}
// Get the <canvas> for the PDF page containing the highlight. We assume all
// Get the <canvas> for the PDF page containing the highlight. We assume all
// the highlights are on the same page.
// the highlights are on the same page.
const
canvasEl
=
getP
df
Canvas
(
highlightEls
[
0
]);
const
canvasEl
=
getP
DF
Canvas
(
highlightEls
[
0
]);
if
(
!
canvasEl
||
!
canvasEl
.
parentElement
)
{
if
(
!
canvasEl
||
!
canvasEl
.
parentElement
)
{
return
;
return
;
}
}
...
@@ -276,7 +276,7 @@ export function highlightRange(range, cssClass = 'hypothesis-highlight') {
...
@@ -276,7 +276,7 @@ export function highlightRange(range, cssClass = 'hypothesis-highlight') {
// to reduce the number of forced reflows. We also skip creating them for
// to reduce the number of forced reflows. We also skip creating them for
// unrendered pages for performance reasons.
// unrendered pages for performance reasons.
if
(
!
inPlaceholder
)
{
if
(
!
inPlaceholder
)
{
drawHighlightsAboveP
df
Canvas
(
highlights
);
drawHighlightsAboveP
DF
Canvas
(
highlights
);
}
}
return
highlights
;
return
highlights
;
...
...
src/annotator/test/highlighter-test.js
View file @
2269088f
...
@@ -16,7 +16,7 @@ import {
...
@@ -16,7 +16,7 @@ import {
*
*
* This is used to test PDF-specific highlighting behavior.
* This is used to test PDF-specific highlighting behavior.
*/
*/
function
P
df
Page
({
showPlaceholder
=
false
})
{
function
P
DF
Page
({
showPlaceholder
=
false
})
{
return
(
return
(
<
div
className
=
"page"
>
<
div
className
=
"page"
>
<
div
className
=
"canvasWrapper"
>
<
div
className
=
"canvasWrapper"
>
...
@@ -45,11 +45,11 @@ function PdfPage({ showPlaceholder = false }) {
...
@@ -45,11 +45,11 @@ function PdfPage({ showPlaceholder = false }) {
/**
/**
* Highlight the text in a fake PDF page.
* Highlight the text in a fake PDF page.
*
*
* @param {HTMLElement} pageContainer - HTML element into which `P
df
Page`
* @param {HTMLElement} pageContainer - HTML element into which `P
DF
Page`
* component has been rendered
* component has been rendered
* @return {HTMLElement} - `<hypothesis-highlight>` element
* @return {HTMLElement} - `<hypothesis-highlight>` element
*/
*/
function
highlightP
df
Range
(
pageContainer
)
{
function
highlightP
DF
Range
(
pageContainer
)
{
const
textSpan
=
pageContainer
.
querySelector
(
'.testText'
);
const
textSpan
=
pageContainer
.
querySelector
(
'.testText'
);
const
range
=
new
Range
();
const
range
=
new
Range
();
range
.
setStartBefore
(
textSpan
.
childNodes
[
0
]);
range
.
setStartBefore
(
textSpan
.
childNodes
[
0
]);
...
@@ -58,15 +58,15 @@ function highlightPdfRange(pageContainer) {
...
@@ -58,15 +58,15 @@ function highlightPdfRange(pageContainer) {
}
}
/**
/**
* Render a fake PDF.js page (`P
df
Page`) and return its container.
* Render a fake PDF.js page (`P
DF
Page`) and return its container.
*
*
* @return {HTMLElement}
* @return {HTMLElement}
*/
*/
function
createP
df
PageWithHighlight
()
{
function
createP
DF
PageWithHighlight
()
{
const
container
=
document
.
createElement
(
'div'
);
const
container
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
/>
,
container
);
render
(
<
P
DF
Page
/>
,
container
);
highlightP
df
Range
(
container
);
highlightP
DF
Range
(
container
);
return
container
;
return
container
;
}
}
...
@@ -245,13 +245,13 @@ describe('annotator/highlighter', () => {
...
@@ -245,13 +245,13 @@ describe('annotator/highlighter', () => {
context
(
'when the highlighted text is part of a PDF.js text layer'
,
()
=>
{
context
(
'when the highlighted text is part of a PDF.js text layer'
,
()
=>
{
it
(
"removes the highlight element's background color"
,
()
=>
{
it
(
"removes the highlight element's background color"
,
()
=>
{
const
page
=
createP
df
PageWithHighlight
();
const
page
=
createP
DF
PageWithHighlight
();
const
highlight
=
page
.
querySelector
(
'hypothesis-highlight'
);
const
highlight
=
page
.
querySelector
(
'hypothesis-highlight'
);
assert
.
isTrue
(
highlight
.
classList
.
contains
(
'is-transparent'
));
assert
.
isTrue
(
highlight
.
classList
.
contains
(
'is-transparent'
));
});
});
it
(
'creates an SVG layer above the PDF canvas and draws a highlight in that'
,
()
=>
{
it
(
'creates an SVG layer above the PDF canvas and draws a highlight in that'
,
()
=>
{
const
page
=
createP
df
PageWithHighlight
();
const
page
=
createP
DF
PageWithHighlight
();
const
canvas
=
page
.
querySelector
(
'canvas'
);
const
canvas
=
page
.
querySelector
(
'canvas'
);
const
svgLayer
=
page
.
querySelector
(
'svg'
);
const
svgLayer
=
page
.
querySelector
(
'svg'
);
...
@@ -268,10 +268,10 @@ describe('annotator/highlighter', () => {
...
@@ -268,10 +268,10 @@ describe('annotator/highlighter', () => {
it
(
're-uses the existing SVG layer for the page if present'
,
()
=>
{
it
(
're-uses the existing SVG layer for the page if present'
,
()
=>
{
// Create a PDF page with a single highlight.
// Create a PDF page with a single highlight.
const
page
=
createP
df
PageWithHighlight
();
const
page
=
createP
DF
PageWithHighlight
();
// Create a second highlight on the same page.
// Create a second highlight on the same page.
highlightP
df
Range
(
page
);
highlightP
DF
Range
(
page
);
// There should be multiple highlights.
// There should be multiple highlights.
assert
.
equal
(
page
.
querySelectorAll
(
'hypothesis-highlight'
).
length
,
2
);
assert
.
equal
(
page
.
querySelectorAll
(
'hypothesis-highlight'
).
length
,
2
);
...
@@ -287,7 +287,7 @@ describe('annotator/highlighter', () => {
...
@@ -287,7 +287,7 @@ describe('annotator/highlighter', () => {
it
(
'does not create an SVG highlight if the canvas is not found'
,
()
=>
{
it
(
'does not create an SVG highlight if the canvas is not found'
,
()
=>
{
const
container
=
document
.
createElement
(
'div'
);
const
container
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
/>
,
container
);
render
(
<
P
DF
Page
/>
,
container
);
// Remove canvas. This might be missing if the DOM structure looks like
// Remove canvas. This might be missing if the DOM structure looks like
// PDF.js but isn't, or perhaps a future PDF.js update or fork changes
// PDF.js but isn't, or perhaps a future PDF.js update or fork changes
...
@@ -295,7 +295,7 @@ describe('annotator/highlighter', () => {
...
@@ -295,7 +295,7 @@ describe('annotator/highlighter', () => {
// regular CSS-based highlighting.
// regular CSS-based highlighting.
container
.
querySelector
(
'canvas'
).
remove
();
container
.
querySelector
(
'canvas'
).
remove
();
const
[
highlight
]
=
highlightP
df
Range
(
container
);
const
[
highlight
]
=
highlightP
DF
Range
(
container
);
assert
.
isFalse
(
highlight
.
classList
.
contains
(
'is-transparent'
));
assert
.
isFalse
(
highlight
.
classList
.
contains
(
'is-transparent'
));
assert
.
isNull
(
container
.
querySelector
(
'rect'
));
assert
.
isNull
(
container
.
querySelector
(
'rect'
));
...
@@ -304,8 +304,8 @@ describe('annotator/highlighter', () => {
...
@@ -304,8 +304,8 @@ describe('annotator/highlighter', () => {
it
(
'does not create an SVG highlight for placeholder highlights'
,
()
=>
{
it
(
'does not create an SVG highlight for placeholder highlights'
,
()
=>
{
const
container
=
document
.
createElement
(
'div'
);
const
container
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
showPlaceholder
=
{
true
}
/>, container
)
;
render
(
<
P
DF
Page
showPlaceholder
=
{
true
}
/>, container
)
;
const
[
highlight
]
=
highlightP
df
Range
(
container
);
const
[
highlight
]
=
highlightP
DF
Range
(
container
);
// If the highlight is a placeholder, the highlight element should still
// If the highlight is a placeholder, the highlight element should still
// be created.
// be created.
...
@@ -328,10 +328,10 @@ describe('annotator/highlighter', () => {
...
@@ -328,10 +328,10 @@ describe('annotator/highlighter', () => {
it
(
'renders highlights when mix-blend-mode is supported'
,
()
=>
{
it
(
'renders highlights when mix-blend-mode is supported'
,
()
=>
{
const
container
=
document
.
createElement
(
'div'
);
const
container
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
/>
,
container
);
render
(
<
P
DF
Page
/>
,
container
);
CSS
.
supports
.
withArgs
(
'mix-blend-mode'
,
'multiply'
).
returns
(
true
);
CSS
.
supports
.
withArgs
(
'mix-blend-mode'
,
'multiply'
).
returns
(
true
);
highlightP
df
Range
(
container
);
highlightP
DF
Range
(
container
);
// When mix blending is available, the highlight layer has default
// When mix blending is available, the highlight layer has default
// opacity and highlight rects are transparent.
// opacity and highlight rects are transparent.
...
@@ -345,10 +345,10 @@ describe('annotator/highlighter', () => {
...
@@ -345,10 +345,10 @@ describe('annotator/highlighter', () => {
it
(
'renders highlights when mix-blend-mode is not supported'
,
()
=>
{
it
(
'renders highlights when mix-blend-mode is not supported'
,
()
=>
{
const
container
=
document
.
createElement
(
'div'
);
const
container
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
/>
,
container
);
render
(
<
P
DF
Page
/>
,
container
);
CSS
.
supports
.
withArgs
(
'mix-blend-mode'
,
'multiply'
).
returns
(
false
);
CSS
.
supports
.
withArgs
(
'mix-blend-mode'
,
'multiply'
).
returns
(
false
);
highlightP
df
Range
(
container
);
highlightP
DF
Range
(
container
);
// When mix blending is not available, highlight rects are opaque and
// When mix blending is not available, highlight rects are opaque and
// the entire highlight layer is transparent.
// the entire highlight layer is transparent.
...
@@ -391,7 +391,7 @@ describe('annotator/highlighter', () => {
...
@@ -391,7 +391,7 @@ describe('annotator/highlighter', () => {
});
});
it
(
'removes any associated SVG elements external to the highlight element'
,
()
=>
{
it
(
'removes any associated SVG elements external to the highlight element'
,
()
=>
{
const
page
=
createP
df
PageWithHighlight
();
const
page
=
createP
DF
PageWithHighlight
();
const
highlight
=
page
.
querySelector
(
'hypothesis-highlight'
);
const
highlight
=
page
.
querySelector
(
'hypothesis-highlight'
);
assert
.
instanceOf
(
highlight
.
svgHighlight
,
SVGElement
);
assert
.
instanceOf
(
highlight
.
svgHighlight
,
SVGElement
);
...
@@ -475,8 +475,8 @@ describe('annotator/highlighter', () => {
...
@@ -475,8 +475,8 @@ describe('annotator/highlighter', () => {
it
(
'adds class to PDF highlights when focused'
,
()
=>
{
it
(
'adds class to PDF highlights when focused'
,
()
=>
{
const
root
=
document
.
createElement
(
'div'
);
const
root
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
/>
,
root
);
render
(
<
P
DF
Page
/>
,
root
);
const
highlights
=
highlightP
df
Range
(
root
);
const
highlights
=
highlightP
DF
Range
(
root
);
setHighlightsFocused
(
highlights
,
true
);
setHighlightsFocused
(
highlights
,
true
);
...
@@ -487,9 +487,9 @@ describe('annotator/highlighter', () => {
...
@@ -487,9 +487,9 @@ describe('annotator/highlighter', () => {
it
(
'raises focused highlights in PDFs'
,
()
=>
{
it
(
'raises focused highlights in PDFs'
,
()
=>
{
const
root
=
document
.
createElement
(
'div'
);
const
root
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
/>
,
root
);
render
(
<
P
DF
Page
/>
,
root
);
const
highlights1
=
highlightP
df
Range
(
root
);
const
highlights1
=
highlightP
DF
Range
(
root
);
const
highlights2
=
highlightP
df
Range
(
root
);
const
highlights2
=
highlightP
DF
Range
(
root
);
const
svgLayer
=
root
.
querySelector
(
'svg'
);
const
svgLayer
=
root
.
querySelector
(
'svg'
);
const
lastSVGHighlight
=
highlights
=>
const
lastSVGHighlight
=
highlights
=>
...
@@ -504,8 +504,8 @@ describe('annotator/highlighter', () => {
...
@@ -504,8 +504,8 @@ describe('annotator/highlighter', () => {
it
(
'removes class from PDF highlights when not focused'
,
()
=>
{
it
(
'removes class from PDF highlights when not focused'
,
()
=>
{
const
root
=
document
.
createElement
(
'div'
);
const
root
=
document
.
createElement
(
'div'
);
render
(
<
P
df
Page
/>
,
root
);
render
(
<
P
DF
Page
/>
,
root
);
const
highlights
=
highlightP
df
Range
(
root
);
const
highlights
=
highlightP
DF
Range
(
root
);
setHighlightsFocused
(
highlights
,
true
);
setHighlightsFocused
(
highlights
,
true
);
setHighlightsFocused
(
highlights
,
false
);
setHighlightsFocused
(
highlights
,
false
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment