Commit 903276d7 authored by 范雪寒's avatar 范雪寒
parents a6f8e6e0 6aa3d128
......@@ -128,5 +128,8 @@
}
}
},
"defaultProject": "ng-template-generator"
"defaultProject": "ng-template-generator",
"cli": {
"analytics": "13fe2fd7-277c-409d-bfc5-8c084b10cab6"
}
}
\ No newline at end of file
This diff is collapsed.
......@@ -675,7 +675,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
showItemPic(item) {
item.pic.visible = true;
item.itemType = 'pic';
this.showArrowTop(item)
this.showArrowTop(item, true)
}
showItemLabel(item) {
......@@ -1718,10 +1718,10 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
if (item.lineDashFlag && this.checkClickTarget(item.arrow)) {
this.changeItemSize(item);
// } else if (item.lineDashFlag && this.checkClickTarget(item.arrowTop)) {
// this.changeItemTopSize(item);
// } else if (item.lineDashFlag && this.checkClickTarget(item.arrowRight)) {
// this.changeItemRightSize(item);
} else if (item.lineDashFlag && this.checkClickTarget(item.arrowTop)) {
this.changeItemTopSize(item);
} else if (item.lineDashFlag && this.checkClickTarget(item.arrowRight)) {
this.changeItemRightSize(item);
} else {
this.changeCurItem(item);
}
......
<div class="position-relative">
<button nz-button (click)="setAnimaBtnClick()" style=" border-radius: 0.5rem; border: 1px solid #ddd;">
<button nz-button (click)="setAnimaBtnClick()" style=" border-radius: 0.5rem; border: 1px solid #ddd;" >
<i nz-icon nzType="tool" nzTheme="outline"></i>
{{btnName}}
</button>
<!--配置龙骨面板-->
<nz-modal [(nzVisible)]="animaPanelVisible" (nzAfterClose)="closePanel()" nzTitle="配置资源文件"
(nzOnCancel)="animaPanelCancel()" (nzOnOk)="animaPanelOk()" nzOkText="保存">
<nz-modal [(nzVisible)]="animaPanelVisible" (nzAfterClose)="closePanel()" nzTitle="配置资源文件" (nzOnCancel)="animaPanelCancel()" (nzOnOk)="animaPanelOk()" nzOkText="保存">
<div class="anima-upload-btn">
<span style="margin-right: 10px">上传 ske_json 文件: </span>
<nz-upload [nzShowUploadList]="false" nzAccept="application/json" [nzAction]="uploadUrl" [nzData]="uploadData"
<nz-upload [nzShowUploadList]="false"
nzAccept="application/json"
[nzAction]="uploadUrl"
[nzData]="uploadData"
(nzChange)="skeJsonHandleChange($event)">
<button nz-button><i nz-icon nzType="upload"></i><span>Upload</span></button>
</nz-upload>
......@@ -23,7 +25,10 @@
<div class="anima-upload-btn">
<span style="margin-right: 10px">上传 tex_json 文件: </span>
<nz-upload [nzShowUploadList]="false" nzAccept="application/json" [nzAction]="uploadUrl" [nzData]="uploadData"
<nz-upload [nzShowUploadList]="false"
nzAccept="application/json"
[nzAction]="uploadUrl"
[nzData]="uploadData"
(nzChange)="texJsonHandleChange($event)">
<button nz-button><i nz-icon nzType="upload"></i><span>Upload</span></button>
</nz-upload>
......@@ -33,7 +38,10 @@
<div class="anima-upload-btn">
<span style="margin-right: 10px">上传 tex_png 文件: </span>
<nz-upload [nzShowUploadList]="false" nzAccept="image/*" [nzAction]="uploadUrl" [nzData]="uploadData"
<nz-upload [nzShowUploadList]="false"
nzAccept = "image/*"
[nzAction]="uploadUrl"
[nzData]="uploadData"
(nzChange)="texPngHandleChange($event)">
<button nz-button><i nz-icon nzType="upload"></i><span>Upload</span></button>
</nz-upload>
......@@ -48,3 +56,5 @@
</nz-modal>
</div>
export const defaultData = {
bookPages: [{
pageIdx: 1, // 第几页
startAudio: 'http://xxxx.mp3', // 页码引导音频
startBg: 'http://xxxx.jpg', // 页码背景图片
scanImg: 'http://xxxx.jpg', // 页码扫描图片
bgItem: {
guidAudio: 'http://xxxx.mp3', // 热区引导音频
guidBg: 'http://xxxx.jpg', // 热区背景图片
},
hotZoneArr: [{ // 数组顺序
rect: { x: 0, y: 0, width: 100, height: 100 },
}, { // 数组顺序
rect: { x: 0, y: 0, width: 100, height: 100 },
}]
}]
}
\ No newline at end of file
<div class="model-content">
<div style="padding: 10px;">
<div style="margin-top: 5px">
<span>开始音频: </span>
<app-audio-recorder
[audioUrl]="item.begin_audio"
(audioUploaded)="onAudioUploadSuccess($event, 'begin_audio')"
></app-audio-recorder>
</div>
<div style="margin-top: 5px">
<span>区分时间点: </span>
<nz-input-number
(nzBlur)="setBeginSepTime()"
[(ngModel)]="item.begin_sep_time"
[nzStep]="1"></nz-input-number>
</div>
<div style="margin-top: 5px">
<span>做题引导音频: </span>
<app-audio-recorder
[audioUrl]="item.guide_audio"
(audioUploaded)="onAudioUploadSuccess($event, 'guide_audio')"
></app-audio-recorder>
</div>
<div style="margin-top: 5px">
<span>背景循环音频: </span>
<app-audio-recorder
[audioUrl]="item.playing_audio"
(audioUploaded)="onAudioUploadSuccess($event, 'playing_audio')"
></app-audio-recorder>
</div>
<!-- <div style="margin-top: 5px">-->
<!-- <span>做题引导音频: </span>-->
<!-- <app-audio-recorder-->
<!-- [audioUrl]="item.guide_audio"-->
<!-- (audioUploaded)="onAudioUploadSuccess($event, 'guide_audio')"-->
<!-- ></app-audio-recorder>-->
<!-- </div>-->
<div style="margin-top: 5px">
<span>正确提示音: </span>
<app-audio-recorder
[audioUrl]="item.right_audio"
(audioUploaded)="onAudioUploadSuccess($event, 'right_audio')"
></app-audio-recorder>
<div style="text-align: center;">
<div style="margin-top: 20px; margin-bottom: 20px;">
<app-upload-dragon-bone
[btnName]=animaBtnName
[skeJsonData]=data.skeJsonData
[texJsonData]=data.texJsonData
[texPngData]=data.texPngData
(save)="saveAnima($event, data)"
(refreshEmitter)="refresh()"
>
</app-upload-dragon-bone>
</div>
<div style="margin-top: 5px">
<span>默认错误提示音: </span>
<app-audio-recorder
[audioUrl]="item.wrong_audio"
(audioUploaded)="onAudioUploadSuccess($event, 'wrong_audio')"
></app-audio-recorder>
<div>
上传收获的图片: <br>
<app-upload-image-with-preview
style="display: inline-block; width: 300px; height: 150px;"
[picUrl]="data.havePic"
(imageUploaded)="onImageUploadSuccess($event, 'havePic', data)">
</app-upload-image-with-preview>
</div>
<div style="margin-top: 5px">
<span>错误提示音频1: </span>
<app-audio-recorder
[audioUrl]="item.wrong_audio1"
(audioUploaded)="onAudioUploadSuccess($event, 'wrong_audio1')"
></app-audio-recorder>
</div>
<div style="margin-top: 5px">
<span>错误提示音频2: </span>
<div *ngFor="let item of data.pageArr; let i = index" style="margin: 20px; padding: 20px; border: solid 2px #000; border-radius: 30px;">
<h3 style="text-align: center;">制作索引页{{i+1}}</h3>
<button style="float: right;" nz-button nzType="danger" (click)='deleteItem(i)'>删除</button>
页码:<input type="text" style="width: 200px;" nz-input placeholder="请填写对应书页" [(ngModel)]="item.pageIdx" (blur)="saveItem()" />
<br><br>
<div>
<span>上传书页引导音频: </span> &nbsp;&nbsp;&nbsp;
<app-audio-recorder
[audioUrl]="item.wrong_audio2"
(audioUploaded)="onAudioUploadSuccess($event, 'wrong_audio2')"
style="display: inline-block;"
[audioUrl]="item.startAudio"
(audioUploaded)="onAudioUploadSuccess($event, 'startAudio', item)"
></app-audio-recorder>
</div>
<div style="margin-top: 5px">
<span>结尾音频: </span>
<app-audio-recorder
[audioUrl]="item.end_audio"
(audioUploaded)="onAudioUploadSuccess($event, 'end_audio')"
></app-audio-recorder>
<br>
<div>
上传书页背景图: <br>
<app-upload-image-with-preview
style="display: inline-block; width: 300px; height: 150px;"
[picUrl]="item.startBg"
(imageUploaded)="onImageUploadSuccess($event, 'startBg', item)">
</app-upload-image-with-preview>
</div>
<h2>热区配置:</h2>
<br><br>
<span>配置书页: </span>
<app-custom-hot-zone
[bgItem]="item.bgItem"
[hotZoneItemArr]="item.hotZoneItemArr"
[customTypeGroupArr]="customTypeGroupArr"
(save)="saveHotZone(item, $event)"
>
</app-custom-hot-zone>
<!--
<div style="width: 300px;" align='center'>
<span>图1: </span>
<app-upload-image-with-preview
[picUrl]="item.pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url')">
</app-upload-image-with-preview>
</div>
<div style="width: 300px; margin-top: 5px;" align='center'>
<span>图2: </span>
<app-upload-image-with-preview
[picUrl]="item.pic_url_2"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url_2')">
</app-upload-image-with-preview>
</div>
<div style="width: 300px; margin-top: 15px;">
<span>文本: </span>
<input type="text" nz-input [(ngModel)]="item.text" (blur)="save()">
</div>
<div style="margin-top: 5px">
<span>音频: </span>
<app-audio-recorder
[audioUrl]="item.audio_url"
(audioUploaded)="onAudioUploadSuccess($event, 'audio_url')"
></app-audio-recorder>
<br>
<div style="text-align: center;">
<button nz-button nzType="primary" (click)='addItem()'>添加书页</button>
</div>
-->
</div>
<br><br>
</div>
......@@ -8,88 +8,82 @@ import { JsonPipe } from '@angular/common';
styleUrls: ['./form.component.css']
})
export class FormComponent implements OnInit, OnChanges, OnDestroy {
// 储存数据用
saveKey = 'test_op15';
saveKey = 'ng_game_select';
// 储存对象
item;
data;
customTypeGroupArr = [
{
name: '交互动画',
anima: true,
audio: true,
// pic: true,
rect: true,
// text: true,
// isShowPos: true,
// isCopy: true,
animaBtnName = '上传龙骨动画';
animaNames = ['normal', 'wrong'];
label: '开始提示时间点',
},
{
name: '显示动画',
anima: true,
// audio: true,
// pic: true,
// rect: true,
// text: true,
// isShowPos: true,
// isCopy: true,
// label: '开始提示时间点',
},
customTypeGroupArr = [
{
name: '图片',
name: '热区',
// anima: true,
// audio: true,
pic: true,
audio: true,
// pic: true,
rect: true,
// text: true,
// isShowPos: true,
// isCopy: true,
// label: '开始提示时间点',
},
];
saveHotZone(group, e) {
constructor(private appRef: ApplicationRef, private changeDetectorRef: ChangeDetectorRef) {
}
saveHotZone(item, e) {
console.log('e: ', e);
const {bgItem, hotZoneItemArr} = e;
group.bgItem = bgItem;
group.hotZoneItemArr = hotZoneItemArr;
item.bgItem = bgItem;
item.hotZoneItemArr = hotZoneItemArr;
item.scanImg = bgItem.url;
this.save();
}
constructor(private appRef: ApplicationRef, private changeDetectorRef: ChangeDetectorRef) {
addItem () {
this.data.pageArr.push({});
}
saveItem() {
this.save();
}
createShell() {
this.item.wordList.push({
word: '',
audio: '',
backWord: '',
backWordAudio: '',
});
deleteItem(index) {
if (index !== -1) {
this.data.pageArr.splice(index, 1);
this.save();
}
}
removeShell(idx) {
this.item.wordList.splice(idx, 1);
saveAnima(e, group) {
console.log('e:', e);
group.skeJsonData = e.skeJsonData;
group.texJsonData = e.texJsonData;
group.texPngData = e.texPngData;
this.save();
}
ngOnInit() {
this.item = {};
this.data = {
havePic: "",
skeJsonData: {},
texJsonData: {},
texPngData: {},
pageArr: [],
};
// 获取存储的数据
(<any>window).courseware.getData((data) => {
if (data) {
this.item = data;
this.data = data;
}
this.init();
......@@ -107,40 +101,33 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
}
init() {
if (!this.data.skeJsonData) {
this.data.skeJsonData = null;
}
if (!this.data.texJsonData) {
this.data.texJsonData = null;
}
if (!this.data.texPngData) {
this.data.texPngData = null;
}
if (!this.data.havePic) {
this.data.havePic = "";
}
if (!this.data.pageArr) {
this.data.pageArr = [];
}
/**
* 储存图片数据
* @param e
*/
onImageUploadSuccess(e, key) {
this.item[key] = e.url;
this.save();
}
/**
* 储存音频数据
* @param e
*/
onAudioUploadSuccess(e, key) {
this.item[key] = e.url;
this.save();
}
setBeginSepTime() {
this.save();
}
onWordAudioUploadSuccess(e, idx) {
this.item.wordList[idx].audio = e.url;
onAudioUploadSuccess(e, key, item) {
item[key] = e.url;
this.save();
}
onBackWordAudioUploadSuccess(e, idx) {
this.item.wordList[idx].backWordAudio = e.url;
onImageUploadSuccess(e, key, item) {
item[key] = e.url;
this.save();
}
......@@ -148,10 +135,9 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存数据
*/
save() {
(<any>window).courseware.setData(this.item, null, this.saveKey);
(<any>window).courseware.setData(this.data, null, this.saveKey);
this.refresh();
console.log('this.item = ' + JSON.stringify(this.item));
console.log('this.pageArr = ' + JSON.stringify(this.data));
}
/**
......
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