I'm currently working with angular project, making a website for watching video. I use Videogular is a framework to develop video apps. I don't know how to make video by default in full screen.
My code:
<vg-player (onPlayerReady)="onPlayerReady($event)" >
<vg-overlay-play></vg-overlay-play>
<vg-buffering></vg-buffering>
<vg-scrub-bar>
<vg-scrub-bar-current-time></vg-scrub-bar-current-time>
<vg-scrub-bar-buffering-time></vg-scrub-bar-buffering-time>
</vg-scrub-bar>
<vg-controls>
<vg-play-pause></vg-play-pause>
<vg-playback-button></vg-playback-button>
</vg-controls>
<h1>{{id}}</h1>
<video [vgMedia]="media" #media id="singleVideo" preload="auto" crossorigin>
<source src="assets/skill/skill_{{id}}.mp4" type="video/mp4">
</video>
</vg-player>
import { Component, OnInit } from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import {VgAPI} from 'videogular2/compiled/src/core/services/vg-api';
@Component({
selector: 'app-skill',
templateUrl: './skill.component.html',
styleUrls: ['./skill.component.css']
})
export class SkillComponent implements OnInit {
id: string;
constructor(private route: ActivatedRoute) {
route.params.subscribe(params => {
this.id = params['id'];
});
}
ngOnInit() {
}
onPlayerReady(vgAPI: VgAPI) {
vgAPI.play();
vgAPI.fsAPI.toggleFullscreen();
}
}
Thank you so much!
http://www.videogular.com/tutorials/videogular-api/
I found a method in the Videogular’s API documentation that trigger fullscreen:
toggleFullScreen(): Toggles between fullscreen and normal mode.
Have you tried yet ?