Commit dbc4c314 authored by Chen Jiping's avatar Chen Jiping

完成

parent 7b9a904b
......@@ -128,5 +128,8 @@
}
}
},
"defaultProject": "ng-template-generator"
"defaultProject": "ng-template-generator",
"cli": {
"analytics": "d4049f16-cc8a-4a40-a984-afeed976b129"
}
}
\ No newline at end of file
<div class="model-content">
<div nz-row>
<div nz-col nzOffset='4'><h1 nz-title>课程内容编辑</h1></div>
</div>
<div nz-form>
<nz-form-item>
<nz-form-control [nzSpan]="15" nzOffset="3">
<div *ngFor="let it of item.exercises; let i = index" class="card-item" style="padding: 0.5vw;">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{i}}.contents">内容</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" [disabled]="it.contents.length == 5 ? true : false" class="add-btn" id="add-btn"
(click)="addContentItem(it.contents)">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
<div >
<div style="position: absolute; left: 200px; top: 100px; width: 800px;">
<input type="text" nz-input [(ngModel)]="item.text" (blur)="save()">
<div *ngFor="let data of it.contents;let j = index" class="card-item" style="padding: 0.5vw;">
<div class="border">
<nz-divider nzText="内容-{{j+1}}" nzOrientation="left"></nz-divider>
<nz-form-item>
<nz-form-label [nzSpan]="6" >内容形式</nz-form-label>
<nz-form-control [nzSpan]="6">
<nz-radio-group [(ngModel)]="data.contentType" (ngModelChange)="setContentType($event, data)">
<label nz-radio nzValue="T">文字</label>
<label nz-radio nzValue="P">图片</label>
</nz-radio-group>
</nz-form-control>
</nz-form-item>
<div *ngIf="data.contentType == 'T'">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.val">文本</nz-form-label>
<nz-form-control [nzSpan]="6">
<input nz-input type="text" id="{{j}}.val" placeholder="请录入内容" [(ngModel)]="data.val" (blur)="save()">
</nz-form-control>
</nz-form-item>
</div>
<div *ngIf="data.contentType == 'P'">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.pic_url">图片</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-upload-image-with-preview
[picUrl]="item.pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url')"
style="width: 100%"
[picUrl]="data.pic_url"
(imageUploaded)="onImageUploadSuccess($event, data, 'pic_url')"
></app-upload-image-with-preview>
<app-audio-recorder
[audioUrl]="item.audio_url"
(audioUploaded)="onAudioUploadSuccess($event, 'audio_url')"
></app-audio-recorder>
<app-custom-hot-zone></app-custom-hot-zone>
<app-upload-video></app-upload-video>
<app-lesson-title-config></app-lesson-title-config>
</nz-form-control>
</nz-form-item>
</div>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.pic_url">音频</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="{{j}}.audio_url"
[audioUrl]="data.audio_url"
(audioUploaded)="onAudioUploadSuccess($event, data, 'audio_url')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<button style="margin: 10px;" nz-button nzType="danger" (click)="delContentItem(it.contents, j)">
<span>删除</span>
</button>
</nz-form-item>
</div>
</div>
</div>
</div>
</nz-form-control>
</nz-form-item>
</div>
</div>
\ No newline at end of file
\ No newline at end of file
......@@ -10,7 +10,7 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap
export class FormComponent implements OnInit, OnChanges, OnDestroy {
// 储存数据用
saveKey = "test_0011";
saveKey = "DF_L223";
// 储存对象
item;
......@@ -31,6 +31,14 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
this.item = data;
}
if(!this.item.exercises){
this.item.exercises = [];
this.addExercisesItem();
this.item.exercises[0].contents.push(this.getDefaultContentItem());
}
this.init();
this.changeDetectorRef.markForCheck();
this.changeDetectorRef.detectChanges();
......@@ -58,9 +66,9 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存图片数据
* @param e
*/
onImageUploadSuccess(e, key) {
onImageUploadSuccess(e, item, key) {
this.item[key] = e.url;
item[key] = e.url;
this.save();
}
......@@ -68,9 +76,9 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存音频数据
* @param e
*/
onAudioUploadSuccess(e, key) {
onAudioUploadSuccess(e, item, key) {
this.item[key] = e.url;
item[key] = e.url;
this.save();
}
......@@ -93,5 +101,87 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
}, 1);
}
/**
* 添加练习
*/
addExercisesItem(){
let exercises = this.getDefaultExercisesItem();
this.item.exercises.push(exercises);
this.save();
}
delExercisesItem(index){
if (index !== -1) {
this.item.exercises.splice(index, 1);
this.save();
}
}
/**
* 获取缺省的练习题内容
*/
getDefaultExercisesItem(){
let exercises = {
contents:[]
}
return exercises;
}
/**
* 添加练习题内容
*/
addContentItem(contents){
let content = this.getDefaultContentItem();
contents.push(content);
this.save();
}
/**
* 删除练习题内容
* @param contents
* @param index
*/
delContentItem(contents, index){
if (index !== -1) {
contents.splice(index, 1);
this.save();
}
}
/**
* 获取缺省的练习题内容
*/
getDefaultContentItem(){
let content = {
contentType:"T",
val:"",
pic_url:"",
audio_url:""
}
return content;
}
setContentType(e, item){
item['contentType'] = e;
if("T" == e){
item['pic_url'] = "";
}
else if("P" == e){
item['val'] = "";
}
this.save();
}
}
import {
Label,
MySprite
} from './Unit';
/**
* 根据父级组件大小设置字体大小
* @param parWidth
* @param label
*/
export function setFontSize(parWidth : number, label: Label){
if(!label){
return;
}
let w = label.width;
let h = label.height;
let r = Math.sqrt( w * w + h * h)/2;
//如果宽度超过,则缩小字体
if(r > parWidth/2){
shrinkFont(parWidth, label);
}
else{
magnifyingFontSize(parWidth, label);
}
}
export function shrinkFont(parWidth : number, label: Label){
if(!label){
return;
}
let w = label.width;
let h = label.height;
let r = Math.sqrt( w * w + h * h)/2;
//如果宽度超过,则缩小字体
if(r > parWidth/2){
let fontSize = label.fontSize;
fontSize = fontSize - 2;
label.fontSize = fontSize;
label.refreshSize();
shrinkFont(parWidth, label);
}
}
export function magnifyingFontSize(parWidth : number, label: Label){
if(!label){
return;
}
let w = label.width;
let h = label.height;
let r = Math.sqrt( w * w + h * h)/2;
//如果宽度超过,则缩小字体
if(r < parWidth/2){
let fontSize = label.fontSize;
fontSize = fontSize + 2;
label.fontSize = fontSize;
label.refreshSize();
magnifyingFontSize(parWidth, label);
}
}
/**
* 获取按钮图片
* @param text 文本内容
* @param font 字体
* @param fontColor
*/
export function getBtnPic(text, font, fontColor){
const btn = new MySprite();
btn.init(this.images.get('btn'));
btn.setScaleXY(this.mapScale);
let btnText = new Label();
btnText.text = text;
btnText.textAlign='middle';
btnText.fontSize = 50;
btnText.fontName = font;
btnText.fontColor = fontColor;
btnText.refreshSize();
btnText.x = -btnText.width/2;
btnText.y = 0;
btn.addChild(btnText);
btn.childDepandAlpha = true;
return btn;
}
export function getRandomItemFromArr(arr){
if(!arr){
return;
}
let length = arr.length;
let index = Math.ceil(Math.random()*100000000)%length;
return arr[index];
}
\ No newline at end of file
......@@ -2,8 +2,15 @@ import {Component, ElementRef, ViewChild, OnInit, Input, OnDestroy, HostListener
import {
Label,
MySprite, tweenChange,
MySprite,
ShapeRect,
tweenChange,
removeItemFromArr,
showPopParticle,
rotateItem,
randomSortByArr,
hideItem,
moveItem
} from './Unit';
import {res, resAudio} from './resources';
......@@ -12,7 +19,8 @@ import {debounceTime} from 'rxjs/operators';
import TWEEN from '@tweenjs/tween.js';
import {setFontSize,
getRandomItemFromArr} from './MyUtil'
@Component({
......@@ -51,23 +59,65 @@ export class PlayComponent implements OnInit, OnDestroy {
audioObj = {};
bgRenderArr;
renderArr;
/**青蛙渲染数组 */
renderFrogArr;
starRenderArr;
endRenderArr;
mapScale = 1;
canvasLeft;
canvasTop;
saveKey = 'test_0011';
saveKey = 'DF_L223';
/**背景图片 */
bg;
btnStart;
btnLeft;
btnRight;
pic1;
pic2;
btnRestart;
canTouch = true;
curPic;
frogCanTouch = false;
/**玩游戏状态 */
playStatus = false;
/**游戏结束标识*/
playEnd = false;
/**左上角水波*/
leftWave;
/**右上角水波*/
rightWave;
/**大荷叶 */
bigLotusLeaf;
/**青蛙 */
frog;
//小荷叶坐标数组
leafMapArr = [];
//小荷叶
smallLotusLeafs = [];
//小荷叶临时数组
tempSmallLotusLeafs = [];
/**屏幕星星临时数组*/
tempStarArr = [];
@HostListener('window:resize', ['$event'])
onResize(event) {
......@@ -284,10 +334,24 @@ export class PlayComponent implements OnInit, OnDestroy {
callback();
};
}
audio.play();
}
}
pauseAudio(key, callback = null){
const audio = this.audioObj[key];
if (audio) {
if (callback) {
audio.onended = () => {
callback();
};
}
audio.pause();
}
}
loadResources() {
......@@ -432,10 +496,69 @@ export class PlayComponent implements OnInit, OnDestroy {
*/
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';
if(!this.data.exercises){
this.data.exercises = [];
let exercises = {contents:[]};
this.data.exercises.push(exercises);
for(let i = 0; i < 5; ++ i){
let contentItem;
if(i % 2 == 0){
contentItem = this.getDefaultContentItem('Hello', null);
}
else if(i % 3 == 0){
contentItem = this.getDefaultContentItem('World', null);
}
else{
contentItem = this.getDefaultContentItem('Lion', null);
}
console.log(contentItem);
exercises.contents.push(contentItem);
}
}
if(this.data.exercises[0].contents.length == 0){
for(let i = 0; i < 5; ++ i){
let contentItem;
if(i % 2 == 0){
contentItem = this.getDefaultContentItem('Hello', null);
}
else if(i % 3 == 0){
contentItem = this.getDefaultContentItem('World', null);
}
else{
contentItem = this.getDefaultContentItem('Lion', null);
}
console.log(contentItem);
this.data.exercises[0].contents.push(contentItem);
}
}
}
/**
*
* @param text
* @param pic_url
*/
getDefaultContentItem(text, pic_url){
let content = {
val:text,
pic_url:pic_url,
audio_url:this.rawAudios.get('click')
}
return content;
}
......@@ -444,8 +567,16 @@ export class PlayComponent implements OnInit, OnDestroy {
*/
initImg() {
this.addUrlToImages(this.data.pic_url);
this.addUrlToImages(this.data.pic_url_2);
for(let i = 0; i < this.data.exercises.length; ++ i){
let exercises = this.data.exercises[i];
for(let j = 0; j < exercises.contents.length; ++ j){
let content = exercises.contents[j];
this.addUrlToImages(content.pic_url);
}
}
}
......@@ -454,12 +585,27 @@ export class PlayComponent implements OnInit, OnDestroy {
*/
initAudio() {
// 音频资源
this.addUrlToAudioObj(this.data.audio_url);
this.addUrlToAudioObj(this.data.audio_url_2);
this.addUrlToAudioObj('click', this.rawAudios.get('click'));
this.addUrlToAudioObj('croak', this.rawAudios.get('croak'));
this.addUrlToAudioObj('handclap', this.rawAudios.get('handclap'));
this.addUrlToAudioObj('jump', this.rawAudios.get('jump'));
this.addUrlToAudioObj('showContent', this.rawAudios.get('showContent'));
for(let i = 0; i < this.data.exercises.length; ++ i){
let exercises = this.data.exercises[i];
for(let j = 0; j < exercises.contents.length; ++ j){
// 音效
this.addUrlToAudioObj('click', this.rawAudios.get('click'), 0.3);
let content = exercises.contents[j];
this.addUrlToAudioObj(content.audio_url);
}
}
}
......@@ -478,11 +624,39 @@ export class PlayComponent implements OnInit, OnDestroy {
// this.mapScale = sx;
// this.mapScale = sy;
this.bgRenderArr = [];
this.renderArr = [];
this.renderFrogArr = [];
this.starRenderArr = [];
this.endRenderArr = [];
this.leftWave = {};
this.rightWave = {};
this.bigLotusLeaf = {};
this.frog = {};
this.btnRestart = {};
this.btnStart = {};
this.leafMapArr = [];
this.smallLotusLeafs = [];
this.tempSmallLotusLeafs = [];
this.playStatus = false;
this.tempStarArr = [];
this.playEnd = false;
}
......@@ -497,127 +671,534 @@ export class PlayComponent implements OnInit, OnDestroy {
this.initBottomPart();
this.initLeftWavesPic();
this.initRightWavesPic();
this.initBigLotusLeaf();
this.initFrogPic();
this.initSmallLotusLeaf();
}
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);
const btnStart = new MySprite();
btnStart.init(this.images.get('start'));
btnStart.setScaleXY(this.mapScale);
btnStart.x = this.canvasWidth - 50 * this.mapScale - btnStart.getBoundingBox().width / 2;
btnStart.y = this.canvasHeight - 100 * this.mapScale;
this.btnLeft = btnLeft;
this.renderArr.push(btnStart);
this.btnStart.sprite = btnStart;
const btnRestart = new MySprite();
btnRestart.init(this.images.get('restart'));
btnRestart.setScaleXY(this.mapScale);
btnRestart.x = this.canvasWidth + btnRestart.getBoundingBox().width / 2;
btnRestart.y = btnStart.y;
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(btnRestart);
this.renderArr.push(btnRight);
this.btnRestart.sprite = btnRestart;
this.btnRestart.showX = btnStart.x;
this.btnRestart.showY = btnStart.y;
this.btnRestart.initX = btnRestart.x;
this.btnRestart.initY = btnRestart.y;
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);
const bg_pic = new MySprite();
bg_pic.init(this.images.get("bg"));
bg_pic.x = this.canvasWidth / 2;
bg_pic.y = this.canvasHeight / 2;
bg_pic.setScaleXY(this.canvasWidth / bg_pic.width);
bg_pic.childDepandAlpha = false;
this.bgRenderArr.push(bg_pic);
const bg = new ShapeRect();
bg.fillColor = '#75d100';
bg.alpha = 0;
bg.setSize(this.canvasWidth, this.canvasHeight);
this.starRenderArr.push(bg);
this.bg = bg;
this.renderArr.push(pic1);
this.pic1 = pic1;
}
/**
* 获得小水波组合
*/
getSmallWaveGropPic(){
const wave1 = new MySprite();
wave1.init(this.images.get("s_wave"));
wave1.setScaleXY(0.3 * this.mapScale);
wave1.x = wave1.width / 2;
wave1.y = wave1.height / 2;
const wave2 = new MySprite();
wave2.init(this.images.get("s_wave"));
wave2.setScaleXY(1 * this.mapScale);
wave2.alpha = 0;
wave2.x = wave1.x;
wave2.y = wave1.y;
const waveBg = new ShapeRect();
waveBg.fillColor = '#75d100';
waveBg.alpha = 0;
waveBg.setSize(wave1.width, wave1.height);
waveBg.addChild(wave1);
waveBg.addChild(wave2);
waveBg.x = Math.random() * this.canvasWidth;
waveBg.y = Math.random() * this.canvasHeight;
this.bgRenderArr.push(waveBg);
const showWave1 = () =>{
tweenChange(wave1, {alpha:0, scaleX:this.mapScale, scaleY:this.mapScale}, 0.6, null, null, (a, b)=>{
if(b >= 0.5/0.6){
showWave2();
}
});
}
const label1 = new Label();
label1.text = this.data.text;
label1.textAlign = 'center';
label1.fontSize = 50;
label1.fontName = 'BRLNSDB';
label1.fontColor = '#ffffff';
const showWave2 = () => {
tweenChange(wave1, {alpha:0, scaleX:this.mapScale * 1.3, scaleY:this.mapScale * 1.3}, 0.5, ()=>{
pic1.addChild(label1);
//移除小水珠
removeItemFromArr(this.bgRenderArr, waveBg);
});
};
showWave1();
return {waveBg:waveBg, wave1:wave1, wave2:wave2};
}
/**
* 初始左上角水波图标
*/
initLeftWavesPic(){
const l_wave = new MySprite();
l_wave.init(this.images.get("l_wave"));
l_wave.setScaleXY(this.mapScale);
l_wave.x = -l_wave.getBoundingBox().width / 2;
l_wave.y = -l_wave.getBoundingBox().height / 2;
this.renderArr.push(l_wave);
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.leftWave.sprite = l_wave;
//设置初始位置
this.leftWave.initX = l_wave.x;
this.leftWave.initY = l_wave.y;
this.renderArr.push(pic2);
this.pic2 = pic2;
//设置移动到位置
this.leftWave.toX = l_wave.getBoundingBox().width / 2;
this.leftWave.toY = l_wave.getBoundingBox().height / 2;
this.curPic = pic1;
this.moveWave(this.leftWave, 3, 2000);
}
/**
* 初始右上角水波图标
*/
initRightWavesPic(){
const r_wave = new MySprite();
r_wave.setScaleXY(this.mapScale);
r_wave.init(this.images.get("r_wave"));
r_wave.x = this.canvasWidth + r_wave.getBoundingBox().width / 2;
r_wave.y = - r_wave.getBoundingBox().height / 2;
this.renderArr.push(r_wave);
this.rightWave.sprite = r_wave;
//设置移动到位置
this.rightWave.toX = this.canvasWidth - r_wave.getBoundingBox().width / 2;
this.rightWave.toY = r_wave.getBoundingBox().height / 2;
//设置初始位置
this.rightWave.initX = r_wave.x;
this.rightWave.initY = r_wave.y;
btnLeftClicked() {
this.moveWave(this.rightWave, 3, 2000);
}
this.lastPage();
/**
* 初始化大荷叶
*/
initBigLotusLeaf(){
//荷叶
const lotusLeaf = new MySprite();
lotusLeaf.setScaleXY(this.mapScale);
lotusLeaf.init(this.images.get("b_lotus_leaf"));
lotusLeaf.x = this.canvasWidth + lotusLeaf.getBoundingBox().width / 2;
lotusLeaf.y = this.canvasHeight + lotusLeaf.getBoundingBox().height / 2;
this.renderArr.push(lotusLeaf);
this.bigLotusLeaf.lotusLeaf = lotusLeaf;
let initX = this.canvasWidth - lotusLeaf.getBoundingBox().width / 2 - 150 * this.mapScale;
this.bigLotusLeaf.initX = initX;
let initY = this.canvasHeight - lotusLeaf.getBoundingBox().height / 2 + 80 * this.mapScale;
this.bigLotusLeaf.initY = initY;
//水波
const leafWave = new MySprite();
leafWave.setScaleXY(this.mapScale);
leafWave.init(this.images.get("b_leaf_wave"));
leafWave.x = initX;
leafWave.y = initY;
leafWave.visible = false;
this.renderArr.push(leafWave);
this.bigLotusLeaf.leafWave = leafWave;
//影子
const shadow = new MySprite();
shadow.setScaleXY(this.mapScale);
shadow.init(this.images.get("b_shadow"));
shadow.x = initX;
shadow.y = initY;
shadow.visible = false;
this.renderArr.push(shadow);
this.bigLotusLeaf.shadow = shadow;
}
btnRightClicked() {
this.nextPage();
/**
* 初始青蛙图片
*/
initFrogPic(){
if(!this.frog.standbys){
this.frog.standbys = [];
}
lastPage() {
let frogWidth = 0;
if (this.curPic == this.pic1) {
return;
let frogHeight = 0;
//初始化待机图片
const initStandbyPic = (index) =>{
const frogStandby = new MySprite();
frogStandby.setScaleXY(this.mapScale > 1 ? 1 : this.mapScale);
frogStandby.init(this.images.get("standby-" + index));
frogWidth = frogStandby.getBoundingBox().width;
frogHeight = frogStandby.getBoundingBox().height;
//初始不可见
frogStandby.visible = false;
frogStandby.x = frogWidth/2;
frogStandby.y = frogHeight/2;
this.frog.standbys.push(frogStandby);
};
//初始青待机图片
for(let i = 0; i < 28; ++ i){
let index = String(i + 1);
if(i < 9){
index = "0" + (i + 1);
}
//console.log(index);
initStandbyPic(index);
}
this.canTouch = false;
//青蛙初始位置
this.frog.initX = this.canvasWidth + frogWidth;
this.frog.initY = this.canvasHeight + frogHeight;
this.frog.width = frogWidth;
this.frog.height = frogHeight;
//青蛙背景
const frogBg = new ShapeRect();
frogBg.setSize(frogWidth, frogHeight);
frogBg.fillColor ="#696969";
frogBg.alpha= 0;
frogBg.x = this.frog.initX;
frogBg.y = this.frog.initY;
this.frog.bg = frogBg;
this.renderFrogArr.push(frogBg);
//将待机图片添加背景图片
for(let i = 0; i < this.frog.standbys.length; ++ i){
frogBg.addChild(this.frog.standbys[i]);
}
//青蛙跳起
{
const jumpedUp = new MySprite();
jumpedUp.setScaleXY(this.mapScale > 1 ? 1 : this.mapScale);
jumpedUp.init(this.images.get("jumped_up"));
//初始不可见
jumpedUp.visible = true;
jumpedUp.x = jumpedUp.getBoundingBox().width / 2;
jumpedUp.y = jumpedUp.getBoundingBox().height / 2;
frogBg.addChild(jumpedUp);
this.frog.jumpedUp = jumpedUp;
}
//播放青蛙待机动画
this.animation(this.frog, this.frog.standbys, 0, 80);
}
/**
* 初始化小荷叶
*/
initSmallLotusLeaf(){
//荷叶宽度
let width = 340 * this.mapScale;
//荷叶高度
let height = 209 * this.mapScale;
//计算所有荷叶坐标
//荷叶1
this.leafMapArr.push({x: 160 * this.mapScale + width /2, y: 80 * this.mapScale + height / 2});
//荷叶2
this.leafMapArr.push({x: this.canvasWidth/2 + 40 * this.mapScale + width /2, y: 20 * this.mapScale + height / 2});
//荷叶3
this.leafMapArr.push({x: 30 * this.mapScale + width /2, y: this.canvasHeight/2 + height / 2});
//荷叶4
this.leafMapArr.push({x: this.canvasWidth/2 - 210 * this.mapScale + width /2, y: this.canvasHeight/2 - 140 * this.mapScale + height / 2});
//荷叶5
this.leafMapArr.push({x: this.canvasWidth - 30 * this.mapScale - width /2, y: this.canvasHeight/2 - 180 * this.mapScale + height / 2});
console.log('leafMapArr', this.leafMapArr);
const initLotusLeafPic = (content, x, y) =>{
let lotusLeafObj = {leaf:null, droplet:null, hl:null, conText:null, conPic:null, shadow: null, canVoice: false, audioUrl:content.audio_url};
const lotusLeaf = new MySprite();
lotusLeaf.setScaleXY(this.mapScale);
lotusLeaf.init(this.images.get("s_lotus_leaf"));
lotusLeaf.x = x;
lotusLeaf.y = y;
this.renderArr.push(lotusLeaf);
lotusLeafObj.leaf = lotusLeaf;
//高亮荷叶
const hightLightLotusLeaf = new MySprite();
hightLightLotusLeaf.setScaleXY(this.mapScale);
hightLightLotusLeaf.init(this.images.get("s_lotus_leaf_light"));
hightLightLotusLeaf.alpha = 0;
hightLightLotusLeaf.x = x;
hightLightLotusLeaf.y = y;
this.renderArr.push(hightLightLotusLeaf);
lotusLeafObj.hl = hightLightLotusLeaf;
//设置内容
this.setContent(content, lotusLeaf, hightLightLotusLeaf, lotusLeafObj);
//小珠
const droplet = new MySprite();
droplet.setScaleXY(this.mapScale);
droplet.init(this.images.get("droplet"));
droplet.alpha = 0;
droplet.x = x;
droplet.y = y;
this.renderArr.push(droplet);
lotusLeafObj.droplet = droplet;
//阴影
const shadow = new MySprite();
shadow.setScaleXY(this.mapScale);
shadow.init(this.images.get("s_shadow"));
shadow.x = lotusLeaf.x;
shadow.y = lotusLeaf.y;
this.renderArr.push(shadow);
lotusLeafObj.shadow = shadow;
this.smallLotusLeafs.push(lotusLeafObj);
};
//取练习题
let exercises = this.data.exercises[0];
//打乱数组
let contents = randomSortByArr(exercises.contents);
console.log('random contents', contents);
//初始小荷叶
for(let i = 0; i < contents.length; ++ i){
let content = contents[i];
initLotusLeafPic(content, this.leafMapArr[i].x, this.leafMapArr[i].y);
}
this.tempSmallLotusLeafs = [...this.smallLotusLeafs];
}
/**
* 设置内容
*/
setContent(content, parItem, parItem2, lotusLeafObj){
//图片存在,则渲染图片
if(content.pic_url){
const content_pic = new MySprite();
content_pic.init(this.images.get(content.pic_url));
let w = content_pic.width;
let h = content_pic.height;
let d = Math.sqrt( w * w + h * h);
content_pic.setScaleXY((parItem.getBoundingBox().height - 50 * this.mapScale) / d);
content_pic.alpha = 0;
content_pic.x = 0;
content_pic.y = -20 * this.mapScale;
parItem.addChild(content_pic);
parItem2.addChild(content_pic);
lotusLeafObj.conPic = content_pic;
}
else{
let content_val = new Label();
content_val.text = content.val;
content_val.textAlign='middle';
content_val.fontSize = 50;
content_val.fontName = "BRLNSDB";
content_val.fontColor = "#FFFFFF";
content_val.alpha = 0;
content_val.refreshSize();
setFontSize(parItem.getBoundingBox().height - 70 * this.mapScale, content_val);
content_val.refreshSize();
content_val.x = - content_val.getBoundingBox().width/2;
content_val.y = -20 * this.mapScale;
lotusLeafObj.conText = content_val;
parItem.addChild(content_val);
parItem2.addChild(content_val);
}
parItem2.childDepandAlpha = false;
}
/**
* 移动水波
* @param wave
* @param time
* @param intervalTime
*/
moveWave(wave, time:number, intervalTime:number){
//从初始位置移动到指定位置并进行透明度变化
tweenChange(wave.sprite, {x:wave.toX, y:wave.toY, alpha:0}, time, ()=>{
//回到初始位置
wave.sprite.x = wave.initX;
wave.sprite.y = wave.initY;
//回到初始透明度
wave.sprite.alpha = 1;
setTimeout(() => {
this.moveWave(wave, time, intervalTime);
}, intervalTime);
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() {
/**
* 播放序列针动画
* @param parItem
* @param arr 图片数组
* @param nextIndex 下一图片顺序
* @param intervalTime 间隔时间
*/
animation(parItem, arr, nextIndex : number, intervalTime : number){
if (this.curPic == this.pic2) {
if(!parItem){
return;
}
this.canTouch = false;
if(!arr || arr.length == 0){
return;
}
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;
});
let tNextIndex = nextIndex;
//如果相等,则表示一轮播放结束,将播放顺序重置为0
if(nextIndex == arr.length){
tNextIndex = 0;
}
//暂停动画
if(parItem.animationStop){
//隐藏上一张图
if(nextIndex > 0){
arr[nextIndex - 1].visible = false;
}
else if(nextIndex == 0){
arr[nextIndex].visible = false;
}
pic1Clicked() {
this.playAudio(this.data.audio_url);
return;
}
pic2Clicked() {
this.playAudio(this.data.audio_url_2);
//console.log('nextIndex', tNextIndex);
//隐藏上一张图
if(nextIndex > 0){
arr[nextIndex - 1].visible = false;
}
arr[tNextIndex].visible = true;
setTimeout(() => {
let nextIndex = tNextIndex + 1;
this.animation(parItem, arr, nextIndex, intervalTime);
}, intervalTime);
}
mapDown(event) {
......@@ -625,26 +1206,54 @@ export class PlayComponent implements OnInit, OnDestroy {
return;
}
if ( this.checkClickTarget(this.btnLeft) ) {
this.btnLeftClicked();
if(this.checkClickTarget(this.btnStart.sprite)){
this.playAudio('click');
this.btnStart.keyDown = true;
this.btnStart.sprite.setScaleXY(this.mapScale * 1.3);
return;
}
if ( this.checkClickTarget(this.btnRight) ) {
this.btnRightClicked();
if ( this.checkClickTarget(this.btnRestart.sprite)) {
this.playAudio('click');
this.btnRestart.keyDown = true;
this.btnRestart.sprite.setScaleXY(this.mapScale * 1.3);
return;
}
if ( this.checkClickTarget(this.pic1) ) {
this.pic1Clicked();
return;
if(this.frogCanTouch){
if(this.checkClickTarget(this.frog.bg)){
this.frogCanTouch = false;
this.jumpToSmallLotusLeaf();
}
if ( this.checkClickTarget(this.pic2) ) {
this.pic2Clicked();
return;
}
//判断是否点击了荷叶上的内容
for(let i = 0; i < this.smallLotusLeafs.length; ++ i){
if(this.checkClickTarget(this.smallLotusLeafs[i].leaf)){
//可以发音,则点击发音
if(this.smallLotusLeafs[i].canVoice){
//停止所有的音效
for(let j = 0; j < this.smallLotusLeafs.length; ++ j){
let audio = this.audioObj[this.smallLotusLeafs[j].audioUrl];
audio.currentTime = 0;
audio.pause();
}
this.playAudio(this.smallLotusLeafs[i].audioUrl);
}
}
}
}
mapMove(event) {
......@@ -653,27 +1262,616 @@ export class PlayComponent implements OnInit, OnDestroy {
mapUp(event) {
if(!this.canTouch){
return;
}
if(this.checkClickTarget(this.btnStart.sprite)){
//按下松开
if(this.btnStart.keyDown = true){
update() {
this.btnStart.keyDown = false;
// ----------------------------------------------------------
this.animationId = window.requestAnimationFrame(this.update.bind(this));
// 清除画布内容
this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight);
// tween 更新动画
TWEEN.update();
// ----------------------------------------------------------
let toX = this.btnStart.sprite.getBoundingBox().width + this.btnStart.sprite.x;
//向左移出
tweenChange(this.btnStart.sprite, {x : toX}, 0.3, ()=>{
//恢复原来大小写
this.btnStart.sprite.setScaleXY(this.mapScale);
this.updateArr(this.renderArr);
//开始游戏
this.playGame();
});
}
}
if(this.checkClickTarget(this.btnRestart.sprite)){
//按下松开
if(this.btnRestart.keyDown = true){
this.btnRestart.keyDown = false;
let toX = this.btnRestart.initX;
//向左移出
tweenChange(this.btnRestart.sprite, {x : toX}, 0.3, ()=>{
//恢复原来大小写
this.btnRestart.sprite.setScaleXY(this.mapScale);
//开始游戏
this.restartGame();
});
}
}
}
update() {
// ----------------------------------------------------------
this.animationId = window.requestAnimationFrame(this.update.bind(this));
// 清除画布内容
this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight);
// tween 更新动画
TWEEN.update();
// ----------------------------------------------------------
this.updateArr(this.bgRenderArr);
this.updateArr(this.renderArr);
this.updateArr(this.renderFrogArr);
this.updateArr(this.starRenderArr);
this.updateArr(this.endRenderArr);
}
/**
* 显示小水波
*/
showSmallWaveGrop(){
//未开始游戏,直接返回
if(!this.playStatus){
return;
}
//产生水波个数
let count = Math.ceil(Math.random() * 2) + 3;
for(let i = 0; i < count; ++ i){
this.getSmallWaveGropPic();
}
setTimeout(() => {
this.showSmallWaveGrop();
}, 5000);
}
/**
* 显示屏幕小星星
*/
showStar(){
if(!this.playStatus){
return;
}
const star = this.getStar();
this.starRenderArr.push(star);
this.tempStarArr.push(star);
hideItem(star, 2, () => {
removeItemFromArr(this.starRenderArr, star);
removeItemFromArr(this.tempStarArr, star);
});
rotateItem(star, star['tr'], star['time']);
setTimeout(() => {
if(this.tempStarArr.length < 10){
this.showStar();
}
}, 500);
}
getStar() {
const star = new MySprite(this.ctx);
star.init(this.images.get('star'));
const randomS = (Math.random() * 1.5 + 0.5) * this.mapScale;
star.setScaleXY(randomS);
const randomR = Math.random() * 360;
star.rotation = randomR;
const randomX = Math.random() * this.canvasWidth;
star.x = randomX;
star.y = Math.random() * this.canvasHeight;
const randomT = 2 + Math.random() * 5;
star['time'] = randomT;
let randomTR = 360 * Math.random(); // - 180;
if (Math.random() < 0.5) { randomTR *= -1; }
star['tr'] = randomTR;
return star;
}
/**
* 开始游戏
*/
playGame(){
this.playStatus = true;
//显示小水波
this.showSmallWaveGrop();
//显示小星星
this.showStar();
for(let i = 0; i < this.smallLotusLeafs.length; ++ i){
let lotusLeaf = this.smallLotusLeafs[i];
//显示小水珠
lotusLeaf.droplet.alpha = 1;
//显示内容
let content;
if(lotusLeaf.conPic){
content = lotusLeaf.conPic;
}
else{
content = lotusLeaf.conText;
}
//显示内容
tweenChange(content, {alpha:1}, 0.5, ()=>{
//隐藏小水珠
lotusLeaf.droplet.alpha = 0;
});
//高亮显示荷叶
tweenChange(lotusLeaf.hl, {alpha:1}, 0.5, ()=>{
//3秒后恢复原状
setTimeout(() => {
tweenChange(lotusLeaf.hl, {alpha:0}, 0.5, ()=>{
//显示水珠
lotusLeaf.droplet.alpha = 1;
//最后一次,显示大荷叶
if(i == this.smallLotusLeafs.length - 1){
//显示大荷叶
showBigLotus();
}
});
//隐藏内容
tweenChange(content, {alpha:0}, 0.5, ()=>{
});
}, 3000);
});
}
//显示荷叶
const showBigLotus = () =>{
tweenChange(this.bigLotusLeaf.lotusLeaf, {x: this.bigLotusLeaf.initX, y:this.bigLotusLeaf.initY}, 1, ()=>{
this.toggleBigLotus();
this.shakeWave();
//跳转到大荷叶
this.jumpToBigLotusLeaf();
});
}
}
/**
* 跳转到大荷叶上
*/
jumpToBigLotusLeaf(){
//设置初始位置
this.frog.bg.x = this.frog.initX;
this.frog.bg.y = this.frog.initY;
//青蛙跳到大荷叶上
this.frog.animationStop = true;
this.frog.jumpedUp.visible = true;
//计算青蛙新位置
let toX = this.bigLotusLeaf.lotusLeaf.x - this.frog.width / 2;
let toY = this.bigLotusLeaf.lotusLeaf.y - this.frog.height + 50 * this.mapScale;
//跳到大荷叶上
this.frogJump(toX, toY, 1, ()=>{
this.playAudio('croak');
this.frogCanTouch = true;
//播放青蛙待机动画
this.animation(this.frog, this.frog.standbys, 0, 80);
});
}
/**
* 跳到小荷叶上
*/
jumpToSmallLotusLeaf(){
if(this.tempSmallLotusLeafs.length == 0){
return;
}
//获取随机荷叶
let lotusLeaf = getRandomItemFromArr(this.tempSmallLotusLeafs);
removeItemFromArr(this.tempSmallLotusLeafs, lotusLeaf);
//console.log('lotusLeaf', lotusLeaf);
let toX = lotusLeaf.leaf.x - this.frog.width / 2;
let toY = lotusLeaf.leaf.y - this.frog.height + 50 * this.mapScale;
this.playAudio('jump');
this.frogJump(toX, toY, 0.3,()=>{
//显示星星
this.showParticle(lotusLeaf.leaf);
//水珠消失
lotusLeaf.droplet.alpha = 0;
//显示高亮图片
lotusLeaf.hl.alpha = 1;
this.playAudio('showContent');
if(lotusLeaf.conPic){
lotusLeaf.conPic.alpha = 1;
}
else{
lotusLeaf.conText.alpha = 1;
}
lotusLeaf.canVoice = true;
//荷叶放大
tweenChange(lotusLeaf.hl, {scaleX:this.mapScale * 1.3, scaleY: this.mapScale * 1.3}, 0.3, () => {
//荷叶缩小
tweenChange(lotusLeaf.hl, {scaleX:this.mapScale, scaleY: this.mapScale}, 0.3, ()=>{
tweenChange(lotusLeaf.hl, {alpha:0}, 0.3, ()=>{
});
});
});
//阴影放大再缩小
tweenChange(lotusLeaf.shadow, {scaleX:this.mapScale * 1.3, scaleY: this.mapScale * 1.3}, 0.3, () => {
tweenChange(lotusLeaf.shadow, {scaleX:this.mapScale, scaleY: this.mapScale}, 0.3);
});
//停留0.1秒,然后跳出
setTimeout(() => {
let tPos = this.getJumpOutMap(toX, toY, this.frog.width, this.frog.height);
console.log('out pos', tPos);
this.frogJump(tPos.x, tPos.y, 0.5,()=>{
//游戏结束
if(this.tempSmallLotusLeafs.length == 0){
//初始化重新玩游戏状态
this.initRestartGame();
}
else{
//重置小青蛙,并跳到大荷叶
this.jumpToBigLotusLeaf();
}
});
}, 100);
});
}
/**
* 如果大荷叶隐藏,则显示;如果显示,则隐藏
*/
toggleBigLotus() {
if(this.bigLotusLeaf.leafWave.visible){
this.bigLotusLeaf.leafWave.visible = false;
this.bigLotusLeaf.shadow.visible = false;
}
else{
this.bigLotusLeaf.leafWave.visible = true;
this.bigLotusLeaf.shadow.visible = true;
}
}
/**
* 晃动大荷叶
*/
shakeWave(){
let scale = this.mapScale * 1.3;
//从小变大和透明度变化
tweenChange(this.bigLotusLeaf.leafWave, {scaleX:scale, scaleY:scale, alpha:0}, 3, ()=>{
//回到初始大小
this.bigLotusLeaf.leafWave.setScaleXY(this.mapScale);
//回到初始透明度
this.bigLotusLeaf.leafWave.alpha = 1;
this.shakeWave();
});
}
/**
* 青蛙跳跃
* @param toX
* @param toY
* @param time
* @param callback
*/
frogJump(toX, toY, time:number, callback = null){
//显示跳越动作
this.frog.jumpedUp.visible = true;
//停止动画
this.frog.animationStop = true;
tweenChange(this.frog.bg, {x : toX, y : toY}, time, ()=>{
this.frog.jumpedUp.visible = false;
this.frog.animationStop = false;
if(callback){
callback();
}
},null, () =>{
});
}
/**
* 获取青蛙跳出坐标
* @param curX
* @param curY
*/
getJumpOutMap(curX, curY, width, height){
if(curX < this.canvasWidth /2){
//第二象限
if(curY < this.canvasHeight / 2){
return {x : curX, y:-height};
}
else{
//第三象限
return {x: -width, y: curY};
}
}
else{
if(curY < this.canvasHeight / 2){
//第一象限
return {x: curX, y: -height};
}
else{
//第四象限
return {x: curX, y: -height};
}
}
}
/**
* 跳到荷叶上显示小星星
* @param lotusLeaf
*/
showParticle(lotusLeaf){
showPopParticle(this.images.get('star'), {x: lotusLeaf.x,y: lotusLeaf.y - 50} ,this.bg, 15, 40, 120, 2);
}
/**
* 显示结束花瓣
*/
showPetal(){
if(!this.playEnd){
return;
}
const petal = this.getPetal();
this.endRenderArr.push(petal);
moveItem(petal, petal.x, this.canvasHeight + petal.height * petal.scaleY, petal['time'], () => {
removeItemFromArr(this.endRenderArr, petal);
});
rotateItem(petal, petal['tr'], petal['time']);
setTimeout(() => {
this.showPetal();
}, 100);
}
/**
* 得到花瓣
*/
getPetal() {
const petal = new MySprite(this.ctx);
const id = Math.ceil( Math.random() * 9 );
petal.init(this.images.get('petal_' + id));
const randomS = (Math.random() * 0.4 + 0.6) * this.mapScale;
petal.setScaleXY(randomS);
const randomR = Math.random() * 360;
petal.rotation = randomR;
const randomX = Math.random() * this.canvasWidth;
petal.x = randomX;
petal.y = -petal.height / 2 * petal.scaleY;
const randomT = 2 + Math.random() * 5;
petal['time'] = randomT;
let randomTR = 360 * Math.random(); // - 180;
if (Math.random() < 0.5) { randomTR *= -1; }
petal['tr'] = randomTR;
return petal;
}
/**
* 初始化重新开始游戏
*/
initRestartGame(){
this.playEnd = true;
this.canTouch = false;
this.playAudio('handclap', false, () => {
//撒花结束
this.playEnd = false;
//清除所有的花瓣
this.endRenderArr = [];
this.canTouch = true;
});
//显示花瓣
this.showPetal();
//隐藏大荷叶水波
this.toggleBigLotus();
//大荷叶划出屏幕
let toX = this.canvasWidth + this.bigLotusLeaf.lotusLeaf.getBoundingBox().width / 2;
let toY = this.canvasHeight + this.bigLotusLeaf.lotusLeaf.getBoundingBox().height / 2;
tweenChange(this.bigLotusLeaf.lotusLeaf, {x: toX, y:toY}, 1);
//显示重新开始按钮
tweenChange(this.btnRestart.sprite, {x: this.btnRestart.showX, y:this.btnRestart.showY}, 0.3);
this.tempSmallLotusLeafs = [... this.smallLotusLeafs];
}
/**
* 重新开始游戏
*/
restartGame(){
//取练习题
let exercises = this.data.exercises[0];
//打乱数组
let contents = randomSortByArr(exercises.contents);
for(let i = 0; i < this.smallLotusLeafs.length; ++ i){
let audio = this.audioObj[this.smallLotusLeafs[i].audioUrl];
audio.currentTime = 0;
audio.pause();
this.smallLotusLeafs[i].canVoice = false;
//荷叶
let leaf = this.smallLotusLeafs[i].leaf;
//高亮荷叶
let hlLeaf = this.smallLotusLeafs[i].hl;
if(this.smallLotusLeafs[i].conText){
leaf.removeChild(this.smallLotusLeafs[i].conText);
hlLeaf.removeChild(this.smallLotusLeafs[i].conText);
this.smallLotusLeafs[i].conText = null;
}
if(this.smallLotusLeafs[i].conPic){
leaf.removeChild(this.smallLotusLeafs[i].conPic);
hlLeaf.removeChild(this.smallLotusLeafs[i].conPic);
this.smallLotusLeafs[i].conPic = null;
}
let content = contents[i];
this.smallLotusLeafs[i].audioUrl = content.audio_url;
//重新设置显示内容
this.setContent(content, leaf, hlLeaf, this.smallLotusLeafs[i]);
}
this.playGame();
}
}
const res = [
// ['bg', "assets/play/bg.jpg"],
['btn_left', "assets/play/btn_left.png"],
['btn_right', "assets/play/btn_right.png"],
// ['text_bg', "assets/play/text_bg.png"],
['bg', "assets/play/bg.png"],
['start', "assets/play/start.png"],
['restart', "assets/play/restart.png"],
['l_wave', "assets/play/l_wave.png"],
['r_wave', "assets/play/r_wave.png"],
['b_leaf_wave', "assets/play/b_leaf_wave.png"],
['b_lotus_leaf', "assets/play/b_lotus_leaf.png"],
['b_shadow', "assets/play/b_shadow.png"],
['s_wave', "assets/play/s_wave.png"],
['s_lotus_leaf', "assets/play/s_lotus_leaf.png"],
['s_shadow', "assets/play/s_shadow.png"],
['s_lotus_leaf_light', "assets/play/s_lotus_leaf_light.png"],
['jumped_up', "assets/play/jumped_up.png"],
['droplet', "assets/play/droplet.png"],
['star', "assets/play/star.png"],
['standby-01', "assets/play/frog_standby/standby-01.png"],
['standby-02', "assets/play/frog_standby/standby-02.png"],
['standby-03', "assets/play/frog_standby/standby-03.png"],
['standby-04', "assets/play/frog_standby/standby-04.png"],
['standby-05', "assets/play/frog_standby/standby-05.png"],
['standby-06', "assets/play/frog_standby/standby-06.png"],
['standby-07', "assets/play/frog_standby/standby-07.png"],
['standby-08', "assets/play/frog_standby/standby-08.png"],
['standby-09', "assets/play/frog_standby/standby-09.png"],
['standby-10', "assets/play/frog_standby/standby-10.png"],
['standby-11', "assets/play/frog_standby/standby-11.png"],
['standby-12', "assets/play/frog_standby/standby-12.png"],
['standby-13', "assets/play/frog_standby/standby-13.png"],
['standby-14', "assets/play/frog_standby/standby-14.png"],
['standby-15', "assets/play/frog_standby/standby-15.png"],
['standby-16', "assets/play/frog_standby/standby-16.png"],
['standby-17', "assets/play/frog_standby/standby-17.png"],
['standby-18', "assets/play/frog_standby/standby-18.png"],
['standby-19', "assets/play/frog_standby/standby-19.png"],
['standby-20', "assets/play/frog_standby/standby-20.png"],
['standby-21', "assets/play/frog_standby/standby-21.png"],
['standby-22', "assets/play/frog_standby/standby-22.png"],
['standby-23', "assets/play/frog_standby/standby-23.png"],
['standby-24', "assets/play/frog_standby/standby-24.png"],
['standby-25', "assets/play/frog_standby/standby-25.png"],
['standby-26', "assets/play/frog_standby/standby-26.png"],
['standby-27', "assets/play/frog_standby/standby-27.png"],
['standby-28', "assets/play/frog_standby/standby-28.png"],
['petal_1', "assets/play/petal_1.png"],
['petal_2', "assets/play/petal_2.png"],
['petal_3', "assets/play/petal_3.png"],
['petal_4', "assets/play/petal_4.png"],
['petal_5', "assets/play/petal_5.png"],
['petal_6', "assets/play/petal_6.png"],
['petal_7', "assets/play/petal_7.png"],
['petal_8', "assets/play/petal_8.png"],
['petal_9', "assets/play/petal_9.png"]
];
......@@ -12,7 +62,10 @@ const res = [
const resAudio = [
['click', "assets/play/music/click.mp3"],
['croak', "assets/play/music/croak.mp3"],
['handclap', "assets/play/music/handclap.mp3"],
['jump', "assets/play/music/jump.mp3"],
['showContent', "assets/play/music/showContent.mp3"]
];
export {res, resAudio};
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