Commit 5c94e0b4 authored by 李维's avatar 李维

dev commit

parent 5c63c1e3
<nz-form-item> <div class="content-border">
<nz-form-label [nzSpan]="2" >左上</nz-form-label> <nz-form-item>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2" >左上</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.leftTop" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'leftTop')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.leftTop"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'leftTop')"></app-upload-image-with-preview>
<nz-form-label [nzSpan]="2" >中上</nz-form-label> </nz-form-control>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2" >中上</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.middleTop" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'middleTop')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.middleTop"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'middleTop')"></app-upload-image-with-preview>
<nz-form-label [nzSpan]="2" >右上</nz-form-label> </nz-form-control>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2" >右上</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.rightTop" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'rightTop')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.rightTop"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'rightTop')"></app-upload-image-with-preview>
</nz-form-item> </nz-form-control>
<nz-form-item> </nz-form-item>
<nz-form-label [nzSpan]="2" >左中</nz-form-label> <nz-form-item>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2" >左中</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.leftMiddle" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'leftMiddle')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.leftMiddle"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'leftMiddle')"></app-upload-image-with-preview>
<div nz-col nzSpan="8"></div> </nz-form-control>
<nz-form-label [nzSpan]="2" >右中</nz-form-label> <div nz-col nzSpan="8"></div>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2" >右中</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.rightMiddle" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'rightMiddle')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.rightMiddle"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'rightMiddle')"></app-upload-image-with-preview>
</nz-form-item> </nz-form-control>
<nz-form-item> </nz-form-item>
<nz-form-label [nzSpan]="2" >左下</nz-form-label> <nz-form-item>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2" >左下</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.leftBottom" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'leftBottom')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.leftBottom"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'leftBottom')"></app-upload-image-with-preview>
<nz-form-label [nzSpan]="2" >中下</nz-form-label> </nz-form-control>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2" >中下</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.middleBottom" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'middleBottom')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.middleBottom"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'middleBottom')"></app-upload-image-with-preview>
<nz-form-label [nzSpan]="2">右下</nz-form-label> </nz-form-control>
<nz-form-control [nzSpan]="6"> <nz-form-label [nzSpan]="2">右下</nz-form-label>
<app-upload-image-with-preview style="width: 100%" [picUrl]="items.rightBottom" <nz-form-control [nzSpan]="6">
(imageUploaded)="onImageUploadSuccess($event, items, 'rightBottom')"></app-upload-image-with-preview> <app-upload-image-with-preview style="width: 100%" [picUrl]="items.rightBottom"
</nz-form-control> (imageUploaded)="onImageUploadSuccess($event, items, 'rightBottom')"></app-upload-image-with-preview>
</nz-form-item> </nz-form-control>
\ No newline at end of file </nz-form-item>
</div>
\ No newline at end of file
.content-border {
width: 100%;
height: 100%;
border-radius: 0.5rem;
min-width: 1200px;
border: 2px solid #ddd;
}
\ No newline at end of file
...@@ -346,6 +346,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -346,6 +346,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
number: 2, number: 2,
combin: [0,0] combin: [0,0]
}) })
this.autoSave()
} }
handleCombinLength(item) { handleCombinLength(item) {
...@@ -561,8 +562,8 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -561,8 +562,8 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
} }
handlePartChange(e, item, index) { handlePartChange(e, item, index) {
item.combin[index] = e item.combin[index] = Number(e)
console.log(item.combin, index) this.autoSave()
} }
hideAllLineDash() { hideAllLineDash() {
......
import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, ApplicationRef} from '@angular/core'; import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, ApplicationRef} from '@angular/core';
import { defaultData } from '../../assets/default/formData/defaultData.js'
@Component({ @Component({
selector: 'app-form', selector: 'app-form',
...@@ -40,10 +41,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -40,10 +41,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
this.item = {}; this.item = {};
} }
if ( !this.item.contentObj ) { if ( !this.item.contentObj ) {
this.item.contentObj = { this.item.contentObj = {};
"version": "1.0",
"dataKey": "DataKey_YM4-11",
};
} }
this.init(); this.init();
this.refresh(); this.refresh();
...@@ -67,39 +65,19 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -67,39 +65,19 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
} }
init() { init() {
if (this.item.contentObj.dataArray) { if(typeof(this.item.contentObj.hotZoneItemArr) == undefined || typeof(this.item.contentObj.bgItem) == undefined || typeof(this.item.contentObj.bgImages) == undefined || this.item.contentObj.version != defaultData.version) {
this.dataArray = this.item.contentObj.dataArray; console.log("Init defalue data")
this.item.contentObj = defaultData
this.hotZoneItemArr = defaultData.hotZoneItemArr
this.bgItem = defaultData.bgItem
this.bgImages = defaultData.bgImages
} else { } else {
this.dataArray = this.getDefaultPicArr(); console.log("Data loaded")
this.item.contentObj.dataArray = this.dataArray;
}
if (this.item.contentObj.hotZoneItemArr) {
this.hotZoneItemArr = this.item.contentObj.hotZoneItemArr; this.hotZoneItemArr = this.item.contentObj.hotZoneItemArr;
} else {
this.hotZoneItemArr = this.getDefaultPicArr();
this.item.contentObj.hotZoneItemArr = this.hotZoneItemArr;
}
if (this.item.contentObj.bgItem) {
this.bgItem = this.item.contentObj.bgItem; this.bgItem = this.item.contentObj.bgItem;
} else {
this.bgItem = {
url: 'assets/play/hotZooCard/defalut_bg.png'
}
this.item.contentObj.bgItem = this.bgItem;
}
if (this.item.contentObj.bgImages) {
this.bgImages = this.item.contentObj.bgImages; this.bgImages = this.item.contentObj.bgImages;
} else {
this.bgImages = {
leftTop: '', middleTop: '', rightTop: '', leftMiddle: '', rightMiddle: '', leftBottom: '', middleBottom: '', rightBottom: '',
}
this.item.contentObj.bgImages = this.bgImages;
} }
} }
cardItemData(){ cardItemData(){
......
...@@ -42,8 +42,7 @@ import { Subject } from "rxjs"; ...@@ -42,8 +42,7 @@ import { Subject } from "rxjs";
import { debounceTime, map, takeWhile, retry } from "rxjs/operators"; import { debounceTime, map, takeWhile, retry } from "rxjs/operators";
import * as _ from "lodash"; import * as _ from "lodash";
import TWEEN from "@tweenjs/tween.js"; import TWEEN from "@tweenjs/tween.js";
import defauleFormData from '../../assets/default/formData/defaultData.js' import { demoData as defaultData } from '../../assets/default/formData/defaultData.js'
import { element } from 'protractor';
const zIndexMap = { const zIndexMap = {
mainBackground: 0, mainBackground: 0,
...@@ -341,11 +340,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -341,11 +340,11 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
}) })
element.originX = element.ref.x - 960 * this.g_mapScale / 2
element.originY = element.ref.y - 155 * this.g_mapScale / 2 let contentImageWidth = 0
let element_t = this.g_cartoon.createCartoonElementImageFunc("window-image-container", this.g_formData.bgItem.url, (w, h)=>{ let element_t = this.g_cartoon.createCartoonElementImageFunc("window-image-container", this.g_formData.bgItem.url, (w, h)=>{
let s = Math.min( 960 / w, 155 / h) let s = Math.min( 960 / w, 155 / h)
contentImageWidth = (w * s) / 2
return { return {
sx: s, sx: s,
sy: s sy: s
...@@ -357,6 +356,9 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -357,6 +356,9 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
}) })
element.originX = element.ref.x - contentImageWidth * element.ref.scaleX
element.originY = element.ref.y - 155 * this.g_mapScale / 2
element.ref.addChild(element_t.ref) element.ref.addChild(element_t.ref)
this.render(element.ref) this.render(element.ref)
...@@ -379,21 +381,19 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -379,21 +381,19 @@ export class PlayComponent implements OnInit, OnDestroy {
element.initY = element.ref.y element.initY = element.ref.y
element.margin = 0 element.margin = 0
element.hotZooIndex = index; element.hotZooIndex = index;
element.ref.alpha = 0;
let elementDrag = null let elementDrag = null
elementDrag = this.g_cartoon.createCartoonElementLabel("text-puzzle-"+index, " " + item.media.text + " ", "MMTextBook-Bold", "#000", 48 * this.g_mapScale, -500, -500) elementDrag = this.g_cartoon.createCartoonElementLabel("text-puzzle-"+index, " " + item.media.text + " ", "MMTextBook-Bold", "#000", 48 * this.g_mapScale, -500, -500)
this.render(element.ref) this.render(element.ref)
this.render(elementDrag.ref) this.render(elementDrag.ref)
this.subscribeMapDragEvent(element.id, ()=>{ this.subscribeMapDragEvent(element.id, ()=>{
element.ref.alpha = 0.5;
item.media.audio_url && this.g_cartoon.playAudio(item.media.audio_url) item.media.audio_url && this.g_cartoon.playAudio(item.media.audio_url)
console.log(item.media.audio_url) console.log(item.media.audio_url)
}, ()=>{ }, ()=>{
elementDrag.ref.x = this.g_clickX, elementDrag.ref.x = this.g_clickX,
elementDrag.ref.y = this.g_clickY elementDrag.ref.y = this.g_clickY
}, ()=>{ }, ()=>{
element.ref.alpha = 1;
elementDrag.ref.x = elementDrag.initX, elementDrag.ref.x = elementDrag.initX,
elementDrag.ref.y = elementDrag.initY elementDrag.ref.y = elementDrag.initY
this.m_elementDraged = element.id; this.m_elementDraged = element.id;
...@@ -876,9 +876,9 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -876,9 +876,9 @@ export class PlayComponent implements OnInit, OnDestroy {
// 初始化默认数据 // 初始化默认数据
// ---------------------------------- // ----------------------------------
initDefaultData() { initDefaultData() {
if ( Object.keys(this.g_formData).length===0 || this.g_formData.version != defauleFormData.version ) { if ( Object.keys(this.g_formData).length===0 || this.g_formData.version != defaultData.version ) {
this.g_formData = defauleFormData; this.g_formData = defaultData;
console.log("Use default data.") console.log("Use default data.", this.g_formData)
} }
} }
......
export default { export const defaultData = {
"version": "1.0", "version": "1.0",
"dataKey": "DataKey_YM4-11", "dataKey": "DataKey_YM4-11",
"dataArray": [ "dataArray": [
...@@ -8,7 +8,7 @@ export default { ...@@ -8,7 +8,7 @@ export default {
], ],
"bgItem": { "bgItem": {
"url": "demo", "url": "",
"questions": [ "questions": [
], ],
...@@ -29,4 +29,203 @@ export default { ...@@ -29,4 +29,203 @@ export default {
"bgImages": { "bgImages": {
"leftTop": '', "middleTop": '', "rightTop": '', "leftMiddle": '', "rightMiddle": '', "leftBottom": '', "middleBottom": '', "rightBottom": '', "leftTop": '', "middleTop": '', "rightTop": '', "leftMiddle": '', "rightMiddle": '', "leftBottom": '', "middleBottom": '', "rightBottom": '',
} }
}
export const demoData = {
version: "1.0",
dataKey: "DataKey_YM4-11",
dataArray: [],
hotZoneItemArr: [
{
index: 0,
rect: {
x: 8.769469387755102,
y: 20.163265306122447,
width: 72.12244897959184,
height: 39.5029387755102,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_1.png",
text: "p",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 1,
rect: {
x: 14.19804081632653,
y: 96.89069387755102,
width: 54.285714285714285,
height: 31.020408163265305,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_2.png",
text: "t",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 2,
rect: {
x: 138.27967346938775,
y: 57.339673469387755,
width: 54.285714285714285,
height: 31.020408163265305,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_3.png",
text: "d",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 3,
rect: {
x: 246.8511020408163,
y: 20.115183673469385,
width: 54.285714285714285,
height: 31.020408163265305,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_4.png",
text: "w",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 4,
rect: {
x: 235.99395918367347,
y: 96.11518367346939,
width: 54.285714285714285,
height: 31.020408163265305,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_5.png",
text: "st",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 5,
rect: {
x: 360.85110204081633,
y: 59.714285714285715,
width: 89.95918367346938,
height: 32.52334693877551,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_6.png",
text: "eam",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 6,
rect: {
x: 496.565387755102,
y: 20.115183673469385,
width: 54.285714285714285,
height: 31.020408163265305,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_7.png",
text: "o",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 7,
rect: {
x: 487.2592653061224,
y: 101.59183673469387,
width: 77.55102040816327,
height: 30.196816326530612,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_8.png",
text: "one",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 8,
rect: {
x: 735.4225306122448,
y: 21.714285714285715,
width: 79.87755102040816,
height: 32.52334693877551,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_9.png",
text: "m",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
{
index: 9,
rect: {
x: 723.0143673469388,
y: 93.83673469387755,
width: 94.61224489795919,
height: 41.05395918367347,
},
media: {
image_url: "assets/play/hotZooCard/bg_70_40_10.png",
text: "eet",
type: "text",
audio_url: "",
},
scale: 0.7755102040816326,
},
],
bgItem: {
url: "assets/play/demo.png",
questions: [],
NO: "C",
mainText: "Listen, circle and write.",
mainTextAudio: "",
wordLeft_text: "ear",
wordLeft_audio_url: "",
wordRight_text: "pl",
wordRight_audio_url: "",
questions: [
{number: 2, combin: [0, -1]},
{number: 2, combin: [0, -1]}
],
rect: {
x: 43.691666666666606,
y: 0,
width: 1088.6166666666668,
height: 189.875,
},
},
bgImages: {
leftTop: "",
middleTop: "",
rightTop: "",
leftMiddle: "",
rightMiddle: "",
leftBottom: "",
middleBottom: "",
rightBottom: "",
},
} }
\ No newline at end of file
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