@capgo/camera-preview 7.23.10 → 7.23.12
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/README.md +18 -18
- package/android/src/androidTest/java/com/getcapacitor/android/ExampleInstrumentedTest.java +6 -6
- package/android/src/main/java/app/capgo/capacitor/camera/preview/CameraPreview.java +1838 -2291
- package/android/src/main/java/app/capgo/capacitor/camera/preview/CameraXView.java +3153 -3948
- package/android/src/main/java/app/capgo/capacitor/camera/preview/GridOverlayView.java +86 -97
- package/android/src/main/java/app/capgo/capacitor/camera/preview/model/CameraDevice.java +53 -53
- package/android/src/main/java/app/capgo/capacitor/camera/preview/model/CameraSessionConfiguration.java +166 -166
- package/android/src/main/java/app/capgo/capacitor/camera/preview/model/LensInfo.java +22 -27
- package/android/src/main/java/app/capgo/capacitor/camera/preview/model/ZoomFactors.java +22 -22
- package/android/src/test/java/com/getcapacitor/ExampleUnitTest.java +4 -4
- package/dist/docs.json +34 -34
- package/dist/esm/definitions.d.ts +15 -15
- package/dist/esm/definitions.js.map +1 -1
- package/dist/esm/index.d.ts +2 -2
- package/dist/esm/index.js +5 -5
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/web.d.ts +4 -4
- package/dist/esm/web.js +201 -216
- package/dist/esm/web.js.map +1 -1
- package/dist/plugin.cjs.js +201 -216
- package/dist/plugin.cjs.js.map +1 -1
- package/dist/plugin.js +201 -216
- package/dist/plugin.js.map +1 -1
- package/package.json +2 -2
package/dist/plugin.js
CHANGED
|
@@ -12,7 +12,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
12
12
|
DeviceType["TRIPLE"] = "triple";
|
|
13
13
|
})(exports.DeviceType || (exports.DeviceType = {}));
|
|
14
14
|
|
|
15
|
-
const CameraPreview = core.registerPlugin(
|
|
15
|
+
const CameraPreview = core.registerPlugin('CameraPreview', {
|
|
16
16
|
web: () => Promise.resolve().then(function () { return web; }).then((m) => new m.CameraPreviewWeb()),
|
|
17
17
|
});
|
|
18
18
|
async function getBase64FromFilePath(filePath) {
|
|
@@ -26,7 +26,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
26
26
|
const reader = new FileReader();
|
|
27
27
|
reader.onloadend = () => {
|
|
28
28
|
const dataUrl = reader.result;
|
|
29
|
-
const commaIndex = dataUrl.indexOf(
|
|
29
|
+
const commaIndex = dataUrl.indexOf(',');
|
|
30
30
|
resolve(commaIndex >= 0 ? dataUrl.substring(commaIndex + 1) : dataUrl);
|
|
31
31
|
};
|
|
32
32
|
reader.onerror = () => reject(reader.error);
|
|
@@ -39,7 +39,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
39
39
|
return !!success;
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
-
const DEFAULT_VIDEO_ID =
|
|
42
|
+
const DEFAULT_VIDEO_ID = 'capgo_video';
|
|
43
43
|
class CameraPreviewWeb extends core.WebPlugin {
|
|
44
44
|
constructor() {
|
|
45
45
|
super();
|
|
@@ -55,32 +55,32 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
55
55
|
}
|
|
56
56
|
async checkPermissions(options) {
|
|
57
57
|
const result = {
|
|
58
|
-
camera:
|
|
58
|
+
camera: 'prompt',
|
|
59
59
|
};
|
|
60
60
|
const permissionsApi = navigator === null || navigator === void 0 ? void 0 : navigator.permissions;
|
|
61
61
|
if (permissionsApi === null || permissionsApi === void 0 ? void 0 : permissionsApi.query) {
|
|
62
62
|
try {
|
|
63
|
-
const cameraPermission = await permissionsApi.query({ name:
|
|
63
|
+
const cameraPermission = await permissionsApi.query({ name: 'camera' });
|
|
64
64
|
result.camera = this.mapWebPermission(cameraPermission.state);
|
|
65
65
|
}
|
|
66
66
|
catch (error) {
|
|
67
|
-
console.warn(
|
|
67
|
+
console.warn('Camera permission query failed', error);
|
|
68
68
|
}
|
|
69
69
|
if ((options === null || options === void 0 ? void 0 : options.disableAudio) === false) {
|
|
70
70
|
try {
|
|
71
71
|
const microphonePermission = await permissionsApi.query({
|
|
72
|
-
name:
|
|
72
|
+
name: 'microphone',
|
|
73
73
|
});
|
|
74
74
|
result.microphone = this.mapWebPermission(microphonePermission.state);
|
|
75
75
|
}
|
|
76
76
|
catch (error) {
|
|
77
|
-
console.warn(
|
|
78
|
-
result.microphone =
|
|
77
|
+
console.warn('Microphone permission query failed', error);
|
|
78
|
+
result.microphone = 'prompt';
|
|
79
79
|
}
|
|
80
80
|
}
|
|
81
81
|
}
|
|
82
82
|
else if ((options === null || options === void 0 ? void 0 : options.disableAudio) === false) {
|
|
83
|
-
result.microphone =
|
|
83
|
+
result.microphone = 'prompt';
|
|
84
84
|
}
|
|
85
85
|
return result;
|
|
86
86
|
}
|
|
@@ -88,15 +88,13 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
88
88
|
var _a, _b;
|
|
89
89
|
const disableAudio = (_a = options === null || options === void 0 ? void 0 : options.disableAudio) !== null && _a !== void 0 ? _a : true;
|
|
90
90
|
if ((_b = navigator === null || navigator === void 0 ? void 0 : navigator.mediaDevices) === null || _b === void 0 ? void 0 : _b.getUserMedia) {
|
|
91
|
-
const constraints = disableAudio
|
|
92
|
-
? { video: true }
|
|
93
|
-
: { video: true, audio: true };
|
|
91
|
+
const constraints = disableAudio ? { video: true } : { video: true, audio: true };
|
|
94
92
|
let stream;
|
|
95
93
|
try {
|
|
96
94
|
stream = await navigator.mediaDevices.getUserMedia(constraints);
|
|
97
95
|
}
|
|
98
96
|
catch (error) {
|
|
99
|
-
console.warn(
|
|
97
|
+
console.warn('Unable to obtain camera or microphone stream', error);
|
|
100
98
|
}
|
|
101
99
|
finally {
|
|
102
100
|
try {
|
|
@@ -109,19 +107,19 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
109
107
|
}
|
|
110
108
|
const status = await this.checkPermissions({ disableAudio: disableAudio });
|
|
111
109
|
if (options === null || options === void 0 ? void 0 : options.showSettingsAlert) {
|
|
112
|
-
console.warn(
|
|
110
|
+
console.warn('showSettingsAlert is not supported on the web platform; returning permission status only.');
|
|
113
111
|
}
|
|
114
112
|
return status;
|
|
115
113
|
}
|
|
116
114
|
mapWebPermission(state) {
|
|
117
115
|
switch (state) {
|
|
118
|
-
case
|
|
119
|
-
return
|
|
120
|
-
case
|
|
121
|
-
return
|
|
122
|
-
case
|
|
116
|
+
case 'granted':
|
|
117
|
+
return 'granted';
|
|
118
|
+
case 'denied':
|
|
119
|
+
return 'denied';
|
|
120
|
+
case 'prompt':
|
|
123
121
|
default:
|
|
124
|
-
return
|
|
122
|
+
return 'prompt';
|
|
125
123
|
}
|
|
126
124
|
}
|
|
127
125
|
getCurrentOrientation() {
|
|
@@ -129,113 +127,111 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
129
127
|
try {
|
|
130
128
|
const so = screen.orientation;
|
|
131
129
|
const type = (so === null || so === void 0 ? void 0 : so.type) || (so === null || so === void 0 ? void 0 : so.mozOrientation) || (so === null || so === void 0 ? void 0 : so.msOrientation);
|
|
132
|
-
if (typeof type ===
|
|
133
|
-
if (type.includes(
|
|
134
|
-
return
|
|
135
|
-
if (type.includes(
|
|
136
|
-
return
|
|
137
|
-
if (type.includes(
|
|
138
|
-
return
|
|
139
|
-
if (type.includes(
|
|
140
|
-
return
|
|
141
|
-
if (type.includes(
|
|
142
|
-
return
|
|
143
|
-
if (type.includes(
|
|
144
|
-
return
|
|
130
|
+
if (typeof type === 'string') {
|
|
131
|
+
if (type.includes('portrait-primary'))
|
|
132
|
+
return 'portrait';
|
|
133
|
+
if (type.includes('portrait-secondary'))
|
|
134
|
+
return 'portrait-upside-down';
|
|
135
|
+
if (type.includes('landscape-primary'))
|
|
136
|
+
return 'landscape-left';
|
|
137
|
+
if (type.includes('landscape-secondary'))
|
|
138
|
+
return 'landscape-right';
|
|
139
|
+
if (type.includes('landscape'))
|
|
140
|
+
return 'landscape-right'; // avoid generic landscape
|
|
141
|
+
if (type.includes('portrait'))
|
|
142
|
+
return 'portrait';
|
|
145
143
|
}
|
|
146
144
|
const angle = window.orientation;
|
|
147
|
-
if (typeof angle ===
|
|
145
|
+
if (typeof angle === 'number') {
|
|
148
146
|
if (angle === 0)
|
|
149
|
-
return
|
|
147
|
+
return 'portrait';
|
|
150
148
|
if (angle === 180)
|
|
151
|
-
return
|
|
149
|
+
return 'portrait-upside-down';
|
|
152
150
|
if (angle === 90)
|
|
153
|
-
return
|
|
151
|
+
return 'landscape-right';
|
|
154
152
|
if (angle === -90)
|
|
155
|
-
return
|
|
153
|
+
return 'landscape-left';
|
|
156
154
|
if (angle === 270)
|
|
157
|
-
return
|
|
155
|
+
return 'landscape-left';
|
|
158
156
|
}
|
|
159
|
-
if ((_a = window.matchMedia(
|
|
160
|
-
return
|
|
157
|
+
if ((_a = window.matchMedia('(orientation: portrait)')) === null || _a === void 0 ? void 0 : _a.matches) {
|
|
158
|
+
return 'portrait';
|
|
161
159
|
}
|
|
162
|
-
if ((_b = window.matchMedia(
|
|
160
|
+
if ((_b = window.matchMedia('(orientation: landscape)')) === null || _b === void 0 ? void 0 : _b.matches) {
|
|
163
161
|
// Default to landscape-right when we can't distinguish primary/secondary
|
|
164
|
-
return
|
|
162
|
+
return 'landscape-right';
|
|
165
163
|
}
|
|
166
164
|
}
|
|
167
165
|
catch (e) {
|
|
168
166
|
console.error(e);
|
|
169
167
|
}
|
|
170
|
-
return
|
|
168
|
+
return 'unknown';
|
|
171
169
|
}
|
|
172
170
|
ensureOrientationListener() {
|
|
173
171
|
if (this.orientationListenerBound)
|
|
174
172
|
return;
|
|
175
173
|
const emit = () => {
|
|
176
|
-
this.notifyListeners(
|
|
174
|
+
this.notifyListeners('orientationChange', {
|
|
177
175
|
orientation: this.getCurrentOrientation(),
|
|
178
176
|
});
|
|
179
177
|
};
|
|
180
|
-
window.addEventListener(
|
|
181
|
-
window.addEventListener(
|
|
178
|
+
window.addEventListener('orientationchange', emit);
|
|
179
|
+
window.addEventListener('resize', emit);
|
|
182
180
|
this.orientationListenerBound = true;
|
|
183
181
|
}
|
|
184
182
|
async getOrientation() {
|
|
185
183
|
return { orientation: this.getCurrentOrientation() };
|
|
186
184
|
}
|
|
187
185
|
getSafeAreaInsets() {
|
|
188
|
-
throw new Error(
|
|
186
|
+
throw new Error('Method not implemented.');
|
|
189
187
|
}
|
|
190
188
|
async getZoomButtonValues() {
|
|
191
|
-
throw new Error(
|
|
189
|
+
throw new Error('getZoomButtonValues not supported under the web platform');
|
|
192
190
|
}
|
|
193
191
|
async getSupportedPictureSizes() {
|
|
194
|
-
throw new Error(
|
|
192
|
+
throw new Error('getSupportedPictureSizes not supported under the web platform');
|
|
195
193
|
}
|
|
196
194
|
async start(options) {
|
|
197
195
|
if (options.aspectRatio && (options.width || options.height)) {
|
|
198
|
-
throw new Error(
|
|
196
|
+
throw new Error('Cannot set both aspectRatio and size (width/height). Use setPreviewSize after start.');
|
|
199
197
|
}
|
|
200
198
|
if (this.isStarted) {
|
|
201
|
-
throw new Error(
|
|
199
|
+
throw new Error('camera already started');
|
|
202
200
|
}
|
|
203
201
|
this.isBackCamera = true;
|
|
204
202
|
this.isStarted = false;
|
|
205
|
-
const parent = document.getElementById((options === null || options === void 0 ? void 0 : options.parent) ||
|
|
206
|
-
const gridMode = (options === null || options === void 0 ? void 0 : options.gridMode) ||
|
|
207
|
-
const positioning = (options === null || options === void 0 ? void 0 : options.positioning) ||
|
|
203
|
+
const parent = document.getElementById((options === null || options === void 0 ? void 0 : options.parent) || '');
|
|
204
|
+
const gridMode = (options === null || options === void 0 ? void 0 : options.gridMode) || 'none';
|
|
205
|
+
const positioning = (options === null || options === void 0 ? void 0 : options.positioning) || 'top';
|
|
208
206
|
if (options.position) {
|
|
209
|
-
this.isBackCamera = options.position ===
|
|
207
|
+
this.isBackCamera = options.position === 'rear';
|
|
210
208
|
}
|
|
211
209
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
212
210
|
if (video) {
|
|
213
211
|
video.remove();
|
|
214
212
|
}
|
|
215
|
-
const container = options.parent
|
|
216
|
-
? document.getElementById(options.parent)
|
|
217
|
-
: document.body;
|
|
213
|
+
const container = options.parent ? document.getElementById(options.parent) : document.body;
|
|
218
214
|
if (!container) {
|
|
219
|
-
throw new Error(
|
|
215
|
+
throw new Error('container not found');
|
|
220
216
|
}
|
|
221
|
-
this.videoElement = document.createElement(
|
|
217
|
+
this.videoElement = document.createElement('video');
|
|
222
218
|
this.videoElement.id = DEFAULT_VIDEO_ID;
|
|
223
|
-
this.videoElement.className = options.className ||
|
|
219
|
+
this.videoElement.className = options.className || '';
|
|
224
220
|
this.videoElement.playsInline = true;
|
|
225
221
|
this.videoElement.muted = true;
|
|
226
222
|
this.videoElement.autoplay = true;
|
|
227
223
|
// Remove objectFit as we'll match camera's native aspect ratio
|
|
228
|
-
this.videoElement.style.backgroundColor =
|
|
224
|
+
this.videoElement.style.backgroundColor = 'transparent';
|
|
229
225
|
// Reset any default margins that might interfere
|
|
230
|
-
this.videoElement.style.margin =
|
|
231
|
-
this.videoElement.style.padding =
|
|
226
|
+
this.videoElement.style.margin = '0';
|
|
227
|
+
this.videoElement.style.padding = '0';
|
|
232
228
|
container.appendChild(this.videoElement);
|
|
233
229
|
if (options.toBack) {
|
|
234
|
-
this.videoElement.style.zIndex =
|
|
230
|
+
this.videoElement.style.zIndex = '-1';
|
|
235
231
|
}
|
|
236
232
|
// Default to 4:3 if no aspect ratio or size specified
|
|
237
233
|
const useDefaultAspectRatio = !options.aspectRatio && !options.width && !options.height;
|
|
238
|
-
const effectiveAspectRatio = options.aspectRatio || (useDefaultAspectRatio ?
|
|
234
|
+
const effectiveAspectRatio = options.aspectRatio || (useDefaultAspectRatio ? '4:3' : null);
|
|
239
235
|
if (options.width) {
|
|
240
236
|
this.videoElement.width = options.width;
|
|
241
237
|
this.videoElement.style.width = `${options.width}px`;
|
|
@@ -248,8 +244,8 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
248
244
|
const centerX = options.x === undefined;
|
|
249
245
|
const centerY = options.y === undefined;
|
|
250
246
|
// Always set position to absolute for proper positioning
|
|
251
|
-
this.videoElement.style.position =
|
|
252
|
-
console.log(
|
|
247
|
+
this.videoElement.style.position = 'absolute';
|
|
248
|
+
console.log('Initial positioning flags:', {
|
|
253
249
|
centerX,
|
|
254
250
|
centerY,
|
|
255
251
|
x: options.x,
|
|
@@ -262,28 +258,28 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
262
258
|
this.videoElement.style.top = `${options.y}px`;
|
|
263
259
|
}
|
|
264
260
|
// Create and add grid overlay if needed
|
|
265
|
-
if (gridMode !==
|
|
261
|
+
if (gridMode !== 'none') {
|
|
266
262
|
const gridOverlay = this.createGridOverlay(gridMode);
|
|
267
|
-
gridOverlay.id =
|
|
263
|
+
gridOverlay.id = 'camera-grid-overlay';
|
|
268
264
|
parent === null || parent === void 0 ? void 0 : parent.appendChild(gridOverlay);
|
|
269
265
|
}
|
|
270
266
|
// Aspect ratio handling is now done after getting camera stream
|
|
271
267
|
// Store centering flags for later use
|
|
272
268
|
const needsCenterX = centerX;
|
|
273
269
|
const needsCenterY = centerY;
|
|
274
|
-
console.log(
|
|
270
|
+
console.log('Centering flags stored:', { needsCenterX, needsCenterY });
|
|
275
271
|
// First get the camera stream with basic constraints
|
|
276
272
|
const constraints = {
|
|
277
273
|
video: {
|
|
278
|
-
facingMode: this.isBackCamera ?
|
|
274
|
+
facingMode: this.isBackCamera ? 'environment' : 'user',
|
|
279
275
|
},
|
|
280
276
|
};
|
|
281
277
|
const stream = await navigator.mediaDevices.getUserMedia(constraints);
|
|
282
278
|
if (!stream) {
|
|
283
|
-
throw new Error(
|
|
279
|
+
throw new Error('could not acquire stream');
|
|
284
280
|
}
|
|
285
281
|
if (!this.videoElement) {
|
|
286
|
-
throw new Error(
|
|
282
|
+
throw new Error('video element not found');
|
|
287
283
|
}
|
|
288
284
|
// Get the actual camera dimensions from the video track
|
|
289
285
|
const videoTrack = stream.getVideoTracks()[0];
|
|
@@ -291,12 +287,12 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
291
287
|
const cameraWidth = settings.width || 640;
|
|
292
288
|
const cameraHeight = settings.height || 480;
|
|
293
289
|
const cameraAspectRatio = cameraWidth / cameraHeight;
|
|
294
|
-
console.log(
|
|
290
|
+
console.log('Camera native dimensions:', {
|
|
295
291
|
width: cameraWidth,
|
|
296
292
|
height: cameraHeight,
|
|
297
293
|
aspectRatio: cameraAspectRatio,
|
|
298
294
|
});
|
|
299
|
-
console.log(
|
|
295
|
+
console.log('Container dimensions:', {
|
|
300
296
|
width: container.offsetWidth,
|
|
301
297
|
height: container.offsetHeight,
|
|
302
298
|
id: container.id,
|
|
@@ -316,7 +312,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
316
312
|
targetHeight = containerHeight;
|
|
317
313
|
targetWidth = targetHeight * cameraAspectRatio;
|
|
318
314
|
}
|
|
319
|
-
console.log(
|
|
315
|
+
console.log('Video element dimensions:', {
|
|
320
316
|
width: targetWidth,
|
|
321
317
|
height: targetHeight,
|
|
322
318
|
container: { width: containerWidth, height: containerHeight },
|
|
@@ -333,21 +329,21 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
333
329
|
if (needsCenterY || options.y === undefined) {
|
|
334
330
|
let y;
|
|
335
331
|
switch (positioning) {
|
|
336
|
-
case
|
|
332
|
+
case 'top':
|
|
337
333
|
y = 0;
|
|
338
334
|
break;
|
|
339
|
-
case
|
|
335
|
+
case 'bottom':
|
|
340
336
|
y = window.innerHeight - targetHeight;
|
|
341
337
|
break;
|
|
342
|
-
case
|
|
338
|
+
case 'center':
|
|
343
339
|
default:
|
|
344
340
|
y = Math.round((window.innerHeight - targetHeight) / 2);
|
|
345
341
|
break;
|
|
346
342
|
}
|
|
347
|
-
this.videoElement.style.setProperty(
|
|
343
|
+
this.videoElement.style.setProperty('top', `${y}px`, 'important');
|
|
348
344
|
// Force a style recalculation
|
|
349
345
|
this.videoElement.offsetHeight;
|
|
350
|
-
console.log(
|
|
346
|
+
console.log('Positioning video:', {
|
|
351
347
|
positioning,
|
|
352
348
|
viewportHeight: window.innerHeight,
|
|
353
349
|
targetHeight,
|
|
@@ -359,9 +355,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
359
355
|
}
|
|
360
356
|
else if (effectiveAspectRatio && !options.width && !options.height) {
|
|
361
357
|
// Aspect ratio specified but no size
|
|
362
|
-
const [widthRatio, heightRatio] = effectiveAspectRatio
|
|
363
|
-
.split(":")
|
|
364
|
-
.map(Number);
|
|
358
|
+
const [widthRatio, heightRatio] = effectiveAspectRatio.split(':').map(Number);
|
|
365
359
|
const targetRatio = widthRatio / heightRatio;
|
|
366
360
|
const viewportWidth = window.innerWidth;
|
|
367
361
|
const viewportHeight = window.innerHeight;
|
|
@@ -388,13 +382,13 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
388
382
|
const parentHeight = container.offsetHeight || viewportHeight;
|
|
389
383
|
let y;
|
|
390
384
|
switch (positioning) {
|
|
391
|
-
case
|
|
385
|
+
case 'top':
|
|
392
386
|
y = 0;
|
|
393
387
|
break;
|
|
394
|
-
case
|
|
388
|
+
case 'bottom':
|
|
395
389
|
y = parentHeight - targetHeight;
|
|
396
390
|
break;
|
|
397
|
-
case
|
|
391
|
+
case 'center':
|
|
398
392
|
default:
|
|
399
393
|
y = Math.round((parentHeight - targetHeight) / 2);
|
|
400
394
|
break;
|
|
@@ -404,11 +398,10 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
404
398
|
}
|
|
405
399
|
this.videoElement.srcObject = stream;
|
|
406
400
|
if (!this.isBackCamera) {
|
|
407
|
-
this.videoElement.style.transform =
|
|
401
|
+
this.videoElement.style.transform = 'scaleX(-1)';
|
|
408
402
|
}
|
|
409
403
|
// Set initial zoom level if specified and supported
|
|
410
|
-
if (options.initialZoomLevel !== undefined &&
|
|
411
|
-
options.initialZoomLevel !== 1.0) {
|
|
404
|
+
if (options.initialZoomLevel !== undefined && options.initialZoomLevel !== 1.0) {
|
|
412
405
|
// videoTrack already declared above
|
|
413
406
|
if (videoTrack) {
|
|
414
407
|
const capabilities = videoTrack.getCapabilities();
|
|
@@ -438,26 +431,26 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
438
431
|
await new Promise((resolve) => {
|
|
439
432
|
const videoEl = this.videoElement;
|
|
440
433
|
if (!videoEl) {
|
|
441
|
-
throw new Error(
|
|
434
|
+
throw new Error('video element not found');
|
|
442
435
|
}
|
|
443
436
|
if (videoEl.readyState >= 2) {
|
|
444
437
|
resolve();
|
|
445
438
|
}
|
|
446
439
|
else {
|
|
447
|
-
videoEl.addEventListener(
|
|
440
|
+
videoEl.addEventListener('loadeddata', () => resolve(), {
|
|
448
441
|
once: true,
|
|
449
442
|
});
|
|
450
443
|
}
|
|
451
444
|
});
|
|
452
445
|
// Ensure centering is applied after DOM updates
|
|
453
446
|
await new Promise((resolve) => requestAnimationFrame(resolve));
|
|
454
|
-
console.log(
|
|
447
|
+
console.log('About to re-center, flags:', { needsCenterX, needsCenterY });
|
|
455
448
|
// Re-apply centering with correct parent dimensions
|
|
456
449
|
if (needsCenterX) {
|
|
457
450
|
const parentWidth = container.offsetWidth;
|
|
458
451
|
const x = Math.round((parentWidth - this.videoElement.offsetWidth) / 2);
|
|
459
452
|
this.videoElement.style.left = `${x}px`;
|
|
460
|
-
console.log(
|
|
453
|
+
console.log('Re-centering X:', {
|
|
461
454
|
parentWidth,
|
|
462
455
|
videoWidth: this.videoElement.offsetWidth,
|
|
463
456
|
x,
|
|
@@ -466,19 +459,19 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
466
459
|
if (needsCenterY) {
|
|
467
460
|
let y;
|
|
468
461
|
switch (positioning) {
|
|
469
|
-
case
|
|
462
|
+
case 'top':
|
|
470
463
|
y = 0;
|
|
471
464
|
break;
|
|
472
|
-
case
|
|
465
|
+
case 'bottom':
|
|
473
466
|
y = window.innerHeight - this.videoElement.offsetHeight;
|
|
474
467
|
break;
|
|
475
|
-
case
|
|
468
|
+
case 'center':
|
|
476
469
|
default:
|
|
477
470
|
y = Math.round((window.innerHeight - this.videoElement.offsetHeight) / 2);
|
|
478
471
|
break;
|
|
479
472
|
}
|
|
480
|
-
this.videoElement.style.setProperty(
|
|
481
|
-
console.log(
|
|
473
|
+
this.videoElement.style.setProperty('top', `${y}px`, 'important');
|
|
474
|
+
console.log('Re-positioning Y:', {
|
|
482
475
|
positioning,
|
|
483
476
|
viewportHeight: window.innerHeight,
|
|
484
477
|
videoHeight: this.videoElement.offsetHeight,
|
|
@@ -490,7 +483,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
490
483
|
// Get the actual rendered dimensions after video is loaded
|
|
491
484
|
const rect = this.videoElement.getBoundingClientRect();
|
|
492
485
|
const computedStyle = window.getComputedStyle(this.videoElement);
|
|
493
|
-
console.log(
|
|
486
|
+
console.log('Final video element state:', {
|
|
494
487
|
rect: { x: rect.x, y: rect.y, width: rect.width, height: rect.height },
|
|
495
488
|
style: {
|
|
496
489
|
position: computedStyle.position,
|
|
@@ -523,21 +516,21 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
523
516
|
this.isStarted = false;
|
|
524
517
|
}
|
|
525
518
|
// Remove grid overlay if it exists
|
|
526
|
-
const gridOverlay = document.getElementById(
|
|
519
|
+
const gridOverlay = document.getElementById('camera-grid-overlay');
|
|
527
520
|
gridOverlay === null || gridOverlay === void 0 ? void 0 : gridOverlay.remove();
|
|
528
521
|
}
|
|
529
522
|
async capture(options) {
|
|
530
523
|
return new Promise((resolve, reject) => {
|
|
531
524
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
532
525
|
if (!(video === null || video === void 0 ? void 0 : video.srcObject)) {
|
|
533
|
-
reject(new Error(
|
|
526
|
+
reject(new Error('camera is not running'));
|
|
534
527
|
return;
|
|
535
528
|
}
|
|
536
529
|
// video.width = video.offsetWidth;
|
|
537
530
|
let base64EncodedImage;
|
|
538
531
|
if (video && video.videoWidth > 0 && video.videoHeight > 0) {
|
|
539
|
-
const canvas = document.createElement(
|
|
540
|
-
const context = canvas.getContext(
|
|
532
|
+
const canvas = document.createElement('canvas');
|
|
533
|
+
const context = canvas.getContext('2d');
|
|
541
534
|
// Calculate capture dimensions
|
|
542
535
|
let captureWidth = video.videoWidth;
|
|
543
536
|
let captureHeight = video.videoHeight;
|
|
@@ -584,15 +577,13 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
584
577
|
context === null || context === void 0 ? void 0 : context.drawImage(video, sourceX, sourceY, captureWidth, captureHeight, 0, 0, captureWidth, captureHeight);
|
|
585
578
|
if (options.saveToGallery) ;
|
|
586
579
|
if (options.withExifLocation) ;
|
|
587
|
-
if ((options.format ||
|
|
580
|
+
if ((options.format || 'jpeg') === 'jpeg') {
|
|
588
581
|
base64EncodedImage = canvas
|
|
589
|
-
.toDataURL(
|
|
590
|
-
.replace(
|
|
582
|
+
.toDataURL('image/jpeg', (options.quality || 85) / 100.0)
|
|
583
|
+
.replace('data:image/jpeg;base64,', '');
|
|
591
584
|
}
|
|
592
585
|
else {
|
|
593
|
-
base64EncodedImage = canvas
|
|
594
|
-
.toDataURL("image/png")
|
|
595
|
-
.replace("data:image/png;base64,", "");
|
|
586
|
+
base64EncodedImage = canvas.toDataURL('image/png').replace('data:image/png;base64,', '');
|
|
596
587
|
}
|
|
597
588
|
}
|
|
598
589
|
resolve({
|
|
@@ -605,17 +596,17 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
605
596
|
return this.capture(_options);
|
|
606
597
|
}
|
|
607
598
|
async stopRecordVideo() {
|
|
608
|
-
throw new Error(
|
|
599
|
+
throw new Error('stopRecordVideo not supported under the web platform');
|
|
609
600
|
}
|
|
610
601
|
async startRecordVideo(_options) {
|
|
611
|
-
console.log(
|
|
612
|
-
throw new Error(
|
|
602
|
+
console.log('startRecordVideo', _options);
|
|
603
|
+
throw new Error('startRecordVideo not supported under the web platform');
|
|
613
604
|
}
|
|
614
605
|
async getSupportedFlashModes() {
|
|
615
|
-
throw new Error(
|
|
606
|
+
throw new Error('getSupportedFlashModes not supported under the web platform');
|
|
616
607
|
}
|
|
617
608
|
async getHorizontalFov() {
|
|
618
|
-
throw new Error(
|
|
609
|
+
throw new Error('getHorizontalFov not supported under the web platform');
|
|
619
610
|
}
|
|
620
611
|
async setFlashMode(_options) {
|
|
621
612
|
throw new Error(`setFlashMode not supported under the web platform${_options}`);
|
|
@@ -623,7 +614,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
623
614
|
async flip() {
|
|
624
615
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
625
616
|
if (!(video === null || video === void 0 ? void 0 : video.srcObject)) {
|
|
626
|
-
throw new Error(
|
|
617
|
+
throw new Error('camera is not running');
|
|
627
618
|
}
|
|
628
619
|
// Stop current stream
|
|
629
620
|
this.stopStream(video.srcObject);
|
|
@@ -632,7 +623,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
632
623
|
// Get new constraints
|
|
633
624
|
const constraints = {
|
|
634
625
|
video: {
|
|
635
|
-
facingMode: this.isBackCamera ?
|
|
626
|
+
facingMode: this.isBackCamera ? 'environment' : 'user',
|
|
636
627
|
width: { ideal: video.videoWidth || 640 },
|
|
637
628
|
height: { ideal: video.videoHeight || 480 },
|
|
638
629
|
},
|
|
@@ -647,12 +638,12 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
647
638
|
}
|
|
648
639
|
// Update video transform based on camera
|
|
649
640
|
if (this.isBackCamera) {
|
|
650
|
-
video.style.transform =
|
|
651
|
-
video.style.webkitTransform =
|
|
641
|
+
video.style.transform = 'none';
|
|
642
|
+
video.style.webkitTransform = 'none';
|
|
652
643
|
}
|
|
653
644
|
else {
|
|
654
|
-
video.style.transform =
|
|
655
|
-
video.style.webkitTransform =
|
|
645
|
+
video.style.transform = 'scaleX(-1)';
|
|
646
|
+
video.style.webkitTransform = 'scaleX(-1)';
|
|
656
647
|
}
|
|
657
648
|
await video.play();
|
|
658
649
|
}
|
|
@@ -663,7 +654,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
663
654
|
async setOpacity(_options) {
|
|
664
655
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
665
656
|
if (!!video && !!_options.opacity)
|
|
666
|
-
video.style.setProperty(
|
|
657
|
+
video.style.setProperty('opacity', _options.opacity.toString());
|
|
667
658
|
}
|
|
668
659
|
async isRunning() {
|
|
669
660
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
@@ -672,10 +663,10 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
672
663
|
async getAvailableDevices() {
|
|
673
664
|
var _a;
|
|
674
665
|
if (!((_a = navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.enumerateDevices)) {
|
|
675
|
-
throw new Error(
|
|
666
|
+
throw new Error('getAvailableDevices not supported under the web platform');
|
|
676
667
|
}
|
|
677
668
|
const devices = await navigator.mediaDevices.enumerateDevices();
|
|
678
|
-
const videoDevices = devices.filter((device) => device.kind ===
|
|
669
|
+
const videoDevices = devices.filter((device) => device.kind === 'videoinput');
|
|
679
670
|
// Group devices by position (front/back)
|
|
680
671
|
const frontDevices = [];
|
|
681
672
|
const backDevices = [];
|
|
@@ -685,19 +676,18 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
685
676
|
// Determine device type based on label
|
|
686
677
|
let deviceType = exports.DeviceType.WIDE_ANGLE;
|
|
687
678
|
let baseZoomRatio = 1.0;
|
|
688
|
-
if (labelLower.includes(
|
|
679
|
+
if (labelLower.includes('ultra') || labelLower.includes('0.5')) {
|
|
689
680
|
deviceType = exports.DeviceType.ULTRA_WIDE;
|
|
690
681
|
baseZoomRatio = 0.5;
|
|
691
682
|
}
|
|
692
|
-
else if (labelLower.includes(
|
|
693
|
-
labelLower.includes(
|
|
694
|
-
labelLower.includes(
|
|
695
|
-
labelLower.includes(
|
|
683
|
+
else if (labelLower.includes('telephoto') ||
|
|
684
|
+
labelLower.includes('tele') ||
|
|
685
|
+
labelLower.includes('2x') ||
|
|
686
|
+
labelLower.includes('3x')) {
|
|
696
687
|
deviceType = exports.DeviceType.TELEPHOTO;
|
|
697
688
|
baseZoomRatio = 2.0;
|
|
698
689
|
}
|
|
699
|
-
else if (labelLower.includes(
|
|
700
|
-
labelLower.includes("truedepth")) {
|
|
690
|
+
else if (labelLower.includes('depth') || labelLower.includes('truedepth')) {
|
|
701
691
|
deviceType = exports.DeviceType.TRUE_DEPTH;
|
|
702
692
|
baseZoomRatio = 1.0;
|
|
703
693
|
}
|
|
@@ -711,7 +701,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
711
701
|
maxZoom: 1.0,
|
|
712
702
|
};
|
|
713
703
|
// Determine position and add to appropriate array
|
|
714
|
-
if (labelLower.includes(
|
|
704
|
+
if (labelLower.includes('back') || labelLower.includes('rear')) {
|
|
715
705
|
backDevices.push(lensInfo);
|
|
716
706
|
}
|
|
717
707
|
else {
|
|
@@ -722,8 +712,8 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
722
712
|
if (frontDevices.length > 0) {
|
|
723
713
|
result.push({
|
|
724
714
|
deviceId: frontDevices[0].deviceId,
|
|
725
|
-
label:
|
|
726
|
-
position:
|
|
715
|
+
label: 'Front Camera',
|
|
716
|
+
position: 'front',
|
|
727
717
|
lenses: frontDevices,
|
|
728
718
|
isLogical: false,
|
|
729
719
|
minZoom: Math.min(...frontDevices.map((d) => d.minZoom)),
|
|
@@ -733,8 +723,8 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
733
723
|
if (backDevices.length > 0) {
|
|
734
724
|
result.push({
|
|
735
725
|
deviceId: backDevices[0].deviceId,
|
|
736
|
-
label:
|
|
737
|
-
position:
|
|
726
|
+
label: 'Back Camera',
|
|
727
|
+
position: 'rear',
|
|
738
728
|
lenses: backDevices,
|
|
739
729
|
isLogical: false,
|
|
740
730
|
minZoom: Math.min(...backDevices.map((d) => d.minZoom)),
|
|
@@ -746,17 +736,17 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
746
736
|
async getZoom() {
|
|
747
737
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
748
738
|
if (!(video === null || video === void 0 ? void 0 : video.srcObject)) {
|
|
749
|
-
throw new Error(
|
|
739
|
+
throw new Error('camera is not running');
|
|
750
740
|
}
|
|
751
741
|
const stream = video.srcObject;
|
|
752
742
|
const videoTrack = stream.getVideoTracks()[0];
|
|
753
743
|
if (!videoTrack) {
|
|
754
|
-
throw new Error(
|
|
744
|
+
throw new Error('no video track found');
|
|
755
745
|
}
|
|
756
746
|
const capabilities = videoTrack.getCapabilities();
|
|
757
747
|
const settings = videoTrack.getSettings();
|
|
758
748
|
if (!capabilities.zoom) {
|
|
759
|
-
throw new Error(
|
|
749
|
+
throw new Error('zoom not supported by this device');
|
|
760
750
|
}
|
|
761
751
|
// Get current device info to determine lens type
|
|
762
752
|
let deviceType = exports.DeviceType.WIDE_ANGLE;
|
|
@@ -766,19 +756,18 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
766
756
|
const device = devices.find((d) => d.deviceId === this.currentDeviceId);
|
|
767
757
|
if (device) {
|
|
768
758
|
const labelLower = device.label.toLowerCase();
|
|
769
|
-
if (labelLower.includes(
|
|
759
|
+
if (labelLower.includes('ultra') || labelLower.includes('0.5')) {
|
|
770
760
|
deviceType = exports.DeviceType.ULTRA_WIDE;
|
|
771
761
|
baseZoomRatio = 0.5;
|
|
772
762
|
}
|
|
773
|
-
else if (labelLower.includes(
|
|
774
|
-
labelLower.includes(
|
|
775
|
-
labelLower.includes(
|
|
776
|
-
labelLower.includes(
|
|
763
|
+
else if (labelLower.includes('telephoto') ||
|
|
764
|
+
labelLower.includes('tele') ||
|
|
765
|
+
labelLower.includes('2x') ||
|
|
766
|
+
labelLower.includes('3x')) {
|
|
777
767
|
deviceType = exports.DeviceType.TELEPHOTO;
|
|
778
768
|
baseZoomRatio = 2.0;
|
|
779
769
|
}
|
|
780
|
-
else if (labelLower.includes(
|
|
781
|
-
labelLower.includes("truedepth")) {
|
|
770
|
+
else if (labelLower.includes('depth') || labelLower.includes('truedepth')) {
|
|
782
771
|
deviceType = exports.DeviceType.TRUE_DEPTH;
|
|
783
772
|
baseZoomRatio = 1.0;
|
|
784
773
|
}
|
|
@@ -801,16 +790,16 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
801
790
|
async setZoom(options) {
|
|
802
791
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
803
792
|
if (!(video === null || video === void 0 ? void 0 : video.srcObject)) {
|
|
804
|
-
throw new Error(
|
|
793
|
+
throw new Error('camera is not running');
|
|
805
794
|
}
|
|
806
795
|
const stream = video.srcObject;
|
|
807
796
|
const videoTrack = stream.getVideoTracks()[0];
|
|
808
797
|
if (!videoTrack) {
|
|
809
|
-
throw new Error(
|
|
798
|
+
throw new Error('no video track found');
|
|
810
799
|
}
|
|
811
800
|
const capabilities = videoTrack.getCapabilities();
|
|
812
801
|
if (!capabilities.zoom) {
|
|
813
|
-
throw new Error(
|
|
802
|
+
throw new Error('zoom not supported by this device');
|
|
814
803
|
}
|
|
815
804
|
const zoomLevel = Math.max(capabilities.zoom.min || 1, Math.min(capabilities.zoom.max || 1, options.level));
|
|
816
805
|
// Note: autoFocus is not supported on web platform
|
|
@@ -824,15 +813,15 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
824
813
|
}
|
|
825
814
|
}
|
|
826
815
|
async getFlashMode() {
|
|
827
|
-
throw new Error(
|
|
816
|
+
throw new Error('getFlashMode not supported under the web platform');
|
|
828
817
|
}
|
|
829
818
|
async getDeviceId() {
|
|
830
|
-
return { deviceId: this.currentDeviceId ||
|
|
819
|
+
return { deviceId: this.currentDeviceId || '' };
|
|
831
820
|
}
|
|
832
821
|
async setDeviceId(options) {
|
|
833
822
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
834
823
|
if (!(video === null || video === void 0 ? void 0 : video.srcObject)) {
|
|
835
|
-
throw new Error(
|
|
824
|
+
throw new Error('camera is not running');
|
|
836
825
|
}
|
|
837
826
|
// Stop current stream
|
|
838
827
|
this.stopStream(video.srcObject);
|
|
@@ -851,19 +840,17 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
851
840
|
const devices = await navigator.mediaDevices.enumerateDevices();
|
|
852
841
|
const device = devices.find((d) => d.deviceId === options.deviceId);
|
|
853
842
|
this.isBackCamera =
|
|
854
|
-
(device === null || device === void 0 ? void 0 : device.label.toLowerCase().includes(
|
|
855
|
-
(device === null || device === void 0 ? void 0 : device.label.toLowerCase().includes("rear")) ||
|
|
856
|
-
false;
|
|
843
|
+
(device === null || device === void 0 ? void 0 : device.label.toLowerCase().includes('back')) || (device === null || device === void 0 ? void 0 : device.label.toLowerCase().includes('rear')) || false;
|
|
857
844
|
const stream = await navigator.mediaDevices.getUserMedia(constraints);
|
|
858
845
|
video.srcObject = stream;
|
|
859
846
|
// Update video transform based on camera
|
|
860
847
|
if (this.isBackCamera) {
|
|
861
|
-
video.style.transform =
|
|
862
|
-
video.style.webkitTransform =
|
|
848
|
+
video.style.transform = 'none';
|
|
849
|
+
video.style.webkitTransform = 'none';
|
|
863
850
|
}
|
|
864
851
|
else {
|
|
865
|
-
video.style.transform =
|
|
866
|
-
video.style.webkitTransform =
|
|
852
|
+
video.style.transform = 'scaleX(-1)';
|
|
853
|
+
video.style.webkitTransform = 'scaleX(-1)';
|
|
867
854
|
}
|
|
868
855
|
await video.play();
|
|
869
856
|
}
|
|
@@ -874,7 +861,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
874
861
|
async getAspectRatio() {
|
|
875
862
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
876
863
|
if (!video) {
|
|
877
|
-
throw new Error(
|
|
864
|
+
throw new Error('camera is not running');
|
|
878
865
|
}
|
|
879
866
|
const width = video.offsetWidth;
|
|
880
867
|
const height = video.offsetHeight;
|
|
@@ -882,24 +869,22 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
882
869
|
const ratio = width / height;
|
|
883
870
|
// Check for portrait camera ratios: 4:3 -> 3:4, 16:9 -> 9:16
|
|
884
871
|
if (Math.abs(ratio - 3 / 4) < 0.01) {
|
|
885
|
-
return { aspectRatio:
|
|
872
|
+
return { aspectRatio: '4:3' };
|
|
886
873
|
}
|
|
887
874
|
if (Math.abs(ratio - 9 / 16) < 0.01) {
|
|
888
|
-
return { aspectRatio:
|
|
875
|
+
return { aspectRatio: '16:9' };
|
|
889
876
|
}
|
|
890
877
|
}
|
|
891
878
|
// Default to 4:3 if no specific aspect ratio is matched
|
|
892
|
-
return { aspectRatio:
|
|
879
|
+
return { aspectRatio: '4:3' };
|
|
893
880
|
}
|
|
894
881
|
async setAspectRatio(options) {
|
|
895
882
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
896
883
|
if (!video) {
|
|
897
|
-
throw new Error(
|
|
884
|
+
throw new Error('camera is not running');
|
|
898
885
|
}
|
|
899
886
|
if (options.aspectRatio) {
|
|
900
|
-
const [widthRatio, heightRatio] = options.aspectRatio
|
|
901
|
-
.split(":")
|
|
902
|
-
.map(Number);
|
|
887
|
+
const [widthRatio, heightRatio] = options.aspectRatio.split(':').map(Number);
|
|
903
888
|
// For camera, use portrait orientation: 4:3 becomes 3:4, 16:9 becomes 9:16
|
|
904
889
|
const ratio = heightRatio / widthRatio;
|
|
905
890
|
// Get current position and size
|
|
@@ -935,7 +920,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
935
920
|
video.style.height = `${newHeight}px`;
|
|
936
921
|
video.style.left = `${x}px`;
|
|
937
922
|
video.style.top = `${y}px`;
|
|
938
|
-
video.style.position =
|
|
923
|
+
video.style.position = 'absolute';
|
|
939
924
|
const offsetX = newWidth / 8;
|
|
940
925
|
const offsetY = newHeight / 8;
|
|
941
926
|
return {
|
|
@@ -946,7 +931,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
946
931
|
};
|
|
947
932
|
}
|
|
948
933
|
else {
|
|
949
|
-
video.style.objectFit =
|
|
934
|
+
video.style.objectFit = 'cover';
|
|
950
935
|
const rect = video.getBoundingClientRect();
|
|
951
936
|
const offsetX = rect.width / 8;
|
|
952
937
|
const offsetY = rect.height / 8;
|
|
@@ -959,41 +944,41 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
959
944
|
}
|
|
960
945
|
}
|
|
961
946
|
createGridOverlay(gridMode) {
|
|
962
|
-
const overlay = document.createElement(
|
|
963
|
-
overlay.style.position =
|
|
964
|
-
overlay.style.top =
|
|
965
|
-
overlay.style.left =
|
|
966
|
-
overlay.style.width =
|
|
967
|
-
overlay.style.height =
|
|
968
|
-
overlay.style.pointerEvents =
|
|
969
|
-
overlay.style.zIndex =
|
|
970
|
-
const divisions = gridMode ===
|
|
947
|
+
const overlay = document.createElement('div');
|
|
948
|
+
overlay.style.position = 'absolute';
|
|
949
|
+
overlay.style.top = '0';
|
|
950
|
+
overlay.style.left = '0';
|
|
951
|
+
overlay.style.width = '100%';
|
|
952
|
+
overlay.style.height = '100%';
|
|
953
|
+
overlay.style.pointerEvents = 'none';
|
|
954
|
+
overlay.style.zIndex = '10';
|
|
955
|
+
const divisions = gridMode === '3x3' ? 3 : 4;
|
|
971
956
|
// Create SVG for grid lines
|
|
972
|
-
const svg = document.createElementNS(
|
|
973
|
-
svg.style.width =
|
|
974
|
-
svg.style.height =
|
|
975
|
-
svg.style.position =
|
|
976
|
-
svg.style.top =
|
|
977
|
-
svg.style.left =
|
|
957
|
+
const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
|
|
958
|
+
svg.style.width = '100%';
|
|
959
|
+
svg.style.height = '100%';
|
|
960
|
+
svg.style.position = 'absolute';
|
|
961
|
+
svg.style.top = '0';
|
|
962
|
+
svg.style.left = '0';
|
|
978
963
|
// Create grid lines
|
|
979
964
|
for (let i = 1; i < divisions; i++) {
|
|
980
965
|
// Vertical lines
|
|
981
|
-
const verticalLine = document.createElementNS(
|
|
982
|
-
verticalLine.setAttribute(
|
|
983
|
-
verticalLine.setAttribute(
|
|
984
|
-
verticalLine.setAttribute(
|
|
985
|
-
verticalLine.setAttribute(
|
|
986
|
-
verticalLine.setAttribute(
|
|
987
|
-
verticalLine.setAttribute(
|
|
966
|
+
const verticalLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
|
|
967
|
+
verticalLine.setAttribute('x1', `${(i / divisions) * 100}%`);
|
|
968
|
+
verticalLine.setAttribute('y1', '0%');
|
|
969
|
+
verticalLine.setAttribute('x2', `${(i / divisions) * 100}%`);
|
|
970
|
+
verticalLine.setAttribute('y2', '100%');
|
|
971
|
+
verticalLine.setAttribute('stroke', 'rgba(255, 255, 255, 0.5)');
|
|
972
|
+
verticalLine.setAttribute('stroke-width', '1');
|
|
988
973
|
svg.appendChild(verticalLine);
|
|
989
974
|
// Horizontal lines
|
|
990
|
-
const horizontalLine = document.createElementNS(
|
|
991
|
-
horizontalLine.setAttribute(
|
|
992
|
-
horizontalLine.setAttribute(
|
|
993
|
-
horizontalLine.setAttribute(
|
|
994
|
-
horizontalLine.setAttribute(
|
|
995
|
-
horizontalLine.setAttribute(
|
|
996
|
-
horizontalLine.setAttribute(
|
|
975
|
+
const horizontalLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
|
|
976
|
+
horizontalLine.setAttribute('x1', '0%');
|
|
977
|
+
horizontalLine.setAttribute('y1', `${(i / divisions) * 100}%`);
|
|
978
|
+
horizontalLine.setAttribute('x2', '100%');
|
|
979
|
+
horizontalLine.setAttribute('y2', `${(i / divisions) * 100}%`);
|
|
980
|
+
horizontalLine.setAttribute('stroke', 'rgba(255, 255, 255, 0.5)');
|
|
981
|
+
horizontalLine.setAttribute('stroke-width', '1');
|
|
997
982
|
svg.appendChild(horizontalLine);
|
|
998
983
|
}
|
|
999
984
|
overlay.appendChild(svg);
|
|
@@ -1006,12 +991,12 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
1006
991
|
}
|
|
1007
992
|
async getGridMode() {
|
|
1008
993
|
// Web implementation - default to none
|
|
1009
|
-
return { gridMode:
|
|
994
|
+
return { gridMode: 'none' };
|
|
1010
995
|
}
|
|
1011
996
|
async getPreviewSize() {
|
|
1012
997
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
1013
998
|
if (!video) {
|
|
1014
|
-
throw new Error(
|
|
999
|
+
throw new Error('camera is not running');
|
|
1015
1000
|
}
|
|
1016
1001
|
const offsetX = video.width / 8;
|
|
1017
1002
|
const offsetY = video.height / 8;
|
|
@@ -1025,7 +1010,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
1025
1010
|
async setPreviewSize(options) {
|
|
1026
1011
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
1027
1012
|
if (!video) {
|
|
1028
|
-
throw new Error(
|
|
1013
|
+
throw new Error('camera is not running');
|
|
1029
1014
|
}
|
|
1030
1015
|
video.style.left = `${options.x}px`;
|
|
1031
1016
|
video.style.top = `${options.y}px`;
|
|
@@ -1043,16 +1028,16 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
1043
1028
|
async setFocus(options) {
|
|
1044
1029
|
// Reject if values are outside 0-1 range
|
|
1045
1030
|
if (options.x < 0 || options.x > 1 || options.y < 0 || options.y > 1) {
|
|
1046
|
-
throw new Error(
|
|
1031
|
+
throw new Error('Focus coordinates must be between 0 and 1');
|
|
1047
1032
|
}
|
|
1048
1033
|
const video = document.getElementById(DEFAULT_VIDEO_ID);
|
|
1049
1034
|
if (!(video === null || video === void 0 ? void 0 : video.srcObject)) {
|
|
1050
|
-
throw new Error(
|
|
1035
|
+
throw new Error('camera is not running');
|
|
1051
1036
|
}
|
|
1052
1037
|
const stream = video.srcObject;
|
|
1053
1038
|
const videoTrack = stream.getVideoTracks()[0];
|
|
1054
1039
|
if (!videoTrack) {
|
|
1055
|
-
throw new Error(
|
|
1040
|
+
throw new Error('no video track found');
|
|
1056
1041
|
}
|
|
1057
1042
|
const capabilities = videoTrack.getCapabilities();
|
|
1058
1043
|
// Check if focusing is supported
|
|
@@ -1063,7 +1048,7 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
1063
1048
|
await videoTrack.applyConstraints({
|
|
1064
1049
|
advanced: [
|
|
1065
1050
|
{
|
|
1066
|
-
focusMode:
|
|
1051
|
+
focusMode: 'manual',
|
|
1067
1052
|
focusDistance: 0.5, // Mid-range focus as fallback
|
|
1068
1053
|
},
|
|
1069
1054
|
],
|
|
@@ -1074,30 +1059,30 @@ var capacitorCapacitorCameraView = (function (exports, core) {
|
|
|
1074
1059
|
}
|
|
1075
1060
|
}
|
|
1076
1061
|
else {
|
|
1077
|
-
console.warn(
|
|
1062
|
+
console.warn('Focus control is not supported on this device. Focus coordinates were provided but cannot be applied.');
|
|
1078
1063
|
}
|
|
1079
1064
|
}
|
|
1080
1065
|
// Exposure stubs (unsupported on web)
|
|
1081
1066
|
async getExposureModes() {
|
|
1082
|
-
throw new Error(
|
|
1067
|
+
throw new Error('getExposureModes not supported under the web platform');
|
|
1083
1068
|
}
|
|
1084
1069
|
async getExposureMode() {
|
|
1085
|
-
throw new Error(
|
|
1070
|
+
throw new Error('getExposureMode not supported under the web platform');
|
|
1086
1071
|
}
|
|
1087
1072
|
async setExposureMode(_options) {
|
|
1088
|
-
throw new Error(
|
|
1073
|
+
throw new Error('setExposureMode not supported under the web platform');
|
|
1089
1074
|
}
|
|
1090
1075
|
async getExposureCompensationRange() {
|
|
1091
|
-
throw new Error(
|
|
1076
|
+
throw new Error('getExposureCompensationRange not supported under the web platform');
|
|
1092
1077
|
}
|
|
1093
1078
|
async getExposureCompensation() {
|
|
1094
|
-
throw new Error(
|
|
1079
|
+
throw new Error('getExposureCompensation not supported under the web platform');
|
|
1095
1080
|
}
|
|
1096
1081
|
async setExposureCompensation(_options) {
|
|
1097
|
-
throw new Error(
|
|
1082
|
+
throw new Error('setExposureCompensation not supported under the web platform');
|
|
1098
1083
|
}
|
|
1099
1084
|
async deleteFile(_options) {
|
|
1100
|
-
throw new Error(
|
|
1085
|
+
throw new Error('deleteFile not supported under the web platform');
|
|
1101
1086
|
}
|
|
1102
1087
|
}
|
|
1103
1088
|
|