From 2e380fa054dd5c23206361f1256cfa96727ee59c Mon Sep 17 00:00:00 2001 From: liujiangnan <695541723@qq.com> Date: Wed, 8 Jun 2022 21:32:36 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20cocos=E6=B7=BB=E5=8A=A0=E4=B8=8A?= =?UTF-8?q?=E6=8A=A5=E6=88=90=E7=BB=A9=E6=96=B9=E6=B3=95=EF=BC=9Bangular?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E9=9F=B3=E8=A7=86=E9=A2=91=E8=BD=AC=E7=A0=81?= =?UTF-8?q?=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/cocos_generator/script/util.ts | 8 +-- .../audio-recorder.component.html | 6 +- .../audio-recorder.component.scss | 15 ++++- .../audio-recorder.component.ts | 53 +++++++++++++++- .../upload-video/upload-video.component.ts | 60 ++++++++++++------- 5 files changed, 107 insertions(+), 35 deletions(-) diff --git a/assets/cocos_generator/script/util.ts b/assets/cocos_generator/script/util.ts index 62b8d68..e472ec2 100644 --- a/assets/cocos_generator/script/util.ts +++ b/assets/cocos_generator/script/util.ts @@ -411,15 +411,13 @@ export function showTrebleFirework(baseNode, rabbonList) { showFireworks(right); } -export function onHomeworkFinish() { +export function onHomeworkFinish(data = "", callback = ()=>{}) { const middleLayer = cc.find('middleLayer'); if (middleLayer) { const middleLayerComponent = middleLayer.getComponent('middleLayer'); - if (middleLayerComponent.role == 'student') { - middleLayerComponent.onHomeworkFinish(() => { }); - } + middleLayerComponent.onHomeworkFinish(callback, data); } else { - console.log('onHomeworkFinish'); + console.log('onHomeworkFinish', JSON.stringify(data)); } } diff --git a/form_angular/src/app/common/audio-recorder/audio-recorder.component.html b/form_angular/src/app/common/audio-recorder/audio-recorder.component.html index e174c34..79f390d 100644 --- a/form_angular/src/app/common/audio-recorder/audio-recorder.component.html +++ b/form_angular/src/app/common/audio-recorder/audio-recorder.component.html @@ -45,10 +45,6 @@ <fa-icon icon="cog"></fa-icon> </div> </ng-template> - - - - </div> <div class="p-progress ml-2" (click)="onBtnPlay()" *ngIf="audioUrl || audioBlob"> @@ -58,4 +54,6 @@ <fa-icon [icon]="playIcon"></fa-icon> </div> </div> + + <div class="audio-name">{{_audioName}}</div> </div> diff --git a/form_angular/src/app/common/audio-recorder/audio-recorder.component.scss b/form_angular/src/app/common/audio-recorder/audio-recorder.component.scss index 8267c9d..12b41ce 100644 --- a/form_angular/src/app/common/audio-recorder/audio-recorder.component.scss +++ b/form_angular/src/app/common/audio-recorder/audio-recorder.component.scss @@ -90,17 +90,26 @@ } .p-progress { - margin-top: 2px; + margin-top: 3.5px; position: relative; + background-color: #27b43f; + border-radius: 15px; line-height: 26px; .p-btn-play { position: absolute; - left: 10px; + left: 11px; top: 3px; - color: #555; + color: #ffffff; } } +.audio-name{ + margin-top: 3.5px; + position: relative; + margin-left: 7px;; + line-height: 26px; +} + :host ::ng-deep nz-upload { line-height: 33px; } diff --git a/form_angular/src/app/common/audio-recorder/audio-recorder.component.ts b/form_angular/src/app/common/audio-recorder/audio-recorder.component.ts index 605db0a..4af32f1 100644 --- a/form_angular/src/app/common/audio-recorder/audio-recorder.component.ts +++ b/form_angular/src/app/common/audio-recorder/audio-recorder.component.ts @@ -31,12 +31,21 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy { @Input() audioItem: any = null; + @Input() + _audioName: any = null; + @Input() set audioUrl(url) { this._audioUrl = url; if (url) { - this.audio.src = this._audioUrl; - this.audio.load(); + this.httpHeadCall(this._audioUrl, flag => { + if (flag) { + this.audio.src = this._audioUrl; + } else { + this.audio.src = this._audioUrl.replace("_l.", "."); + } + this.audio.load(); + }); } this.init(); } @@ -48,6 +57,7 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy { @Output() audioUploaded = new EventEmitter(); @Output() audioUploadFailure = new EventEmitter(); @Output() audioRemoved = new EventEmitter(); + @Output() audioName = new EventEmitter(); percent = 0; progress = 0; recorder: any; @@ -64,6 +74,41 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy { }; } + httpHeadCall(requsetUrl: string, callback) { + let xhr = new XMLHttpRequest(); + console.log("Status: Send Post Request to " + requsetUrl); + try { + xhr.onreadystatechange = () => { + try { + console.log('xhr.readyState: ', xhr.readyState); + if (xhr.readyState == 4) { + if ((xhr.status >= 200 && xhr.status < 400)) { + callback(true); + } else { + callback(false); + } + } + + } catch (e) { + console.log(e) + } + }; + xhr.open("HEAD", requsetUrl, true); + xhr.send(); + xhr.timeout = 15000; + xhr.onerror = (e) => { + console.log("汪汪汪 posterror", e); + callback(false); + }; + xhr.ontimeout = (e) => { + console.log("汪汪汪 ontimeout", e); + callback(false); + }; + } catch (e) { + console.log("Send Get Request error: ", e) + } + } + init() { this.playIcon = 'play'; this.isPlaying = false; @@ -168,8 +213,12 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy { break; case 'success': this.isUploading = false; + let url = info.file.response.url; + url = url.substring(0, url.lastIndexOf(".")) + "_l.mp3"; + info.file.response.url = url; this.uploadSuccess(info.file.response); this.audioUploaded.emit(info.file.response); + this.audioName.emit(info.file.name); break; case 'progress': this.progress = parseInt(info.event.percent, 10); diff --git a/form_angular/src/app/common/upload-video/upload-video.component.ts b/form_angular/src/app/common/upload-video/upload-video.component.ts index 013f8ad..60c5764 100644 --- a/form_angular/src/app/common/upload-video/upload-video.component.ts +++ b/form_angular/src/app/common/upload-video/upload-video.component.ts @@ -80,43 +80,62 @@ export class UploadVideoComponent implements OnChanges, OnDestroy { URL.revokeObjectURL(this.videoUrl); } + httpHeadCall(requsetUrl: string, callback) { + let xhr = new XMLHttpRequest(); + console.log("Status: Send Post Request to " + requsetUrl); + try { + xhr.onreadystatechange = () => { + try { + console.log('xhr.readyState: ', xhr.readyState); + if (xhr.readyState == 4) { + if ((xhr.status >= 200 && xhr.status < 400)) { + callback(true); + } else { + callback(false); + } + } + + } catch (e) { + console.log(e) + } + }; + xhr.open("HEAD", requsetUrl, true); + xhr.send(); + xhr.timeout = 15000; + xhr.onerror = (e) => { + callback(false); + }; + xhr.ontimeout = (e) => { + callback(false); + }; + } catch (e) { + console.log("Send Get Request error: ", e) + } + } + safeVideoUrl(url) { - console.log(url); - return this.sanitization.bypassSecurityTrustResourceUrl(url); // `${url}`; + const _url = url.replace("_l.", "."); + return this.sanitization.bypassSecurityTrustResourceUrl(_url); // `${url}`; } videoLoadedMetaData() { } - handleChange(info: UploadChangeParam/* { type: string, file: UploadFile, event: any }*/): void { - - console.log('info:' , info); - + handleChange(info: UploadChangeParam): void { switch (info.type) { case 'start': - - // this.beforeUpload(info.file); - - if (!this.checkSelectFile(info.file)) { return; } - - this.uploading = true; this.progress = 0; - break; - case 'success': - - + let url = info.file.response.url; + url = url.substring(0, url.lastIndexOf(".")) + "_l.mp4"; + info.file.response.url = url; this.uploadSuccess(info.file); - - // this.beforeUpload(info.file); - // this.uploadSuccess(info.file); - break; case 'progress': this.progress = info.event.percent; @@ -125,7 +144,6 @@ export class UploadVideoComponent implements OnChanges, OnDestroy { } } - checkSelectFile(file) { if (!file.lastModified) { return false; -- 2.21.0