Commit 5dfcd1ef authored by limingzhe's avatar limingzhe

first

parent 3747dd67
......@@ -81,7 +81,7 @@ export class UploadVideoComponent implements OnChanges, OnDestroy {
handleChange(info: { type: string, file: UploadFile, event: any }): void {
console.log('info:' , info);
// console.log('info:' , info);
switch (info.type) {
case 'start':
......@@ -102,6 +102,7 @@ export class UploadVideoComponent implements OnChanges, OnDestroy {
case 'success':
console.log('success');
this.uploadSuccess(info.file);
// this.beforeUpload(info.file);
......@@ -110,7 +111,9 @@ export class UploadVideoComponent implements OnChanges, OnDestroy {
break;
case 'progress':
this.progress = parseInt(info.event.percent, 10);
this.doProgress(this.progress);
// this.doProgress(this.progress);
// console.log('progress: ', this.progress);
break;
}
}
......
......@@ -7,7 +7,7 @@
[src]="item.contentObj.video_url | resource" controls
(loadeddata)="videoLoaded($event,item)"
(error)="videoError($event)"
(seeked)="videoSeeked($event, false)"
(seeked)="videoSeeked($event)"
#videoNode ></video>
<!--&& item.contentObj.video_url.constructor.name === 'String'-->
<div *ngIf="!item.contentObj.video_url">
......
......@@ -70,6 +70,8 @@ export class FormComponent implements OnInit, OnChanges {
// });
// }
this.item = {};
this.item.contentObj = {};
const getData = (<any> window).courseware.getData;
getData((data) => {
......
<!--<div>-->
<!--<h1>{{aaa.a}}</h1>-->
<div
class="p-courseware-video"
[style.background-image]="hasVideo ? '' : 'url(assets/default/video-not-upload.jpg)'"
>
<!--<h1 style="color: #ffffff">{{aaa.a}}</h1>-->
<video *ngIf="hasVideo"
[src]="data.contentObj.video_url"
width="100%" height="100%"
......@@ -38,12 +47,7 @@
<div class="i-cursor" [style.left]="progress + '%'"></div>
</div>
<div class="k-video-control-time-total">{{duration | time}}</div>
<!--<div class="k-video-control-tool">-->
<!--<div class="i-tool-btn" (tap)="onBtnQuickSeek(-10)">-10</div>-->
<!--<div class="i-tool-btn" (tap)="onBtnQuickSeek(-5)">-5</div>-->
<!--<div class="i-tool-btn" (tap)="onBtnQuickSeek(5)">+5</div>-->
<!--<div class="i-tool-btn" (tap)="onBtnQuickSeek(10)">+10</div>-->
<!--</div>-->
</div>
</div>
import {AfterViewInit, Component, ElementRef, Input, OnDestroy, OnInit, ViewChild} from '@angular/core';
import {AfterViewInit, ApplicationRef, Component, ElementRef, Input, OnDestroy, OnInit, ViewChild} from '@angular/core';
@Component({
selector: 'app-play',
......@@ -24,14 +24,18 @@ export class PlayComponent implements AfterViewInit, OnInit, OnDestroy {
KEY = 'dfzx_03';
playBtnImg = '';
// aaa;
constructor() {
constructor(private appRef: ApplicationRef) {
}
ngOnInit() {
// console.log(this.data.contentObj)
// this.hasVideo = !!this.data.contentObj.video_url && typeof this.data.contentObj.video_url === 'string';
this.data = {};
this.data.contentObj = {};
const getData = (<any> window).courseware.getData;
getData((data) => {
......@@ -42,19 +46,43 @@ export class PlayComponent implements AfterViewInit, OnInit, OnDestroy {
this.data = {};
}
console.log('data:' , data);
console.log('data:' , this.data);
if (!this.data.contentObj) {
this.data.contentObj = {};
this.data.contentObj.video_url = 'assets/default/demo.mp4';
// this.initDefaultData();
}
this.initDefaultData();
console.log('this.data.contentObj.video_url: ', this.data.contentObj.video_url);
this.hasVideo = !!this.data.contentObj.video_url && typeof this.data.contentObj.video_url === 'string';
console.log('hasVideo: ', this.hasVideo);
this.playBtnImg = 'assets/play/btn-play.png';
this.refresh();
}, this.KEY);
// this.aaa = {a: 1};
// setInterval(() => {
// this.aaa.a ++;
// }, 1000);
setInterval(() => {
this.refresh();
}, 1000);
}
initDefaultData() {
if (!this.data.contentObj.video_url) {
this.data.contentObj.video_url = 'assets/default/demo.mp4';
}
}
playVideo() {
......@@ -62,6 +90,15 @@ export class PlayComponent implements AfterViewInit, OnInit, OnDestroy {
if (!this.videoNodeRef) {
return;
}
if (!this.player) {
this.ngAfterViewInit();
}
if (!this.player) {
console.log(' player not exist');
return;
}
this.initCover = false;
if (this.player.paused) {
const playPromise = this.player.play();
......@@ -84,9 +121,13 @@ export class PlayComponent implements AfterViewInit, OnInit, OnDestroy {
} else {
this.player.pause();
}
this.refresh();
}
ngAfterViewInit() {
console.log(' in ngAfterViewInit');
if (!this.videoNodeRef) {
return;
}
......@@ -113,6 +154,8 @@ export class PlayComponent implements AfterViewInit, OnInit, OnDestroy {
};
this.player.addEventListener("ended", () => {
this.playBtnImg = 'assets/play/btn-replay.png';
this.refresh();
})
setTimeout(() => {
this.initCover = this.data.contentObj.video_cover_url;
......@@ -148,4 +191,11 @@ export class PlayComponent implements AfterViewInit, OnInit, OnDestroy {
const {target, offsetX} = event;
this.player.currentTime = this.player.duration * offsetX / target.clientWidth;
}
refresh() {
setTimeout(() => {
this.appRef.tick();
}, 1);
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment