Skip to content

Commit 0ea5e3d

Browse files
triniwiztriniwiz
committed
fix(android): video support
1 parent c5b9b08 commit 0ea5e3d

File tree

40 files changed

+1466
-378
lines changed

40 files changed

+1466
-378
lines changed

‎packages/canvas-media/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@nativescript/canvas-media",
3-
"version": "0.5.0",
3+
"version": "0.6.0",
44
"description": "Canvas media",
55
"main": "index",
66
"typings": "index.d.ts",

‎packages/canvas-media/video/common.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import { Screen, AddChildFromBuilder, Application, booleanConverter, ContentView, PercentLength, Utils } from '@nativescript/core';
2-
import { Property, CSSType } from '@nativescript/core/ui/core/view';
1+
import { Screen, AddChildFromBuilder, Application, booleanConverter, ContentView, Utils } from '@nativescript/core';
2+
import { Property, CSSType} from '@nativescript/core/ui/core/view';
3+
import { PercentLength } from '@nativescript/core/ui/styling/style-properties';
34

45
@CSSType('Video')
56
export abstract class VideoBase extends ContentView implements AddChildFromBuilder {

‎packages/canvas-media/video/index.android.ts‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -41,9 +41,12 @@ export class Video extends VideoBase {
4141
_videoHeight = 0;
4242
constructor() {
4343
super();
44-
java.lang.System.loadLibrary('canvasnative');
44+
try {
45+
java.lang.System.loadLibrary('canvasnative');
46+
} catch (ex) {}
4547
//@ts-ignore
46-
const builder = new com.google.android.exoplayer2.SimpleExoPlayer.Builder(Utils.ad.getApplicationContext());
48+
const activity: androidx.appcompat.app.AppCompatActivity = Application.android.foregroundActivity || Application.android.startActivity;
49+
const builder = new com.google.android.exoplayer2.SimpleExoPlayer.Builder(activity);
4750
this.#player = builder.build();
4851
const ref = new WeakRef(this);
4952
this.#playerListener = new com.google.android.exoplayer2.Player.EventListener({
@@ -82,15 +85,15 @@ export class Video extends VideoBase {
8285
}
8386
},
8487
onLoadingChanged: function (isLoading) {
85-
console.log('onLoadingChanged', isLoading);
88+
//console.log('onLoadingChanged', isLoading);
8689
},
8790
onPlaybackParametersChanged: function (playbackParameters) {},
8891
onPlaybackSuppressionReasonChanged: function (playbackSuppressionReason) {},
8992
onPlayerError: function (error) {
90-
console.log('PlayerError', error);
93+
//console.log('PlayerError', error);
9194
},
9295
onPlayerStateChanged: function (playWhenReady, playbackState) {
93-
console.log('onPlayerStateChanged', Date.now());
96+
//console.log('onPlayerStateChanged', Date.now());
9497
// if (playbackState === STATE_READY) {
9598
// playerReady = true;
9699
// } else if (playbackState === STATE_ENDED) {
@@ -116,7 +119,6 @@ export class Video extends VideoBase {
116119
},
117120
onSurfaceSizeChanged(width: number, height: number) {},
118121
});
119-
const activity: androidx.appcompat.app.AppCompatActivity = Application.android.foregroundActivity || Application.android.startActivity;
120122
const inflator = activity.getLayoutInflater();
121123
const layout = Video.getResourceId(Application.android.foregroundActivity || Application.android.startActivity, 'player');
122124
this.#player.addListener(this.#playerListener);
@@ -216,7 +218,6 @@ export class Video extends VideoBase {
216218
}
217219
// @ts-ignore
218220
com.github.triniwiz.canvas.Utils.updateTexImage(context, this._st, this._render, this._videoWidth, this._videoHeight, arguments[4], arguments[5]);
219-
220221
this._hasFrame = false;
221222
}
222223
}

‎packages/canvas-polyfill/DOM/HTMLVideoElement.ts‎

Lines changed: 46 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,80 @@
11
import { Element } from './Element';
2-
import { Video } from '@nativescript/canvas-media';
2+
let Video: any;
33
export class HTMLVideoElement extends Element {
4-
_video: Video;
4+
_video;
55
constructor() {
66
super('video');
7-
// @ts-ignore
8-
this._video = Video.createCustomView();
7+
if (!Video) {
8+
try {
9+
// @ts-ignore
10+
const video = require('@nativescript/canvas-media');
11+
Video = video.Video;
12+
} catch (e) {}
13+
}
14+
if (Video) {
15+
this._video = Video.createCustomView();
16+
}
917
}
1018

1119
addEventListener(type: string, listener: Function, useCapture: boolean | any) {
12-
this._video.addEventListener(type, listener, useCapture);
20+
this._video?.addEventListener(type, listener, useCapture);
1321
}
1422
removeEventListener(type: string, listener: Function, useCapture: boolean | any) {
15-
this._video.removeEventListener(type, listener, useCapture);
23+
this._video?.removeEventListener(type, listener, useCapture);
1624
}
1725

1826
requestVideoFrameCallback(callback: Function) {
19-
this._video.requestVideoFrameCallback(callback);
27+
this._video?.requestVideoFrameCallback(callback);
2028
}
2129

2230
get autoplay() {
23-
return this._video.autoplay;
31+
return this._video?.autoplay ?? false;
2432
}
2533

2634
set autoplay(value: boolean) {
27-
this._video.autoplay = value;
35+
if (this._video) {
36+
this._video.autoplay = value;
37+
}
2838
}
2939

3040
get muted() {
31-
return this._video.muted;
41+
return this._video?.muted ?? false;
3242
}
3343

3444
set muted(value: boolean) {
35-
this._video.muted = value;
45+
if (this._video) {
46+
this._video.muted = value;
47+
}
3648
}
3749

3850
get controls() {
39-
return this._video.controls;
51+
return this._video?.controls ?? false;
4052
}
4153

4254
set controls(value: boolean) {
43-
this._video.controls = value;
55+
if (this._video) {
56+
this._video.controls = value;
57+
}
4458
}
4559

4660
get loop() {
47-
return this._video.muted;
61+
return this._video?.loop ?? false;
4862
}
4963

5064
set loop(value: boolean) {
51-
this._video.loop = value;
65+
if (this._video) {
66+
this._video.loop = value;
67+
}
5268
}
5369

5470
get src() {
55-
return this._video.src;
71+
return this._video?.src ?? '';
5672
}
5773

5874
set src(value: string) {
59-
this._video.src = value;
75+
if (this._video) {
76+
this._video.src = value;
77+
}
6078
}
6179

6280
set width(value) {
@@ -66,22 +84,28 @@ export class HTMLVideoElement extends Element {
6684
}
6785

6886
get width() {
69-
return this._video.width as any;
87+
return (this._video?.width as any) ?? 0;
7088
}
7189

7290
set height(value) {
73-
this._video.height = value as any;
91+
if (this._video) {
92+
this._video.height = value as any;
93+
}
7494
}
7595

7696
get height() {
77-
return this._video.height as any;
97+
return (this._video?.height as any) ?? 0;
7898
}
7999

80100
play() {
81-
this._video.play();
101+
if (this._video) {
102+
this._video.play();
103+
}
82104
}
83105

84106
pause() {
85-
this._video.pause();
107+
if (this._video) {
108+
this._video.pause();
109+
}
86110
}
87111
}

‎packages/canvas-polyfill/package.json‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@nativescript/canvas-polyfill",
3-
"version": "1.0.0-alpha19",
3+
"version": "1.0.0-alpha20",
44
"description": "Polyfill for making NativeScript compatible with web libs like pixi.js, three.js, phaser.js, babylon.js, etc....",
55
"main": "index",
66
"typings": "index.d.ts",
@@ -32,9 +32,6 @@
3232
"homepage": "https://github.com/NativeScript/canvas",
3333
"readmeFilename": "README.md",
3434
"bootstrapper": "@nativescript/plugin-seed",
35-
"peerDependencies": {
36-
37-
},
3835
"dependencies": {
3936
"xmldom-qsa": "^1.0.3"
4037
}

‎packages/canvas/Canvas2D/CanvasGradient/CanvasGradient.android.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,6 @@ export class CanvasGradient extends CanvasGradientBase {
1818
}
1919

2020
public addColorStop(offset: number, color: any): void {
21-
this.nativeInstance.addColorStop(offset, new Color(color).android);
21+
this.nativeInstance.addColorStop(offset, color);
2222
}
2323
}

‎packages/canvas/Canvas2D/CanvasRenderingContext2D/index.android.ts‎

Lines changed: 37 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -364,15 +364,18 @@ export class CanvasRenderingContext2D extends CanvasRenderingContext2DBase {
364364

365365
get fillStyle() {
366366
this.log('fillStyle');
367-
switch (this.context.getFillStyle().getStyleType()) {
368-
case CanvasColorStyleType.Color:
369-
const color = this.context.getFillStyle() as com.github.triniwiz.canvas.TNSColor;
370-
return color.getColor();
371-
case CanvasColorStyleType.Gradient:
372-
return CanvasGradient.fromNative(this.context.getFillStyle());
373-
case CanvasColorStyleType.Pattern:
374-
return new CanvasPattern(this.context.getFillStyle());
367+
if(this.context){
368+
switch (this.context.getFillStyle().getStyleType()) {
369+
case com.github.triniwiz.canvas.TNSColorStyleType.Color:
370+
const color = this.context.getFillStyle() as com.github.triniwiz.canvas.TNSColor;
371+
return color.getColor();
372+
case com.github.triniwiz.canvas.TNSColorStyleType.Gradient:
373+
return CanvasGradient.fromNative(this.context.getFillStyle());
374+
case com.github.triniwiz.canvas.TNSColorStyleType.Pattern:
375+
return new CanvasPattern(this.context.getFillStyle());
376+
}
375377
}
378+
return 'black';
376379
}
377380

378381
set fillStyle(color: string | CanvasGradient | CanvasPattern) {
@@ -390,6 +393,23 @@ export class CanvasRenderingContext2D extends CanvasRenderingContext2DBase {
390393
}
391394
}
392395

396+
397+
398+
get filter(): string {
399+
this.log('get filter');
400+
//@ts-ignore
401+
return this.context.getFilter();
402+
}
403+
404+
set filter(value: string) {
405+
this.log('set filter', value);
406+
if (this.context) {
407+
//@ts-ignore
408+
this.context.setFilter(value);
409+
}
410+
}
411+
412+
393413
get strokeStyle() {
394414
this.log('strokeStyle');
395415
switch (this.context.getStrokeStyle().getStyleType()) {
@@ -491,9 +511,11 @@ export class CanvasRenderingContext2D extends CanvasRenderingContext2DBase {
491511
this.log('clip value:', ...args);
492512
this._ensureLayoutBeforeDraw();
493513
if (typeof args[0] === 'string') {
494-
this.context.clip(args[0]);
514+
const rule = this._fillRuleFromString(args[0]);
515+
this.context.clip(rule);
495516
} else if (args[0] instanceof Path2D && typeof args[1] === 'string') {
496-
this.context.clip(args[0].native, args[1]);
517+
const rule = this._fillRuleFromString(args[1]);
518+
this.context.clip(args[0].native, rule);
497519
} else if (args[0] instanceof Path2D) {
498520
this.context.clip(args[0].native);
499521
} else {
@@ -710,6 +732,7 @@ export class CanvasRenderingContext2D extends CanvasRenderingContext2DBase {
710732
);
711733
}
712734

735+
713736
fill(): void;
714737

715738
fill(fillRule: string): void;
@@ -720,9 +743,11 @@ export class CanvasRenderingContext2D extends CanvasRenderingContext2DBase {
720743
this.log('fill value:', ...args);
721744
this._ensureLayoutBeforeDraw();
722745
if (typeof args[0] === 'string') {
723-
this.context.fill(args[0]);
746+
const rule = this._fillRuleFromString(args[0]);
747+
this.context.fill(rule);
724748
} else if (args[0] instanceof Path2D && typeof args[1] === 'string') {
725-
this.context.fill(args[0].native, args[1]);
749+
const rule = this._fillRuleFromString(args[1]);
750+
this.context.fill(args[0].native, rule);
726751
} else if (args[0] instanceof Path2D) {
727752
this.context.fill(args[0].native);
728753
} else {

‎packages/canvas/Canvas2D/CanvasRenderingContext2D/index.ios.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -593,7 +593,6 @@ export class CanvasRenderingContext2D extends CanvasRenderingContext2DBase {
593593
if (typeof args[0] === 'string') {
594594
// browser throws for invalid enum
595595
const rule = this._fillRuleFromString(args[0]);
596-
console.log(rule);
597596
this.context.clip(rule);
598597
} else if (args[0] instanceof Path2D && typeof args[1] === 'string') {
599598
const rule = this._fillRuleFromString(args[1]);

0 commit comments

Comments
 (0)