Selaa lähdekoodia

Add VideoSource.video

customisations
alemart 8 kuukautta sitten
vanhempi
commit
f7dc9e7f5c

+ 1
- 1
docs/api/camera-source.md Näytä tiedosto

1
 # CameraSource
1
 # CameraSource
2
 
2
 
3
-A [source of data](source.md) linked to a webcam.
3
+A [source of data](source.md) linked to a webcam. This class extends [VideoSource](video-source.md).
4
 
4
 
5
 ## Instantiation
5
 ## Instantiation
6
 
6
 

+ 11
- 1
docs/api/video-source.md Näytä tiedosto

16
 
16
 
17
 **Returns**
17
 **Returns**
18
 
18
 
19
-A new source of data.
19
+A new source of data.
20
+
21
+## Properties
22
+
23
+### video
24
+
25
+`source.video: HTMLVideoElement, read-only`
26
+
27
+The underlying `<video>` element.
28
+
29
+*Since:* 0.4.1

+ 7
- 9
src/sources/camera-source.ts Näytä tiedosto

58
  */
58
  */
59
 export class CameraSource extends VideoSource
59
 export class CameraSource extends VideoSource
60
 {
60
 {
61
-    /** Video element */
62
-    private _cameraVideo: HTMLVideoElement;
63
-
64
     /** Options of the constructor */
61
     /** Options of the constructor */
65
     private _options: Required<CameraSourceOptions>;
62
     private _options: Required<CameraSourceOptions>;
66
 
63
 
75
         const video = document.createElement('video');
72
         const video = document.createElement('video');
76
 
73
 
77
         super(video);
74
         super(video);
78
-        this._cameraVideo = video;
79
         this._options = Object.assign({}, DEFAULT_CAMERA_OPTIONS, options);
75
         this._options = Object.assign({}, DEFAULT_CAMERA_OPTIONS, options);
80
     }
76
     }
81
 
77
 
108
             video: {
104
             video: {
109
                 width: size.width,
105
                 width: size.width,
110
                 height: size.height,
106
                 height: size.height,
107
+                aspectRatio: options.aspectRatio,
111
                 ...options.constraints,
108
                 ...options.constraints,
112
             }
109
             }
113
         };
110
         };
115
         // load camera stream
112
         // load camera stream
116
         return new Speedy.Promise<HTMLVideoElement>((resolve, reject) => {
113
         return new Speedy.Promise<HTMLVideoElement>((resolve, reject) => {
117
             navigator.mediaDevices.getUserMedia(constraints).then(stream => {
114
             navigator.mediaDevices.getUserMedia(constraints).then(stream => {
118
-                const video = this._cameraVideo;
115
+                const video = this.video;
119
                 video.onloadedmetadata = () => {
116
                 video.onloadedmetadata = () => {
120
                     const promise = video.play();
117
                     const promise = video.play();
121
                     const success = 'Access to the webcam has been granted.';
118
                     const success = 'Access to the webcam has been granted.';
148
                     error
145
                     error
149
                 ));
146
                 ));
150
             });
147
             });
151
-        }).then(_ => super._init()); // this will call VideoSource._handleBrowserQuirks()
148
+        }).then(_ => super._init()); // this will handle browser quirks
152
     }
149
     }
153
 
150
 
154
     /**
151
     /**
158
      */
155
      */
159
     _release(): SpeedyPromise<void>
156
     _release(): SpeedyPromise<void>
160
     {
157
     {
161
-        const stream = this._cameraVideo.srcObject as MediaStream;
158
+        const video = this.video;
159
+        const stream = video.srcObject as MediaStream;
162
         const tracks = stream.getTracks();
160
         const tracks = stream.getTracks();
163
 
161
 
164
         // stop camera feed
162
         // stop camera feed
165
         tracks.forEach(track => track.stop());
163
         tracks.forEach(track => track.stop());
166
-        this._cameraVideo.onloadedmetadata = null;
167
-        this._cameraVideo.srcObject = null;
164
+        video.onloadedmetadata = null;
165
+        video.srcObject = null;
168
 
166
 
169
         // release the media
167
         // release the media
170
         return super._release();
168
         return super._release();

+ 8
- 0
src/sources/video-source.ts Näytä tiedosto

59
     }
59
     }
60
 
60
 
61
     /**
61
     /**
62
+     * The underlying <video> element
63
+     */
64
+    get video(): HTMLVideoElement
65
+    {
66
+        return this._video;
67
+    }
68
+
69
+    /**
62
      * A type-identifier of the source of data
70
      * A type-identifier of the source of data
63
      * @internal
71
      * @internal
64
      */
72
      */

Loading…
Peruuta
Tallenna