Commit 9a5a2c48 authored by limingzhe's avatar limingzhe

feat: 结算界面

parent a351942f
...@@ -25,7 +25,14 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -25,7 +25,14 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
select: [ select: [
{label: '日期', value: 'date'}, {label: '日期', value: 'date'},
{label: '时间', value: 'time'}, {label: '时间', value: 'time'},
{label: '人名', value: 'name'} {label: '人名', value: 'name'},
{label: '城市', value: 'city'},
{label: '电器', value: 'device'},
{label: '方位', value: 'side'},
{label: '工作', value: 'work'},
{label: '动词', value: 'adj'},
{label: '单词', value: 'word'},
], ],
label: '比对', label: '比对',
}, },
...@@ -33,9 +40,10 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -33,9 +40,10 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
name: '提交按钮', name: '提交按钮',
rect: true, rect: true,
isFixed: true isFixed: true
} },
] ]
constructor(private appRef: ApplicationRef, private changeDetectorRef: ChangeDetectorRef) { constructor(private appRef: ApplicationRef, private changeDetectorRef: ChangeDetectorRef) {
} }
......
...@@ -586,6 +586,7 @@ export class Label extends MySprite { ...@@ -586,6 +586,7 @@ export class Label extends MySprite {
// fontSize:String = '40px'; // fontSize:String = '40px';
fontName = 'Verdana'; fontName = 'Verdana';
textAlign = 'left'; textAlign = 'left';
textBaseline = 'middle';
fontSize = 40; fontSize = 40;
fontColor = '#000000'; fontColor = '#000000';
fontWeight = 900; fontWeight = 900;
...@@ -615,7 +616,7 @@ export class Label extends MySprite { ...@@ -615,7 +616,7 @@ export class Label extends MySprite {
this.ctx.font = `${this.fontSize}px ${this.fontName}`; this.ctx.font = `${this.fontSize}px ${this.fontName}`;
this.ctx.textAlign = this.textAlign; this.ctx.textAlign = this.textAlign;
this.ctx.textBaseline = 'middle'; this.ctx.textBaseline = this.textBaseline;
this.ctx.fontWeight = this.fontWeight; this.ctx.fontWeight = this.fontWeight;
this._width = this.ctx.measureText(this.text).width; this._width = this.ctx.measureText(this.text).width;
...@@ -843,27 +844,41 @@ export class RichText extends Label { ...@@ -843,27 +844,41 @@ export class RichText extends Label {
disH = 10; disH = 10;
offW = 10; offW = 10;
row = 1; private rowCount = 1;
textBaseline = "middle"; textBaseline = "middle";
constructor(ctx?: any) { constructor(ctx?: any) {
super(ctx); super(ctx);
// this.dataArr = dataArr;
} }
getLineNum() { getLineNum() {
this.drawSelf(); this.drawSelf();
return this.row; return this.rowCount;
} }
getAreaHeight() { getAreaHeight() {
this.drawSelf(); this.drawSelf();
const tmpTextH = this.row * this.fontSize; const tmpTextH = this.rowCount * this.fontSize;
const tmpDisH = (this.row - 1) * this.disH const tmpDisH = (this.rowCount - 1) * this.disH
return tmpTextH + tmpDisH; return tmpTextH + tmpDisH;
} }
// addLabelMask(mask) {
// this._labelMaskArr.push(mask);
// this._createLabelOffCtx();
// }
// _createLabelOffCtx() {
// if (!this._labelOffCtx) {
// this._labelOffCanvas = document.createElement('canvas'); // 创建一个新的canvas
// this._labelOffCanvas.width = this.width; // 创建一个正好包裹住一个粒子canvas
// this._labelOffCanvas.height = this.height;
// this._labelOffCtx = this._labelOffCanvas.getContext('2d');
// }
// }
getSubTextRect(subText) { getSubTextRect(subText) {
const tmpLabel = new RichText(); const tmpLabel = new RichText();
...@@ -899,12 +914,25 @@ export class RichText extends Label { ...@@ -899,12 +914,25 @@ export class RichText extends Label {
return; return;
} }
let curCtx = this.ctx;
this.ctx.font = `${this.fontSize}px ${this.fontName}`; if (this._offCtx) {
this.ctx.textAlign = this.textAlign;
this.ctx.textBaseline = this.textBaseline;
this.ctx.fontWeight = this.fontWeight;
this.ctx.fillStyle = this.fontColor; this._offCtx.save();
this._offCtx.clearRect(0, 0, this.width, this.height);
curCtx = this._offCtx;
}
curCtx.font = `${this.fontSize}px ${this.fontName}`;
curCtx.textAlign = this.textAlign;
curCtx.textBaseline = this.textBaseline;
curCtx.fontWeight = this.fontWeight;
curCtx.fillStyle = this.fontColor;
const selfW = this.width * this.scaleX; const selfW = this.width * this.scaleX;
...@@ -912,7 +940,7 @@ export class RichText extends Label { ...@@ -912,7 +940,7 @@ export class RichText extends Label {
const chr = this.text.split(' '); const chr = this.text.split(' ');
let temp = ''; let temp = '';
const row = []; const rows = [];
const w = selfW - this.offW * 2; const w = selfW - this.offW * 2;
const disH = (this.fontSize + this.disH) * this.scaleY; const disH = (this.fontSize + this.disH) * this.scaleY;
...@@ -920,45 +948,61 @@ export class RichText extends Label { ...@@ -920,45 +948,61 @@ export class RichText extends Label {
for (const c of chr) { for (const c of chr) {
if (this.ctx.measureText(temp).width < w && this.ctx.measureText(temp + (c)).width <= w) { if (curCtx.measureText(temp).width < w && curCtx.measureText(temp + (c)).width <= w) {
temp += ' ' + c; temp += ' ' + c;
} else { } else {
row.push(temp); rows.push(temp);
temp = ' ' + c; temp = ' ' + c;
} }
} }
row.push(temp); rows.push(temp);
this.row = row.length; this.rowCount = rows.length;
const x = 0; const x = 0;
const y = 0//-row.length * disH / 2; const y = 0;
// for (let b = 0 ; b < row.length; b++) {
// this.ctx.strokeText(row[b], x, y + ( b + 1 ) * disH ); // 每行字体y坐标间隔20
// }
if (this._outlineFlag) { if (this._outlineFlag) {
this.ctx.lineWidth = this._outLineWidth; curCtx.lineWidth = this._outLineWidth;
this.ctx.strokeStyle = this._outLineColor; curCtx.strokeStyle = this._outLineColor;
for (let b = 0 ; b < row.length; b++) { for (let b = 0 ; b < rows.length; b++) {
this.ctx.strokeText(row[b], x, y + ( b + 0 ) * disH / this.scaleY ); // 每行字体y坐标间隔20 curCtx.strokeText(rows[b], x, y + ( b + 0 ) * disH / this.scaleY ); // 每行字体y坐标间隔20
} }
// this.ctx.strokeText(this.text, 0, 0);
} }
// this.ctx.fillStyle = '#ff7600'; for (let b = 0 ; b < rows.length; b++) {
for (let b = 0 ; b < row.length; b++) { curCtx.fillText(rows[b], x, y + ( b + 0 ) * disH / this.scaleY ); // 每行字体y坐标间隔20
this.ctx.fillText(row[b], x, y + ( b + 0 ) * disH / this.scaleY ); // 每行字体y坐标间隔20 }
if (this._offCtx) {
this._offCtx.globalCompositeOperation = this._maskType;
if (this._maskSprArr && this._maskSprArr.length > 0) {
for (let i=0; i<this._maskSprArr.length; i++) {
this._maskSprArr[i].ctx = this._offCtx;
this._maskSprArr[i].update();
}
// console.log('aaaaa1');
}
this.ctx.drawImage(this._offCanvas, this._offX, this._offY);
this._offCtx.restore();
} }
} }
drawSelf() { drawSelf() {
super.drawSelf(); super.drawSelf();
this.drawText();
} }
} }
...@@ -2162,7 +2206,7 @@ export class ScrollView extends MySprite { ...@@ -2162,7 +2206,7 @@ export class ScrollView extends MySprite {
refreshContentSize() { refreshContentSize() {
const children = this.content.children; const children = this.content.children;
console.log('children: ', children); // console.log('children: ', children);
let maxW = 0; let maxW = 0;
let maxH = 0; let maxH = 0;
...@@ -2171,11 +2215,11 @@ export class ScrollView extends MySprite { ...@@ -2171,11 +2215,11 @@ export class ScrollView extends MySprite {
continue; continue;
} }
const box = children[i].getBoundingBox(); const box = children[i].getBoundingBox();
console.log('box: ', box); // console.log('box: ', box);
const boxEdgeX = box.x + box.width; const boxEdgeX = box.x + box.width;
const boxEdgeY = box.y + box.height; const boxEdgeY = box.y + box.height;
console.log('boxEdgeY: ', boxEdgeY); // console.log('boxEdgeY: ', boxEdgeY);
if (boxEdgeX > maxW) { if (boxEdgeX > maxW) {
maxW = boxEdgeX; maxW = boxEdgeX;
} }
...@@ -2184,8 +2228,8 @@ export class ScrollView extends MySprite { ...@@ -2184,8 +2228,8 @@ export class ScrollView extends MySprite {
} }
} }
console.log('maxW: ', maxW); // console.log('maxW: ', maxW);
console.log('maxH: ', maxH); // console.log('maxH: ', maxH);
this.content.width = maxW; this.content.width = maxW;
this.content.height = maxH ; this.content.height = maxH ;
......
import { data } from "./words";
export function checkAnswer(type, string, word) {
switch (type) {
case 'device':
case 'side':
case 'work':
case 'adj':
return WordData.getInstance().check(type, string);
case 'name':
case 'city':
return checkCity(string);
case 'time':
return checkTime(string);
case 'date':
return checkDate(string);
case 'word':
return checkWord(string, word);
default:
throw "错误的格式";
}
}
function checkCity(string) {
const bigCase = ('ABCDEFGHIJKLMNOPQRSTUVWXYZ').split('');
const smallCase = ('abcdefghijklmnopqrstuvwxyz').split('');
const right = string.split(' ')
.filter(word => word != '')
.every(word => {
return word.split('')
.every((letter, idx) => {
if (idx == 0) {
return bigCase.includes(letter)
&& !smallCase.includes(letter);
} else {
return !bigCase.includes(letter)
&& smallCase.includes(letter);
}
});
});
return {
right: right,
info: '',
}
}
function checkTime(string) {
const rightResult = {
right: true,
info: '',
}
const wrongResult = {
right: false,
info: 'time格式填写错误。正确格式为“时 分”, 例如:ten thirty',
};
if (string.includes(":")) {
const words = string.split(":");
if (words.length != 2) {
return wrongResult;
}
if (words.some(word => word.length > 2)) {
return wrongResult;
}
const hour = parseInt(words[0]);
const minute = parseInt(words[1]);
if (hour < 0 || 12 < hour) {
return wrongResult;
}
if (minute < 0 || 59 < minute) {
return wrongResult;
}
return rightResult;
}
const hours = [
"one", "two", "three", "four", "five", "six",
"seven", "eight", "nine", "ten", "eleven", "twelve"
];
const minutes = [
"o'clock", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten",
"eleven", "twelve", "thirteen", "fourteen", "fifteen", "a quarter", "sixteen", "seventeen", "eighteen", "nineteen", "twenty",
"twenty-one", "twenty-two", "twenty-three", "twenty-four", "twenty-five", "twenty-six", "twenty-seven", "twenty-eight", "twenty-nine", "thirty", "half",
"thirty-one", "thirty-two", "thirty-three", "thirty-four", "thirty-five", "thirty-six", "thirty-seven", "thirty-eight", "thirty-nine", "forty",
"forty-one", "forty-two", "forty-three", "forty-four", "forty-five", "three quarter", "forty-six", "forty-seven", "forty-eight", "forty-nine", "fifty",
"fifty-one", "fifty-two", "fifty-three", "fifty-four", "fifty-five", "fifty-six", "fifty-seven", "fifty-eight", "fifty-nine",
];
const middles = [
'to',
'past'
];
const middleWord = middles.find(word => string.includes(word));
if (middleWord) {
const strings = string.split(middleWord);
if (minutes.some(word => strings[0].trim().toLowerCase() == word)) {
if (hours.some(word => strings[1].trim().toLowerCase() == word)) {
return rightResult;
}
}
return wrongResult;
}
const strings = string.split(' ');
if (hours.some(word => strings[0].trim().toLowerCase() == word)) {
if (minutes.some(word => strings[1].trim().toLowerCase() == word)) {
return rightResult;
}
}
return wrongResult;
}
function checkDate(string: string) {
const wrongResult = {
right: false,
info: 'date格式填写错误。正确格式为“日 月 年”, 例如:15th August 2008',
};
const rightResult = {
right: true,
info: '',
}
let numberList = [];
if (string.includes('.')) {
numberList = string.split('.').map(string => parseInt(string));
} else {
const days1 = [
'none',
'First', 'second', 'third', 'fourth',
'fifth', 'sixth', 'seventh', 'eighth',
'ninth', 'tenth', 'eleventh', 'twelfth',
'thirteenth', 'fourteenth', 'fifteenth', 'sixteenth',
'seventeenth', 'eighteenth', 'nineteenth', 'Twentieth',
'twenty-first', 'twenty-second', 'Twenty-third', 'twenty-fourth',
'Twenty-fifth', 'Twenty-sixth', 'twenty-seventh', 'Twenty-eighth',
'twenty-ninth', 'Thirtieth', 'Thirty-first'
];
const days2 = [
'none',
'1st', '2nd', '3rd', '4th',
'5th', '6th', '7th', '8th',
'9th', '10th', '11th', '12th',
'13th', '14th', '15th', '16th',
'17th', '18th', '19th', '20th',
'21st', '22nd', '23rd', '24th',
'25th', '26th', '27th', '28th',
'29th', '30th', '31st'
]
const months = [
'none',
'January', 'February', 'March', 'April',
'May', 'June', 'July', 'August',
'September', 'October', 'November', 'December'
];
let yearFlg = false;
let monthFlg = false;
let dayFlg = false;
numberList = string.split(' ').map(string => {
if (!monthFlg) {
const month = months.findIndex(str => str == string);
if (month >= 1) {
monthFlg = true;
return month;
}
}
if (!dayFlg) {
let day = days1.findIndex(str => str == string);
if (day >= 1) {
dayFlg = true;
return day;
}
day = days2.findIndex(str => str == string);
if (day >= 1) {
dayFlg = true;
return day;
}
}
if (!yearFlg) {
const year: number = parseInt(string);
if (!isNaN(year)) {
yearFlg = true;
return year;
}
}
});
}
console.log('numberList = ' + JSON.stringify(numberList));
if (numberList.length < 2 || 3 < numberList.length) {
return wrongResult;
}
if (numberList.some(num => !num)) {
// 有null或者undefind
return wrongResult;
}
if (numberList.some(num => num <= 0)) {
// 负数
return wrongResult;
}
let rightFlg = true;
let yearFlg = false;
let monthFlg = false;
let dayFlg = false;
numberList.forEach((number, idx) => {
if (number > 31) {
if (!yearFlg) {
if (idx == 1) {
rightFlg = false;
} else {
yearFlg = true;
}
} else {
rightFlg = false;
}
} else if (number > 12) {
if (!dayFlg) {
dayFlg = true;
} else {
rightFlg = false;
}
} else {
if (!monthFlg) {
monthFlg = true;
} else if (!dayFlg) {
dayFlg = true;
} else {
rightFlg = false;
}
}
});
if (!monthFlg || !dayFlg) {
rightFlg = false;
}
if (rightFlg) {
return rightResult;
}
return wrongResult;
}
function checkWord(string: string, word: string) {
if (string.trim() != word.trim()) {
return { right: false, info: '' };
}
return { right: true, info: '' };
}
export class WordData {
static _instance = null;
static getInstance(): WordData {
if (!WordData._instance) {
WordData._instance = new WordData();
}
return WordData._instance;
}
constructor() {
this.device = data.device;
this.side = data.side;
this.work = data.work;
this.adj = data.adj;
}
device = ['TV', 'heater'];
side = ['north'];
work = ['teacher', 'worker'];
adj = ['big', 'small'];
check(type: any, string: any) {
const wrongString = {
device: '电器名错误。',
side: '方向名词错误。',
work: '工作名错误。',
adj: '形容词错误。',
}
return {
right: this[type].includes(string.trim()),
info: wrongString[type],
};
}
}
...@@ -20,6 +20,7 @@ import TWEEN from '@tweenjs/tween.js'; ...@@ -20,6 +20,7 @@ import TWEEN from '@tweenjs/tween.js';
import { loadFonts } from './Util' import { loadFonts } from './Util'
import { faTshirt } from '@fortawesome/free-solid-svg-icons'; import { faTshirt } from '@fortawesome/free-solid-svg-icons';
import { DomSanitizer } from '@angular/platform-browser'; import { DomSanitizer } from '@angular/platform-browser';
import { checkAnswer } from './checker';
...@@ -230,7 +231,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -230,7 +231,7 @@ export class PlayComponent implements OnInit, OnDestroy {
initDefaultData() { initDefaultData() {
const data = {"sentenceArr":[{"text":"1. She was not only _ but also very musical.","answer":"starfish"},{"text":"2. A _ is a flat sea creature in the shape of a star with five arms.","answer":"sea horse"},{"text":"3. A _ is a small sea fish with a horse-like head.","answer":"stream"},{"text":"4. There was a small _ at the end of the garden.","answer":"intelligent"}],"templateArr":[{"formUrl":"https://staging-teach.cdn.ireadabc.com/h5template/JM_4-2/v11/index.html?type=form&key=1","template":{"id":740,"uuid":"b4279bef-f779-4ab7-be76-f1af96713a86","name":"JM_4-2","description":"JM04-02拼句子","interaction_type":"","recommend_type":"","cover":"https://staging-teach.cdn.ireadabc.com/d5baf57d-0175-4640-93a5-6baaff117867.png","type":1,"t_type":2,"form_url":"index.html?type=form","play_url":"index.html","developer_id":12,"git":"{\"id\":791,\"ssh\":\"git@vcs.ireadabc.com:template/JM_4-2.git\",\"http\":\"https://vcs.ireadabc.com/template/JM_4-2.git\"}","del":0,"publish":1,"last_version":11,"pub_date":null,"is_public":0,"created_date":"2021-07-26T10:01:26.000Z","updated_date":"2021-08-02T03:24:44.000Z"},"data":{"sentenceArr":[{"answer":"Sea horse","text":"1. _ is a small sea fish that swims in a vertical position and has a head that looks like the head of a horse. ","audio_url":"https://staging-teach.cdn.ireadabc.com/a9f91947f324c79d0d640aa4995cbcd2.mp3"},{"answer":"intelligent","text":"2. The dolphin is an _ animal. ","audio_url":"https://staging-teach.cdn.ireadabc.com/291f7ad56dd0999112256172c4331829.mp3"},{"answer":"stream","text":"3. A _ flowed gently down into the valley. ","audio_url":"https://staging-teach.cdn.ireadabc.com/9520380ba7ebf7fedb69b4ced3d53502.mp3"},{"answer":"starfishes","text":"4. In the oceans, you can find _ and sea horses. They are interesting and beautiful sea animals. ","audio_url":"https://staging-teach.cdn.ireadabc.com/41def023ed829fb5faf197b5de29b7cb.mp3"}],"templateArr":[],"title":"请同学们根据图示的主题自己通过朗读创作一篇文章"}},{"formUrl":"https://staging-teach.cdn.ireadabc.com/h5template/JM04-3/v10/index.html?type=form&key=2","template":{"id":733,"uuid":"3900b0f7-d041-490e-9b42-da8d3855633b","name":"JM04-3","description":"JM04-03拼单词","interaction_type":"","recommend_type":"","cover":"https://staging-teach.cdn.ireadabc.com/0455da10-c452-4cec-9f01-530536b886b3.png","type":1,"t_type":2,"form_url":"index.html?type=form","play_url":"index.html","developer_id":119,"git":"{\"id\":784,\"ssh\":\"git@vcs.ireadabc.com:template/JM04-3.git\",\"http\":\"https://vcs.ireadabc.com/template/JM04-3.git\"}","del":0,"publish":1,"last_version":10,"pub_date":null,"is_public":0,"created_date":"2021-07-20T06:18:52.000Z","updated_date":"2021-08-01T13:16:43.000Z"},"data":{"contentObj":{"version":"1.0","dataKey":"DataKey_JM04_3","title":{"NO":"C","mainText":"Solve the puzzle using the given clue","mainTextAudio_url":""},"size":{"wh":"12*12"},"dataArray":[{"image_url":"","audio_url":"","text":"smart and possessing sound knowledge","uuid":"9803c50c-3638-4a6a-a4f8-719bdeaacede","direction":"Across"},{"image_url":"","audio_url":"","direction":"Across","text":"running water flowing on the earth","uuid":"239d1dde-4fea-40a7-bc02-4fe681e6f20c"},{"image_url":"","audio_url":"","direction":"Across","text":"a fish whose head look like those of a horse","uuid":"5ae09383-2c3f-4c35-9ed8-f3f7c463dc3c"},{"image_url":"","audio_url":"","direction":"Down","text":"a star-shaped sea animal","uuid":"c9d5aeeb-e37a-41a7-8473-df34d28f1779"}],"grid":[[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[3],"text":"s"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[1],"text":"s"},{"index":[3],"text":"t"},{"index":[1],"text":"r"},{"index":[1],"text":"e"},{"index":[1],"text":"a"},{"index":[1],"text":"m"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[2],"text":"s"},{"index":[2],"text":"e"},{"index":[3],"text":"a"},{"index":[2],"text":"h"},{"index":[2],"text":"o"},{"index":[2],"text":"r"},{"index":[2],"text":"s"},{"index":[2],"text":"e"},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[3],"text":"r"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[3],"text":"f"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[3],"text":"i"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[3],"text":"s"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[3],"text":"h"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[0],"text":"i"},{"index":[0],"text":"n"},{"index":[0],"text":"t"},{"index":[3],"text":"e"},{"index":[0],"text":"l"},{"index":[0],"text":"l"},{"index":[0],"text":"i"},{"index":[0],"text":"g"},{"index":[0],"text":"e"},{"index":[0],"text":"n"},{"index":[0],"text":"t"}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[3],"text":"s"},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}],[{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""},{"index":[],"text":""}]]}}}],"title":"Vocabulary box","bg_url":"https://staging-teach.cdn.ireadabc.com/892d0db2075efa3fa7aea6911bf36a83.png"} const data = {"sentenceArr":[{"text":"111 _ 2222 3333 4444.!","answer":"1111","answerType":"occupation","isChangeLine":true},{"text":"555 666 _ 777 8888 99999!","answer":"2222","answerType":"date","isChangeLine":true},{"text":"111 _ 2222","answer":"3"},{"text":"444 _ 44444","answer":"4"},{"text":"555 _ 5555555","answer":"5"}],"templateArr":[],"title":"aaa aaa","tipArr":[[{"text":"44"},{"text":"1"}],[{"text":"222"},{"text":"555","isShowIcon":true},{"text":"666","isShowIcon":true},{"text":"777","isShowIcon":true}]],"bgItem":{"url":"http://staging-teach.cdn.ireadabc.com/b876b9b2748414253c662d32177b4178.png","rect":{"x":78.8,"y":0,"width":1033.41,"height":456}},"hotZoneItemArr":[{"id":"1632387004410","index":0,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"name","posX":390.5,"posY":192,"rect":{"x":226.2,"y":166,"width":171,"height":52}},{"id":"1632387054795","index":1,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"time","posX":593.4958429447247,"posY":"192","rect":{"x":429.2,"y":166,"width":171,"height":52}},{"id":"1632387061874","index":2,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"city","posX":801.4958429447247,"posY":"192","rect":{"x":637.2,"y":166,"width":171,"height":52}},{"id":"1632387063064","index":3,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"work","posX":1004.4958429447247,"posY":"192","rect":{"x":840.2,"y":166,"width":171,"height":52}},{"id":"1632387122910","index":4,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"name","posX":389.4958429447247,"posY":265.99921052956194,"rect":{"x":225.2,"y":240,"width":171,"height":52}},{"id":"1632387127274","index":5,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"time","posX":594.4950082442094,"posY":264.99921052956194,"rect":{"x":430.2,"y":239,"width":171,"height":52}},{"id":"1632387134147","index":6,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"city","posX":800.4941529845682,"posY":265.99921052956194,"rect":{"x":636.19,"y":240,"width":171,"height":52}},{"id":"1632387139551","index":7,"itemType":"rect","fontScale":0.93046875,"imgScale":1,"imgSizeW":0,"imgSizeH":0,"mapScale":0.93046875,"dragDot":{"x":595.5,"y":228},"gIdx":"0","selectType":"work","posX":1005.4933182840531,"posY":266.99921052956194,"rect":{"x":841.19,"y":241,"width":171,"height":52}}],"bg_url":"http://staging-teach.cdn.ireadabc.com/ea1a5b5a1de77baf71c49ccf3a2f690f.jpg"};
this.data = { contentObj: data }; this.data = { contentObj: data };
...@@ -272,6 +273,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -272,6 +273,7 @@ export class PlayComponent implements OnInit, OnDestroy {
// this.mapScale = this.canvasWidth / this.canvasBaseW; // this.mapScale = this.canvasWidth / this.canvasBaseW;
// this.mapScale = this.canvasHeight / this.canvasBaseH; // this.mapScale = this.canvasHeight / this.canvasBaseH;
this.renderArr = []; this.renderArr = [];
this.topArr = [];
console.log(' in initData', this.data); console.log(' in initData', this.data);
...@@ -440,6 +442,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -440,6 +442,7 @@ export class PlayComponent implements OnInit, OnDestroy {
addPicUrl(contentObj.bgItem?.url || ''); addPicUrl(contentObj.bgItem?.url || '');
addPicUrl(contentObj.bg_url || '');
} }
...@@ -518,11 +521,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -518,11 +521,11 @@ export class PlayComponent implements OnInit, OnDestroy {
gameStart() { gameStart() {
console.log(' in gameStart '); console.log(' in gameStart ');
if (this.isTeacher) { if (this.isTeacher) {
this.sentBtn.visible = false; this.sendBtn.visible = false;
this.sentBtn.shadowSpr.visible = false; this.sendBtn.shadowSpr.visible = false;
this.maskPic.visible = true; this.maskPic.visible = true;
} else { } else {
this.changeBtnOn(); // this.changeBtnOn();
this.maskPic.visible = false; this.maskPic.visible = false;
} }
...@@ -588,6 +591,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -588,6 +591,10 @@ export class PlayComponent implements OnInit, OnDestroy {
this.initBg(); this.initBg();
this.initHotZone(); this.initHotZone();
this.setOneBtn();
this.initMaskPic();
// this.gameStart();
// this.initBtn(); // this.initBtn();
...@@ -602,7 +609,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -602,7 +609,7 @@ export class PlayComponent implements OnInit, OnDestroy {
// this.initMaskPic(); // this.initMaskPic();
// this.relink(); this.relink();
// // this.gameStart(); // // this.gameStart();
// // this.testInput() // // this.testInput()
...@@ -646,6 +653,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -646,6 +653,11 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
const inputView = this.inputView; const inputView = this.inputView;
if (inputView.callback) {
inputView.onblur();
}
inputView.show(); inputView.show();
inputView.x = rect.x / this.canvasScale ; // this.canvasWidth / 2; inputView.x = rect.x / this.canvasScale ; // this.canvasWidth / 2;
...@@ -684,22 +696,23 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -684,22 +696,23 @@ export class PlayComponent implements OnInit, OnDestroy {
if (progress == '1') { if (progress == '1') {
this.gameStart();
const resultData = this.getPageData('resultData') const resultData = this.getPageData('resultData')
if (resultData) { if (resultData) {
this.initResultView(resultData); this.initResultView(resultData);
return; return;
} }
this.gameStart();
return; return;
} }
if (progress == '2' || progress == '3') { // if (progress == '2' || progress == '3') {
const submitCount = this.getPageData('submitCount') // const submitCount = this.getPageData('submitCount')
this.submitCount = submitCount; // this.submitCount = submitCount;
this.checkShowSubTemplateOne(); // this.checkShowSubTemplateOne();
return; // return;
} // }
} }
...@@ -736,9 +749,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -736,9 +749,10 @@ export class PlayComponent implements OnInit, OnDestroy {
setRectRight(data) { setRectRight(data) {
for (let i=0; i<this.sentenceEmptyArr.length; i++) { for (let i=0; i<this.hotZoneArr.length; i++) {
if (data[i]) { this.hotZoneArr[i].result = data[i];
this.sentenceEmptyArr[i].isRight = true; if (data[i] && data[i].right) {
this.hotZoneArr[i].isRight = true;
} }
} }
} }
...@@ -748,6 +762,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -748,6 +762,8 @@ export class PlayComponent implements OnInit, OnDestroy {
moreBtn; moreBtn;
initResultView(data = null) { initResultView(data = null) {
this.setAnswerData();
if (data) { if (data) {
this.setRectRight(data); this.setRectRight(data);
} else { } else {
...@@ -773,7 +789,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -773,7 +789,7 @@ export class PlayComponent implements OnInit, OnDestroy {
bgItem.init(this.images.get("result_bg_item")); bgItem.init(this.images.get("result_bg_item"));
bg.addChild(bgItem); bg.addChild(bgItem);
const panelOffY = -50 * this.mapScale; const panelOffY = 0 //-50 * this.mapScale;
const panel = new MySprite(); const panel = new MySprite();
panel.init(this.images.get("result_panel")); panel.init(this.images.get("result_panel"));
panel.setScaleXY(this.mapScale); panel.setScaleXY(this.mapScale);
...@@ -806,14 +822,14 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -806,14 +822,14 @@ export class PlayComponent implements OnInit, OnDestroy {
btn.init(this.images.get("big_btn")); btn.init(this.images.get("big_btn"));
btn.setScaleXY(this.mapScale); btn.setScaleXY(this.mapScale);
btn.y = panel.y + ( panel.height / 2 + 120 ) * panel.scaleY; btn.y = panel.y + ( panel.height / 2 + 120 ) * panel.scaleY;
resultLayer.addChild(btn, 2); // resultLayer.addChild(btn, 2);
this.moreBtn = btn; // this.moreBtn = btn;
const btnShadow = new MySprite(); const btnShadow = new MySprite();
btnShadow.init(this.images.get("big_btn_shadow")); btnShadow.init(this.images.get("big_btn_shadow"));
btnShadow.setScaleXY(this.mapScale); btnShadow.setScaleXY(this.mapScale);
btnShadow.y = btn.y + 30 * this.mapScale; btnShadow.y = btn.y + 30 * this.mapScale;
resultLayer.addChild(btnShadow); // resultLayer.addChild(btnShadow);
const btnLabel = new Label(); const btnLabel = new Label();
...@@ -842,8 +858,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -842,8 +858,10 @@ export class PlayComponent implements OnInit, OnDestroy {
getResultData() { getResultData() {
const dataArr = []; const dataArr = [];
for (let i=0; i<this.sentenceEmptyArr.length; i++) { for (let i=0; i<this.hotZoneArr.length; i++) {
dataArr.push(this.sentenceEmptyArr[i].isRight == true); const result = this.hotZoneArr[i].result;
result.userAnswer = this.hotZoneArr[i].label?.text || '';
dataArr.push(result);
} }
return dataArr; return dataArr;
} }
...@@ -862,41 +880,49 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -862,41 +880,49 @@ export class PlayComponent implements OnInit, OnDestroy {
this.resultPanel.addChild(resultSv); this.resultPanel.addChild(resultSv);
this.resultSv = resultSv; this.resultSv = resultSv;
console.log('hotZoneArr: ', this.hotZoneArr);
let baseY = 0 //-500; let baseY = 0 //-500;
for (let i=0; i<this.sentenceArr.length; i++) { for (let i=0; i<this.hotZoneArr.length; i++) {
const richText = new RichText(); const richText = new RichText();
richText.disH = 5; richText.disH = 5;
// richText.x = -this.panel.width / 2 * 0.9 // richText.x = -this.panel.width / 2 * 0.9
richText.x = 0.05 * this.panel.width; richText.x = 0.05 * this.resultPanel.width;
richText.y = baseY + 80; richText.y = baseY + 80;
richText.fontSize = 48; richText.fontSize = 48;
richText.width = this.panel.width * 0.9; richText.width = this.resultPanel.width * this.mapScale * 0.9;
richText.fontColor = '#ffffff' richText.fontColor = '#ffffff'
richText.fontName = 'DroidSansFallback'; richText.fontName = 'DroidSansFallback';
richText.text = this.sentenceArr[i].text; richText.text = this.hotZoneArr[i].result.userAnswer;
// this.resultPanel.addChild(richText, 1) // this.resultPanel.addChild(richText, 1)
resultSv.addItem(richText);
const rect = richText.getSubTextRect('____________________'); // const rect = richText.getBoundingBox();
// richText.refreshSize();
const rect = {x: richText.x, y: richText.y, width: richText.width * 0.5, height: richText.fontSize};
rect.width += 8; rect.width += 8;
rect.height += 16; rect.height += 16;
const colorRect = new ShapeRectNew(); const colorRect = new ShapeRectNew();
colorRect.setSize(rect.width, rect.height, 10); colorRect.setSize(rect.width, rect.height, 10);
// colorRect.alpha = 0.3;
colorRect.fillColor = '#007b3e' colorRect.fillColor = '#007b3e'
const offX = 9; const offX = 9;
colorRect.x = rect.x + offX; colorRect.x = rect.x // + offX;
colorRect.y = -rect.height / 2; colorRect.y = rect.y - rect.height / 2;
// colorRect.alpha = 0.5; // colorRect.alpha = 0.5;
richText.addChild(colorRect); resultSv.addItem(colorRect);
resultSv.addItem(richText);
baseY = richText.y + richText.getAreaHeight(); baseY = richText.y + richText.getAreaHeight();
if (!this.sentenceEmptyArr[i].isRight) { if (!this.hotZoneArr[i].isRight) {
colorRect.fillColor = '#d71818' colorRect.fillColor = '#d71818'
const infoBg = new MySprite(); const infoBg = new MySprite();
...@@ -919,7 +945,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -919,7 +945,7 @@ export class PlayComponent implements OnInit, OnDestroy {
infoLabel.width = infoBg.width; infoLabel.width = infoBg.width;
infoLabel.fontColor = '#ffe9b1' infoLabel.fontColor = '#ffe9b1'
infoLabel.fontName = 'Aileron-Black'; infoLabel.fontName = 'Aileron-Black';
infoLabel.text = this.sentenceArr[i].answer; infoLabel.text = this.hotZoneArr[i].result?.info || '';
infoBg.addChild(infoLabel); infoBg.addChild(infoLabel);
} else { } else {
...@@ -927,7 +953,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -927,7 +953,7 @@ export class PlayComponent implements OnInit, OnDestroy {
labelAnswer.fontSize = 48; labelAnswer.fontSize = 48;
labelAnswer.fontColor = '#ffffff' labelAnswer.fontColor = '#ffffff'
labelAnswer.fontName = 'Aileron-Black'; labelAnswer.fontName = 'Aileron-Black';
labelAnswer.text = this.sentenceArr[i].answer; labelAnswer.text = this.hotZoneArr[i].result?.info || '';
labelAnswer.setScaleXY(1); labelAnswer.setScaleXY(1);
labelAnswer.textAlign = 'center'; labelAnswer.textAlign = 'center';
...@@ -939,7 +965,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -939,7 +965,7 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
if (i != this.sentenceArr.length - 1) { if (i != this.hotZoneArr.length - 1) {
const line = new MySprite(); const line = new MySprite();
line.init(this.images.get("line")); line.init(this.images.get("line"));
line.x = this.resultPanel.width / 2; line.x = this.resultPanel.width / 2;
...@@ -1011,7 +1037,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1011,7 +1037,7 @@ export class PlayComponent implements OnInit, OnDestroy {
if (this.isTeacher) { if (this.isTeacher) {
this.initSentBtn(); this.initsendBtn();
return; return;
} }
...@@ -1053,8 +1079,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1053,8 +1079,8 @@ export class PlayComponent implements OnInit, OnDestroy {
this.submitOff(); this.submitOff();
} }
sentBtn; sendBtn;
initSentBtn() { initsendBtn() {
const panel = this.panel; const panel = this.panel;
...@@ -1063,14 +1089,15 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1063,14 +1089,15 @@ export class PlayComponent implements OnInit, OnDestroy {
btn.setScaleXY(this.mapScale); btn.setScaleXY(this.mapScale);
btn.x = this.canvasWidth / 2; btn.x = this.canvasWidth / 2;
btn.y = panel.y + ( panel.height / 2 - 120 ) * panel.scaleY; btn.y = panel.y + ( panel.height / 2 - 120 ) * panel.scaleY;
this.sentBtn = btn; this.sendBtn = btn;
const btnShadow = new MySprite(); const btnShadow = new MySprite();
btnShadow.init(this.images.get("big_btn_shadow")); btnShadow.init(this.images.get("big_btn_shadow"));
btnShadow.setScaleXY(this.mapScale); btnShadow.setScaleXY(this.mapScale);
btnShadow.x = btn.x; btnShadow.x = btn.x;
btnShadow.y = btn.y + 20 * this.mapScale; btnShadow.y = btn.y + 20 * this.mapScale;
this.sentBtn.shadowSpr = btnShadow; this.sendBtn.shadowSpr = btnShadow;
const btnLabel = new Label(); const btnLabel = new Label();
btnLabel.fontSize = 64; btnLabel.fontSize = 64;
...@@ -1503,6 +1530,15 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1503,6 +1530,15 @@ export class PlayComponent implements OnInit, OnDestroy {
okBtnClick() {
this.checkPanel.visible = false;
this.initResultView();
}
cancelBtnClick() {
this.checkPanel.visible = false;
}
curMoveItem = null; curMoveItem = null;
...@@ -1526,8 +1562,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1526,8 +1562,8 @@ export class PlayComponent implements OnInit, OnDestroy {
if (this.isTeacher) { if (this.isTeacher) {
if (this.sentBtn && this.sentBtn.visible) { if (this.sendBtn && this.sendBtn.visible) {
if (this.checkClickTarget(this.sentBtn)) { if (this.checkClickTargetSv(this.sendBtn)) {
this.sendServerEvent('game_start', {}); this.sendServerEvent('game_start', {});
this.setPageData('progress', '1'); this.setPageData('progress', '1');
this.playAudio('submit', true); this.playAudio('submit', true);
...@@ -1539,6 +1575,37 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1539,6 +1575,37 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
if (this.checkPanel && this.checkPanel.visible) {
if (this.checkClickTarget(this.okBtn)) {
this.okBtnClick();
return;
}
if (this.checkClickTarget(this.cancelBtn)) {
this.cancelBtnClick();
return;
}
return;
}
if (this.resultPanel) {
if (this.checkClickTarget(this.resultSv)) {
this.resultSv.onTouchStart(this.mx, this.my);
return;
}
return;
}
if (this.submitBtn && this.submitBtn.visible) {
if (this.checkClickTargetSv(this.submitBtn)) {
this.submitBtnClick();
return;
}
}
for (let i = 0; i < this.hotZoneArr.length; i++) { for (let i = 0; i < this.hotZoneArr.length; i++) {
if (this.checkClickTargetSv(this.hotZoneArr[i])) { if (this.checkClickTargetSv(this.hotZoneArr[i])) {
...@@ -1573,6 +1640,12 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1573,6 +1640,12 @@ export class PlayComponent implements OnInit, OnDestroy {
event.preventDefault() event.preventDefault()
} }
if (this.resultPanel) {
this.resultSv.onTouchMove(this.mx, this.my);
return;
}
this.scrollView.onTouchMove(this.mx, this.my); this.scrollView.onTouchMove(this.mx, this.my);
return; return;
...@@ -1607,6 +1680,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1607,6 +1680,11 @@ export class PlayComponent implements OnInit, OnDestroy {
mapUp(event) { mapUp(event) {
if (this.resultPanel) {
this.resultSv.onTouchEnd(this.mx, this.my);
return;
}
this.scrollView.onTouchEnd(this.mx, this.my); this.scrollView.onTouchEnd(this.mx, this.my);
return; return;
...@@ -1696,16 +1774,63 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1696,16 +1774,63 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
addLabelMask(target, label) { addLabelMask(target, label) {
const rect = target.getBoundingBox(); const box = target.getBoundingBox();
// const mask = new ShapeRect();
// mask.setSize(400, 400);
// mask.fillColor = '#ff0000';
// // const mask = new MySprite();
// // mask.init(this.images.get("mask"))
// // mask.x = rect.x;
// // mask.y = rect.y;
// // const sx = rect.width / mask.width;
// // const sy = rect.height / mask.height;
// // mask.scaleX = sx;
// // mask.scaleY = sy;
// // this.scrollView.addItem(mask);
// // label.addMaskSpr(mask);
// // mask.x = 200;
// // mask.y = 200;
const mask = new ShapeRect();
mask.x = rect.x;
mask.y = rect.y;
mask.setSize(rect.width, rect.height);
label.addMaskSpr(mask);;
// // const label1 = new MySprite();
// // label1.init(this.images.get("btn_bg"))
// // label1.setScaleXY(2);
// const label1 = this.getFillLabel();
// label1.text = 'aaaaaaaa a a a a a a a a a a a a a a ';
// label1.x = 400;
// label1.y = 400;
// label1.width = mask.width;
// label1.height = mask.height;
// label1.textBaseline = 'top';
// // label1.setMaxSize(rect.width);
// this.renderArr.push(mask);
// this.renderArr.push(label1);
// // mask.setMaskType("destination-in");
// // // label1.addMaskSpr(mask)
// // mask.addMaskSpr(label1);
// label1.addMaskSpr(mask);
label.width = box.width;
label.height = box.height;
label.x = box.width / 2;
label.y = box.height / 2;
const rect = new ShapeRect();
rect.setSize(box.width, box.heigth);
label.addMaskSpr(rect);
} }
emptyRectDown(targetRect) { emptyRectDown(targetRect) {
...@@ -1713,8 +1838,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1713,8 +1838,10 @@ export class PlayComponent implements OnInit, OnDestroy {
if (!targetRect.label) { if (!targetRect.label) {
const label = this.getFillLabel(); const label = this.getFillLabel();
label.disH = 0; label.disH = 0;
label.offW = 0;
label.textBaseline = 'top' label.textBaseline = 'top'
label.width = targetRect.width; label.width = targetRect.width;
label.fontSize *= (this.bg.scaleX);
// targetRect.label.x = ( targetRect.width / 2 ) // targetRect.label.x = ( targetRect.width / 2 )
targetRect.label = label; targetRect.label = label;
targetRect.addChild(targetRect.label); targetRect.addChild(targetRect.label);
...@@ -1737,10 +1864,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1737,10 +1864,10 @@ export class PlayComponent implements OnInit, OnDestroy {
const rect = {x, y, width, height}; const rect = {x, y, width, height};
const style = { const style = {
'font-size' : 56 / this.canvasScale * scale + 'px', 'font-size' : 56 / this.canvasScale * this.bg.scaleX + 'px',
'color' : '#000000', 'color' : '#000000',
'font-family' : 'Aileron-Bold', 'font-family' : 'Aileron-Bold',
'line-height' : 56 / this.canvasScale * scale + 'px', 'line-height' : 56 / this.canvasScale * this.bg.scaleX + 'px',
} }
this.showInputView(style, rect, targetRect.label.text || '', (value) => { this.showInputView(style, rect, targetRect.label.text || '', (value) => {
targetRect.label.text = value; targetRect.label.text = value;
...@@ -1765,12 +1892,60 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1765,12 +1892,60 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
} }
checkPanel;
okBtn;
cancelBtn;
showCheckPanel() {
if (!this.checkPanel) {
this.checkPanel = new MySprite();
this.checkPanel.init(this.images.get("check_panel"));
this.checkPanel.setScaleXY(this.mapScale);
this.checkPanel.x = this.canvasWidth / 2;
this.checkPanel.y = this.canvasHeight / 2;
const label = new Label();
label.text = '本题只能提交一次,确认提交吗?'
label.textAlign = 'center';
label.fontColor = '#ffffff';
label.fontSize = 56 //* this.mapScale;
label.fontName = 'Aileron-Black';
label.y = -70;
this.checkPanel.addChild(label);
// label.x = this.checkPanel.width / 2;
// label.y = this.checkPanel.height / 2;
const offX = 300;
const okBtn = new MySprite()
okBtn.init(this.images.get("check_ok"));
this.checkPanel.addChild(okBtn);
okBtn.x = offX;
okBtn.y = 130;
this.okBtn = okBtn;
const cancelBtn = new MySprite()
cancelBtn.init(this.images.get("check_cancel"));
this.checkPanel.addChild(cancelBtn);
cancelBtn.x = -offX;
cancelBtn.y = okBtn.y;
this.cancelBtn = cancelBtn;
this.renderArr.push(this.checkPanel);
}
this.checkPanel.visible = true;
}
submitBtnClick() { submitBtnClick() {
this.submitCount ++; // this.submitCount ++;
const btnBaseY = this.submitBtn['baseY']; const btnBaseY = this.submitBtn.y;
const btnTargetY = this.submitBtn['baseY'] + 5 * this.mapScale; const btnTargetY = btnBaseY + 5 * this.mapScale;
const baseS = this.submitBtn.scaleX; const baseS = this.submitBtn.scaleX;
const targetS = baseS * 0.95; const targetS = baseS * 0.95;
...@@ -1779,41 +1954,48 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1779,41 +1954,48 @@ export class PlayComponent implements OnInit, OnDestroy {
this.canTouch = false; this.canTouch = false;
tweenChange(this.submitBtn, {y: btnTargetY, scaleX: targetS, scaleY: targetS}, time, ()=> { tweenChange(this.submitBtn, {y: btnTargetY, scaleX: targetS, scaleY: targetS}, time, ()=> {
// tweenChange(this.submitBtn, {y: btnBaseY, scaleX: baseS, scaleY: baseS}, time) // tweenChange(this.submitBtn, {y: btnBaseY, scaleX: baseS, scaleY: baseS}, time)
tweenChange(this.submitBtn, {y: btnBaseY, scaleX: baseS, scaleY: baseS}, time, () => {
this.canTouch = true; this.canTouch = true;
})
this.submitOff(); this.showCheckPanel();
const isAllRight = this.checkAnswer(); // this.submitOff();
// const isAllRight = this.checkAnswer();
if (isAllRight || this.submitCount >= 2) {
this.changeBtnOff();
this.btnArr = [];
// if (isAllRight || this.submitCount >= 2) {
// this.changeBtnOff();
// this.btnArr = [];
delayCall(0.3, ()=> {
this.initResultView();
this.setPageData('progress', '2', false); // delayCall(0.3, ()=> {
this.setPageData('submitCount', this.submitCount); // this.initResultView();
this.serverSendAnswer('4-1', this.resultAnswerArr);
}) // this.setPageData('progress', '2', false);
} // this.setPageData('submitCount', this.submitCount);
// this.serverSendAnswer('4-1', this.resultAnswerArr);
// })
// }
}) })
const shadow = this.submitBtn.shadowSpr; const shadow = this.submitBtn.shadowSpr;
const shadowBaseY = shadow['baseY']; const shadowBaseY = shadow.y //shadow['baseY'];
const shadowTargetY = shadow['baseY'] - 15 * this.mapScale; const shadowTargetY = shadowBaseY - 15 * this.mapScale;
tweenChange(shadow, {y: shadowTargetY, alpha: 0}, time, ()=> { tweenChange(shadow, {y: shadowTargetY, alpha: 0}, time, ()=> {
// tweenChange(shadow, {y: shadowBaseY, alpha: 1}, time) shadow.y = shadowBaseY;
shadow.alpha = 1;
tweenChange(shadow, {y: shadowBaseY, alpha: 1}, time)
}) })
this.addResultAnswer(); // this.addResultAnswer();
} }
...@@ -1850,22 +2032,30 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1850,22 +2032,30 @@ export class PlayComponent implements OnInit, OnDestroy {
checkAnswer() { setAnswerData() {
let isAllRight = true; let isAllRight = true;
for (let i=0; i<this.sentenceEmptyArr.length; i++) { for (let i=0; i<this.hotZoneArr.length; i++) {
const rightData = this.sentenceArr[i]; const data = this.hotZoneArr[i].data;
console.log('rightData: ', rightData); console.log('data: ', data);
const answer = this.sentenceEmptyArr[i].label.text; let answer = this.hotZoneArr[i].label?.text || '';
console.log('answer: ', answer) console.log('data.selectType: ', data.selectType);
if (rightData.answer != answer) { console.log('answer: ', answer);
this.removeRectText( this.sentenceEmptyArr[i] );
// answer = answer.replace(/\n/g," ");
const result = checkAnswer(data.selectType, answer, this.hotZoneArr[i].labelText || null);
this.hotZoneArr[i].result = result;
if (!result.right) {
// this.removeRectText( this.hotZoneArr[i] );
isAllRight = false; isAllRight = false;
} else { } else {
this.showSentenceRight(this.sentenceEmptyArr[i]); this.hotZoneArr[i].isRight = true;
// this.showSentenceRight(this.hotZoneArr[i]);
} }
} }
...@@ -2309,11 +2499,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2309,11 +2499,11 @@ export class PlayComponent implements OnInit, OnDestroy {
this.updateArr(this.renderArr); this.updateArr(this.renderArr);
// this.updateArr(this.topArr); this.updateArr(this.topArr);
// if (this.curMoveItem) { // if (this.curMoveItem) {
// this.curMoveItem.update(); // this.curMoveItem.update();
// } // }
// this.updateItem(this.maskPic); this.updateItem(this.maskPic);
// this.updateArr(this.endPageArr); // this.updateArr(this.endPageArr);
...@@ -2404,15 +2594,14 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2404,15 +2594,14 @@ export class PlayComponent implements OnInit, OnDestroy {
openBtn; openBtn;
getHotZoneItem(data) { getHotZoneItem(data) {
console.log(' item data: ', data); // console.log(' item data: ', data);
switch(data.gIdx) { switch(data.gIdx) {
case "0": case "0":
return this.setOneRect(data); return this.setOneRect(data);
case "1": case "1":
return; return //this.setOneBtn(data);
} }
...@@ -2465,6 +2654,48 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2465,6 +2654,48 @@ export class PlayComponent implements OnInit, OnDestroy {
// return item; // return item;
} }
setOneBtn() {
const btnRes = this.isTeacher ? 'send' : 'submit';
const btn = new MySprite()
btn.init(this.images.get(btnRes));
btn.setScaleXY(this.mapScale);
// btn.setScaleXY(1 / this.bg.scaleX);
const content = this.scrollView.content;
btn.x = content.width - btn.width / 2 * btn.scaleX - 20;
btn.y = content.height + btn.height / 2 * btn.scaleY;
if (this.isTeacher) {
this.sendBtn = btn;
} else {
this.submitBtn = btn;
}
const btnShadow = new MySprite();
btnShadow.init(this.images.get("shadow"));
btnShadow.setScaleXY(this.mapScale);
btnShadow.x = btn.x;
btnShadow.y = btn.y + 30 * this.mapScale;
btn['shadowSpr'] = btnShadow;
this.scrollView.addItem(btnShadow);
this.scrollView.addItem(btn);
return btn;
// const item = new ShapeRect(this.ctx);
// item.setSize(saveRect.width, saveRect.height);
// item.x = saveRect.x
// item.y = saveRect.y
// // item.setScaleXY(this.bg.scaleX);
// item.fillColor = '#ff0000';
// item['data'] = data;
// item.alpha = 0;
}
setOneRect(data) { setOneRect(data) {
const saveRect = data.rect; const saveRect = data.rect;
...@@ -2821,7 +3052,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2821,7 +3052,7 @@ export class PlayComponent implements OnInit, OnDestroy {
checkClickTargetSv(target) { checkClickTargetSv(target) {
console.log('target: ', target); // console.log('target: ', target);
const scale = 1 // this.mapScale; const scale = 1 // this.mapScale;
......
const res = [ const res = [
['bg', "assets/play/bg.png"], ['bg', "assets/play/bg.png"],
['mask', "assets/play/mask.png"],
['shadow', "assets/play/shadow.png"],
['send', "assets/play/send.png"],
['submit', "assets/play/submit.png"],
['bg_item', "assets/play/bg_item.png"], ['bg_item', "assets/play/bg_item.png"],
['btn', "assets/play/btn.png"], ['btn', "assets/play/btn.png"],
['btn_off', "assets/play/btn_off.png"], ['btn_off', "assets/play/btn_off.png"],
['panel', "assets/play/panel.png"], ['panel', "assets/play/panel.png"],
['panel_item', "assets/play/panel_item.png"], ['panel_item', "assets/play/panel_item.png"],
['btn_bg', "assets/play/btn_bg.png"], ['btn_bg', "assets/play/btn_bg.png"],
['submit', "assets/play/submit.png"],
['submit_off', "assets/play/submit_off.png"], ['submit_off', "assets/play/submit_off.png"],
['submit_shadow', "assets/play/submit_shadow.png"], ['submit_shadow', "assets/play/submit_shadow.png"],
['check_panel', "assets/play/check_panel.png"],
['check_shadow', "assets/play/check_shadow.png"],
['check_ok', "assets/play/check_ok.png"],
['check_cancel', "assets/play/check_cancel.png"],
['result_bg', "assets/play/result_bg.png"], ['result_bg', "assets/play/result_bg.png"],
['result_bg_item', "assets/play/result_bg_item.png"], ['result_bg_item', "assets/play/result_bg_item.png"],
['result_panel', "assets/play/result_panel.png"], ['result_panel', "assets/play/result_panel.png"],
......
export const data = {
"device": ["vacuum cleaner", "electric fan", "air conditioner", "hair dryerstyler", "electric cooker", "desk lamp", "electric shaver", "micro wave oven", "frige", "washing machine", "electric heater", "fluorescent lamp", "dictaphone, dictating machine", "tape recorder", "television", "electric iron", "electric foot warmer", "electric vacuum cleaner", "bulb", "electronic oven", "radio", "loud-speaker", "refrigerator", "air conditioning", "microwave oven", "dry cell", "tap", "broiler", "defroster", "dicer", "dishwasher", "dryer", "eggbeater", "fan", "air-condition", "vertical disinfection cabinetffice", "horizontal disinfection cabinet", "pasteurize cupboard", "disinfectant tank", "household gas stove", "smoke exhauster", "air exhauster", "soya-bean milk grinder", "soya-bean milking", "food blender", "juice extractor", "filter purifier", "water dispenser", "can opener", "compactor", "freezer", "furnace", "humidifier", "iron", "juicer", "oven ", "percolator", "range hood", "rotisserie", "shaver", "stove", "toaster", "absorber", "ac accumulator", "ac azinuth comprator", "active loudspeaker", "acu automatic calling unit", "electric rice cooker", "electric kettle", "coffee maker", "blender", "toast oven", "exhaust fan", "disinfecting cabinet", "towel dispenser", "lcd tv", "electric fireplace", "wine cabinet", "cool freezer", "massager", "hair dryer", "electric toolbrush", "depilation equipment", "hair crimper", "compactordefroster", "lithium battery/cell", "lcd(liquid crystal displaytv", "electric fireplaceelectric fan", "electric toolbrushelectric iron", "tv", "computer", "drive", "monitor", "speaker", "air-conditioning", "flashlight", "calculator", "electric light", "electric calculator", "tube", "dictaphone,dictating machine", "electric shaverelectric cooker electric heaterelectric vacuum cleanerbulb", "microphone", "air conditioning microwave ovendry cell", "airconditioning", "electricfootwarmer", "electricshaver", "electriccooker", "electricheater", "electricvacuumcleaner", "electronicoven", "loudspeaker", "microwaveoven", "drycell", "boiler", "aircondition", "householdgasstove", "smokeexhauster", "airexhauster", "soyabeanmilkgrinder", "foodblender", "juiceextractor", "filterpurifier", "waterdispenser", "oven", "rangehood", "vacuumcleaner", "electriccalculator", "taperecorder", "projection lamp", "large screen splicing", "professional display", "industry display", "plasma panel display", "digital signage", "led display", "touch one machine", "touch screen", "recreational machine", "psp nds handheld game machine", "recreational machine ", "laser printer", "bubble jet printer", "multifunctional integrated machine", "large format printer", "scanner", "the fax machine", "copier", "copying machine", "dye sublimation printer", "projection booth", "projection screen", "electronic whiteboard", "automobile electric productsthe", "education electric products", "cd", "camera", "digital video (dv)", "camera lens", "mp3", "mp4", "u disk", "e-book", "electric book", "digital voice recorder", "earphone", "electric dictionary", "digital phone frameusb", "repeater", "point reading machine", "multimedia hard disk recoding", "portable source", "digital companion", "pick-up head", "desktop computer", "all-in-one desktops", "workstation", "jotter", "notebook", "netbooks", "iphone", "ipad", "panel computer", "computer components", "mouse", "liquid crystal display", "loudspeaker box", "voice box", "cell phone", "mobile phone", "phone", "gps", "walkie-talkie", "intercom", "telephone", "teleconference", "dial conference", "conference call", "do mobile phone", "electric toothbrush", "bath heater", "soap dispenser", "television set", "washer", "mosquito killer", "electric mosquito swatter", "electric mosquito repellent", "electro-thermal mosquito-repellent incense", "gas water heater", "electric water heater", "solar heater", "air source heat gong water heater", "water heater", "bracker fan", "desk fan", "floor fan", "ceiling fan", "wall fan", "air conditioning fan", "warm fan", "hand warmer", "heat insulation plate", "insulating pad", "insulation chests", "incubator", "hair removal device", "depilator", "shaving device", "electric eyebrow shaving device ", "electric eyelash curler", "beauty device", "crimping iron", "curler", "straighener", "pore cleaner", "nose hair trimmer", "electric manicure", "eyelash pen", "heating apparatus", "electric blanket", "foot bath", "ear cleaner", "hair cap", "electric massager", "barber", "the fat meter", "deaf-aid", "hemomanometer", "sphy gmomanometer", "pedometer", "bathroom scale", "weight balance", "weight scale", "glucometer", "moisture extractor", "humidity regulator", "perfuming machine", "perfuming device", "steam clean machine", "electronic trash", "air purifier", "air-cleaner", "water purifying machine", "vacuum cleaner,", "sweeping machine", "oxygen machine", "oxygen bar", "bread machine", "egg boiler", "steamed egg", "sandwich machine", "electric baking pan", "soybean milk machine", "ice cream machine", "coffee machine", "popcorn machine", "mill", "winepress,juicer", "fruit and vegetable cleaning machine", "clothes drier", "(electric) kettle", "electric cup", "fridge", "shoes dryer", "shoe polisher", "hand dryer", "electronic thermometer", "electronic timer", "reminder", "hair ball trim", "spin drier", "dehydrator", "agitator", "amalgamator", "cooking machine", "dish-washing machine", "food waste processor", "disinfection cabinet", "electric oven", "cheese furnace", "decoction vessel", "block shaving machine", "ice crusher", "fry ice machine", "hotplate,gas cooker", "casserole", "electromagnetic oven", "induction cooker", "electric (rice) cooker", "electric pressure cooker", "electric chafing dish", "the convection oven", "electric frying pan", "electric steamer", "the soup pot", "slow cooker ", "juicer ", "toaster ", "grill/barbeque ", "micro oven ", "toaster over", "coffer maker", "kettle", "ice cream maker", "break maker", "pasta maker", "mixer/blader", "food process", "deep fryer", "dishwasher ", "water pump", "compressed water pump", "Refrigerators", "freezers", "wine cabinets", "ice makers", "air conditioners", "washing machines", "dryers", "televisions", "home theaters", "projectors", "DVD players", "combination audio", "recorders", "tablets", "video game consoles", "Walkmans", "PDAs", "electronic dictionaries", "learning machines", "mobile memory", "digital cameras Electric paper books", "walkie-talkies", "car refrigerators", "mahjong machines", "fumes", "cooktops", "dishwashers", "disinfection cupboards", "gas water heaters", "electric hot water taps", "electric water heaters", "heat pump water heaters", "body cleaners", "hair dryers", "bathers", "dry mobile phones", "integrated ceiling", "soy milk machine", "rice cooker", "electric cake", "electric stew pot", "noodle machine", "yogurt machine", "fruit and vegetable detoxifier Egg-boiling machine", "egg-laying machine", "bean sprout machine", "oil press", "kitchen treasure", "garbage disposal machine", "solar water heater", "solar lawn lamp", "courtyard lamp", "solar toys", "solar panels", "0401 water treatment appliances: water dispensers", "water purifiers", "pure water machines", "soft water machines", "pipeline machines", "straight drinker", "defying vacuum cleaner", "steam mop", "sweeper", "floor waxing machine", "ironing machine", "shoe shine machine", "electric mosquito racket", "toilet deodorant", "cold fan", "dehumidifier", "negative oxygen ion occurrence devices", "small oxygen generators", "electric heaters", "electric blankets", "shavers", "curlers", "electric toothbrushes", "beauty devices", "electric breast pumps", "foot baths", "massage chairs", "massagers", "blood pressure meters", "thermometers", "body fat meters", "smart home systems", "Smart lighting control smart home central control system", "smart home ecological control", "smart shade", "smart door and window control", "smart socket", "security", "monitoring", "access control", "visual intercom", "set-top box", "smart switch", "information appliances", "home network system", "system integration product communication network and component sensor controller", "smart bracelet", "smart watch", "smart toys", "smart drop device", "router", "electrodrill", "electric drill", "electrical drill", "electron telescope", "electronic telescope"],
"side": [
"east",
"south",
"west",
"north",
"northeast",
"northwest",
"southeast",
"southwest",
"middle"
],
"work": ["Social workers", "personnelmanagers", "translators", "human mediators", "librarians", "journalists", "newspaper and magazine editors", "screenwriters", "book editors", "stone carvers", "carpenters", "cartoonists", "dancers", "instrument players", "construction and engineering management", "steel structure design and management personnel", "microcomputers", "electronic newspaper/e-magazine editors", "information managers", "kindergarten education teachers", "chain store managers", "marketing planning", "telecommunications engineers", "web designers", "Construction machinery operators", "electrical engineers", "mechanical cartographers", "architectural cartographers", "electronic processing data system operators", "photography staff", "merchant ship staff", "civil aviation transport pilots", "turbine personnel", "flight controllers", "dietitians", "eyewear professionals", "medical records managers", "insurance support personnel", "salesmen", "securities dealers", "sales agents", "real estate agents", "procurement personnel", "import and export clerks", "futures brokers", "accountants", "commercial art designers", "interior designers", "TV presenter", "advertising AE", "international trade practitioner", "international trade English clerk", "Chinese typist", "secretary of affairs", "information login", "assistant accountant", "quality control assistant", "warehouse manager", "production planning assistant", "distribution staff", "postman", "postal staff", "customs clearance Staff", "guest management", "bank clerks", "financial tellers", "foreign exchange traders", "travel agents", "tour guides", "flight attendants", "cultural relics narrator", "chef", "bartender", "Western food chef", "meal attendant", "nanny", "beauty barber", "beautician", "preservation Staff", "police", "fire workers", "fashion models", "merchandise salesmen", "pet beauticians", "horticultural crop growers", "nursery workers", "florists", "builders", "plumbers", "industrial plumbers", "industrial wiring operators", "indoor wiring workers", "electricians", "Sanitary plumbers", "magnetic brick pavers", "wiring workers", "painters", "automotive board goldworkers", "welders", "general board goldworkers", "special welders", "foundries", "metal mold makers", "fitters", "car repairmen", "automotive electricians", "Transaction machine repairer", "heavy mechanical repairman", "car chassis worker", "precision grinder", "milling machine worker", "numerical control lathe operator", "refrigeration air conditioner", "refrigeration air conditioner decorator", "audio-visual electronics worker", "industrial electronic worker", "bread baker", "motor repairer", "electrical repair Workers", "electronic instrument repairers", "jewelry and precious metals manufacturers", "precision gage manufacturers", "instrument tuners", "precision machinery", "ceramics workers", "printers", "printing design and plate makers", "bakers", "food and beverage technicians", "carpentry", "furniture carpentry", "Sewing", "weaver", "suit worker", "national clothing seamstress", "shoemaker", "garment design and production staff", "women's fitter", "garment worker", "heat treatment worker", "metal modeling", "metal surface treatment worker", "plate maker", "cold work", "planer", "metal plating Workers", "plastic mold manufacturers", "plastic products manufacturers", "rubber products manufacturers", "paper products manufacturers", "photo plate makers", "dairy manufacturers", "electronic assembly personnel", "automobile drivers", "fishing boat crews", "lathe workers", "oil and gas pressure automatic control personnel", "cleaning service personnel", "professional athletes teachers worker", "Teachers", "workers", "actors", "cooks", "doctors", "nurses", "drivers", "military personnel", "lawyers", "businessmen", "shop assistants", "cashiers", "writers", "models", "singers", "tailors", "judges", "security guards", "florists Waiter", "Cleaning workers", "architects", "hairdressers", "buyers", "designers", "firefighters", "mechanics", "magicians", "postmen", "lifeguards", "athletes", "engineers", "pilots", "administrators", "brokers", "auditors", "Cartoonist", "gardener", "scientist", "host", "make-up artist", "music festival", "artist", "pastry chef", "dessertr", "athlete", "diplomat", "dancer", "archery", "actor", "skater", "piano player", "guzheng hand", "designer", "bar owner", "CEO", "Amusement park owner", "captain", "journalist", "racer", "lawyer", "barber", "taekwondo coach", "veterinarian", "special police", "masseuse Java software engineer", "ERP software development engineer", "WAP development engineer", "software test engineer", "document engineer", "Internet software development engineer", "search engine engineer", "game development engineer", "web designer", "network engineer", "network administrator", "website editor", "embedded software development engineer", "electronic technology research and development engineer", "electronic engineer", "communication technology engineer", "mobile communication engineer", "3G software engineer", "mobile phone application development engineer", "urban planning designer", "civil engineer", "water supply and drainage engineer", "HVAC engineer", "engineering budgeter", "contract engineer", "property management specialist", "product process engineer", "Quality Management Specialist", "Supply Chain Specialist", "Automotive Electronics Engineer", "Automotive Technical Support Engineer", "Electrical Development Engineer", "Digital Product Development Engineer", "Mold Engineer", "Mechanical Engineer", "Pre-Sales Technical Engineer", "Aftermarket Technical Engineer", "Bioengineering Technician", "Chemical Technology Engineer", "Materials Engineer", "Water Treatment Engineer", "Strong Electrical Engineer", "Weak Electrical Engineer", "Electrical Engineer", "Automation Engineer", "Electrical and Mechanical Engineer", "Mining Engineer", "Geoengineer", "Physician", "Surgeon", "Pharmacist", "Pharmaceutical technology developer", "drug registrar", "bench worker", "drawing worker", "field worker", "forestry worker", "lathe worker", "lifting worker", "harbor worker", "iron worker", "Technical Worker", "accountant", "actress", "airlinerepresentative", "anchor", "announcer", "architect", "associateprofessor", "astronaut.", "attendant", "auditor", "automechanic", "baker", "baseballplayer", "bellboy", "bellhop", "binman", "blacksmith", "boxer", "broker(agent)", "budgeteer", "busdriver", "butcher", "buyer", "carpenter", "cashier", "chemist", "clerk", "clown", "cobbler", "computerprogrammer", "constructionworker", "cook", "cowboy", "customsofficer", "dentist", "deskclerk", "detective", "doctor", "door-to-doorsalesman", "driver", "dustman", "editor", "electrician", "engineer", "farmer", "fashiondesigner", "fireman(firefighter)", "fisherman", "florist", "flyer", "Foreignminister", "gasstationattendant", "geologist", "guard", "guide", "hiredresseer", "housekeeper", "housewife", "interpreter", "janitor", "judge", "librarian.", "lifeguard", "magician", "masseur", "masseuse", "mathematician", "mechanic", "miner", "model", "monk", "moviedirector", "moviestar", "musician", "nun", "nurse", "officeclerk", "officestaff", "operator", "parachutist.", "photographer", "pilot", "planner", "policeman", "postalclerk", "President", "priest", "processfor", "realestateagent", "receptionist", "repairman", "reporter", "sailor", "salesman/selespeople/salesperson", "seamstress", "secretary", "singer", "soldiery", "statistician", "surveyor", "tailor", "taxidriver", "teacher", "technician", "tourguide", "trafficwarden", "translator", "TVproducer", "typist", "vet", "waiter", "waitress", "welder", "writer", "MarketingandSales", "Vice-PresidentofSales", "SeniorCustomerManager", "SalesManager", "RegionalSalesManager", "MerchandisingManager", "SalesAssistant", "WholesaleBuyer", "Tele-Interviewer", "RealEstateAppraiser", "MarketingConsultant", "MarketingandSalesDirector", "MarketResearchAnalyst", "Manufacturer\\'sRepresentative", "DirectorofSubsidiaryRights", "SalesRepresentative", "AssistantCustomerExecutive", "MarketingIntern", "MarketingDirector", "InsuranceAgent", "CustomerManager", "Vice-PresidentofMarketing", "RegionalCustomerManager", "SalesAdministrator", "TelemarketingDirector", "AdvertisingManager", "TravelAgent", "Salesperson", "Telemarketer", "SalesExecutive", "MarketingAssistant", "RetailBuyer", "RealEstateManager", "RealEstateBroker", "PurchasingAgent", "ProductDeveloper", "MarketingManager", "AdvertisingCoordinator", "AdvertisingAssistant", "AdCopywriter(DirectMail)", "CustomerRepresentative", "ComputersandMathematics()", "ManagerofNetworkAdministration", "MISManager", "ProjectManager", "TechnicalEngineer", "DevelopmentalEngineer", "SystemsProgrammer", "Administrator", "OperationsAnalyst", "ComputerOperator", "ProductSupportManager", "ComputerOperationsSupervisor", "DirectorofInformationServices", "SystemsEngineer", "HardwareEngineer", "ApplicationsProgrammer", "InformationAnalyst", "LANSystemsAnalyst", "HumanResources", "DirectorofHumanResources", "AssistantPersonnelOfficer", "CompensationManager", "EmploymentConsultant", "FacilityManager", "JobPlacementOfficer", "LaborRelationsSpecialistRecruiter", "TrainingSpecialist", "Vice-PresidentofHumanResources", "AssistantVice-PresidentofHumanResources", "PersonnelManager", "BenefitsCoordinator", "EmployerRelationsRepresentative", "PersonnelConsultant", "TrainingCoordinator", "ExecutiveandManagerial", "ChiefExecutiveOfficer(CEO)", "DirectorofOperations", "Vice-President", "BranchManager", "RetailStoreManager", "HMOProductManager", "OperationsManager", "AssistantVice-President", "FieldAssuranceCoordinator", "ManagementConsultant", "DistrictManager", "HospitalAdministrator", "Import/ExportManager", "InsuranceClaimsController", "ProgramManager", "InsuranceCoordinator", "InventoryControlManager", "RegionalManager", "ChiefOperationsOfficer(COO)", "GeneralManager", "ExecutiveMarketingDirector", "Controller(International)", "FoodServiceManager", "ProductionManager", "PropertyManager", "ClaimsExaminer", "Controller(General)", "ServiceManager", "ManufacturingManager", "VendingManager", "TelecommunicationsManager", "TransportationManager", "WarehouseManager", "AssistantStoreManager", "Manager(Non-ProfitandCharities)", "simultaneous", "publisher", "graphicdesigner", "deliveryboy", "director", "talent", "producer", "scholar", "novelist", "playwright", "linguist", "botanist", "economist", "philosopher", "politician", "physicist", "astropologist", "archaeologist", "expertonfolklore", "biologist", "zoologist", "physiologist", "futurologist", "artists", "painter", "composer", "sculptor", "fashioncoordinator", "dressmaker", "cutter", "sewer", "ballerina", "firefigher", "chiefofpolice", "mailman", "newspaperboy", "bootblack", "poet", "copywriter", "newscaster", "milkman", "merchant", "greengrocer", "fish-monger", "shoe-maker", "saleswoman", "stewardess", "conductor", "stationagent", "porter", "carmechanic", "civilplanner", "civilengineer", "druggist", "oilsupplier", "(public)healthnurse", "supervisor", "forman", "keypuncher", "stenographer", "telephoneoperator", "programmer", "systemanalyst", "shorthandtypist", "officegirl", "publicservants", "nationalpublicservant", "localpublicserviceemployee", "nationrailroadman", "tracer", "illustrator", "acountant", "businessman", "tradesman", "pedlar", "meson", "spinner", "dyer", "temporaryworker", "probationer", "lecturer", "headmaster", "headmistress", "personnel", "administrative director", "file clerk", "executive assistant", "office manager", "executive secretary", "general office clerk", "inventory control analyst", "staff assistant", "mail room supervisor", "order entry clerk", "telephone operator", "shipping/receiving expediter", "ticket agent", "vice-president of administration", "daycare worker", "esl teacher", "developmental educator '", "head teacher", "foreign language teacher", "librarian", "guidance counselor", "music teacher", "library technician", "physical education teacher", "principal", "school psychologist", "special needs educator", "teacher aide", "art instructor", "computer teacher", "college professor", "coach", "assistant dean of students", "archivist", "vocational counselor", "tutor", "police officer", "fire fighter", "police sergeant", "assistant attorney general", "law clerk", "contracts manager", "law student", "ombudsman", "paralegal", "security manager", "patent agent", "legal assistant", "court officer", "legal secretary", "court reporter", "attorney", "clinical director", "cardiologist", "dental hygienist", "chiropractor", "dental technician", "dental assistant", "dietary technician", "emergency medical technician", "dietician", "fitness instructor", "home health aide", "health services coordinator", "lab technician", "hospital supervisor", "medical records clerk", "nursing aide", "medical technologist", "nursing supervisor", "nursing administrator", "nutritionist", "nursing home manager", "optician", "occupational therapist", "orthodontist", "veterinary assistant", "pharmacy technician", "psychiatrist", "physical therapist", "physician's assistant", "respiratory therapist", "pediatrician", "speech pathologist", "sanitation inspector", "wait person", "customer service manager", "customer service representative", "caterer", "fast food worker", "health club manager", "cosmetologist", "hotel concierge", "hotel manager'", "food inspector", "hotel clerk", "restaurant manager", "hairstylist", "flight attendant", "technical", "technical llustrator", "landscape architect", "research and development technician", "aircraft mechanic", "quality control inspector", "qatest technician", "precision inspector", "drafter", "technical support specialist", "building inspector", "engineering technician", "electronic equipment repairer", "aircraft pilot", "deputy gencral managc", "economic rescarch assistan", "electrical enginccr", "enginccring technician", "english instructor/tcachcr", "export salcs managc", "export salcs staf", "financial controllcrfinancial reportcr", "f.x. (foreign exchangc)clcrk", "f.x. settlcmcnt clcrk", "fund managcr", "gcncral auditor", "gcncral managcr", "gcncral managcr assistant", "gcncral managcr's sccrctary", "hardwarc enginccr )", "accounting assistant", "accounting clcrk", "accounting managcraccounting stall ", "accounting supervisor", "administration managcr", "administration staff", "administrativc assistant ", "administrativc clerk ", "advcrtising staff ", "airlincs sales rcprcscntativc", "airlincs staff ", "application enginccr", "assistant managcr", "bond analyst ", "bond trader", "business controllcr", "business managcr", "buycr ", "cashicr ", "chcmical enginccr", "civil enginccr", "clcrk receptionist", "clerk typist & secrctary", "computcr data input operator", "computcr enginccr", "computcr proccssing operator", "computer systcm managcr", "deputy gcncral managc", "gencral managcrl prcsident", "gcneral managcr assistant.", "gcneral managcr's secrctary", "hardwarc enginecr)", "lmport liaison staff", "import managcr", "insurancc actuary", "intcrnational salcs staff", "intcrprctcr ", "lcgal adviscr", "linc supcrvisor", "maintenancc enginccr", "managcmcnt consultant ", "managcr", "managcr for public rclation", "manufacturing enginccr", "manufacturing workcr", "markct analyst", "markct devclopmcnt managcr", "markcting managcr", "markcting staff", "markcting assistant", "markcting exccutivc", "markcting rcprcscntativc", "markcting rcprcscntativc managcr", "mechanical enginccr", "mining enginccr", "naval architect", "officc assistant", "officc clerk ", "opcrational managcr", "packagc designcr", "passenger rcservation staff", "pcrsonnel clcrk ", "pcrsonncl managcr", "plant/ factory managcr", "postal clerk", "privatc secrctary", "product managcr", "production enginecr", "profcssional staff", "project staff ", "promotional managcr", "proof-rcader", "purchasing agcnt ", "quality control enginccr", "rcal estatc staff", "rccruitment co-ordinator", "rcgional mangcr", "rcscarch&.devclopment enginccr", "rcstaurant managcr", "salcs and planning staff", "salcs assistant ", "salcs clerk ", "salcs coordinator", "salcs enginccr", "salcs exccutivc", "salcs managcr", "scller rprcscntativc", "salcs supcrvisor", "school rcgistrar", "secrctarial assistant", "securitics custody clcrk", "security officcr", "scnior accountant", "senior consultant/adviscr", "scnior employcc", "senior sccrctary", "scrvicc managcr", "simultancous interprctcr", "softwarc enginccr", "systcms adviscr", "systems enginccr", "systems operator ", "tcchnical editor", "technical translator", "tcchnical workcr", "tclecommunication executivc()", "tclcphonist / opcrator", "tourist guidc", "tradc financc exccutivc", "trainec managcr", "translation checkcr", "'translator", "trust banking exccutivc", "wordproccssor operator", "actrcss", "airlinc reprcscntativc ", "announccr", "architcct", "associatc profcssor", "astronaut", "attcndant", "auto mechanic ", "bakcr", "barbcr", "bascball playcr", "bcll boy", "binman,", "boxcr", "broker (agcnt) ", "budgctecr", "bus driver", "taxi driver", "subway driver", "train driver", "butchcr,", "buycr", "carpentcr", "cashicr", "chcmist ", "clerk ", "clown ", "cobblcr", "computcr programmcr ", "construction workcr ", "cowboy ", "customs officcr", "danccr ", "designcr", "dcsk clcrk", "detcctivc", "door-to-door salesmen"],
"adj": [
"big", "small", "red", "blue", "good", "bad"
]
}
\ No newline at end of file
src/assets/play/submit.png

10.9 KB | W: | H:

src/assets/play/submit.png

11.7 KB | W: | H:

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