Commit bff9d52f authored by Chen Jiping's avatar Chen Jiping

完善

parent 7b9a904b
...@@ -128,5 +128,8 @@ ...@@ -128,5 +128,8 @@
} }
} }
}, },
"defaultProject": "ng-template-generator" "defaultProject": "ng-template-generator",
"cli": {
"analytics": "8d68f3f0-a62a-4e4a-b60b-30f1986bfcc1"
}
} }
\ No newline at end of file
<div class="model-content"> <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 style="position: absolute; left: 200px; top: 100px; width: 800px;"> <nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="exercises">练习题内容</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" [disabled]="item.exercises.length == 5 ? true : false" class="add-btn" id="add-btn"
(click)="addExercisesItem()">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
<div >
<input type="text" nz-input [(ngModel)]="item.text" (blur)="save()">
<div *ngFor="let data of item.exercises;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}}.text">文本</nz-form-label>
<nz-form-control [nzSpan]="6">
<input nz-input type="text" id="{{j}}.text" placeholder="请录入内容" [(ngModel)]="data.text" (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 <app-upload-image-with-preview
[picUrl]="item.pic_url" style="width: 100%"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url')" [picUrl]="data.pic_url"
(imageUploaded)="onImageUploadSuccess($event, data, 'pic_url')"
></app-upload-image-with-preview> ></app-upload-image-with-preview>
</nz-form-control>
<app-audio-recorder </nz-form-item>
[audioUrl]="item.audio_url" </div>
(audioUploaded)="onAudioUploadSuccess($event, 'audio_url')" <nz-form-item>
></app-audio-recorder> <nz-form-label [nzSpan]="6" nzFor="{{j}}.pic_url">音频</nz-form-label>
<app-custom-hot-zone></app-custom-hot-zone> <nz-form-control [nzSpan]="6">
<app-upload-video></app-upload-video> <app-audio-recorder id="{{j}}.audio_url"
<app-lesson-title-config></app-lesson-title-config> [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" [disabled]="item.exercises.length &lt;= 2 ? true : false" (click)="delExercisesItem(j)">
<span>删除</span>
</button>
</nz-form-item>
</div> </div>
</div>
</div>
</nz-form-control>
</nz-form-item>
</div>
</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 ...@@ -10,7 +10,7 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap
export class FormComponent implements OnInit, OnChanges, OnDestroy { export class FormComponent implements OnInit, OnChanges, OnDestroy {
// 储存数据用 // 储存数据用
saveKey = "test_0011"; saveKey = "DF-L208";
// 储存对象 // 储存对象
item; item;
...@@ -50,6 +50,23 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -50,6 +50,23 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
init() { init() {
if(!this.item.exercises){
this.item.exercises = [];
}
let length = this.item.exercises.length;
//不足两个,添加默认值
for(let i = 0; i < 2 - length; ++ i){
let exercises = this.getDefaultExercisesItem();
this.item.exercises.push(exercises);
}
} }
...@@ -58,9 +75,9 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -58,9 +75,9 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存图片数据 * 储存图片数据
* @param e * @param e
*/ */
onImageUploadSuccess(e, key) { onImageUploadSuccess(e, item, key) {
this.item[key] = e.url; item[key] = e.url;
this.save(); this.save();
} }
...@@ -68,9 +85,9 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -68,9 +85,9 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存音频数据 * 储存音频数据
* @param e * @param e
*/ */
onAudioUploadSuccess(e, key) { onAudioUploadSuccess(e, item, key) {
this.item[key] = e.url; item[key] = e.url;
this.save(); this.save();
} }
...@@ -93,5 +110,53 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -93,5 +110,53 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
}, 1); }, 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 = {
contentType:"T",
text:"",
pic_url:"",
audio_url:""
}
return exercises;
}
setContentType(e, item){
item['contentType'] = e;
if("T" == e){
item['pic_url'] = "";
}
else if("P" == e){
item['text'] = "";
}
this.save();
}
} }
import {
ShapeRect,
MySprite
} from './Unit';
export class Exercises{
/**正面 */
front: MySprite;
/**发光 */
light: MySprite;
/**背面 */
back: MySprite;
/**基板 */
baseboard: ShapeRect;
/**当前显示:0-背面,1-正面 */
curShow = '0';
/**当前练习题顺序 */
index = 0;
/**显示亮光 */
lightShow = true;
audioUrl: string;
/**内容类型:T-文本,P-图片;默认为文本 */
contentType : 'T';
/**内容 */
contentSprite : MySprite;
/**
* 重置内容
*/
resetContent(){
this.curShow = '0';
this.lightShow = true;
this.audioUrl = '';
}
}
\ No newline at end of file
export class FloorInfo{
nextFloor = 0;
num = 0;
floors = [];
addFloor(startY : number, cardX){
this.floors.push({
startY : startY,
cardX : cardX
});
this.num = this.floors.length;
}
getNum(){
return this.num;
}
getTopFloor(){
if(this.floors.length > 0){
return this.floors[this.num - 1];
}
return null;
}
}
\ No newline at end of file
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 parWidth
* @param parHeight
* @param label
*/
export function setRectFontSize(parWidth : number, parHeight : number,label: Label){
if(!label){
return;
}
let w = label.width;
let scaleX = w / parWidth;
let h = label.height;
let scaleY = h / parHeight;
//console.log('sacle x:', scaleX, 'sacle y:', scaleY);
//如果宽度比高度的比例小,则按高度进行字体处理
if(scaleX < scaleY){
//如果高度超过,则缩小字体
if(h > parHeight){
shrinkRectFont(parWidth, parHeight, label);
}
else{
magnifyingRectFontSize(parWidth, parHeight, label);
}
}
else{
//如果高度超过,则缩小字体
if(w > parWidth){
shrinkRectFont(parWidth, parHeight, label);
}
else{
magnifyingRectFontSize(parWidth, parHeight, label);
}
}
}
export function shrinkRectFont(parWidth : number, parHeight : number, label: Label){
if(!label){
return;
}
let w = label.width;
let scaleX = w / parWidth;
let h = label.height;
let scaleY = h / parHeight;
let flag = false;
//如果宽度比高度的比例小,则按高度进行字体处理
if(scaleX < scaleY){
//如果高度超过,则缩小字体
if(h > parHeight){
flag = true;
}
}
else{
//如果宽度超过,则缩小字体
if(w > parWidth){
flag = true;
}
}
//如果超过,则继续缩小字体
if(flag){
let fontSize = label.fontSize;
fontSize = fontSize - 1;
label.fontSize = fontSize;
label.refreshSize();
shrinkRectFont(parWidth, parHeight, label);
}
}
export function magnifyingRectFontSize(parWidth : number, parHeight : number, label: Label){
if(!label){
return;
}
let w = label.width;
let scaleX = w / parWidth;
let h = label.height;
let scaleY = h / parHeight;
let flag = false;
//如果宽度比高度的比例小,则按高度进行字体处理
if(scaleX < scaleY){
//如果高度超过,则缩小字体
if(h < parHeight){
flag = true;
}
}
else{
//如果宽度超过,则放大字体
if(w < parWidth){
flag = true;
}
}
//如果超过,则继续放大字体
if(flag){
let fontSize = label.fontSize;
fontSize = fontSize + 1;
label.fontSize = fontSize;
label.refreshSize();
magnifyingRectFontSize(parWidth, parHeight, 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
import {Component, ElementRef, ViewChild, OnInit, Input, OnDestroy, HostListener} from '@angular/core'; import { Component, ElementRef, ViewChild, OnInit, Input, OnDestroy, HostListener } from '@angular/core';
import { import {
Label, Label,
MySprite, tweenChange, MySprite, tweenChange,
ShapeRect, randomSortByArr, rotateItem, moveItem, removeItemFromArr
} from './Unit'; } from './Unit';
import {res, resAudio} from './resources'; import { res, resAudio } from './resources';
import {Subject} from 'rxjs'; import { Subject } from 'rxjs';
import {debounceTime} from 'rxjs/operators'; import { debounceTime } from 'rxjs/operators';
import TWEEN from '@tweenjs/tween.js'; import TWEEN from '@tweenjs/tween.js';
import {
setRectFontSize,
getRandomItemFromArr
} from './MyUtil';
import {
FloorInfo
} from './FloorInfo';
import {
Exercises
} from './Exercises';
import { constants } from 'buffer';
@Component({ @Component({
selector: 'app-play', selector: 'app-play',
...@@ -22,8 +34,8 @@ import TWEEN from '@tweenjs/tween.js'; ...@@ -22,8 +34,8 @@ import TWEEN from '@tweenjs/tween.js';
}) })
export class PlayComponent implements OnInit, OnDestroy { export class PlayComponent implements OnInit, OnDestroy {
@ViewChild('canvas', {static: true }) canvas: ElementRef; @ViewChild('canvas', { static: true }) canvas: ElementRef;
@ViewChild('wrap', {static: true }) wrap: ElementRef; @ViewChild('wrap', { static: true }) wrap: ElementRef;
// 数据 // 数据
data; data;
...@@ -51,23 +63,58 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -51,23 +63,58 @@ export class PlayComponent implements OnInit, OnDestroy {
audioObj = {}; audioObj = {};
renderArr; renderArr = [];
endRenderArr = [];
mapScale = 1; mapScale = 1;
canvasLeft; canvasLeft;
canvasTop; canvasTop;
saveKey = 'test_0011'; saveKey = 'DF-L208';
canTouch = true;
btnLeft; canPlay = false;
btnRight;
pic1;
pic2;
canTouch = true; canClickMonkey = false;
showPetalStatus = false;
/**背景图片 */
bg;
btnStart;
btnRestart;
/**桃子 */
peach;
/**楼层信息 */
floorInfo
curPic; /**练习题 */
exercisesArr = [];
/**左边猴子 */
leftMonkey;
/**右边猴子 */
rightMonkey;
/**绳子挂卡片的坐标 */
cardXArr = [];
/**遮罩层 */
cover;
/**大桃子 */
bigPeach;
/**背景光 */
bigLight;
@HostListener('window:resize', ['$event']) @HostListener('window:resize', ['$event'])
onResize(event) { onResize(event) {
...@@ -80,13 +127,13 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -80,13 +127,13 @@ export class PlayComponent implements OnInit, OnDestroy {
this.data = {}; this.data = {};
// 获取数据 // 获取数据
const getData = (<any> window).courseware.getData; const getData = (<any>window).courseware.getData;
getData((data) => { getData((data) => {
if (data && typeof data == 'object') { if (data && typeof data == 'object') {
this.data = data; this.data = data;
} }
// console.log('data:' , data); console.log('data:', data);
// 初始化 各事件监听 // 初始化 各事件监听
this.initListener(); this.initListener();
...@@ -432,10 +479,44 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -432,10 +479,44 @@ export class PlayComponent implements OnInit, OnDestroy {
*/ */
initDefaultData() { initDefaultData() {
if (!this.data.pic_url) { if (!this.data.exercises) {
this.data.pic_url = 'assets/play/default/pic.jpg';
this.data.pic_url_2 = 'assets/play/default/pic.jpg'; this.data.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);
}
this.data.exercises.push(contentItem);
}
}
}
/**
*
* @param text
* @param pic_url
*/
getDefaultContentItem(text, pic_url) {
let content = {
text: text,
pic_url: pic_url,
audio_url: this.rawAudios.get('click')
} }
return content;
} }
...@@ -444,8 +525,12 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -444,8 +525,12 @@ export class PlayComponent implements OnInit, OnDestroy {
*/ */
initImg() { initImg() {
this.addUrlToImages(this.data.pic_url); for (let i = 0; i < this.data.exercises.length; ++i) {
this.addUrlToImages(this.data.pic_url_2);
let exercises = this.data.exercises[i];
this.addUrlToImages(exercises.pic_url);
}
} }
...@@ -454,12 +539,22 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -454,12 +539,22 @@ export class PlayComponent implements OnInit, OnDestroy {
*/ */
initAudio() { initAudio() {
// 音频资源
this.addUrlToAudioObj(this.data.audio_url);
this.addUrlToAudioObj(this.data.audio_url_2);
// 音效 // 音效
this.addUrlToAudioObj('click', this.rawAudios.get('click'), 0.3); this.addUrlToAudioObj('click', this.rawAudios.get('click'), 0.3);
this.addUrlToAudioObj('peachShow', this.rawAudios.get('peachShow'));
this.addUrlToAudioObj('monkey', this.rawAudios.get('monkey'));
this.addUrlToAudioObj('spring', this.rawAudios.get('spring'));
this.addUrlToAudioObj('win', this.rawAudios.get('win'));
for (let i = 0; i < this.data.exercises.length; ++i) {
let exercises = this.data.exercises[i];
this.addUrlToAudioObj(exercises.audio_url);
}
} }
...@@ -475,14 +570,53 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -475,14 +570,53 @@ export class PlayComponent implements OnInit, OnDestroy {
const s = Math.min(sx, sy); const s = Math.min(sx, sy);
this.mapScale = s; this.mapScale = s;
// this.mapScale = sx; this.canPlay = false;
// this.mapScale = sy;
this.renderArr = []; this.renderArr = [];
this.endRenderArr = [];
this.btnRestart = {};
this.btnStart = {};
this.peach = {};
this.exercisesArr = [];
this.leftMonkey = {};
this.rightMonkey = {};
this.cardXArr = [];
this.bigLight = {};
this.bigPeach = {};
this.showPetalStatus = false;
//绳子X坐标(从下往上)
const initCardX = () => {
//第一根
this.cardXArr.push(this.canvasWidth / 2 - 90 * this.mapScale);
//第二根
this.cardXArr.push(this.canvasWidth / 2 + 110 * this.mapScale);
//第三根
this.cardXArr.push(this.canvasWidth / 2 - 60 * this.mapScale);
//第四根
this.cardXArr.push(this.canvasWidth / 2 + 60 * this.mapScale);
//第五根
this.cardXArr.push(this.canvasWidth / 2);
};
initCardX();
} }
...@@ -493,131 +627,368 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -493,131 +627,368 @@ export class PlayComponent implements OnInit, OnDestroy {
initView() { initView() {
this.initPic(); this.initBackground();
this.initFloorPic();
this.initBottomPart(); this.initBottomPart();
this.initPeachPic();
this.initMonkeyPic();
this.initEndPic();
} }
initBottomPart() { initBottomPart() {
const btnLeft = new MySprite(); const btnStart = new MySprite();
btnLeft.init(this.images.get('btn_left')); btnStart.init(this.images.get('start'));
btnLeft.x = this.canvasWidth - 150 * this.mapScale; btnStart.setScaleXY(this.mapScale);
btnLeft.y = this.canvasHeight - 100 * this.mapScale; btnStart.x = this.canvasWidth - 50 * this.mapScale - btnStart.getBoundingBox().width / 2;
btnStart.y = this.canvasHeight - 100 * this.mapScale;
btnLeft.setScaleXY(this.mapScale); this.renderArr.push(btnStart);
this.renderArr.push(btnLeft); this.btnStart.sprite = btnStart;
}
this.btnLeft = btnLeft; /**
* 初化背景
*/
initBackground() {
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(Math.max(this.canvasWidth / bg_pic.width, this.canvasHeight / bg_pic.height));
this.bg = bg_pic;
const btnRight = new MySprite(); this.renderArr.push(bg_pic);
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() { /**
* 初始化楼层信息
*/
initFloorPic() {
//取练习题
let exercisesArr = this.data.exercises;
const maxW = this.canvasWidth * 0.7; //打乱数组
let newExercisesArr = randomSortByArr(exercisesArr);
const pic1 = new MySprite(); let startY = this.canvasHeight - 100 * this.mapScale;
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); const floorInfo = new FloorInfo();
this.pic1 = pic1;
//初始楼层信息
for (let i = 0; i < this.data.exercises.length; ++i) {
const label1 = new Label(); //绳子图片索引
label1.text = this.data.text; let ropeIndex = 5 - this.data.exercises.length + i + 1;
label1.textAlign = 'center';
label1.fontSize = 50;
label1.fontName = 'BRLNSDB';
label1.fontColor = '#ffffff';
pic1.addChild(label1); floorInfo.addFloor(startY, this.cardXArr[ropeIndex - 1]);
let ropeImgKey = "rope_";
if(this.data.exercises.length == 4){
if(ropeIndex == 5){
ropeImgKey = ropeImgKey + "5_l";
}
else if(ropeIndex == 4){
ropeImgKey = ropeImgKey + "4_l";
}
else{
ropeImgKey = ropeImgKey + ropeIndex;
}
}
else{
ropeImgKey = ropeImgKey + ropeIndex;
}
const rope = new MySprite();
rope.init(this.images.get(ropeImgKey));
rope.setScaleXY(this.bg.scaleY);
rope.x = this.canvasWidth / 2;
rope.y = startY - rope.getBoundingBox().height / 2;
const pic2 = new MySprite(); let exercises = newExercisesArr[i];
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; let floor = floorInfo.floors[i];
this.curPic = pic1; this.initCardPic(exercises, floor, i);
}
this.renderArr.push(rope);
btnLeftClicked() { startY = startY - 118 * this.mapScale;
this.lastPage();
} }
btnRightClicked() { this.floorInfo = floorInfo;
this.nextPage();
} }
lastPage() { /**
* 初始化卡片
*/
initCardPic(exercises, floor, index) {
let cardObj = new Exercises();
cardObj.index = index;
cardObj.audioUrl = exercises.audio_url;
//卡片背面
const cardBack = new MySprite();
cardBack.init(this.images.get("card-bg"));
cardBack.setScaleXY(this.mapScale);
cardBack.alpha = 0;
cardObj.back = cardBack;
const cardBaseboard = new ShapeRect();
cardBaseboard.setSize(cardBack.getBoundingBox().width, cardBack.getBoundingBox().height);
cardBaseboard.alpha = 0;
cardBaseboard.x = floor.cardX - cardBaseboard.getBoundingBox().width / 2;
cardBaseboard.y = floor.startY - 10 * this.mapScale;
cardObj.baseboard = cardBaseboard;
//卡片发光
const cardLight = new MySprite();
cardLight.init(this.images.get("card-light"));
cardLight.setScaleXY(this.mapScale);
cardLight.alpha = 0;
cardLight.x = cardBaseboard.getBoundingBox().width / 2;
cardLight.y = cardBaseboard.getBoundingBox().height / 2;
cardObj.light = cardLight;
cardBaseboard.addChild(cardLight);
cardBack.x = cardLight.x;
cardBack.y = cardLight.y;
cardBaseboard.addChild(cardBack);
//卡片正面
const cardFront = new MySprite();
cardFront.init(this.images.get("card-front"));
cardFront.setScaleXY(this.mapScale);
cardFront.x = cardBack.x;
cardFront.y = cardBack.y;
cardFront.alpha = 0;
cardFront.visible = true;
cardObj.front = cardFront;
cardBaseboard.addChild(cardFront);
//设置内容
this.setContent(exercises, cardFront, cardObj);
cardFront.childDepandAlpha = true;
this.renderArr.push(cardBaseboard);
this.exercisesArr.push(cardObj);
if (this.curPic == this.pic1) {
return;
} }
this.canTouch = false; /**
* 设置内容
*/
setContent(content, parItem, card) {
const moveLen = this.canvasWidth; //图片存在,则渲染图片
tweenChange(this.pic1, {x: this.pic1.x + moveLen}, 1); if (content.pic_url) {
tweenChange(this.pic2, {x: this.pic2.x + moveLen}, 1, () => {
this.canTouch = true;
this.curPic = this.pic1;
});
}
nextPage() { const content_pic = new MySprite();
content_pic.init(this.images.get(content.pic_url));
content_pic.alpha = 0;
if (this.curPic == this.pic2) { let w = content_pic.width;
return;
let h = content_pic.height;
let scale = Math.min((parItem.height - 25 * this.mapScale) / h, (parItem.width - 25 * this.mapScale) / w);
content_pic.setScaleXY(scale);
content_pic.x = 0;
content_pic.y = 0;
parItem.addChild(content_pic);
card.contentType = 'P';
card.contentSprite = content_pic;
} }
else {
let content_val = new Label();
content_val.text = content.text;
content_val.textAlign = 'middle';
content_val.fontSize = 120;
content_val.fontName = "BRLNSDB";
content_val.fontColor = "#A52A2A";
content_val.alpha = 0;
this.canTouch = false; content_val.refreshSize();
const moveLen = this.canvasWidth; setRectFontSize(parItem.width - 25 * this.mapScale, parItem.height - 25 * this.mapScale, content_val);
tweenChange(this.pic1, {x: this.pic1.x - moveLen}, 1);
tweenChange(this.pic2, {x: this.pic2.x - moveLen}, 1, () => { content_val.refreshSize();
this.canTouch = true;
this.curPic = this.pic2; content_val.x = - content_val.getBoundingBox().width / 2 + 5 * this.mapScale;
});
parItem.addChild(content_val);
card.contentType = 'T';
card.contentSprite = content_val;
} }
pic1Clicked() {
this.playAudio(this.data.audio_url);
} }
pic2Clicked() { /**
this.playAudio(this.data.audio_url_2); * 初始化桃子
*/
initPeachPic() {
//桃子发光
const peachLight = new MySprite();
peachLight.init(this.images.get("peach-light"));
peachLight.setScaleXY(this.mapScale);
peachLight.alpha = 0;
peachLight.x = this.canvasWidth / 2;
peachLight.y = this.floorInfo.getTopFloor().startY - peachLight.getBoundingBox().height / 2 - 15 * this.mapScale;
//桃子图片
const peach = new MySprite();
peach.init(this.images.get("peach"));
peach.setScaleXY(this.mapScale);
peach.x = 0;
peach.y = 0;
peachLight.addChild(peach);
this.renderArr.push(peachLight);
peach.setScaleXY(0);
this.peach = { light: peachLight, peach: peach, initX: peachLight.x, initY: peachLight.y };
} }
/**
* 初始化猴子
*/
initMonkeyPic() {
const initMonekey = (flag, monkeyObj) => {
//猴子发光
const light = new MySprite();
light.init(this.images.get(flag + "-monkey-light"));
light.setScaleXY(this.mapScale);
light.alpha = 0;
light.x = light.getBoundingBox().width / 2;
light.y = light.getBoundingBox().height / 2;
monkeyObj.light = light;
//猴子底板
const baseboard = new ShapeRect();
baseboard.setSize(light.getBoundingBox().width, light.getBoundingBox().height);
baseboard.alpha = 0;
baseboard.y = this.canvasHeight - baseboard.getBoundingBox().height + 30 * this.mapScale;
monkeyObj.baseboard = baseboard;
monkeyObj.initY = baseboard.y;
baseboard.addChild(light);
//猴子
const monkey = new MySprite();
monkey.init(this.images.get(flag + "-monkey"));
monkey.setScaleXY(this.mapScale);
monkey.x = light.x;
monkey.y = light.y;
monkeyObj.monkey = monkey;
baseboard.addChild(monkey);
//默认为当前楼层
monkeyObj.curFloor = 0;
monkeyObj.flag = flag;
this.renderArr.push(baseboard);
}
//初始化左边猴子
initMonekey('l', this.leftMonkey);
this.leftMonkey.baseboard.x = - this.leftMonkey.baseboard.getBoundingBox().width;
this.leftMonkey.initX = this.leftMonkey.baseboard.x;
//初始化右边猴子
initMonekey('r', this.rightMonkey);
this.rightMonkey.baseboard.x = this.canvasWidth + this.rightMonkey.baseboard.getBoundingBox().width;
this.rightMonkey.initX = this.rightMonkey.baseboard.x;
}
/**
* 初始化结束界面
*/
initEndPic() {
//灰色透明背景
const cover = new ShapeRect();
cover.setSize(this.canvasWidth, this.canvasHeight);
cover.fillColor = "#696969";
cover.alpha = 0;
cover.x = 0;
cover.y = 0;
this.endRenderArr.push(cover);
this.cover = cover;
const btnRestart = new MySprite();
btnRestart.init(this.images.get('restart'));
btnRestart.setScaleXY(this.mapScale);
btnRestart.x = this.canvasWidth + btnRestart.getBoundingBox().width / 2;
btnRestart.y = this.btnStart.sprite.y;
this.endRenderArr.push(btnRestart);
this.btnRestart.sprite = btnRestart;
this.btnRestart.showX = this.btnStart.sprite.x;
this.btnRestart.showY = this.btnStart.sprite.y;
this.btnRestart.initX = btnRestart.x;
this.btnRestart.initY = btnRestart.y;
//大桃子背景光
const light = new MySprite();
light.init(this.images.get("light"));
light.setScaleXY(0);
light.x = 0;
light.y = 0;
light.alpha = 0;
this.bigLight.sprite = light;
this.bigLight.initX = light.x;
this.bigLight.initY = light.y;
this.endRenderArr.push(light);
//大桃子图片
const bigPeach = new MySprite();
bigPeach.init(this.images.get("big-peach"));
bigPeach.setScaleXY(0);
bigPeach.alpha = 0;
bigPeach.x = 0;
bigPeach.y = 0;
this.bigPeach.sprite = bigPeach;
this.bigPeach.initX = bigPeach.x;
this.bigPeach.initY = bigPeach.y;
this.endRenderArr.push(bigPeach);
}
mapDown(event) { mapDown(event) {
...@@ -625,34 +996,229 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -625,34 +996,229 @@ export class PlayComponent implements OnInit, OnDestroy {
return; return;
} }
if ( this.checkClickTarget(this.btnLeft) ) { if (this.checkClickTarget(this.btnStart.sprite)) {
this.btnLeftClicked();
this.playAudio('click');
this.btnStart.keyDown = true;
this.btnStart.sprite.setScaleXY(this.mapScale * 1.3);
return;
}
if (this.checkClickTarget(this.btnRestart.sprite)) {
this.playAudio('click');
this.btnRestart.keyDown = true;
this.btnRestart.sprite.setScaleXY(this.mapScale * 1.3);
return; return;
} }
if ( this.checkClickTarget(this.btnRight) ) { if (this.canPlay) {
this.btnRightClicked();
if (this.checkClickTarget(this.leftMonkey.baseboard)) {
this.clickLeftMonkey();
return; return;
} }
if ( this.checkClickTarget(this.pic1) ) { if (this.checkClickTarget(this.rightMonkey.baseboard)) {
this.pic1Clicked();
this.clickRightMonkey();
return; return;
} }
if ( this.checkClickTarget(this.pic2) ) { for (let i = 0; i < this.exercisesArr.length; ++i) {
this.pic2Clicked();
let exercises = this.exercisesArr[i];
if (this.checkClickTarget(exercises.baseboard)) {
this.clickCard(exercises);
return; return;
} }
} }
}
}
/**
* 点击卡片
* @param card
*/
clickCard(card) {
//停止闪烁
card.lightShow = false;
card.light.alpha = 0;
//停止闪烁
this.stopLightMonkey();
//显示背面,则翻转
if (card.curShow == '0') {
this.overCard(card.baseboard, () => {
this.canClickMonkey = true;
});
//设置卡片已翻面
card.curShow = '1';
this.startLightMonkey();
//将楼层指向下一层
this.floorInfo.nextFloor = card.index + 1;
//卡片未到顶部,则将下一个卡片点亮
if (card.index < this.exercisesArr.length - 1) {
this.lightCard(this.exercisesArr[card.index + 1]);
}
else {
this.peach.canRotate = true;
this.rotatePeach();
this.lightPeach();
}
}
else {
this.playAudio(card.audioUrl);
}
}
/**
* 点击左边猴子
*/
clickLeftMonkey() {
this.clickMonkey(this.leftMonkey);
}
/**
* 点击右边猴子
*/
clickRightMonkey() {
this.clickMonkey(this.rightMonkey);
}
/**
* 点击猴子
* @param monkey
*/
clickMonkey(monkey) {
if (!this.canClickMonkey) {
return;
}
//停止闪烁
this.stopLightMonkey();
//停止旋转
this.peach.canRotate = false;
this.peach.light.alpha = 0;
this.canClickMonkey = false;
//如果未达到顶部,则往上移动
if (monkey.curFloor < this.exercisesArr.length - 1) {
if (monkey.curFloor < this.floorInfo.nextFloor) {
let floor = this.floorInfo.floors[monkey.curFloor + 1];
//移动到下一层
tweenChange(monkey.baseboard, { y: floor.startY - 40 * this.mapScale }, 1, () => {
monkey.curFloor = monkey.curFloor + 1;
console.log('monkey cur floor', monkey.curFloor);
this.canClickMonkey = true;
});
}
}
else {
let toX = this.peach.initX - monkey.baseboard.getBoundingBox().width / 2;
let toY = this.peach.initY - monkey.baseboard.getBoundingBox().height / 2 + 30 * this.mapScale;
//达到最顶层,当前游戏结束
this.jump(monkey, toX, toY, 0.5, () => {
//猴子向上离开界面
this.monkeyLeave();
//桃子带着离开界面
let toY = - this.peach.light.getBoundingBox().height;
tweenChange(this.peach.light, { y: toY }, 0.3, () => {
//显示结束画面
this.showEndPage(monkey.flag);
});
});
}
}
mapMove(event) { mapMove(event) {
} }
mapUp(event) { mapUp(event) {
if (!this.canTouch) {
return;
}
if (this.checkClickTarget(this.btnStart.sprite)) {
//按下松开
if (this.btnStart.keyDown = true) {
this.btnStart.keyDown = false;
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.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();
});
}
}
} }
...@@ -671,9 +1237,509 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -671,9 +1237,509 @@ export class PlayComponent implements OnInit, OnDestroy {
this.updateArr(this.renderArr); this.updateArr(this.renderArr);
this.updateArr(this.endRenderArr);
}
/**
* 翻卡片
* @param item
* @param callback
*/
overCard(item, callback?: any) {
this.playAudio('spring');
let w = this.mapScale;
tweenChange(item.children[2], { scaleX: 0 }, 0.3, () => {
item.children[3].visible = !item.children[3].visible;
tweenChange(item.children[2], { scaleX: w }, 0.3, () => {
callback && callback();
});
});
}
/**
* 跳跃
* @param monkey
* @param toX
* @param toY
* @param time
* @param callback
*/
jump(monkey, toX, toY, time: number, callback = null) {
let sX = monkey.baseboard.x;
let sY = monkey.baseboard.y;
//计算中间坐标
let mPos = this.getJumpMiddleMap(toX, toY, sX, sY);
tweenChange(monkey.baseboard, { x: mPos.x, y: mPos.y }, time / 2, () => {
tweenChange(monkey.baseboard, { x: toX, y: toY }, time, () => {
if (callback) {
callback();
}
}, null, () => {
});
});
}
/**
* 获取指定位置的中间坐标
* @param toX
* @param toY
* @param sX
* @param sY
*/
getJumpMiddleMap(toX, toY, sX, sY) {
//斜率
let k = (toY - sY) / (toX - sX);
//取得跳出的坐标
let mX = (sX + toX) / 2;
let mY = k * (mX - toX) + toY;
//指定高度
mY = mY - 100 * this.mapScale;
return { x: mX, y: mY };
}
/**
* 点亮卡片
* @param card
*/
lightCard(card) {
if (!card.lightShow) {
return;
}
let alpha = card.light.alpha;
tweenChange(card.light, { alpha: 1 }, 0.4, () => {
tweenChange(card.light, { alpha: 0 }, 0.4, () => {
setTimeout(() => {
this.lightCard(card);
}, 700);
});
});
}
/**
* 猴子开始闪烁
*/
startLightMonkey() {
//已经闪烁,不重复触发
if(!this.leftMonkey.stopLight){
return;
}
this.leftMonkey.stopLight = false;
this.lightMonkey(this.leftMonkey);
//已经闪烁,不重复触发
if(!this.rightMonkey.stopLight){
return;
}
this.rightMonkey.stopLight = false;
this.lightMonkey(this.rightMonkey);
}
/**
* 点亮猴子
* @param monkey
*/
lightMonkey(monkey) {
if (monkey.stopLight) {
return;
}
let alpha = monkey.light.alpha;
tweenChange(monkey.light, { alpha: 1 }, 0.5, () => {
tweenChange(monkey.light, { alpha: 0 }, 0.5, () => {
this.lightMonkey(monkey);
});
});
}
/**
* 停止闪烁
*/
stopLightMonkey() {
this.leftMonkey.stopLight = true;
this.rightMonkey.stopLight = true;
}
/**
* 猴子离开界面
*/
monkeyLeave() {
const leave = (monkey) => {
let toY = - this.leftMonkey.baseboard.getBoundingBox().height;
tweenChange(monkey.baseboard, { y: toY }, 0.3);
}
leave(this.leftMonkey);
leave(this.rightMonkey);
}
/**
* 点亮桃子
*/
lightPeach() {
//点亮桃子
tweenChange(this.peach.light, { alpha: 1 }, 0.1);
}
/**
* 旋转桃子
*/
rotatePeach() {
const rotate4 = () => {
rotateItem(this.peach.light, 0, 0.4, () => {
if (this.peach.canRotate) {
setTimeout(() => {
rotate1();
}, 0.4);
}
});
};
const rotate3 = () => {
rotateItem(this.peach.light, -30, 0.4, () => {
rotate4();
});
};
const rotate2 = () => {
rotateItem(this.peach.light, 0, 0.4, () => {
rotate3();
});
};
const rotate1 = () => {
rotateItem(this.peach.light, 30, 0.4, () => {
rotate2();
});
};
rotate1();
}
/**
* 开始玩游戏
*/
playGame() {
this.playAudio('peachShow');
//桃子显示并放大
tweenChange(this.peach.peach, { scaleX: this.mapScale * 1.2, scaleY: this.mapScale * 1.2, alpha: 1 }, 0.3, () => {
//缩回正常尺寸
tweenChange(this.peach.peach, { scaleX: this.mapScale, scaleY: this.mapScale }, 0.2, () => {
this.peach.light.alpha = 1;
setTimeout(() => {
this.peach.light.alpha = 0;
this.peach.canRotate = true;
}, 300);
});
//显示卡片
for (let i = 0; i < this.exercisesArr.length; ++i) {
let exercises = this.exercisesArr[i];
exercises.front.alpha = 1;
exercises.back.alpha = 1;
if (i == this.exercisesArr.length - 1) {
this.overCard(exercises.baseboard, () => {
this.playAudio('monkey');
this.jump(this.leftMonkey, 300 * this.mapScale, this.leftMonkey.initY, 0.5, () => {
//显示最底层的卡片
this.lightCard(this.exercisesArr[0]);
this.canPlay = true;
this.canClickMonkey = true;
});
this.jump(this.rightMonkey, this.canvasWidth - 300 * this.mapScale - this.rightMonkey.baseboard.getBoundingBox().width, this.rightMonkey.initY, 0.5);
});
}
else {
this.overCard(exercises.baseboard);
}
}
})
}
/**
* 重新开始游戏
*/
restartGame() {
//取练习题
let exercisesArr = this.data.exercises;
//打乱数组
let newExercisesArr = randomSortByArr(exercisesArr);
//卡片隐藏
for (let i = 0; i < this.exercisesArr.length; ++i) {
let card = this.exercisesArr[i];
card.back.alpha = 0;
tweenChange(card.front, { alpha: 0 }, 0.3, () => {
//重置内容
card.resetContent();
let exercises = newExercisesArr[i];
//移除内容
card.front.removeChild(card.contentSprite);
card.contentSprite = null;
card.audioUrl = exercises.audio_url;
//设置内容
this.setContent(exercises, card.front, card);
});
}
const initMonekey = (monkey) => {
//初始化猴子位置
monkey.baseboard.x = monkey.initX;
monkey.baseboard.y = monkey.initY;
monkey.curFloor = 0;
};
//初始化猴子信息
initMonekey(this.leftMonkey);
initMonekey(this.rightMonkey);
//初始楼层下一层索引
this.floorInfo.nextFloor = 0;
//初始化桃子
this.peach.light.alpha = 0;
this.peach.light.x = this.peach.initX;
this.peach.light.y = this.peach.initY;
this.peach.peach.setScaleXY(0);
setTimeout(() => {
this.playGame();
}, 1000);
} }
/**
* 显示结束画面
*/
showEndPage(winner) {
const getShowPos = (winner) => {
let x = 0;
let y = 300;
//r:右侧胜利,l:左侧胜利
if (winner == 'r') {
x = this.canvasWidth - 300 * this.mapScale;
}
else if (winner == 'l') {
x = 300 * this.mapScale;
}
return { x: x, y: y };
};
this.playAudio('win');
//显示灰色半透明背景
tweenChange(this.cover, { alpha: 0.5 }, 0.5);
//显示大桃子
setTimeout(() => {
let pos = getShowPos(winner);
//设置显示坐标
this.bigLight.sprite.x = pos.x;
this.bigLight.sprite.y = pos.y;
this.bigLight.sprite.alpha = 1;
tweenChange(this.bigLight.sprite, { scaleX: this.mapScale, scaleY: this.mapScale }, 0.2, () => {
this.showPetalStatus = true;
this.showPetal(pos);
//1秒后停止撒花
setTimeout(() => {
this.showPetalStatus = false;
}, 800);
this.rotateLight();
//弹出重玩按钮
setTimeout(() => {
//显示重新开始按钮
tweenChange(this.btnRestart.sprite, { x: this.btnRestart.showX, y: this.btnRestart.showY }, 0.3);
}, 2700);
//隐藏大桃子和灯光
setTimeout(() => {
//隐藏桃子
tweenChange(this.bigPeach.sprite, { scaleX: 0, scaleY: 0 }, 0.3);
//隐藏灯光
tweenChange(this.bigLight.sprite, { scaleX: 0, scaleY: 0 }, 0.3);
//隐藏背景
tweenChange(this.cover, { alpha: 0 }, 0.3);
}, 3000);
});
this.bigPeach.sprite.x = pos.x;
this.bigPeach.sprite.y = pos.y;
this.bigPeach.sprite.alpha = 1;
tweenChange(this.bigPeach.sprite, { scaleX: this.mapScale, scaleY: this.mapScale }, 0.2);
}, 300);
}
/**
* 灯光旋转
*/
rotateLight() {
rotateItem(this.bigLight.sprite, 3.3 * 270, 3.3, () => {
});
}
/**
* 显示结束花瓣
* @param pos 花瓣显示位置
*/
showPetal(pos) {
if (!this.showPetalStatus) {
return;
}
const petal = this.getPetal(pos);
this.endRenderArr.push(petal);
let toY = pos.y + this.bigLight.sprite.getBoundingBox().height / 2;
moveItem(petal, petal.x, toY + petal.height * petal.scaleY, petal['time'], () => {
removeItemFromArr(this.endRenderArr, petal);
});
rotateItem(petal, petal['tr'], petal['time']);
setTimeout(() => {
this.showPetal(pos);
}, 100);
}
/**
* 得到花瓣
* @param pos
*/
getPetal(pos) {
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;
let startX = pos.x - this.bigLight.sprite.getBoundingBox().width / 2;
let startY = pos.y - this.bigLight.sprite.getBoundingBox().height / 2;
const randomX = startX + Math.random() * this.bigLight.sprite.getBoundingBox().width;
petal.x = randomX;
const randomY = startY + Math.random() * this.bigLight.sprite.getBoundingBox().height;
petal.y = randomY - 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;
}
} }
const res = [ const res = [
// ['bg', "assets/play/bg.jpg"], ['bg', "assets/play/bg.jpg"],
['btn_left', "assets/play/btn_left.png"], ['start', "assets/play/start.png"],
['btn_right', "assets/play/btn_right.png"], ['restart', "assets/play/restart.png"],
// ['text_bg', "assets/play/text_bg.png"],
['card-bg', "assets/play/card-bg.png"],
['card-front', "assets/play/card-front.png"],
['card-light', "assets/play/card-light.png"],
['light', "assets/play/light.png"],
['l-monkey', "assets/play/l-monkey.png"],
['r-monkey', "assets/play/r-monkey.png"],
['l-monkey-light', "assets/play/l-monkey-light.png"],
['r-monkey-light', "assets/play/r-monkey-light.png"],
['peach', "assets/play/peach.png"],
['peach-light', "assets/play/peach-light.png"],
['big-peach', "assets/play/big-peach.png"],
['rope_5_l', "assets/play/rope_5_l.png"],
['rope_5', "assets/play/rope_5.png"],
['rope_4_l', "assets/play/rope_4_l.png"],
['rope_4', "assets/play/rope_4.png"],
['rope_3', "assets/play/rope_3.png"],
['rope_2', "assets/play/rope_2.png"],
['rope_1', "assets/play/rope_1.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 +43,11 @@ const res = [ ...@@ -12,7 +43,11 @@ const res = [
const resAudio = [ const resAudio = [
['click', "assets/play/music/click.mp3"], ['click', "assets/play/music/click.mp3"],
['peachShow',"assets/play/music/peach_show.mp3"],
['monkey', "assets/play/music/monkey.mp3"],
['spring',"assets/play/music/spring.mp3"],
['win',"assets/play/music/win.mp3"],
['exercisesShow',"assets/play/music/exercises_show.mp3"]
]; ];
export {res, resAudio}; export {res, resAudio};
src/assets/play/bg.jpg

25.8 KB | W: | H:

src/assets/play/bg.jpg

391 KB | W: | H:

src/assets/play/bg.jpg
src/assets/play/bg.jpg
src/assets/play/bg.jpg
src/assets/play/bg.jpg
  • 2-up
  • Swipe
  • Onion skin
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