remote-calibrator 0.3.0-rc.3 → 0.5.0-beta.10

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.
Files changed (58) hide show
  1. package/CHANGELOG.md +35 -3
  2. package/README.md +34 -49
  3. package/homepage/example.css +4 -3
  4. package/homepage/example.js +42 -22
  5. package/homepage/index.html +19 -4
  6. package/i18n/fetch-languages-sheets.js +11 -1
  7. package/lib/RemoteCalibrator.min.js +1 -1
  8. package/lib/RemoteCalibrator.min.js.LICENSE.txt +19 -2
  9. package/lib/RemoteCalibrator.min.js.map +1 -1
  10. package/netlify.toml +1 -1
  11. package/package.json +25 -24
  12. package/src/WebGazer4RC/package-lock.json +198 -143
  13. package/src/WebGazer4RC/package.json +2 -2
  14. package/src/WebGazer4RC/src/index.mjs +161 -52
  15. package/src/WebGazer4RC/test/webgazer_test.js +1 -1
  16. package/src/check/checkScreenSize.js +84 -0
  17. package/src/components/buttons.js +21 -4
  18. package/src/components/input.js +82 -0
  19. package/src/components/keyBinder.js +5 -6
  20. package/src/components/language.js +5 -0
  21. package/src/components/mediaPermission.js +21 -0
  22. package/src/components/onCanvas.js +2 -2
  23. package/src/components/sound.js +30 -2
  24. package/src/components/swalOptions.js +6 -3
  25. package/src/components/utils.js +27 -1
  26. package/src/components/video.js +9 -6
  27. package/src/const.js +15 -0
  28. package/src/core.js +103 -48
  29. package/src/css/buttons.scss +34 -7
  30. package/src/css/components.scss +57 -0
  31. package/src/css/distance.scss +71 -1
  32. package/src/css/gaze.css +9 -5
  33. package/src/css/main.css +22 -6
  34. package/src/css/panel.scss +33 -3
  35. package/src/css/screenSize.css +6 -5
  36. package/src/css/swal.css +1 -1
  37. package/src/css/video.scss +19 -0
  38. package/src/distance/distance.js +194 -41
  39. package/src/distance/distanceCheck.js +241 -0
  40. package/src/distance/distanceTrack.js +165 -68
  41. package/src/{interpupillaryDistance.js → distance/interPupillaryDistance.js} +27 -19
  42. package/src/gaze/gaze.js +4 -7
  43. package/src/gaze/gazeAccuracy.js +9 -4
  44. package/src/gaze/gazeCalibration.js +14 -4
  45. package/src/gaze/gazeTracker.js +40 -9
  46. package/src/i18n.js +1 -1
  47. package/src/index.js +7 -2
  48. package/src/media/two-side-arrow.svg +1 -0
  49. package/src/media/two-sided-horizontal.svg +1 -0
  50. package/src/media/two-sided-vertical.svg +3 -0
  51. package/src/panel.js +130 -65
  52. package/src/screenSize.js +38 -5
  53. package/webpack.config.js +7 -4
  54. package/media/measureDistance.png +0 -0
  55. package/media/panel.png +0 -0
  56. package/media/screenSize.png +0 -0
  57. package/media/trackGaze.png +0 -0
  58. package/src/displaySize.js +0 -28
@@ -0,0 +1,241 @@
1
+ import RemoteCalibrator from '../core'
2
+ import { bindKeys, unbindKeys } from '../components/keyBinder'
3
+ import { phrases } from '../i18n'
4
+ import { addButtons } from '../components/buttons'
5
+ import { sleep } from '../components/utils'
6
+
7
+ RemoteCalibrator.prototype.checkDistance = function (
8
+ cancelable = false,
9
+ trackingConfig
10
+ ) {
11
+ ////
12
+ if (!this.checkInitialized()) return
13
+ ////
14
+ const { distanceDesired, distanceAllowedRatio } = this._distanceTrackNudging
15
+
16
+ if (!distanceDesired) return
17
+
18
+ if (
19
+ this.viewingDistanceCm &&
20
+ this.viewingDistanceCm.method === this._CONST.VIEW_METHOD.F
21
+ ) {
22
+ if (
23
+ !withinRange(
24
+ this.viewingDistanceCm.value,
25
+ distanceDesired,
26
+ distanceAllowedRatio
27
+ )
28
+ ) {
29
+ // ! Out of range
30
+ const breakFunction = () => {
31
+ // In range, remove the nudger, not break/end the whole system
32
+ this._removeNudger()
33
+ clearInterval(this._distanceTrackNudging.distanceCorrecting)
34
+ this._distanceTrackNudging.distanceCorrecting = null
35
+
36
+ unbindKeys(bindKeysFunction)
37
+ }
38
+
39
+ const restartViewingDistanceTracking = async () => {
40
+ this.endDistance()
41
+ this._addBackground()
42
+ await sleep(2000)
43
+ this.trackDistance(
44
+ trackingConfig.options,
45
+ trackingConfig.callbackStatic,
46
+ trackingConfig.callbackTrack
47
+ )
48
+ }
49
+
50
+ // Bind keys
51
+ const bindKeysFunction = bindKeys(
52
+ cancelable
53
+ ? {
54
+ Escape: this.endNudger,
55
+ }
56
+ : {}
57
+ )
58
+
59
+ if (
60
+ this._distanceTrackNudging.distanceCorrecting === null &&
61
+ this._distanceTrackNudging.distanceCorrectEnabled
62
+ ) {
63
+ // ! Start
64
+ const [moveElement, guideNumNow, guideNumDesired] =
65
+ startCorrecting(this)
66
+
67
+ let buttonConfig = cancelable
68
+ ? {
69
+ cancel: () => {
70
+ this.endNudger()
71
+ },
72
+ }
73
+ : {}
74
+ buttonConfig = {
75
+ ...buttonConfig,
76
+ custom: {
77
+ callback: restartViewingDistanceTracking,
78
+ content: phrases.RC_distanceTrackingRedo[this.L],
79
+ },
80
+ }
81
+
82
+ addButtons(
83
+ this.L,
84
+ this.nudger,
85
+ buttonConfig,
86
+ this.params.showCancelButton
87
+ )
88
+
89
+ const _update = () => {
90
+ moveElement.innerHTML = getMoveInner(
91
+ this,
92
+ this.viewingDistanceCm.value,
93
+ distanceDesired
94
+ )
95
+ guideNumNow.innerHTML = Math.round(this.viewingDistanceCm.value)
96
+ guideNumDesired.innerHTML = Math.round(distanceDesired)
97
+ }
98
+ _update()
99
+
100
+ this._distanceTrackNudging.distanceCorrecting = setInterval(() => {
101
+ _update()
102
+
103
+ // Check again
104
+ if (
105
+ withinRange(
106
+ this.viewingDistanceCm.value,
107
+ distanceDesired,
108
+ distanceAllowedRatio
109
+ )
110
+ ) {
111
+ breakFunction()
112
+ unbindKeys(bindKeysFunction)
113
+ }
114
+ }, 200)
115
+ } else if (
116
+ this._distanceTrackNudging.distanceCorrecting &&
117
+ !this._distanceTrackNudging.distanceCorrectEnabled
118
+ ) {
119
+ breakFunction()
120
+ }
121
+ return false
122
+ } else {
123
+ // ! In range
124
+ return true
125
+ }
126
+ } else {
127
+ console.error(
128
+ 'You need to start tracking viewing distance before checking it.'
129
+ )
130
+ return false
131
+ }
132
+ }
133
+
134
+ const withinRange = (value, target, toleranceRatio) => {
135
+ if (!validateAllowedRatio(toleranceRatio)) return false
136
+ let b1 = target * toleranceRatio
137
+ let b2 = target / toleranceRatio
138
+ return value <= Math.max(b1, b2) && value >= Math.min(b1, b2)
139
+ }
140
+
141
+ const startCorrecting = RC => {
142
+ RC._addNudger(`<div id="rc-distance-correct">
143
+ <p id="rc-distance-correct-instruction"></p>
144
+ <p id="rc-distance-correct-guide">${phrases.RC_distanceTrackingGuide[RC.L]
145
+ .replace(
146
+ 'xx1',
147
+ `<span class="rc-distance-num rc-distance-now" id="rc-distance-now"></span>`
148
+ )
149
+ .replace(
150
+ 'xx2',
151
+ `<span class="rc-distance-num rc-distance-desired" id="rc-distance-desired"></span>`
152
+ )}</p>
153
+ </div>
154
+ `)
155
+
156
+ return [
157
+ document.querySelector('#rc-distance-correct-instruction'),
158
+ document.querySelector('#rc-distance-now'),
159
+ document.querySelector('#rc-distance-desired'),
160
+ ]
161
+ }
162
+
163
+ const getMoveInner = (RC, value, target) => {
164
+ if (value >= target) return phrases.RC_distanceTrackingMoveCloser[RC.L]
165
+ else return phrases.RC_distanceTrackingMoveFurther[RC.L]
166
+ }
167
+
168
+ const validateAllowedRatio = ratio => {
169
+ if (isNaN(ratio)) return false
170
+ return ratio > 0 && ratio !== 1
171
+ }
172
+
173
+ RemoteCalibrator.prototype.setDistanceDesired = function (
174
+ d,
175
+ allowedRatio = null
176
+ ) {
177
+ this._distanceTrackNudging.distanceDesired = d
178
+ if (allowedRatio && validateAllowedRatio(allowedRatio))
179
+ this._distanceTrackNudging.distanceAllowedRatio = allowedRatio
180
+ return d
181
+ }
182
+
183
+ RemoteCalibrator.prototype._addNudger = function (inner) {
184
+ if (this.nudger !== null) return
185
+
186
+ let b = document.getElementById('calibration-nudger')
187
+ if (!b) {
188
+ b = document.createElement('div')
189
+ b.id = 'calibration-nudger'
190
+ b.className = 'calibration-nudger' + ` rc-lang-${this.LD.toLowerCase()}`
191
+
192
+ document.body.classList.add('lock-view')
193
+ document.body.appendChild(b)
194
+
195
+ b.style.background = this.params.backgroundColor
196
+ }
197
+
198
+ if (inner) b.innerHTML = inner
199
+ this._nudger.element = b
200
+
201
+ return this.nudger
202
+ }
203
+
204
+ RemoteCalibrator.prototype._removeNudger = function () {
205
+ let b = document.getElementById('calibration-nudger')
206
+ if (b) {
207
+ document.body.classList.remove('lock-view')
208
+ document.body.removeChild(b)
209
+
210
+ this._nudger = {
211
+ element: null,
212
+ }
213
+ // There is a nudger and remove successfully
214
+ return true
215
+ }
216
+ // Cannot find the nudger
217
+ return false
218
+ }
219
+
220
+ RemoteCalibrator.prototype.pauseNudger = function () {
221
+ document.body.classList.add('hide-nudger')
222
+ }
223
+
224
+ RemoteCalibrator.prototype.resumeNudger = function () {
225
+ document.body.classList.remove('hide-nudger')
226
+ }
227
+
228
+ RemoteCalibrator.prototype.endNudger = function () {
229
+ if (!this._distanceTrackNudging.distanceCorrectEnabled) return false
230
+ this._removeNudger()
231
+ // NOT back to init state
232
+ this._distanceTrackNudging.distanceCorrectEnabled = false
233
+ // Back to init state
234
+ if (this._distanceTrackNudging.distanceCorrecting)
235
+ clearInterval(this._distanceTrackNudging.distanceCorrecting)
236
+ this._distanceTrackNudging.distanceCorrecting = null
237
+ this._distanceTrackNudging.distanceDesired = null
238
+ this._distanceAllowedRatio = null
239
+
240
+ return true
241
+ }