Commit 39b5d7dd authored by limingzhe's avatar limingzhe

feat: 填空功能提交

parent 1ba521e9
...@@ -156,8 +156,8 @@ ...@@ -156,8 +156,8 @@
<span style="margin-right: 5px;">选择题问题:</span> <span style="margin-right: 5px;">选择题问题:</span>
<app-upload-image-with-preview <app-upload-image-with-preview
[picUrl]="item.choice_ques_pic_url" [picUrl]="item.choice_obj.ques_pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'choice_ques_pic_url')"> (imageUploaded)="onImageUploadSuccess($event, 'ques_pic_url', item.choice_obj)">
</app-upload-image-with-preview> </app-upload-image-with-preview>
</div> </div>
...@@ -167,21 +167,21 @@ ...@@ -167,21 +167,21 @@
<span style="margin-right: 5px; margin-left: 15px;">选择小标题:</span> <span style="margin-right: 5px; margin-left: 15px;">选择小标题:</span>
<app-audio-recorder <app-audio-recorder
[audioUrl]="item.choice_title_audio_url" [audioUrl]="item.choice_obj.title_audio_url"
(audioUploaded)="onAudioUploadSuccess($event, 'choice_title_audio_url')" (audioUploaded)="onAudioUploadSuccess($event, 'title_audio_url', item.choice_obj)"
></app-audio-recorder> ></app-audio-recorder>
</div> </div>
<app-upload-image-with-preview <app-upload-image-with-preview
[picUrl]="item.choice_title_pic_url" [picUrl]="item.choice_obj.title_pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'choice_title_pic_url')"> (imageUploaded)="onImageUploadSuccess($event, 'title_pic_url', item.choice_obj)">
</app-upload-image-with-preview> </app-upload-image-with-preview>
</div> </div>
</div> </div>
<div *ngFor="let op of item.optionArr" style="border: 1px solid #ccc; margin: 10px; padding: 10px; border-radius: 5px;"> <div *ngFor="let op of item.choice_obj.optionArr" style="border: 1px solid #ccc; margin: 10px; padding: 10px; border-radius: 5px;">
<div style="margin-top: 20px; display: flex; align-items: center; width: 500px;"> <div style="margin-top: 20px; display: flex; align-items: center; width: 500px;">
<span style="margin-right: 5px;">{{op.id}}:</span> <span style="margin-right: 5px;">{{op.id}}:</span>
<div style="width: 300px;"> <div style="width: 300px;">
...@@ -211,8 +211,8 @@ ...@@ -211,8 +211,8 @@
<span style="margin-right: 5px;">新简答问题:</span> <span style="margin-right: 5px;">新简答问题:</span>
<app-upload-image-with-preview <app-upload-image-with-preview
[picUrl]="item.answer_ques_pic_url" [picUrl]="item.answer_obj.ques_pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'answer_ques_pic_url')"> (imageUploaded)="onImageUploadSuccess($event, 'ques_pic_url', item.answer_obj)">
</app-upload-image-with-preview> </app-upload-image-with-preview>
</div> </div>
...@@ -222,14 +222,14 @@ ...@@ -222,14 +222,14 @@
<span style="margin-right: 5px; margin-left: 15px;">新简答小标题:</span> <span style="margin-right: 5px; margin-left: 15px;">新简答小标题:</span>
<app-audio-recorder <app-audio-recorder
[audioUrl]="item.answer_title_audio_url" [audioUrl]="item.answer_obj.title_audio_url"
(audioUploaded)="onAudioUploadSuccess($event, 'answer_title_audio_url')" (audioUploaded)="onAudioUploadSuccess($event, 'title_audio_url', item.answer_obj)"
></app-audio-recorder> ></app-audio-recorder>
</div> </div>
<app-upload-image-with-preview <app-upload-image-with-preview
[picUrl]="item.answer_title_pic_url" [picUrl]="item.answer_obj.title_pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'answer_title_pic_url')"> (imageUploaded)="onImageUploadSuccess($event, 'title_pic_url', item.answer_obj)">
</app-upload-image-with-preview> </app-upload-image-with-preview>
</div> </div>
......
...@@ -106,9 +106,30 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -106,9 +106,30 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
]; ];
} }
if (!this.item.answer_obj) {
this.item.answer_obj = {};
}
if (!this.item.choice_obj) {
this.item.choice_obj = {};
this.item.choice_obj.optionArr = [
{id: 'A', optionArr: [{id: 'A'}, {id: 'B'}]},
{id: 'B', optionArr: [{id: 'A'}, {id: 'B'}]},
{id: 'C', optionArr: [{id: 'A'}, {id: 'B'}]},
{id: 'D', optionArr: [{id: 'A'}, {id: 'B'}]},
];
}
if (!this.item.ques_type) { if (!this.item.ques_type) {
this.item.ques_type = 'single_choice' this.item.ques_type = 'single_choice'
} }
} }
addSubTemplate() { addSubTemplate() {
......
...@@ -1719,6 +1719,9 @@ export function getAngleByPos(px, py, mx, my) { ...@@ -1719,6 +1719,9 @@ export function getAngleByPos(px, py, mx, my) {
export function removeItemFromArr(arr, item) { export function removeItemFromArr(arr, item) {
if (!arr || !item) {
return;
}
const index = arr.indexOf(item); const index = arr.indexOf(item);
if (index !== -1) { if (index !== -1) {
arr.splice(index, 1); arr.splice(index, 1);
......
...@@ -421,6 +421,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -421,6 +421,8 @@ export class PlayComponent implements OnInit, OnDestroy {
let arr = contentObj.hotZoneItemArr; let arr = contentObj.hotZoneItemArr;
addUrlToAudioObj(contentObj.title_audio_url); addUrlToAudioObj(contentObj.title_audio_url);
addUrlToAudioObj(contentObj.answer_obj.title_audio_url);
addUrlToAudioObj(contentObj.choice_obj.title_audio_url);
if (arr) { if (arr) {
...@@ -571,12 +573,25 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -571,12 +573,25 @@ export class PlayComponent implements OnInit, OnDestroy {
addPicUrl(contentObj.bg_url || ''); addPicUrl(contentObj.bg_url || '');
addPicUrl(contentObj.ques_pic_url || ''); addPicUrl(contentObj.ques_pic_url || '');
addPicUrl(contentObj.title_pic_url || ''); addPicUrl(contentObj.title_pic_url || '');
addPicUrl(contentObj.answer_obj.ques_pic_url || '');
addPicUrl(contentObj.answer_obj.title_pic_url || '');
addPicUrl(contentObj.choice_obj.ques_pic_url || '');
addPicUrl(contentObj.choice_obj.title_pic_url || '');
const choiceOptionArr = contentObj.choice_obj.optionArr;
for (let i=0; i<choiceOptionArr.length; i++) {
addPicUrl(choiceOptionArr[i].pic_url || '');
addPicUrl(choiceOptionArr[i].title_pic_url || '');
addPicUrl(choiceOptionArr[i].ques_pic_url);
}
const optionArr = contentObj.optionArr; const optionArr = contentObj.optionArr;
for (let i=0; i<optionArr.length; i++) { for (let i=0; i<optionArr.length; i++) {
addPicUrl(optionArr[i].pic_url || ''); addPicUrl(optionArr[i].pic_url || '');
addPicUrl(optionArr[i].title_pic_url || ''); addPicUrl(optionArr[i].title_pic_url || '');
addPicUrl(optionArr[i].ques_pic_url);
const optionArr2 = optionArr[i].optionArr; const optionArr2 = optionArr[i].optionArr;
...@@ -584,7 +599,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -584,7 +599,6 @@ export class PlayComponent implements OnInit, OnDestroy {
addPicUrl(optionArr2[j].pic_url || ''); addPicUrl(optionArr2[j].pic_url || '');
} }
addPicUrl(optionArr[i].ques_pic_url);
} }
...@@ -624,33 +638,31 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -624,33 +638,31 @@ export class PlayComponent implements OnInit, OnDestroy {
addServerListener() { addServerListener() {
console.log(' in addServerListener'); console.log(' in addServerListener');
const c = window['courseware']; const air = window['air']
if (air) {
air.onCourseInScreen = (next) => {
//各种逻辑
// this.showTemplateStartAnima();
console.log('in onCourseInScreen')
this.loadEnd(() => {
next();
});
}
}
const c = window['courseware'];
if (!c) { if (!c) {
console.log(' window.courseware not exist !!!!!!!!') console.log(' window.courseware not exist !!!!!!!!')
return; return;
} }
const air = window['air']
if (!air) {
console.log(' window air err !!!!!!!!')
return;
}
air.onCourseInScreen = (next) => {
//各种逻辑
// this.showTemplateStartAnima();
console.log('in onCourseInScreen')
this.loadEnd(() => {
next();
});
}
c.onEvent('game_start', (data, next) => { c.onEvent('game_start', (data, next) => {
this.gameStart(); this.loadEnd(_=>{});
if (next) { if (next) {
next(); next();
} }
...@@ -2132,7 +2144,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2132,7 +2144,7 @@ export class PlayComponent implements OnInit, OnDestroy {
return; return;
} }
if (this.templateQuesType == this.TYPE_SINGLE_CHOICE) { if (this.curAreaItem && this.curAreaItem.visible) {
for (let i=0; i<this.optionItemArr.length; i++) { for (let i=0; i<this.optionItemArr.length; i++) {
if (this.checkClickTarget(this.optionItemArr[i])) { if (this.checkClickTarget(this.optionItemArr[i])) {
this.optionItemClick(this.optionItemArr[i]); this.optionItemClick(this.optionItemArr[i]);
...@@ -2182,10 +2194,46 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2182,10 +2194,46 @@ export class PlayComponent implements OnInit, OnDestroy {
return; return;
} }
courseware.activeFormulaBoard((data) => { // courseware.activeFormulaBoard((data) => {
// TODO // // TODO
console.log('in activeFormulaBoard data: ', data); // console.log('in activeFormulaBoard data: ', data);
// });
const data = {
formulaSrc: 'http://staging-teach.cdn.ireadabc.com/82f0ecacdc80cbb50c1a229cdee253c4.png',
formula:"\\sqrt {777}+\\sqrt {444}"
}
this.setShortAnswerData(data);
}
setShortAnswerData(data) {
const {formulaSrc, formula} = data;
const labelPic = this.answerLabelPic;
labelPic.load(formulaSrc).then(img => {
const sx = (this.answerRect.width - 20) / labelPic.width;
const sy = this.answerRect.height / labelPic.height;
const s = Math.min(sx, sy);
labelPic.setScaleXY(s);
labelPic.x = labelPic.width / 2 * labelPic.scaleX + 10;
labelPic.y = this.answerRect.height / 2;
}); });
if (formula && false) {
this.changeAnswerBg('rightPic');
} else {
this.changeAnswerBg('wrongPic');
setTimeout(() => {
this.changeChoiceArea(this.data.contentObj.choice_obj);
}, 2000);
}
} }
changeBase64ToPicUrl(base64Data) { changeBase64ToPicUrl(base64Data) {
...@@ -2230,10 +2278,22 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2230,10 +2278,22 @@ export class PlayComponent implements OnInit, OnDestroy {
this.curVideo.element.pause(); this.curVideo.element.pause();
} }
if (this.curOpItem) { if (this.curOpItem) {
this.changeArea(this.curOpItem.data);
this.changeChoiceArea(this.curOpItem.data);
} }
} }
cleanSmallTitle() {
this.curAreaItem.visible = false;
this.curAreaItem.removeChildren();
removeItemFromArr(this.renderArr, this.curAreaItem);
removeItemFromArr(this.renderArr, this.answerRectNode);
removeItemFromArr(this.renderArr, this.answerQuesPic)
}
curOpItem; curOpItem;
optionItemClick(opItem) { optionItemClick(opItem) {
console.log('opItem: ', opItem); console.log('opItem: ', opItem);
...@@ -2255,8 +2315,17 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2255,8 +2315,17 @@ export class PlayComponent implements OnInit, OnDestroy {
optionWrong(opItem) { optionWrong(opItem) {
this.changeOpItemBg(opItem, 'wrongPic'); this.changeOpItemBg(opItem, 'wrongPic');
this.canTouch = false; this.canTouch = false;
setTimeout(() => { setTimeout(() => {
this.canTouch = true;
if (this.data.contentObj.ques_type == this.TYPE_SHORT_ANSWER) {
this.cleanSmallTitle();
this.changeAnswerArea();
return;
}
if (opItem.data.video_url) { if (opItem.data.video_url) {
this.showVideo(opItem); this.showVideo(opItem);
...@@ -2264,12 +2333,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2264,12 +2333,11 @@ export class PlayComponent implements OnInit, OnDestroy {
this.callTeacher(); this.callTeacher();
} }
this.canTouch = true;
}, 2000); }, 2000);
} }
callTeacher() { callTeacher() {
this.changeArea(this.data.contentObj); this.changeChoiceArea(this.data.contentObj);
} }
showVideo(opItem) { showVideo(opItem) {
...@@ -2285,6 +2353,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2285,6 +2353,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this.videoBg.visible = false; this.videoBg.visible = false;
} }
changeAllOpItem() { changeAllOpItem() {
for (let i=0; i<this.optionItemArr.length; i++) { for (let i=0; i<this.optionItemArr.length; i++) {
this.changeOpItemBg(this.optionItemArr[i], 'normalPic'); this.changeOpItemBg(this.optionItemArr[i], 'normalPic');
...@@ -2297,6 +2366,13 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -2297,6 +2366,13 @@ export class PlayComponent implements OnInit, OnDestroy {
opItem[opItem.curRes].visible = true; opItem[opItem.curRes].visible = true;
} }
changeAnswerBg(res) {
const node = this.answerRectNode;
node[node.curRes].visible = false;
node.curRes = res;
node[node.curRes].visible = true;
}
moreBtnClick() { moreBtnClick() {
...@@ -3357,6 +3433,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -3357,6 +3433,7 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
answerQuesPic;
setOneShortAnswerPic(data) { setOneShortAnswerPic(data) {
console.log('setOneShortAnswerPic data: ', data) console.log('setOneShortAnswerPic data: ', data)
...@@ -3377,11 +3454,14 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -3377,11 +3454,14 @@ export class PlayComponent implements OnInit, OnDestroy {
pic.visible = false; pic.visible = false;
// this.openBtn = pic; // this.openBtn = pic;
this.renderArr.push(pic); this.renderArr.push(pic);
this.answerQuesPic = pic;
return pic; return pic;
} }
answerRect; answerRect;
answerLabelPic;
answerRectNode;
setOneShortAnswerRect(data) { setOneShortAnswerRect(data) {
console.log('setOneShortAnswerRect data: ', data) console.log('setOneShortAnswerRect data: ', data)
...@@ -3397,6 +3477,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -3397,6 +3477,7 @@ export class PlayComponent implements OnInit, OnDestroy {
item['data'] = data; item['data'] = data;
item.alpha = 0; item.alpha = 0;
item.visible = false; item.visible = false;
this.answerRectNode = item;
const answerNormal = this.getMySprite('answer_normal'); const answerNormal = this.getMySprite('answer_normal');
...@@ -3408,6 +3489,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -3408,6 +3489,7 @@ export class PlayComponent implements OnInit, OnDestroy {
answerNormal.y = answerNormal.height / 2 * answerNormal.scaleY; answerNormal.y = answerNormal.height / 2 * answerNormal.scaleY;
item.addChild(answerNormal); item.addChild(answerNormal);
item['normalPic'] = answerNormal; item['normalPic'] = answerNormal;
this.answerRectNode.curRes = 'normalPic';
const answerRight = this.getMySprite('answer_right'); const answerRight = this.getMySprite('answer_right');
answerRight.setScaleXY(s); answerRight.setScaleXY(s);
...@@ -3429,50 +3511,16 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -3429,50 +3511,16 @@ export class PlayComponent implements OnInit, OnDestroy {
// const labelPic = new MySprite(); const labelPic = new MySprite();
item.addChild(labelPic);
this.answerLabelPic = labelPic;
// labelPic.load(url).then(img => { // labelPic.load(url).then(img => {
// }); // });
// item.addChild(label);
// const w = item.width;
// const h = item.height;
// const subH = h / 6;
// const ques = this.getMySprite(this.data.contentObj.ques_pic_url);
// const sx = w / ques.width;
// const sy = subH * 1.5 / ques.height;
// ques.setScaleXY(Math.min(sx, sy));
// ques.x = w / 2;
// ques.y = subH;
// item.addChild(ques);
// this.optionItemArr = [];
// const optionArr = this.data.contentObj.optionArr;
// const baseY = subH * 2.5;
// for (let i=0; i<4; i++) {
// if (optionArr[i]) {
// const opItem = this.getOneOpItem(optionArr[i]);
// const sx = w / opItem.width;
// const sy = subH / opItem.height;
// opItem.setScaleXY(Math.min(sx, sy));
// opItem.y = baseY + i * subH;
// opItem.x = w / 2;
// item.addChild(opItem);
// this.optionItemArr.push(opItem);
// }
// }
// this.curAreaItem = item;
this.renderArr.push(item); this.renderArr.push(item);
return item; return item;
} }
...@@ -3563,14 +3611,97 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -3563,14 +3611,97 @@ export class PlayComponent implements OnInit, OnDestroy {
return item; return item;
} }
changeArea(data) {
console.log('changeArea data: ', data)
resetAnswerQues(data) {
const quesPic = this.answerQuesPic;
const rect = quesPic.getBoundingBox();
quesPic.load(data.ques_pic_url).then(img => {
const sy = rect.height / quesPic.height;
quesPic.setScaleXY(sy);
quesPic.x = rect.x + quesPic.width / 2 * quesPic.scaleX;
})
this.renderArr.push(quesPic);
}
resetAnswerArea() {
const data = this.answerRectNode.data;
const saveRect = data.rect;
const item = new MySprite();
item.width = saveRect.width;
item.height = saveRect.height;
item.x = saveRect.x
item.y = saveRect.y
item['data'] = data;
// item.alpha = 0;
// item.visible = false;
this.answerRectNode = item;
const answerNormal = this.getMySprite('answer_normal');
const sx = saveRect.width / answerNormal.width;
const sy = saveRect.height / answerNormal.height;
const s = Math.min(sx, sy);
answerNormal.setScaleXY(s);
answerNormal.x = answerNormal.width / 2 * answerNormal.scaleX;
answerNormal.y = answerNormal.height / 2 * answerNormal.scaleY;
item.addChild(answerNormal);
item['normalPic'] = answerNormal;
this.answerRectNode.curRes = 'normalPic';
const answerRight = this.getMySprite('answer_right');
answerRight.setScaleXY(s);
answerRight.x = answerRight.width / 2 * answerRight.scaleX;
answerRight.y = answerRight.height / 2 * answerRight.scaleY;
item.addChild(answerRight);
item['rightPic'] = answerRight;
answerRight.visible = false;
const answerWrong = this.getMySprite('answer_wrong');
answerWrong.setScaleXY(s);
answerWrong.x = answerWrong.width / 2 * answerWrong.scaleX;
answerWrong.y = answerWrong.height / 2 * answerWrong.scaleY;
item.addChild(answerWrong);
item['wrongPic'] = answerWrong;
answerWrong.visible = false;
this.answerRect = answerNormal;
const labelPic = new MySprite();
item.addChild(labelPic);
this.answerLabelPic = labelPic;
this.renderArr.push(item);
}
changeAnswerArea() {
const data = this.data.contentObj.answer_obj;
this.showSmallTitle(data); this.showSmallTitle(data);
data.rect = this.curAreaItem.data.rect; this.resetAnswerQues(data)
this.resetAnswerArea()
removeItemFromArr(this.renderArr, this.curAreaItem); }
changeChoiceArea(data) {
console.log('changeChoiceArea data: ', data)
this.cleanSmallTitle();
this.showSmallTitle(data);
if (this.curAreaItem) {
data.rect = this.curAreaItem.data.rect;
}
const saveRect = data.rect; const saveRect = data.rect;
......
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