diva.js 6.0.2 → 7.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.clang-format +7 -0
- package/.github/workflows/npm-publish.yml +45 -0
- package/LICENSE +55 -0
- package/Makefile +75 -0
- package/README.md +15 -114
- package/elm.json +32 -0
- package/package.json +12 -59
- package/review/elm.json +52 -0
- package/review/src/ReviewConfig.elm +87 -0
- package/scripts/elm-esm.sh +40 -0
- package/scripts/minify-css.mjs +31 -0
- package/src/Filters.elm +1044 -0
- package/src/Main.elm +1217 -0
- package/src/Model.elm +213 -0
- package/src/Msg.elm +59 -0
- package/src/Utilities.elm +46 -0
- package/src/View/CollectionExplorer.elm +172 -0
- package/src/View/Helpers.elm +86 -0
- package/src/View/HtmlRenderer.elm +136 -0
- package/src/View/Icons.elm +159 -0
- package/src/View/ManifestInfoModal.elm +363 -0
- package/src/View/PageViewModal.elm +1046 -0
- package/src/View/Sidebar.elm +786 -0
- package/src/View/Toolbar.elm +189 -0
- package/src/View.elm +244 -0
- package/src/diva.ts +802 -0
- package/src/filters.ts +1843 -0
- package/src/styles/app.css +328 -0
- package/src/styles/collection.css +75 -0
- package/src/styles/modal.css +388 -0
- package/src/styles/sidebar.css +215 -0
- package/src/styles/theme.css +39 -0
- package/src/styles/toolbar.css +154 -0
- package/src/viewer-element.ts +1307 -0
- package/testing/index.html +52 -0
- package/testing/testing.html +231 -0
- package/tsconfig.json +12 -0
- package/AUTHORS +0 -22
- package/build/diva.css +0 -554
- package/build/diva.css.map +0 -1
- package/build/diva.js +0 -9
- package/build/diva.js.map +0 -1
- package/build/plugins/download.js +0 -2
- package/build/plugins/download.js.map +0 -1
- package/build/plugins/manipulation.js +0 -2
- package/build/plugins/manipulation.js.map +0 -1
- package/build/plugins/metadata.js +0 -2
- package/build/plugins/metadata.js.map +0 -1
- package/index.html +0 -28
- package/karma.conf.js +0 -87
- package/source/css/_mixins.scss +0 -43
- package/source/css/_variables.scss +0 -50
- package/source/css/_viewer.scss +0 -462
- package/source/css/diva.scss +0 -15
- package/source/css/plugins/_manipulation.scss +0 -228
- package/source/css/plugins/_metadata.scss +0 -31
- package/source/img/adjust.svg +0 -11
- package/source/img/book-view.svg +0 -6
- package/source/img/close.svg +0 -6
- package/source/img/download.svg +0 -6
- package/source/img/from-fullscreen.svg +0 -8
- package/source/img/grid-fewer.svg +0 -6
- package/source/img/grid-more.svg +0 -6
- package/source/img/grid-view.svg +0 -6
- package/source/img/link.svg +0 -6
- package/source/img/metadata.svg +0 -9
- package/source/img/page-view.svg +0 -6
- package/source/img/to-fullscreen.svg +0 -11
- package/source/img/zoom-in.svg +0 -6
- package/source/img/zoom-out.svg +0 -7
- package/source/js/composite-image.js +0 -174
- package/source/js/diva-global.js +0 -7
- package/source/js/diva.js +0 -1543
- package/source/js/document-handler.js +0 -180
- package/source/js/document-layout.js +0 -286
- package/source/js/exceptions.js +0 -26
- package/source/js/gesture-events.js +0 -190
- package/source/js/grid-handler.js +0 -122
- package/source/js/iiif-source-adapter.js +0 -63
- package/source/js/image-cache.js +0 -113
- package/source/js/image-manifest.js +0 -157
- package/source/js/image-request-handler.js +0 -76
- package/source/js/interpolate-animation.js +0 -122
- package/source/js/page-layouts/book-layout.js +0 -161
- package/source/js/page-layouts/grid-layout.js +0 -97
- package/source/js/page-layouts/index.js +0 -38
- package/source/js/page-layouts/page-dimensions.js +0 -9
- package/source/js/page-layouts/singles-layout.js +0 -27
- package/source/js/page-overlay-manager.js +0 -102
- package/source/js/page-tools-overlay.js +0 -95
- package/source/js/parse-iiif-manifest.js +0 -302
- package/source/js/plugins/_filters.js +0 -679
- package/source/js/plugins/download.js +0 -83
- package/source/js/plugins/manipulation.js +0 -837
- package/source/js/plugins/metadata.js +0 -190
- package/source/js/renderer.js +0 -584
- package/source/js/settings-view.js +0 -30
- package/source/js/tile-coverage-map.js +0 -25
- package/source/js/toolbar.js +0 -573
- package/source/js/utils/dragscroll.js +0 -106
- package/source/js/utils/elt.js +0 -94
- package/source/js/utils/events.js +0 -190
- package/source/js/utils/get-scrollbar-width.js +0 -29
- package/source/js/utils/hash-params.js +0 -86
- package/source/js/utils/parse-label-value.js +0 -34
- package/source/js/utils/vanilla.kinetic.js +0 -527
- package/source/js/validation-runner.js +0 -177
- package/source/js/viewer-core.js +0 -1514
- package/source/js/viewport.js +0 -143
- package/test/_setup.js +0 -13
- package/test/composite-image_test.js +0 -94
- package/test/diva_test.js +0 -43
- package/test/hash-params_test.js +0 -221
- package/test/image-cache_test.js +0 -106
- package/test/main.js +0 -6
- package/test/manifests/beromunsterManifest.json +0 -15514
- package/test/manifests/iiifv2.json +0 -11032
- package/test/manifests/iiifv2pages.json +0 -30437
- package/test/manifests/iiifv3.json +0 -10965
- package/test/navigation_test.js +0 -355
- package/test/parse-iiif-manifest_test.js +0 -68
- package/test/public_test.js +0 -881
- package/test/settings_test.js +0 -487
- package/test/utils/book-layout_test.js +0 -148
- package/test/utils/elt_test.js +0 -102
- package/test/utils/events_test.js +0 -245
- package/test/utils/hash-params_test.js +0 -79
- package/test/utils/parse-label-value_test.js +0 -45
- package/test/z_plugins_test.js +0 -180
- package/webpack.config.js +0 -58
- package/webpack.config.test.js +0 -45
|
@@ -1,161 +0,0 @@
|
|
|
1
|
-
import getPageDimensions from './page-dimensions';
|
|
2
|
-
|
|
3
|
-
export default function getBookLayoutGroups (viewerConfig)
|
|
4
|
-
{
|
|
5
|
-
const groupings = getGroupings(viewerConfig);
|
|
6
|
-
|
|
7
|
-
return groupings.map(grouping => getGroupLayoutsFromPageGrouping(viewerConfig, grouping));
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
function getGroupings(viewerConfig)
|
|
11
|
-
{
|
|
12
|
-
const manifest = viewerConfig.manifest;
|
|
13
|
-
|
|
14
|
-
const pagesByGroup = [];
|
|
15
|
-
let leftPage = null;
|
|
16
|
-
let nonPagedPages = []; // Pages to display below the current group
|
|
17
|
-
|
|
18
|
-
const _addNonPagedPages = () =>
|
|
19
|
-
{
|
|
20
|
-
for (let i = 0, nlen = nonPagedPages.length; i < nlen; i++)
|
|
21
|
-
{
|
|
22
|
-
pagesByGroup.push([ nonPagedPages[i] ]);
|
|
23
|
-
}
|
|
24
|
-
nonPagedPages = [];
|
|
25
|
-
};
|
|
26
|
-
|
|
27
|
-
manifest.pages.forEach( (page, index) =>
|
|
28
|
-
{
|
|
29
|
-
const pageRecord = {
|
|
30
|
-
index: index,
|
|
31
|
-
dimensions: getPageDimensions(index, manifest),
|
|
32
|
-
paged: (!manifest.paged || page.paged)
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
// Only display non-paged pages if specified in the settings
|
|
36
|
-
if (!viewerConfig.showNonPagedPages && !pageRecord.paged)
|
|
37
|
-
return;
|
|
38
|
-
|
|
39
|
-
if (!pageRecord.paged)
|
|
40
|
-
{
|
|
41
|
-
nonPagedPages.push(pageRecord);
|
|
42
|
-
}
|
|
43
|
-
else if (index === 0 || page.facingPages)
|
|
44
|
-
{
|
|
45
|
-
// The first page is placed on its own
|
|
46
|
-
pagesByGroup.push([pageRecord]);
|
|
47
|
-
_addNonPagedPages();
|
|
48
|
-
}
|
|
49
|
-
else if (leftPage === null)
|
|
50
|
-
{
|
|
51
|
-
leftPage = pageRecord;
|
|
52
|
-
}
|
|
53
|
-
else
|
|
54
|
-
{
|
|
55
|
-
pagesByGroup.push([leftPage, pageRecord]);
|
|
56
|
-
leftPage = null;
|
|
57
|
-
_addNonPagedPages();
|
|
58
|
-
}
|
|
59
|
-
});
|
|
60
|
-
|
|
61
|
-
// Flush a final left page
|
|
62
|
-
if (leftPage !== null)
|
|
63
|
-
{
|
|
64
|
-
pagesByGroup.push([leftPage]);
|
|
65
|
-
_addNonPagedPages();
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
return pagesByGroup;
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
function getGroupLayoutsFromPageGrouping(viewerConfig, grouping)
|
|
72
|
-
{
|
|
73
|
-
const verticallyOriented = viewerConfig.verticallyOriented;
|
|
74
|
-
|
|
75
|
-
if (grouping.length === 2)
|
|
76
|
-
return getFacingPageGroup(grouping[0], grouping[1], verticallyOriented);
|
|
77
|
-
|
|
78
|
-
const page = grouping[0];
|
|
79
|
-
const pageDims = page.dimensions;
|
|
80
|
-
|
|
81
|
-
// The first page is placed on its own to the right in vertical orientation.
|
|
82
|
-
// NB that this needs to be the page with index 0; if the first page is excluded
|
|
83
|
-
// from the layout then this special case shouldn't apply.
|
|
84
|
-
// If the page is tagged as 'non-paged', center it horizontally
|
|
85
|
-
let leftOffset;
|
|
86
|
-
if (page.paged)
|
|
87
|
-
leftOffset = (page.index === 0 && verticallyOriented) ? pageDims.width : 0;
|
|
88
|
-
else
|
|
89
|
-
leftOffset = (verticallyOriented) ? pageDims.width / 2 : 0;
|
|
90
|
-
|
|
91
|
-
const shouldBeHorizontallyAdjusted =
|
|
92
|
-
verticallyOriented && !viewerConfig.manifest.pages[page.index].facingPages;
|
|
93
|
-
|
|
94
|
-
// We need to left-align the page in vertical orientation, so we double
|
|
95
|
-
// the group width
|
|
96
|
-
return {
|
|
97
|
-
dimensions: {
|
|
98
|
-
height: pageDims.height,
|
|
99
|
-
width: shouldBeHorizontallyAdjusted ? pageDims.width * 2 : pageDims.width
|
|
100
|
-
},
|
|
101
|
-
pages: [{
|
|
102
|
-
index: page.index,
|
|
103
|
-
groupOffset: {
|
|
104
|
-
top: 0,
|
|
105
|
-
left: leftOffset
|
|
106
|
-
},
|
|
107
|
-
dimensions: pageDims
|
|
108
|
-
}]
|
|
109
|
-
};
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
function getFacingPageGroup(leftPage, rightPage, verticallyOriented)
|
|
113
|
-
{
|
|
114
|
-
const leftDims = leftPage.dimensions;
|
|
115
|
-
const rightDims = rightPage.dimensions;
|
|
116
|
-
|
|
117
|
-
const height = Math.max(leftDims.height, rightDims.height);
|
|
118
|
-
|
|
119
|
-
let width, firstLeftOffset, secondLeftOffset;
|
|
120
|
-
|
|
121
|
-
if (verticallyOriented)
|
|
122
|
-
{
|
|
123
|
-
const midWidth = Math.max(leftDims.width, rightDims.width);
|
|
124
|
-
|
|
125
|
-
width = midWidth * 2;
|
|
126
|
-
|
|
127
|
-
firstLeftOffset = midWidth - leftDims.width;
|
|
128
|
-
secondLeftOffset = midWidth;
|
|
129
|
-
}
|
|
130
|
-
else
|
|
131
|
-
{
|
|
132
|
-
width = leftDims.width + rightDims.width;
|
|
133
|
-
firstLeftOffset = 0;
|
|
134
|
-
secondLeftOffset = leftDims.width;
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
return {
|
|
138
|
-
dimensions: {
|
|
139
|
-
height: height,
|
|
140
|
-
width: width
|
|
141
|
-
},
|
|
142
|
-
pages: [
|
|
143
|
-
{
|
|
144
|
-
index: leftPage.index,
|
|
145
|
-
dimensions: leftDims,
|
|
146
|
-
groupOffset: {
|
|
147
|
-
top: 0,
|
|
148
|
-
left: firstLeftOffset
|
|
149
|
-
}
|
|
150
|
-
},
|
|
151
|
-
{
|
|
152
|
-
index: rightPage.index,
|
|
153
|
-
dimensions: rightDims,
|
|
154
|
-
groupOffset: {
|
|
155
|
-
top: 0,
|
|
156
|
-
left: secondLeftOffset
|
|
157
|
-
}
|
|
158
|
-
}
|
|
159
|
-
]
|
|
160
|
-
};
|
|
161
|
-
}
|
|
@@ -1,97 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
export default function getGridLayoutGroups (viewerConfig)
|
|
3
|
-
{
|
|
4
|
-
const viewportWidth = viewerConfig.viewport.width;
|
|
5
|
-
const manifest = viewerConfig.manifest;
|
|
6
|
-
const pagesPerRow = viewerConfig.pagesPerRow;
|
|
7
|
-
const fixedHeightGrid = viewerConfig.fixedHeightGrid;
|
|
8
|
-
const fixedPadding = viewerConfig.fixedPadding;
|
|
9
|
-
const showNonPagedPages = viewerConfig.showNonPagedPages;
|
|
10
|
-
|
|
11
|
-
const horizontalPadding = fixedPadding * (pagesPerRow + 1);
|
|
12
|
-
const pageWidth = (viewportWidth - horizontalPadding) / pagesPerRow;
|
|
13
|
-
const gridPageWidth = pageWidth;
|
|
14
|
-
|
|
15
|
-
// Calculate the row height depending on whether we want to fix the width or the height
|
|
16
|
-
const rowHeight = (fixedHeightGrid) ? fixedPadding + manifest.minRatio * pageWidth : fixedPadding + manifest.maxRatio * pageWidth;
|
|
17
|
-
|
|
18
|
-
const groups = [];
|
|
19
|
-
let currentPages = [];
|
|
20
|
-
|
|
21
|
-
const getGridPageDimensions = pageData =>
|
|
22
|
-
{
|
|
23
|
-
// Calculate the width, height and horizontal placement of this page
|
|
24
|
-
// Get dimensions at max zoom level, although any level should be fine
|
|
25
|
-
const pageDimenData = pageData.d[pageData.d.length - 1];
|
|
26
|
-
const heightToWidthRatio = pageDimenData.h / pageDimenData.w;
|
|
27
|
-
|
|
28
|
-
let pageWidth, pageHeight;
|
|
29
|
-
|
|
30
|
-
if (fixedHeightGrid)
|
|
31
|
-
{
|
|
32
|
-
pageWidth = (rowHeight - fixedPadding) / heightToWidthRatio;
|
|
33
|
-
pageHeight = rowHeight - fixedPadding;
|
|
34
|
-
}
|
|
35
|
-
else
|
|
36
|
-
{
|
|
37
|
-
pageWidth = gridPageWidth;
|
|
38
|
-
pageHeight = pageWidth * heightToWidthRatio;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
return {
|
|
42
|
-
width: Math.round(pageWidth),
|
|
43
|
-
height: Math.round(pageHeight)
|
|
44
|
-
};
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
const rowDimensions = {
|
|
48
|
-
height: rowHeight,
|
|
49
|
-
width: viewportWidth
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
manifest.pages.forEach( (page, pageIndex) =>
|
|
53
|
-
{
|
|
54
|
-
if (!showNonPagedPages && manifest.paged && !page.paged)
|
|
55
|
-
return;
|
|
56
|
-
|
|
57
|
-
// Calculate the width, height and horizontal placement of this page
|
|
58
|
-
const pageDimens = getGridPageDimensions(page);
|
|
59
|
-
let leftOffset = Math.floor(currentPages.length * (fixedPadding + gridPageWidth) + fixedPadding);
|
|
60
|
-
|
|
61
|
-
// Center the page if the height is fixed (otherwise, there is no horizontal padding)
|
|
62
|
-
if (fixedHeightGrid)
|
|
63
|
-
{
|
|
64
|
-
leftOffset += (gridPageWidth - pageDimens.width) / 2;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
// TODO: Precompute page dimensions everywhere
|
|
68
|
-
currentPages.push({
|
|
69
|
-
index: pageIndex,
|
|
70
|
-
dimensions: pageDimens,
|
|
71
|
-
groupOffset: {
|
|
72
|
-
top: 0,
|
|
73
|
-
left: leftOffset
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
|
|
77
|
-
if (currentPages.length === pagesPerRow)
|
|
78
|
-
{
|
|
79
|
-
groups.push({
|
|
80
|
-
dimensions: rowDimensions,
|
|
81
|
-
pages: currentPages
|
|
82
|
-
});
|
|
83
|
-
|
|
84
|
-
currentPages = [];
|
|
85
|
-
}
|
|
86
|
-
});
|
|
87
|
-
|
|
88
|
-
if (currentPages.length > 0)
|
|
89
|
-
{
|
|
90
|
-
groups.push({
|
|
91
|
-
dimensions: rowDimensions,
|
|
92
|
-
pages: currentPages
|
|
93
|
-
});
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
return groups;
|
|
97
|
-
}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import getBookLayoutGroups from './book-layout';
|
|
2
|
-
import getSinglesLayoutGroups from './singles-layout';
|
|
3
|
-
import getGridLayoutGroups from './grid-layout';
|
|
4
|
-
|
|
5
|
-
/** Get the relative positioning of pages for the current view */
|
|
6
|
-
export default function getPageLayouts (settings)
|
|
7
|
-
{
|
|
8
|
-
if (settings.inGrid)
|
|
9
|
-
{
|
|
10
|
-
return getGridLayoutGroups(pluck(settings, [
|
|
11
|
-
'manifest',
|
|
12
|
-
'viewport',
|
|
13
|
-
'pagesPerRow',
|
|
14
|
-
'fixedHeightGrid',
|
|
15
|
-
'fixedPadding',
|
|
16
|
-
'showNonPagedPages'
|
|
17
|
-
]));
|
|
18
|
-
}
|
|
19
|
-
else
|
|
20
|
-
{
|
|
21
|
-
const config = pluck(settings, ['manifest', 'verticallyOriented', 'showNonPagedPages']);
|
|
22
|
-
|
|
23
|
-
if (settings.inBookLayout)
|
|
24
|
-
return getBookLayoutGroups(config);
|
|
25
|
-
else
|
|
26
|
-
return getSinglesLayoutGroups(config);
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
function pluck (obj, keys)
|
|
31
|
-
{
|
|
32
|
-
const out = {};
|
|
33
|
-
keys.forEach(function (key)
|
|
34
|
-
{
|
|
35
|
-
out[key] = obj[key];
|
|
36
|
-
});
|
|
37
|
-
return out;
|
|
38
|
-
}
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import getPageDimensions from './page-dimensions';
|
|
2
|
-
|
|
3
|
-
export default function getSinglesLayoutGroups (viewerConfig)
|
|
4
|
-
{
|
|
5
|
-
const manifest = viewerConfig.manifest;
|
|
6
|
-
|
|
7
|
-
// Render each page alone in a group
|
|
8
|
-
const pages = [];
|
|
9
|
-
manifest.pages.forEach( (page, index) =>
|
|
10
|
-
{
|
|
11
|
-
if (!viewerConfig.showNonPagedPages && manifest.paged && !page.paged)
|
|
12
|
-
return;
|
|
13
|
-
|
|
14
|
-
const pageDims = getPageDimensions(index, manifest);
|
|
15
|
-
|
|
16
|
-
pages.push({
|
|
17
|
-
dimensions: pageDims,
|
|
18
|
-
pages: [{
|
|
19
|
-
index: index,
|
|
20
|
-
groupOffset: { top: 0, left: 0 },
|
|
21
|
-
dimensions: pageDims
|
|
22
|
-
}]
|
|
23
|
-
});
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
return pages;
|
|
27
|
-
}
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Manages a collection of page overlays, which implement a low-level
|
|
3
|
-
* API for synchronizing HTML pages to the canvas. Each overlay needs
|
|
4
|
-
* to implement the following protocol:
|
|
5
|
-
*
|
|
6
|
-
* mount(): Called when a page is first rendered
|
|
7
|
-
* refresh(): Called when a page is moved
|
|
8
|
-
* unmount(): Called when a previously rendered page has stopped being rendered
|
|
9
|
-
*
|
|
10
|
-
* @class
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
export default class PageOverlayManager
|
|
14
|
-
{
|
|
15
|
-
constructor ()
|
|
16
|
-
{
|
|
17
|
-
this._pages = {};
|
|
18
|
-
this._renderedPages = [];
|
|
19
|
-
this._renderedPageMap = {};
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
addOverlay (overlay)
|
|
23
|
-
{
|
|
24
|
-
const overlaysByPage = this._pages[overlay.page] || (this._pages[overlay.page] = []);
|
|
25
|
-
|
|
26
|
-
overlaysByPage.push(overlay);
|
|
27
|
-
|
|
28
|
-
if (this._renderedPageMap[overlay.page])
|
|
29
|
-
overlay.mount();
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
removeOverlay (overlay)
|
|
33
|
-
{
|
|
34
|
-
const page = overlay.page;
|
|
35
|
-
const overlaysByPage = this._pages[page];
|
|
36
|
-
|
|
37
|
-
if (!overlaysByPage)
|
|
38
|
-
return;
|
|
39
|
-
|
|
40
|
-
const overlayIndex = overlaysByPage.indexOf(overlay);
|
|
41
|
-
|
|
42
|
-
if (overlayIndex === -1)
|
|
43
|
-
return;
|
|
44
|
-
|
|
45
|
-
if (this._renderedPageMap[page])
|
|
46
|
-
overlaysByPage[overlayIndex].unmount();
|
|
47
|
-
|
|
48
|
-
overlaysByPage.splice(overlayIndex, 1);
|
|
49
|
-
|
|
50
|
-
if (overlaysByPage.length === 0)
|
|
51
|
-
delete this._pages[page];
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
updateOverlays (renderedPages)
|
|
55
|
-
{
|
|
56
|
-
const previouslyRendered = this._renderedPages;
|
|
57
|
-
const newRenderedMap = {};
|
|
58
|
-
|
|
59
|
-
renderedPages.map( (pageIndex) =>
|
|
60
|
-
{
|
|
61
|
-
newRenderedMap[pageIndex] = true;
|
|
62
|
-
|
|
63
|
-
if (!this._renderedPageMap[pageIndex])
|
|
64
|
-
{
|
|
65
|
-
this._renderedPageMap[pageIndex] = true;
|
|
66
|
-
|
|
67
|
-
this._invokeOnOverlays(pageIndex, overlay =>
|
|
68
|
-
{
|
|
69
|
-
overlay.mount();
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
});
|
|
73
|
-
|
|
74
|
-
previouslyRendered.map( (pageIndex) =>
|
|
75
|
-
{
|
|
76
|
-
if (newRenderedMap[pageIndex])
|
|
77
|
-
{
|
|
78
|
-
this._invokeOnOverlays(pageIndex, (overlay) =>
|
|
79
|
-
{
|
|
80
|
-
overlay.refresh();
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
else
|
|
84
|
-
{
|
|
85
|
-
delete this._renderedPageMap[pageIndex];
|
|
86
|
-
this._invokeOnOverlays(pageIndex, overlay =>
|
|
87
|
-
{
|
|
88
|
-
overlay.unmount();
|
|
89
|
-
});
|
|
90
|
-
}
|
|
91
|
-
});
|
|
92
|
-
|
|
93
|
-
this._renderedPages = renderedPages;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
_invokeOnOverlays (pageIndex, func)
|
|
97
|
-
{
|
|
98
|
-
const overlays = this._pages[pageIndex];
|
|
99
|
-
if (overlays)
|
|
100
|
-
overlays.map( (o) => func(o) );
|
|
101
|
-
}
|
|
102
|
-
}
|
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
import { elt } from './utils/elt';
|
|
2
|
-
/**
|
|
3
|
-
*
|
|
4
|
-
*
|
|
5
|
-
**/
|
|
6
|
-
export default class PageToolsOverlay
|
|
7
|
-
{
|
|
8
|
-
constructor (pageIndex, viewerCore)
|
|
9
|
-
{
|
|
10
|
-
this.page = pageIndex;
|
|
11
|
-
|
|
12
|
-
this._viewerCore = viewerCore;
|
|
13
|
-
|
|
14
|
-
this._innerElement = this._viewerCore.getSettings().innerElement;
|
|
15
|
-
this._pageToolsElem = null;
|
|
16
|
-
this.labelWidth = 0;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
mount ()
|
|
20
|
-
{
|
|
21
|
-
if (this._pageToolsElem === null)
|
|
22
|
-
{
|
|
23
|
-
this._buttons = this._initializePageToolButtons();
|
|
24
|
-
|
|
25
|
-
this._pageToolsElem = elt('div', { class: 'diva-page-tools-wrapper' },
|
|
26
|
-
elt('div', { class: 'diva-page-tools' }, this._buttons)
|
|
27
|
-
);
|
|
28
|
-
|
|
29
|
-
this._pageLabelsElem = elt('div', { class: 'diva-page-labels-wrapper'},
|
|
30
|
-
elt('div', { class: 'diva-page-labels' }, this._viewerCore.settings.manifest.pages[this.page].l)
|
|
31
|
-
);
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
this.refresh();
|
|
35
|
-
this._innerElement.appendChild(this._pageToolsElem);
|
|
36
|
-
this._innerElement.appendChild(this._pageLabelsElem);
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
_initializePageToolButtons ()
|
|
40
|
-
{
|
|
41
|
-
// Callback parameters
|
|
42
|
-
const settings = this._viewerCore.getSettings();
|
|
43
|
-
const publicInstance = this._viewerCore.getPublicInstance();
|
|
44
|
-
const pageIndex = this.page;
|
|
45
|
-
|
|
46
|
-
return this._viewerCore.getPageTools().map( (plugin) =>
|
|
47
|
-
{
|
|
48
|
-
// !!! The node needs to be cloned otherwise it is detached from
|
|
49
|
-
// one and reattached to the other.
|
|
50
|
-
const button = plugin.pageToolsIcon.cloneNode(true);
|
|
51
|
-
|
|
52
|
-
// ensure the plugin instance is handed as the first argument to call;
|
|
53
|
-
// this will set the context (i.e., `this`) of the handleClick call to the plugin instance
|
|
54
|
-
// itself.
|
|
55
|
-
button.addEventListener('click', (event) =>
|
|
56
|
-
{
|
|
57
|
-
plugin.handleClick.call(plugin, event, settings, publicInstance, pageIndex);
|
|
58
|
-
}, false);
|
|
59
|
-
|
|
60
|
-
button.addEventListener('touchend', (event) =>
|
|
61
|
-
{
|
|
62
|
-
// Prevent firing of emulated mouse events
|
|
63
|
-
event.preventDefault();
|
|
64
|
-
|
|
65
|
-
plugin.handleClick.call(plugin, event, settings, publicInstance, pageIndex);
|
|
66
|
-
}, false);
|
|
67
|
-
|
|
68
|
-
return button;
|
|
69
|
-
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
unmount ()
|
|
74
|
-
{
|
|
75
|
-
this._innerElement.removeChild(this._pageToolsElem);
|
|
76
|
-
this._innerElement.removeChild(this._pageLabelsElem);
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
refresh ()
|
|
80
|
-
{
|
|
81
|
-
const pos = this._viewerCore.getPageRegion(this.page, {
|
|
82
|
-
includePadding: true,
|
|
83
|
-
incorporateViewport: true
|
|
84
|
-
});
|
|
85
|
-
|
|
86
|
-
// if window is resized larger, a margin is created - need to subtract this from offsets
|
|
87
|
-
let marginLeft = window.getComputedStyle(this._innerElement, null).getPropertyValue('margin-left');
|
|
88
|
-
|
|
89
|
-
this._pageToolsElem.style.top = `${pos.top}px`;
|
|
90
|
-
this._pageToolsElem.style.left = `${pos.left - parseInt(marginLeft)}px`;
|
|
91
|
-
|
|
92
|
-
this._pageLabelsElem.style.top = `${pos.top}px`;
|
|
93
|
-
this._pageLabelsElem.style.left = `${pos.right - parseInt(marginLeft) - this.labelWidth - 5}px`;
|
|
94
|
-
}
|
|
95
|
-
}
|