diff options
Diffstat (limited to 'pointless/viewer/screen/screen.js')
-rw-r--r-- | pointless/viewer/screen/screen.js | 110 |
1 files changed, 110 insertions, 0 deletions
diff --git a/pointless/viewer/screen/screen.js b/pointless/viewer/screen/screen.js new file mode 100644 index 0000000..bf7a049 --- /dev/null +++ b/pointless/viewer/screen/screen.js | |||
@@ -0,0 +1,110 @@ | |||
1 | /* | ||
2 | * Pointless Viewer, a web-based Beamer presentation viewer | ||
3 | * Copyright (C) 2018 Pacien TRAN-GIRARD | ||
4 | * | ||
5 | * This program is free software: you can redistribute it and/or modify | ||
6 | * it under the terms of the GNU Affero General Public License as | ||
7 | * published by the Free Software Foundation, either version 3 of the | ||
8 | * License, or (at your option) any later version. | ||
9 | * | ||
10 | * This program is distributed in the hope that it will be useful, | ||
11 | * but WITHOUT ANY WARRANTY; without even the implied warranty of | ||
12 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | ||
13 | * GNU Affero General Public License for more details. | ||
14 | * | ||
15 | * You should have received a copy of the GNU Affero General Public License | ||
16 | * along with this program. If not, see <https://www.gnu.org/licenses/>. | ||
17 | */ | ||
18 | |||
19 | "use strict"; | ||
20 | |||
21 | class Screen { | ||
22 | constructor(window, secondary=false, withTimer=false) { | ||
23 | this.window = window; | ||
24 | this.secondary = secondary; | ||
25 | |||
26 | this.canvasId = "screen"; | ||
27 | this.page = null; | ||
28 | |||
29 | this.timer = withTimer ? new Timer(window) : null; | ||
30 | this.pageTurnCount = 0; | ||
31 | |||
32 | this._registerListeners(); | ||
33 | this._hideWelcomeScreen(); | ||
34 | } | ||
35 | |||
36 | setPage(page) { | ||
37 | if (this.pageTurnCount++ === 1 && this.timer != null) | ||
38 | this.timer.start(); | ||
39 | |||
40 | this.page = page; | ||
41 | this._repaint(); | ||
42 | } | ||
43 | |||
44 | _registerListeners() { | ||
45 | const self = this; | ||
46 | this.window.addEventListener("resize", function() { | ||
47 | self._repaint(); | ||
48 | }); | ||
49 | } | ||
50 | |||
51 | _hideWelcomeScreen() { | ||
52 | const welcomeScreen = this.window.document.getElementById("welcomeScreen"); | ||
53 | welcomeScreen.style.display = "none"; | ||
54 | } | ||
55 | |||
56 | _getScreenSize(ratio) { | ||
57 | const windowRatio = this.window.innerWidth / this.window.innerHeight; | ||
58 | const horizontalScaleFactor = ratio / windowRatio; | ||
59 | return { | ||
60 | width: this.window.innerWidth * Math.min(horizontalScaleFactor, 1), | ||
61 | height: this.window.innerHeight / Math.max(horizontalScaleFactor, 1) | ||
62 | }; | ||
63 | } | ||
64 | |||
65 | _getSlideSizeRatio() { | ||
66 | const viewport = this.page.getViewport(1); | ||
67 | return (viewport.width / 2) / viewport.height; | ||
68 | } | ||
69 | |||
70 | _newCanvas(width, height, xOffset, yOffset) { | ||
71 | const canvas = document.createElement("canvas"); | ||
72 | canvas.width = width; | ||
73 | canvas.height = height; | ||
74 | |||
75 | const context = canvas.getContext("2d"); | ||
76 | context.transform(1, 0, 0, 1, xOffset, yOffset); | ||
77 | |||
78 | return { canvas: canvas, context: context }; | ||
79 | } | ||
80 | |||
81 | _showCanvas(canvas) { | ||
82 | const oldCanvas = this.window.document.getElementById(this.canvasId); | ||
83 | canvas.id = oldCanvas.id; | ||
84 | canvas.classList = oldCanvas.classList; | ||
85 | oldCanvas.replaceWith(canvas); | ||
86 | } | ||
87 | |||
88 | _render(canvas, context, scaleFactor) { | ||
89 | const renderContext = { | ||
90 | canvasContext: context, | ||
91 | viewport: this.page.getViewport(scaleFactor) | ||
92 | }; | ||
93 | |||
94 | const self = this; | ||
95 | this.page.render(renderContext).then(function() { | ||
96 | self._showCanvas(canvas); | ||
97 | }); | ||
98 | } | ||
99 | |||
100 | _repaint() { | ||
101 | if (this.page == null) return; | ||
102 | |||
103 | const screenRatio = this._getSlideSizeRatio(); | ||
104 | const { width, height } = this._getScreenSize(screenRatio); | ||
105 | const scaleFactor = height / this.page.getViewport(1).height; | ||
106 | const xOffset = this.secondary ? -width : 0; | ||
107 | const { canvas, context } = this._newCanvas(width, height, xOffset, 0); | ||
108 | this._render(canvas, context, scaleFactor); | ||
109 | } | ||
110 | } | ||