Skip to content

M
mycard
Commit ff09c0dd authored by 神楽坂玲奈's avatar 神楽坂玲奈
Browse files
Options

Merge remote-tracking branch 'origin/dev' into dev 

# Conflicts:
#	app/cube-description/cube-description.component.ts
parents 3a6c98ea bd7df783
Hide whitespace changes
Inline Side-by-side
Showing with 70 additions and 62 deletions
app/cube-description/cube-description.component.html
View file @ ff09c0dd
......@@ -3,18 +3,18 @@
<div class="left-box col-md-8">
<div class="left-big-item-box">
<div style="width:100%; padding-bottom:56.25%;"></div>
<!--<div class="left-big-item" [style.opacity]="divOpacity[key]" [style.display]="divOpacity[key]? 'block':'none'" *ngIf="videosrc.length">-->
<!--单视频-->
<div class="left-big-item" [style.opacity]="selectId<videosrc.length ? 1:0" [style.display]="selectId<videosrc.length? 'block':'none'" *ngIf="videosrc.length">
<video controls="" name="video" (ended)="nextvedio(key)" autoplay="true" [src]="videosrc_now" type="video/webm">
</video>
</div>
<!--多视频-->
<!--<div *ngFor="let src of videosrc ; index as key" class="left-big-item" [style.opacity]="divOpacity[key]" [style.display]="divOpacity[key]? 'block':'none'">-->
<!--<video controls="" name="video" (ended)="nextvedio(key)" [autoplay]="!key">-->
<!--<source [src]="src[0]" type="video/webm">-->
<!--</video>-->
<!--&lt;!&ndash;<img [src]="src[0]"/>&ndash;&gt;-->
<!--</div>-->
<!--多视频-->
<div *ngFor="let src of videosrc ; index as key" class="left-big-item" [style.opacity]="divOpacity[key]" [style.display]="divOpacity[key]? 'block':'none'">
<video controls="" name="video" (ended)="nextvedio(key)" [autoplay]="!key">
<source [src]="src[0]" type="video/webm">
</video>
<!--<img [src]="src[0]"/>-->
</div>
<div *ngFor="let src of imgsrc ; index as key" class="left-big-item" [style.opacity]="divOpacity[key+videosrc.length]" [style.display]="divOpacity[key+videosrc.length]? 'block':'none'">
<img class="img-fixed" [src]="src"/>
</div>
......@@ -23,7 +23,7 @@
<div style="overflow: auto; height:97px ">
<div style="margin-right: -10000px; position: relative; float:left; padding-top: 10px">
<div class="select-rectangle" [style.left]="(2+120*selectId)+'px'"></div>
<div class="select-rectangle" [style.left]="(2+120*selectId)+'px'" ></div>
<div *ngFor="let src of videosrc ; index as key" class="left-small-item" (click)="select(key);" style="position: relative">
<img class="img-fixed" [src]="src[1]"/>
......
app/cube-description/cube-description.component.ts
View file @ ff09c0dd
......@@ -3,6 +3,7 @@
*/
import {Component, Input, OnChanges, SimpleChanges} from '@angular/core';
import {Cube} from '../cube';
import Timer = NodeJS.Timer;
@Component({
......@@ -40,63 +41,68 @@ export class CubeDescriptionComponent implements OnChanges {
imgsrc: string[];
divOpacity: number[];
selectId = 0;
timeOutId: number;
timeOutId: Timer;
ngOnChanges(changes: SimpleChanges): void {
if (changes.currentCube) {
let trailer = this.currentCube.trailer;
let videosrc = this.videosrc = [];
this.videosrc_now="";
let imgsrc = this.imgs rc = [];
let divOpacity = this.divOpacity = [];
this.videosrc = [];
this.imgsrc = [];
this.divOpacity = [];
this.selectId = 0;
for (let val of trailer) {
for (let val of this.currentCube.trailer) {
if (val.type === 'video') {
videosrc.push([val.url, val.url2]);
this.videosrc.push([val.url, val.url2]);
} else if (val.type === 'image') {
imgsrc.push(val.url);
this.imgsrc.push(val.url);
}
if (divOpacity.length) {
divOpacity.push(0);
if (this.divOpacity.length) {
this.divOpacity.push(0);
} else {
divOpacity.push(1);
this.divOpacity.push(1);
}
}
this.videosrc_now = this.videosrc[0] ? this.videosrc[0][0] : '';
}
}
nextvedio(key): void {
// 多视频用
// nextvedio(key): void {
// console.log('nextvedio');
// let videos = document.getElementsByName('video');
// if (key + 1 < videos.length) {
// videos[key + 1].play();
// this.appear(key + 1);
// } else {
// this.nextpic(key);
// }
// }
// 单视频用
nextvedio(key: number): void {
console.log('nextvedio');
let videos = document.getElementsByName('video');
if (key + 1 < videos.length) {
videos[key + 1].play();
this.appear(key + 1);
let videosrc = this.videosrc;
if (key + 1 < videosrc.length) {
this.videosrc_now = videosrc[key + 1][0];
console.log(videosrc);
} else {
this.nextpic(key);
}
}
nextpic(key): void {
nextpic(key: number): void {
console.log('nextpic' + key);
let that = this;
key = this.divOpacity.length > key + 1 ? key : this.videosrc.length - 1;
this.appear(key + 1);
this.timeOutId = setTimeout(function () {
that.nextpic(key + 1)
}, 1000);
}
test(v: number): void {
console.log(this.currentCube);
console.log(this.divOpacity);
console.log(v);
console.log(this.divOpacity[1])
}, 5000);
}
appear(key: number): void {
console.log('appear' + key)
console.log('appear' + key);
let divOpacity = this.divOpacity;
this.selectId = key;
divOpacity.map(function (val, key2) {
......@@ -106,36 +112,38 @@ export class CubeDescriptionComponent implements OnChanges {
}
select(key: number): void {
console.log(this.currentCube);
clearTimeout(this.timeOutId);
this.stop();
let videos = document.getElementsByName('video');
if (key < videos.length) {
videos[key].play();
let videosrc = this.videosrc;
// this.stop();
let videos = <NodeListOf<HTMLVideoElement>>document.getElementsByName('video');
if (key < videosrc.length) {
this.videosrc_now = videosrc[key][0];
console.log(videosrc);
console.log(this.videosrc_now);
// videos[key].play();
videos[0].play();
this.appear(key);
} else {
this.nextpic(key - 1);
}
// this.appear(key);
}
play(key, ele) {
console.log('play');
// console.log(key);
// console.log(ele);
// if(!key){
// ele.play();
// }
}
stop() {
let videos = document.getElementsByName('video');
for (let video of videos) {
console.log(video);
video.pause();
}
}
//
// play(key, ele) {
// console.log('play');
// // console.log(key);
// // console.log(ele);
// // if(!key){
// // ele.play();
// // }
// }
// stop() {
// let videos = document.getElementsByName('video');
// for (let video of videos) {
// console.log(video);
// video.pause();
// }
// }
}
app/cube.ts
View file @ ff09c0dd
......@@ -34,7 +34,7 @@ export class Cube {
key?: string;
// 宣传片
trailer: { url: string, type: 'video' | 'image' }[];
trailer: { url: string, type: 'video' | 'image', url2?: string }[];
static downloadUrl(app: Cube, platform: string, locale: string): string {
if (app.id === 'ygopro') {
......@@ -272,7 +272,7 @@ export class CubeLocal {
for (let [k, v] of Object.entries(this.files)) {
t[k] = v;
}
return { path: this.path, version: this.version, files: t };
return {path: this.path, version: this.version, files: t};
}
}
......
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