From 429b4c9cb330362885a2075d73717c12540deaed Mon Sep 17 00:00:00 2001
From: fanxuehan <fanxuehan@qq.com>
Date: Tue, 15 Jun 2021 11:30:26 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=88=A0=E9=99=A4=E6=97=A0=E7=94=A8?=
 =?UTF-8?q?=E7=9A=84=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/form/form.component.ts |   4 -
 src/app/play/play.component.ts | 234 +--------------------------------
 2 files changed, 7 insertions(+), 231 deletions(-)

diff --git a/src/app/form/form.component.ts b/src/app/form/form.component.ts
index 3588f09..da117ca 100644
--- a/src/app/form/form.component.ts
+++ b/src/app/form/form.component.ts
@@ -56,10 +56,6 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
         this.item = data;
       }
 
-      if (!this.item.groupTitle) {
-        this.item.groupTitle = ['', '', '', ''];
-      }
-
       this.init();
       this.changeDetectorRef.markForCheck();
       this.changeDetectorRef.detectChanges();
diff --git a/src/app/play/play.component.ts b/src/app/play/play.component.ts
index 722f061..40a1d74 100644
--- a/src/app/play/play.component.ts
+++ b/src/app/play/play.component.ts
@@ -1,9 +1,6 @@
 import {Component, ElementRef, ViewChild, OnInit, Input, OnDestroy, HostListener} from '@angular/core';
-
 import {
-  Label,
-  MySprite, tweenChange,
-
+  Label, MySprite, tweenChange,
 } from './Unit';
 import {res, resAudio} from './resources';
 
@@ -12,9 +9,6 @@ import {debounceTime} from 'rxjs/operators';
 
 import TWEEN from '@tweenjs/tween.js';
 
-
-
-
 @Component({
   selector: 'app-play',
   templateUrl: './play.component.html',
@@ -57,26 +51,16 @@ export class PlayComponent implements OnInit, OnDestroy {
   canvasLeft;
   canvasTop;
 
-  saveKey = 'test_0011';
-
-
-  btnLeft;
-  btnRight;
-  pic1;
-  pic2;
+  saveKey = 'test_001211';
 
   canTouch = true;
 
-  curPic;
-
   @HostListener('window:resize', ['$event'])
   onResize(event) {
     this.winResizeEventStream.next();
   }
 
-
   ngOnInit() {
-
     this.data = {};
 
     // 获取数据
@@ -145,20 +129,13 @@ export class PlayComponent implements OnInit, OnDestroy {
     this.canvas.nativeElement.width = this.wrap.nativeElement.clientWidth;
     this.canvas.nativeElement.height = this.wrap.nativeElement.clientHeight;
 
-
     this.ctx = this.canvas.nativeElement.getContext('2d');
     this.canvas.nativeElement.width = this.canvasWidth;
     this.canvas.nativeElement.height = this.canvasHeight;
 
     window['curCtx'] = this.ctx;
-    window['curImages'] = this.images;
   }
 
-
-
-
-
-
   updateItem(item) {
     if (item) {
       item.update();
@@ -174,12 +151,6 @@ export class PlayComponent implements OnInit, OnDestroy {
     }
   }
 
-
-
-
-
-
-
   initListener() {
 
     this.winResizeEventStream
@@ -188,7 +159,6 @@ export class PlayComponent implements OnInit, OnDestroy {
         this.renderAfterResize();
       });
 
-
     // ---------------------------------------------
     const setParentOffset = () => {
       const rect = this.canvas.nativeElement.getBoundingClientRect();
@@ -212,7 +182,6 @@ export class PlayComponent implements OnInit, OnDestroy {
     };
     // ---------------------------------------------
 
-
     let firstTouch = true;
 
     const touchDownFunc = (e) => {
@@ -249,7 +218,6 @@ export class PlayComponent implements OnInit, OnDestroy {
       this.mapUp(e);
     };
 
-
     const element = this.canvas.nativeElement;
 
     const addTouchListener = () => {
@@ -280,7 +248,6 @@ export class PlayComponent implements OnInit, OnDestroy {
     addTouchListener();
   }
 
-
   playAudio(key, now = false, callback = null) {
 
     const audio = this.audioObj[key];
@@ -299,8 +266,6 @@ export class PlayComponent implements OnInit, OnDestroy {
     }
   }
 
-
-
   loadResources() {
     const pr = [];
     this.rawImages.forEach((value, key) => {// 预加载图片
@@ -341,7 +306,7 @@ export class PlayComponent implements OnInit, OnDestroy {
     return new Promise((resolve, reject) => {
       const audio = new Audio();
       audio.oncanplay = (a) => {
-        resolve();
+        resolve(null);
       };
       audio.onerror = () => {
         reject();
@@ -351,17 +316,12 @@ export class PlayComponent implements OnInit, OnDestroy {
     });
   }
 
-
   renderAfterResize() {
     this.canvasWidth = this.wrap.nativeElement.clientWidth;
     this.canvasHeight = this.wrap.nativeElement.clientHeight;
     this.init();
   }
 
-
-
-
-
   checkClickTarget(target) {
 
     const rect = target.getBoundingBox();
@@ -394,10 +354,6 @@ export class PlayComponent implements OnInit, OnDestroy {
     return false;
   }
 
-
-
-
-
   addUrlToAudioObj(key, url = null, vlomue = 1, loop = false, callback = null) {
 
     const audioObj = this.audioObj;
@@ -427,60 +383,42 @@ export class PlayComponent implements OnInit, OnDestroy {
     this.rawImages.set(url, url);
   }
 
-
-
-
-
-
   // ======================================================编写区域==========================================================================
 
-
-
-
-
   /**
    * 添加默认数据 便于无数据时的展示
    */
   initDefaultData() {
-
     if (!this.data.pic_url) {
       this.data.pic_url = 'assets/play/default/pic.jpg';
       this.data.pic_url_2 = 'assets/play/default/pic.jpg';
     }
   }
 
-
   /**
    * 添加预加载图片
    */
   initImg() {
-
     this.addUrlToImages(this.data.pic_url);
     this.addUrlToImages(this.data.pic_url_2);
-
   }
 
   /**
    * 添加预加载音频
    */
   initAudio() {
-
     // 音频资源
     this.addUrlToAudioObj(this.data.audio_url);
     this.addUrlToAudioObj(this.data.audio_url_2);
 
     // 音效
     this.addUrlToAudioObj('click', this.rawAudios.get('click'), 0.3);
-
   }
 
-
-
   /**
    * 初始化数据
    */
   initData() {
-
     const sx = this.canvasWidth / this.canvasBaseW;
     const sy = this.canvasHeight / this.canvasBaseH;
     const s = Math.min(sx, sy);
@@ -489,173 +427,25 @@ export class PlayComponent implements OnInit, OnDestroy {
     // this.mapScale = sx;
     // this.mapScale = sy;
 
-
     this.renderArr = [];
-
-
-
   }
 
-
-
   /**
    * 初始化试图
    */
   initView() {
 
-
-    this.initPic();
-
-    this.initBottomPart();
-
-  }
-
-  initBottomPart() {
-
-    const btnLeft = new MySprite();
-    btnLeft.init(this.images.get('btn_left'));
-    btnLeft.x = this.canvasWidth - 150 * this.mapScale;
-    btnLeft.y = this.canvasHeight - 100 * this.mapScale;
-
-    btnLeft.setScaleXY(this.mapScale);
-
-    this.renderArr.push(btnLeft);
-
-    this.btnLeft = btnLeft;
-
-
-
-    const btnRight = new MySprite();
-    btnRight.init(this.images.get('btn_right'));
-    btnRight.x = this.canvasWidth - 50 * this.mapScale;
-    btnRight.y = this.canvasHeight - 100 * this.mapScale;
-    btnRight.setScaleXY(this.mapScale);
-
-    this.renderArr.push(btnRight);
-
-    this.btnRight = btnRight;
-  }
-
-  initPic() {
-
-    const maxW = this.canvasWidth * 0.7;
-
-    const pic1 = new MySprite();
-    pic1.init(this.images.get(this.data.pic_url));
-    pic1.x = this.canvasWidth / 2;
-    pic1.y = this.canvasHeight / 2;
-    pic1.setScaleXY(maxW / pic1.width);
-
-    this.renderArr.push(pic1);
-    this.pic1 = pic1;
-
-
-    const label1 = new Label();
-    label1.text = this.data.text;
-    label1.textAlign = 'center';
-    label1.fontSize = 50;
-    label1.fontName = 'BRLNSDB';
-    label1.fontColor = '#ffffff';
-
-    pic1.addChild(label1);
-
-
-
-
-
-    const pic2 = new MySprite();
-    pic2.init(this.images.get(this.data.pic_url_2));
-    pic2.x = this.canvasWidth / 2 + this.canvasWidth;
-    pic2.y = this.canvasHeight / 2;
-    pic2.setScaleXY(maxW / pic2.width);
-
-    this.renderArr.push(pic2);
-    this.pic2 = pic2;
-
-    this.curPic = pic1;
-  }
-
-
-  btnLeftClicked() {
-
-    this.lastPage();
-  }
-
-  btnRightClicked() {
-
-    this.nextPage();
-  }
-
-  lastPage() {
-
-    if (this.curPic == this.pic1) {
-      return;
-    }
-
-    this.canTouch = false;
-
-    const moveLen = this.canvasWidth;
-    tweenChange(this.pic1, {x: this.pic1.x + moveLen}, 1);
-    tweenChange(this.pic2, {x: this.pic2.x + moveLen}, 1, () => {
-      this.canTouch = true;
-      this.curPic = this.pic1;
-    });
-  }
-
-  nextPage() {
-
-    if (this.curPic == this.pic2) {
-      return;
-    }
-
-    this.canTouch = false;
-
-    const moveLen = this.canvasWidth;
-    tweenChange(this.pic1, {x: this.pic1.x - moveLen}, 1);
-    tweenChange(this.pic2, {x: this.pic2.x - moveLen}, 1, () => {
-      this.canTouch = true;
-      this.curPic = this.pic2;
-    });
-  }
-
-  pic1Clicked() {
-    this.playAudio(this.data.audio_url);
-  }
-
-  pic2Clicked() {
-    this.playAudio(this.data.audio_url_2);
   }
 
-
-
-
-
   mapDown(event) {
-
     if (!this.canTouch) {
       return;
     }
 
-    if ( this.checkClickTarget(this.btnLeft) ) {
-      this.btnLeftClicked();
-      return;
-    }
-
-    if ( this.checkClickTarget(this.btnRight) ) {
-      this.btnRightClicked();
-      return;
-    }
-
-    if ( this.checkClickTarget(this.pic1) ) {
-      this.pic1Clicked();
-      return;
-    }
-
-    if ( this.checkClickTarget(this.pic2) ) {
-      this.pic2Clicked();
-      return;
-    }
-
+    // if ( this.checkClickTarget(this.btnLeft) ) {
+    //   this.btnLeftClicked();
+    //   return;
+    // }
   }
 
   mapMove(event) {
@@ -666,10 +456,7 @@ export class PlayComponent implements OnInit, OnDestroy {
 
   }
 
-
-
   update() {
-
     // ----------------------------------------------------------
     this.animationId = window.requestAnimationFrame(this.update.bind(this));
     // 清除画布内容
@@ -678,13 +465,6 @@ export class PlayComponent implements OnInit, OnDestroy {
     TWEEN.update();
     // ----------------------------------------------------------
 
-
-
     this.updateArr(this.renderArr);
-
-
   }
-
-
-
 }
-- 
2.21.0