Commit 270dbf6c authored by Chen Jiping's avatar Chen Jiping

fix:增加依赖节点

parent 8092cd0a
...@@ -31,7 +31,8 @@ ...@@ -31,7 +31,8 @@
"rxjs": "~6.5.4", "rxjs": "~6.5.4",
"spark-md5": "^3.0.0", "spark-md5": "^3.0.0",
"tslib": "^1.10.0", "tslib": "^1.10.0",
"zone.js": "~0.10.2" "zone.js": "~0.10.2",
"node-sass": "^4.0.0"
}, },
"devDependencies": { "devDependencies": {
"@angular-devkit/build-angular": "~0.900.3", "@angular-devkit/build-angular": "~0.900.3",
......
...@@ -10,12 +10,12 @@ import { ...@@ -10,12 +10,12 @@ import {
Output, Output,
ViewChild ViewChild
} from '@angular/core'; } from '@angular/core';
import {Subject} from 'rxjs'; import { Subject } from 'rxjs';
import {debounceTime} from 'rxjs/operators'; import { debounceTime } from 'rxjs/operators';
import {EditorItem, HotZoneImg, HotZoneItem, HotZoneLabel, Label, MySprite, removeItemFromArr} from './Unit'; import { EditorItem, HotZoneImg, HotZoneItem, HotZoneLabel, Label, MySprite, removeItemFromArr } from './Unit';
import TWEEN from '@tweenjs/tween.js'; import TWEEN from '@tweenjs/tween.js';
import {getMinScale, ShapeRect} from "../../play/Unit"; import { getMinScale, ShapeRect } from "../../play/Unit";
import {tar} from "compressing"; import { tar } from "compressing";
@Component({ @Component({
...@@ -34,8 +34,8 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -34,8 +34,8 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
hotZoneArr = null; hotZoneArr = null;
@Output() @Output()
save = new EventEmitter(); save = new EventEmitter();
@ViewChild('canvas', {static: true}) canvas: ElementRef; @ViewChild('canvas', { static: true }) canvas: ElementRef;
@ViewChild('wrap', {static: true}) wrap: ElementRef; @ViewChild('wrap', { static: true }) wrap: ElementRef;
@Input() @Input()
isHasRect = true; isHasRect = true;
...@@ -158,7 +158,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -158,7 +158,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
const rate1 = this.canvasWidth / bg.width; const rate1 = this.canvasWidth / bg.width;
const rate2 = this.canvasHeight / bg.height; const rate2 = this.canvasHeight / bg.height;
const rate = Math.min(rate1, rate2); const rate = Math.max(rate1, rate2);
bg.setScaleXY(rate); bg.setScaleXY(rate);
...@@ -269,7 +269,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -269,7 +269,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
if (saveData && saveData.pic_url) { if (saveData && saveData.pic_url) {
this.loadHotZonePic(pic, saveData.pic_url); this.loadHotZonePic(pic, saveData.pic_url);
} }
pic.x = item.x; pic.x = item.x;console.log(item.x);
pic.y = item.y; pic.y = item.y;
this.renderArr.push(pic); this.renderArr.push(pic);
...@@ -385,8 +385,8 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -385,8 +385,8 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
initItem() { initItem() {
//定时刷新背景图片 //定时刷新背景图片
const refreshBg = () =>{ const refreshBg = () => {
setInterval(()=>{ setInterval(() => {
this.refreshBackground(); this.refreshBackground();
}, 2000); }, 2000);
} }
...@@ -417,7 +417,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -417,7 +417,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
if (this.bg) { if (this.bg) {
curBgRect = this.bg.getBoundingBox(); curBgRect = this.bg.getBoundingBox();
} else { } else {
curBgRect = {x: 0, y: 0, width: this.canvasWidth, height: this.canvasHeight}; curBgRect = { x: 0, y: 0, width: this.canvasWidth, height: this.canvasHeight };
} }
let oldBgRect = this.bgItem.rect; let oldBgRect = this.bgItem.rect;
...@@ -441,12 +441,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -441,12 +441,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
data.rect.width *= rate; data.rect.width *= rate;
data.rect.height *= rate; data.rect.height *= rate;
//data.rect.x += curBgRect.x;
//data.rect.y += curBgRect.y;
// img['picItem'] = this.getPicItem(img, data);
// img['audio_url'] = arr[i].audio_url;
// this.imgArr.push(img);
const item = this.getHotZoneItem(data); const item = this.getHotZoneItem(data);
item.audio_url = data.audio_url; item.audio_url = data.audio_url;
...@@ -455,7 +449,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -455,7 +449,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
item.itemType = data.itemType; item.itemType = data.itemType;
this.refreshItem(item); this.refreshItem(item);
console.log('item: ', item); //console.log('item: ', item);
this.hotZoneArr.push(item); this.hotZoneArr.push(item);
} }
...@@ -474,7 +468,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -474,7 +468,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
if (this.bg) { if (this.bg) {
curBgRect = this.bg.getBoundingBox(); curBgRect = this.bg.getBoundingBox();
} else { } else {
curBgRect = {x: 0, y: 0, width: this.canvasWidth, height: this.canvasHeight}; curBgRect = { x: 0, y: 0, width: this.canvasWidth, height: this.canvasHeight };
} }
let oldBgRect = this.bgItem.rect; let oldBgRect = this.bgItem.rect;
...@@ -491,7 +485,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -491,7 +485,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
for (let i = 0; i < arr.length; i++) { for (let i = 0; i < arr.length; i++) {
const data = JSON.parse(JSON.stringify(arr[i])); const data = JSON.parse(JSON.stringify(arr[i]));
const img = {pic_url: data.pic_url}; const img = { pic_url: data.pic_url };
data.rect.x *= rate; data.rect.x *= rate;
data.rect.y *= rate; data.rect.y *= rate;
...@@ -511,6 +505,9 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -511,6 +505,9 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
initData() { initData() {
this.canvasWidth = this.wrap.nativeElement.clientWidth;
this.canvasHeight = this.wrap.nativeElement.clientHeight;
this.mapScale = this.canvasWidth / this.canvasBaseW;
this.renderArr = []; this.renderArr = [];
this.bg = null; this.bg = null;
...@@ -521,17 +518,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -521,17 +518,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
initCtx() { initCtx() {
let canvasWidth = this.wrap.nativeElement.clientWidth;
let canvasHeight = this.wrap.nativeElement.clientHeight;
this.canvasWidth = canvasWidth;
this.canvasHeight = canvasHeight;
console.log(canvasWidth, canvasHeight);
const sx = this.canvasWidth / this.canvasBaseW;
const sy = this.canvasHeight / this.canvasBaseH;
const s = Math.min(sx, sy);
this.mapScale = s;
this.ctx = this.canvas.nativeElement.getContext('2d'); this.ctx = this.canvas.nativeElement.getContext('2d');
this.canvas.nativeElement.width = this.canvasWidth; this.canvas.nativeElement.width = this.canvasWidth;
this.canvas.nativeElement.height = this.canvasHeight; this.canvas.nativeElement.height = this.canvasHeight;
...@@ -540,7 +526,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -540,7 +526,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
mapDown(event) { mapDown(event) {
this.oldPos = {x: this.mx, y: this.my}; this.oldPos = { x: this.mx, y: this.my };
for (let i = 0; i < this.hotZoneArr.length; i++) { for (let i = 0; i < this.hotZoneArr.length; i++) {
...@@ -594,7 +580,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -594,7 +580,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
this.curItem.y += addY; this.curItem.y += addY;
} }
this.oldPos = {x: this.mx, y: this.my}; this.oldPos = { x: this.mx, y: this.my };
this.saveDisabled = true; this.saveDisabled = true;
...@@ -895,12 +881,12 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -895,12 +881,12 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
fontScale: hotZoneArr[i].textLabel ? hotZoneArr[i].textLabel.scaleX : 1, fontScale: hotZoneArr[i].textLabel ? hotZoneArr[i].textLabel.scaleX : 1,
imgScale: hotZoneArr[i].pic ? hotZoneArr[i].pic.scaleX : 1, imgScale: hotZoneArr[i].pic ? hotZoneArr[i].pic.scaleX : 1,
mapScale: this.mapScale, mapScale: this.mapScale,
picX:hotZoneArr[i].pic ?hotZoneArr[i].pic.x : 0, picX: hotZoneArr[i].pic ? hotZoneArr[i].pic.x : 0,
picY: hotZoneArr[i].pic ?hotZoneArr[i].pic.y : 0 picY: hotZoneArr[i].pic ? hotZoneArr[i].pic.y : 0
}; };
hotZoneItem['rect'] = hotZoneArr[i].getBoundingBox(); hotZoneItem['rect'] = hotZoneArr[i].getBoundingBox();
hotZoneItem['rect'].x = Math.round((hotZoneItem['rect'].x) * 100) / 100; hotZoneItem['rect'].x = Math.round((hotZoneItem['rect'].x - bgItem['rect'].x) * 100) / 100;
hotZoneItem['rect'].y = Math.round((hotZoneItem['rect'].y) * 100) / 100; hotZoneItem['rect'].y = Math.round((hotZoneItem['rect'].y - bgItem['rect'].y) * 100) / 100;
hotZoneItem['rect'].width = Math.round((hotZoneItem['rect'].width) * 100) / 100; hotZoneItem['rect'].width = Math.round((hotZoneItem['rect'].width) * 100) / 100;
hotZoneItem['rect'].height = Math.round((hotZoneItem['rect'].height) * 100) / 100; hotZoneItem['rect'].height = Math.round((hotZoneItem['rect'].height) * 100) / 100;
...@@ -909,7 +895,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -909,7 +895,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
console.log('hotZoneItemArr: ', hotZoneItemArr); console.log('hotZoneItemArr: ', hotZoneItemArr);
this.save.emit({bgItem, hotZoneItemArr}); this.save.emit({ bgItem, hotZoneItemArr });
} }
private updatePos() { private updatePos() {
......
...@@ -47,7 +47,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -47,7 +47,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
if (data) { if (data) {
this.item = data; this.item = data;
} }
this.item.exercisesArr[0].hotZoneItemArr[0].picX= 0;
this.init(); this.init();
this.changeDetectorRef.markForCheck(); this.changeDetectorRef.markForCheck();
this.changeDetectorRef.detectChanges(); this.changeDetectorRef.detectChanges();
......
This diff is collapsed.
...@@ -186,7 +186,7 @@ ...@@ -186,7 +186,7 @@
"array": [ "array": [
0, 0,
0, 0,
340.28166214774456, 340.4379931432836,
0, 0,
0, 0,
0, 0,
......
...@@ -80,7 +80,7 @@ cc.Class({ ...@@ -80,7 +80,7 @@ cc.Class({
getDefaultData() { getDefaultData() {
const dataJson = '{"exercisesArr":[{"answers":[{"isRight":"1","audioUrl":"http://staging-teach.cdn.ireadabc.com/4b763321dd84accbf0060038f2e95d6a.mp3","picUrl":"http://staging-teach.cdn.ireadabc.com/10dab2d49188db958a6a6e6b3ab7b5f5.png"},{"isRight":"0","picUrl":"http://staging-teach.cdn.ireadabc.com/cb6a2f948c3febbb7881e6b6a7417811.png"},{"isRight":"0","picUrl":"http://staging-teach.cdn.ireadabc.com/a886b150e8792d433ced3672f4df7dfb.jpg"}],"frames":[{"picUrl":"http://staging-teach.cdn.ireadabc.com/824c94f5e363c351e24dde9325731ab7.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/95638e0ab356b51f960e800e3fa5aacb.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3d330a49df81ae964a705048f8ea0e0d.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3023da8f58edfa36a0a9c34e68902ef7.png"}],"hotZoneItemArr":[{"index":0,"pic_url":"http://staging-teach.cdn.ireadabc.com/00254362880b14c443e533331db4e2bf.png","audio_url":"http://staging-teach.cdn.ireadabc.com/284f8356d7537612833d1d9bf5d76aa8.mp3","itemType":"pic","fontSize":50,"fontName":"BRLNSR_1","fontColor":"#8f3758","fontScale":0.7416666666666667,"imgScale":0.377792672028597,"mapScale":0.7416666666666667,"picX":762.0749999999999,"picY":174.825,"rect":{"x":632.79,"y":45.54,"width":258.57,"height":258.57}}],"skeJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/d74f4a1fff340bf4cf02101d5bfda7e8.json","name":"女孩_ske.json"},"texJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/66d2f8e8c531a4a8583e5faf2cf35e41.json","name":"女孩_tex.json"},"texPngData":{"url":"http://staging-teach.cdn.ireadabc.com/546d11d5c1abbe2a0e442fe4816718b7.png","name":"女孩_tex.png"}},{"answers":[{"isRight":"0","audioUrl":"http://staging-teach.cdn.ireadabc.com/66fe3a8fe9cd81ebb0a20b4fb134443f.mp3","picUrl":"http://staging-teach.cdn.ireadabc.com/cb6dfd436c533f44e8e9fdd594458576.png"},{"isRight":"1","audioUrl":"http://staging-teach.cdn.ireadabc.com/5d8c6991fabc4bf37a0055bb37eac8b3.mp3","picUrl":"http://staging-teach.cdn.ireadabc.com/b2b296923e5fd09e77cd29fd3883f78e.png"},{"isRight":"0","picUrl":"http://staging-teach.cdn.ireadabc.com/3fed3a7bacc07dfb84de7196a50d39ab.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/9f9361601b4f2dbd60f037c6996a5af6.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/2f65d31e390318626fce1180bb09b2ea.png"}],"frames":[{"picUrl":"http://staging-teach.cdn.ireadabc.com/25a82fd9d55b026a76d2caaeed754a02.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/25a82fd9d55b026a76d2caaeed754a02.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3d8d02f661a45283aa4eef1b6faed704.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/8c1833c5a38efea3394ad78a44cd8801.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3d8d02f661a45283aa4eef1b6faed704.png"}],"hotZoneItemArr":[{"index":0,"pic_url":"http://staging-teach.cdn.ireadabc.com/59a3efbfa3df99100e8810cbcddef107.png","itemType":"pic","fontSize":50,"fontName":"BRLNSR_1","fontColor":"#8f3758","fontScale":0.7416666666666667,"imgScale":0.7785451197053408,"mapScale":0.7416666666666667,"picX":798.6899999999999,"picY":181.03,"rect":{"x":692.15,"y":74.49,"width":213.08,"height":213.08}}],"skeJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/6db25cc732cb592dd26295aaefdd016a.json","name":"FT01测试_ske.json"},"texJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/9223e48368163e5d2bd556aa869b4610.json","name":"FT01测试_tex.json"},"texPngData":{"url":"http://staging-teach.cdn.ireadabc.com/f7314ee89b8f27dc6b7cfcd6831ed728.png","name":"FT01测试_tex.png"}}],"bg":{"rect":{"x":101.33333333333331,"y":0,"width":949.3333333333334,"height":534},"picUrl":"http://staging-teach.cdn.ireadabc.com/0b6497174aed7ae05127d1eb8c29d94a.jpg"},"title":{"val":"Find Body Part","audioUrl":"http://staging-teach.cdn.ireadabc.com/8f5559c935b390efdea299ad568d3bd9.mp3"}}'; const dataJson = '{"exercisesArr":[{"answers":[{"isRight":"1","audioUrl":"http://staging-teach.cdn.ireadabc.com/4b763321dd84accbf0060038f2e95d6a.mp3","picUrl":"http://staging-teach.cdn.ireadabc.com/10dab2d49188db958a6a6e6b3ab7b5f5.png"},{"isRight":"0","picUrl":"http://staging-teach.cdn.ireadabc.com/cb6a2f948c3febbb7881e6b6a7417811.png"},{"isRight":"0","picUrl":"http://staging-teach.cdn.ireadabc.com/a886b150e8792d433ced3672f4df7dfb.jpg"}],"frames":[{"picUrl":"http://staging-teach.cdn.ireadabc.com/824c94f5e363c351e24dde9325731ab7.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/95638e0ab356b51f960e800e3fa5aacb.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3d330a49df81ae964a705048f8ea0e0d.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3023da8f58edfa36a0a9c34e68902ef7.png"}],"hotZoneItemArr":[{"index":0,"pic_url":"http://staging-teach.cdn.ireadabc.com/00254362880b14c443e533331db4e2bf.png","audio_url":"http://staging-teach.cdn.ireadabc.com/284f8356d7537612833d1d9bf5d76aa8.mp3","itemType":"pic","fontSize":50,"fontName":"BRLNSR_1","fontColor":"#8f3758","fontScale":0.9,"imgScale":0.4584450402144772,"mapScale":0.9,"picX":932.0749999999999,"picY":60.82499999999999,"rect":{"x":802.79,"y":-68.46,"width":258.57,"height":258.57}}],"skeJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/d74f4a1fff340bf4cf02101d5bfda7e8.json","name":"女孩_ske.json"},"texJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/66d2f8e8c531a4a8583e5faf2cf35e41.json","name":"女孩_tex.json"},"texPngData":{"url":"http://staging-teach.cdn.ireadabc.com/546d11d5c1abbe2a0e442fe4816718b7.png","name":"女孩_tex.png"}},{"answers":[{"isRight":"0","audioUrl":"http://staging-teach.cdn.ireadabc.com/66fe3a8fe9cd81ebb0a20b4fb134443f.mp3","picUrl":"http://staging-teach.cdn.ireadabc.com/cb6dfd436c533f44e8e9fdd594458576.png"},{"isRight":"1","audioUrl":"http://staging-teach.cdn.ireadabc.com/5d8c6991fabc4bf37a0055bb37eac8b3.mp3","picUrl":"http://staging-teach.cdn.ireadabc.com/b2b296923e5fd09e77cd29fd3883f78e.png"},{"isRight":"0","picUrl":"http://staging-teach.cdn.ireadabc.com/3fed3a7bacc07dfb84de7196a50d39ab.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/9f9361601b4f2dbd60f037c6996a5af6.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/2f65d31e390318626fce1180bb09b2ea.png"}],"frames":[{"picUrl":"http://staging-teach.cdn.ireadabc.com/25a82fd9d55b026a76d2caaeed754a02.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/25a82fd9d55b026a76d2caaeed754a02.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3d8d02f661a45283aa4eef1b6faed704.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/8c1833c5a38efea3394ad78a44cd8801.png"},{"picUrl":"http://staging-teach.cdn.ireadabc.com/3d8d02f661a45283aa4eef1b6faed704.png"}],"hotZoneItemArr":[{"index":0,"pic_url":"http://staging-teach.cdn.ireadabc.com/59a3efbfa3df99100e8810cbcddef107.png","itemType":"pic","fontSize":50,"fontName":"BRLNSR_1","fontColor":"#8f3758","fontScale":0.9,"imgScale":0.9447513812154696,"mapScale":0.9,"picX":576.6899999999999,"picY":140.03,"rect":{"x":470.15,"y":33.49,"width":213.08,"height":213.08}}],"skeJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/6db25cc732cb592dd26295aaefdd016a.json","name":"FT01测试_ske.json"},"texJsonData":{"url":"http://staging-teach.cdn.ireadabc.com/9223e48368163e5d2bd556aa869b4610.json","name":"FT01测试_tex.json"},"texPngData":{"url":"http://staging-teach.cdn.ireadabc.com/f7314ee89b8f27dc6b7cfcd6831ed728.png","name":"FT01测试_tex.png"}}],"bg":{"rect":{"x":101.33333333333331,"y":0,"width":949.3333333333334,"height":534},"picUrl":"http://staging-teach.cdn.ireadabc.com/0b6497174aed7ae05127d1eb8c29d94a.jpg"},"title":{"val":"Find Body Part","audioUrl":"http://staging-teach.cdn.ireadabc.com/8f5559c935b390efdea299ad568d3bd9.mp3"}}';
const data = JSON.parse(dataJson); const data = JSON.parse(dataJson);
return data; return 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