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 style="position: absolute; left: 200px; top: 100px; width: 800px;">
<input type="text" nz-input [(ngModel)]="item.text" (blur)="save()">
<app-upload-image-with-preview
[picUrl]="item.pic_url"
(imageUploaded)="onImageUploadSuccess($event, '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>
</div> </div>
<div nz-form>
</div> <nz-form-item>
<nz-form-control [nzSpan]="15" nzOffset="3">
\ No newline at end of file
<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 >
<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
style="width: 100%"
[picUrl]="data.pic_url"
(imageUploaded)="onImageUploadSuccess($event, data, 'pic_url')"
></app-upload-image-with-preview>
</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" [disabled]="item.exercises.length &lt;= 2 ? true : false" (click)="delExercisesItem(j)">
<span>删除</span>
</button>
</nz-form-item>
</div>
</div>
</div>
</nz-form-control>
</nz-form-item>
</div>
</div>
\ 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,7 +50,24 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -50,7 +50,24 @@ 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,19 +75,19 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -58,19 +75,19 @@ 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();
} }
/** /**
* 储存音频数据 * 储存音频数据
* @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
This diff is collapsed.
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 diff is collapsed.
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