Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
P
PU01
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
template admin
PU01
Commits
40281eec
Commit
40281eec
authored
Jun 23, 2020
by
李维
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
dev commit
parent
13070a82
Changes
6
Hide whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
378 additions
and
130 deletions
+378
-130
form.component.html
src/app/form/form.component.html
+79
-2
form.component.scss
src/app/form/form.component.scss
+6
-0
form.component.ts
src/app/form/form.component.ts
+29
-5
Cartoon.ts
src/app/play/Cartoon.ts
+2
-1
play.component.ts
src/app/play/play.component.ts
+261
-121
defaultData.js
src/assets/play/default/formData/defaultData.js
+1
-1
No files found.
src/app/form/form.component.html
View file @
40281eec
<div
class=
"model-content"
>
<div
class=
"card-config"
>
<div
class=
"card-item clearfix"
style=
"padding: 0.5vw; width: 100%;"
>
<div
class=
"card-item-content border"
>
<div
class=
"card-item-content"
>
<div
class=
"title"
>
题目素材
</div>
<div
class=
"section"
>
<div
class=
"section-content"
>
<div
style=
"display: flex; margin-bottom: 10px;"
>
<div
style=
"float: left; text-align: right; margin-right: 10px; margin-left: 10px;"
>
<span>
显示选项
</span><span>
:
</span>
</div>
<div
style=
"float: left; width: 300px;"
>
<nz-radio-group
[(
ngModel
)]="
contentObj
.
question
.
type
"
(
ngModelChange
)="
handleQuestionTypeChange
()"
>
<label
nz-radio
[
nzValue
]="'
Text
'"
>
文字
</label>
<label
nz-radio
[
nzValue
]="'
Image
'"
>
图片
</label>
<label
nz-radio
[
nzValue
]="'
LongAudio
'"
>
长音频
</label>
</nz-radio-group>
</div>
<div
style=
"float: left; width: 300px;"
>
<div
*
ngIf=
"contentObj.question.type=='Image'"
>
<app-upload-image-with-preview
style=
"width: 100%;"
[
picUrl
]="
contentObj
.
question
.
image_url
"
(
imageUploaded
)="
onImageUploadSuccessByItem
($
event
,
contentObj
.
question
,
'
image_url
')"
></app-upload-image-with-preview>
</div>
<div
*
ngIf=
"contentObj.question.type=='Text'"
>
<textarea
type=
"text"
nz-input
placeholder=
""
[(
ngModel
)]="
contentObj
.
question
.
text
"
(
blur
)="
saveItem
()"
></textarea>
</div>
<div
*
ngIf=
"contentObj.question.type=='LongAudio'"
>
<app-audio-recorder
[
audioUrl
]="
contentObj
.
question
.
longAudio_url
"
(
audioUploaded
)="
onAudioUploadSuccessByItem
($
event
,
contentObj
.
question
,
'
longAudio_url
')"
></app-audio-recorder>
</div>
</div>
</div>
</div>
</div>
<div
class=
"section"
>
<div
class=
"section-content"
>
<div
style=
"display: flex; margin-bottom: 10px;"
>
<div
style=
"float: left; text-align: right; margin-right: 10px; margin-left: 10px;"
>
<span>
卡片类型
</span><span>
:
</span>
</div>
<div
style=
"float: left; width: 300px;"
>
<nz-radio-group
[(
ngModel
)]="
contentObj
.
answerType
"
(
ngModelChange
)="
saveItem
()"
>
<label
nz-radio
[
nzValue
]="'
Text
'"
>
文字
</label>
<label
nz-radio
[
nzDisabled
]="
contentObj
.
question
.
type
!=
'
LongAudio
'"
[
nzValue
]="'
Image
'"
>
图片
</label>
</nz-radio-group>
</div>
<div
style=
"float: left; width: 300px;"
>
</div>
</div>
</div>
</div>
<div
class=
"section"
>
<div
class=
"section-content"
>
<div
style=
"display: flex; margin-bottom: 10px;"
>
<div
style=
"flex:1; text-align: right; margin-right: 10px;"
>
<span>
短音频
</span><span>
:
</span>
</div>
<div
style=
"flex:3"
>
<app-audio-recorder
[
audioUrl
]="
contentObj
.
question
.
shortAudio_url
"
(
audioUploaded
)="
onAudioUploadSuccessByItem
($
event
,
contentObj
.
question
,
'
shortAudio_url
')"
></app-audio-recorder>
</div>
<div
style=
"flex:8"
></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div
*
ngFor=
"let item of contentObj.dataArray; let i = index"
class=
"card-item"
style=
"padding: 0.5vw; "
>
<div
class=
"card-item-content border"
>
<div
class=
"card-item-content"
>
...
...
@@ -9,7 +86,7 @@
<div
class=
"section"
>
<div
class=
"section-content"
>
<div
style=
"flex:1"
>
<div
*
ngIf=
"contentObj.answerType=='Text'"
style=
"flex:1"
>
<div
style=
"display: flex; margin-bottom: 10px;"
>
<div
style=
"flex:1"
>
文字
...
...
@@ -20,7 +97,7 @@
</div>
</div>
<div
style=
"flex:1"
>
<div
*
ngIf=
"contentObj.answerType=='Image'"
style=
"flex:1"
>
<div
style=
"display: flex; "
>
<div
style=
"flex:1"
>
图片
...
...
src/app/form/form.component.scss
View file @
40281eec
...
...
@@ -53,3 +53,9 @@
}
}
}
.clearfix
:before
,
.clearfix
:after
{
content
:
""
;
display
:
block
;
clear
:
both
;
}
\ No newline at end of file
src/app/form/form.component.ts
View file @
40281eec
...
...
@@ -11,7 +11,7 @@ import defauleFormData from '../../assets/play/default/formData/defaultData.js'
export
class
FormComponent
implements
OnInit
,
OnChanges
,
OnDestroy
{
_item
:
any
;
KEY
=
'
DataKey_PU0
8
'
;
KEY
=
'
DataKey_PU0
1
'
;
checkOptionsOne
=
[]
set
item
(
item
)
{
...
...
@@ -23,9 +23,11 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
contentObj
=
{
"
version
"
:
"
1.0
"
,
key
:
"
DataKey_PU01
"
,
dataArray
:
[
{
text
:
""
,
image_url
:
""
}
]
question
:
{
type
:
"
Image
"
},
answerType
:
"
Text
"
,
dataArray
:
[]
}
@
Output
()
...
...
@@ -34,6 +36,28 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
}
handleQuestionTypeChange
(){
if
(
this
.
contentObj
.
question
.
type
!=
'
LongAudio
'
){
this
.
contentObj
.
answerType
=
'
Text
'
}
this
.
saveItem
()
}
ngOnInit
()
{
this
.
item
=
{};
this
.
item
.
contentObj
=
{};
...
...
@@ -113,7 +137,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
}
onImageUploadSuccessByItem
(
e
,
item
,
key
)
{
item
[
key
]
.
image_url
=
e
.
url
item
[
key
]
=
e
.
url
this
.
save
();
}
...
...
src/app/play/Cartoon.ts
View file @
40281eec
...
...
@@ -14,6 +14,7 @@ import {
ShapeCircle
,
MyAnimation
}
from
"
./Unit
"
;
import
{
matchesElement
}
from
'
@angular/animations/browser/src/render/shared
'
;
export
class
Cartoon
{
...
...
@@ -410,7 +411,7 @@ export class Cartoon {
createAnimation
(
imageKey
,
length
,
runTime
,
endCallback
?,
order
?:
boolean
)
{
let
element
=
new
MyAnimation
()
element
.
id
=
"
ANI-
"
+
imageKey
element
.
id
=
"
ANI-
"
+
imageKey
+
"
-
"
+
Math
.
floor
(
Math
.
random
()
*
10000
)
if
(
order
){
for
(
let
index
=
length
;
index
>
0
;
index
--
)
{
element
.
addFrameByImg
(
this
.
images
.
get
(
`
${
imageKey
}
(
${
index
}
)`
))
...
...
src/app/play/play.component.ts
View file @
40281eec
...
...
@@ -31,7 +31,8 @@ import {
waterWave
,
jelly
,
getAngleByPos
,
getPosDistance
getPosDistance
,
shake
}
from
"
./Unit
"
;
import
{
localImages
,
localAudios
}
from
"
./resources
"
;
...
...
@@ -52,7 +53,8 @@ const zIndexMap = {
questionKuang
:
50
,
imageContainer
:
20
,
shortAudio
:
60
,
progressBar
:
55
progressBar
:
55
,
animation
:
200
}
@
Component
({
...
...
@@ -123,7 +125,8 @@ export class PlayComponent implements OnInit, OnDestroy {
m_answerCard_All
=
[]
m_questionCard_All
=
[]
m_enableCardMove
=
false
;
m_currentSelectedCardID
=
null
m_currentSelectedCardID
=
null
;
m_startGame
=
true
// ------------------------------------
...
...
@@ -165,12 +168,21 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
g_formData
.
dataArray
.
forEach
(
element
=>
{
array
.
push
(
element
.
image_url
)
});
if
(
this
.
g_formData
.
question
.
image_url
){
array
.
push
(
this
.
g_formData
.
question
.
image_url
)
}
return
array
}
// 映射预加载音频[网路]资源 返回包含音频路径的数组
mapToAduioArray
(
contentObj
){
let
array
=
[]
if
(
this
.
g_formData
.
question
.
longAudio_url
){
array
.
push
(
this
.
g_formData
.
question
.
longAudio_url
)
}
if
(
this
.
g_formData
.
question
.
shortAudio_url
){
array
.
push
(
this
.
g_formData
.
question
.
shortAudio_url
)
}
return
array
}
...
...
@@ -207,6 +219,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
m_enableCardMove
=
false
;
this
.
m_answerCard_All
=
[]
this
.
m_questionCard_All
=
[]
this
.
m_startGame
=
true
;
}
startGame
(){
...
...
@@ -219,7 +232,9 @@ export class PlayComponent implements OnInit, OnDestroy {
}
endGame
(){
alert
(
"
End
"
)
this
.
showEndPatal
()
this
.
m_startGame
=
false
;
}
initBackground
(){
...
...
@@ -270,16 +285,18 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
g_formData
.
dataArray
.
forEach
((
element
,
index
)
=>
{
this
.
m_questionCard_All
.
push
(
this
.
createQuestionCardText
(
index
,
element
))
});
this
.
m_questionCard_All
=
this
.
randomArray_shuffle
(
this
.
m_questionCard_All
)
this
.
alignCenter
(
this
.
m_questionCard_All
,
20
*
this
.
g_mapScale
,
true
)
}
createQuestionCardText
(
index
,
text
){
let
element
=
this
.
g_cartoon
.
createCartoonElementLabel
(
"
questioncard-text-
"
+
index
,
"
"
+
text
+
"
"
,
"
BRLNSDB
"
,
"
#FFFFFF
"
,
6
0
*
this
.
g_mapScale
,
0
,
this
.
g_cartoon
.
getOrigin
().
y
+
720
*
this
.
g_mapScale
-
250
*
this
.
g_mapScale
)
let
element
=
this
.
g_cartoon
.
createCartoonElementLabel
(
"
questioncard-text-
"
+
index
,
"
"
+
text
+
"
"
,
"
BRLNSDB
"
,
"
#FFFFFF
"
,
6
5
*
this
.
g_mapScale
,
0
,
this
.
g_cartoon
.
getOrigin
().
y
+
720
*
this
.
g_mapScale
-
250
*
this
.
g_mapScale
)
let
imageBD
=
element
.
ref
.
getBoundingBox
()
let
cardHeight
=
127
element
.
index
=
index
;
// 边框
let
borderLeft
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
questioncard-text-border-left-
"
+
index
,
"
image_border_left
"
,
(
w
,
h
)
=>
{
return
{
...
...
@@ -360,10 +377,10 @@ export class PlayComponent implements OnInit, OnDestroy {
})
element
.
ref
.
addChild
(
borderRight_H
.
ref
)
let
text_copy
=
this
.
g_cartoon
.
createCartoonElementLabel
(
"
questioncard-text-
"
+
index
+
"
-copy
"
,
text
,
"
BRLNSDB
"
,
"
#d94158
"
,
60
*
this
.
g_mapScale
,
0
,
0
)
let
text_copy_shadow
=
this
.
g_cartoon
.
createCartoonElementLabel
(
"
questioncard-text-
"
+
index
+
"
-copy
"
,
text
,
"
BRLNSDB
"
,
"
#fdf0cd
"
,
60
*
this
.
g_mapScale
,
0
,
5
)
element
.
ref
.
addChild
(
text_copy_shadow
.
ref
)
element
.
ref
.
addChild
(
text_copy
.
ref
)
element
.
text_copy
=
this
.
g_cartoon
.
createCartoonElementLabel
(
"
questioncard-text-
"
+
index
+
"
-copy
"
,
text
,
"
BRLNSDB
"
,
"
#d94158
"
,
65
*
this
.
g_mapScale
,
0
,
0
)
element
.
text_copy_shadow
=
this
.
g_cartoon
.
createCartoonElementLabel
(
"
questioncard-text-
"
+
index
+
"
-copy
"
,
text
,
"
BRLNSDB
"
,
"
#fdf0cd
"
,
65
*
this
.
g_mapScale
,
0
,
5
)
element
.
ref
.
addChild
(
element
.
text_copy_shadow
.
ref
)
element
.
ref
.
addChild
(
element
.
text_copy
.
ref
)
border_H
.
ref
.
visible
=
false
;
borderRight_H
.
ref
.
visible
=
false
;
...
...
@@ -453,6 +470,7 @@ export class PlayComponent implements OnInit, OnDestroy {
}
})
let
imageBD
=
element
.
ref
.
getBoundingBox
()
element
.
index
=
index
;
// 边框
let
border
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
questioncard-image-border-
"
+
index
,
"
image_center
"
,
(
w
,
h
)
=>
{
...
...
@@ -494,7 +512,6 @@ export class PlayComponent implements OnInit, OnDestroy {
})
element
.
ref
.
addChild
(
borderRight
.
ref
)
// 高亮边框
let
border_H
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
questioncard-image-border-h-
"
+
index
,
"
border_center
"
,
(
w
,
h
)
=>
{
return
{
...
...
@@ -601,11 +618,9 @@ export class PlayComponent implements OnInit, OnDestroy {
// 答案卡片 文字
initAnsterCard_Text
(){
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardText
(
0
,
{}))
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardText
(
1
,
{}))
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardText
(
2
,
{}))
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardText
(
3
,
{}))
this
.
g_formData
.
dataArray
.
forEach
((
element
,
index
)
=>
{
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardText
(
index
,
element
))
});
this
.
alignCenter
(
this
.
m_answerCard_All
,
10
*
this
.
g_mapScale
,
true
)
}
...
...
@@ -621,24 +636,71 @@ export class PlayComponent implements OnInit, OnDestroy {
y
:
this
.
g_cartoon
.
getOrigin
().
y
+
720
*
this
.
g_mapScale
-
110
*
this
.
g_mapScale
}
})
element
.
index
=
index
;
element
.
shake
=
(
callback
?)
=>
{
rotateItem
(
element
.
ref
,
10
,
0.1
,
()
=>
{
rotateItem
(
element
.
ref
,
-
10
,
0.2
,
()
=>
{
rotateItem
(
element
.
ref
,
10
,
0.2
,
()
=>
{
rotateItem
(
element
.
ref
,
0
,
0.1
,
()
=>
{
callback
&&
callback
()
})
})
})
})
}
element
.
star
=
(
callback
?)
=>
{
element
.
starAni
=
this
.
g_cartoon
.
createAnimation
(
"
icon_star
"
,
5
,
300
,
()
=>
{
element
.
starAni
.
visible
=
false
;
this
.
deleteElementInRender
(
element
.
starAni
.
id
)
callback
&&
callback
()
})
element
.
starAni
.
setScaleXY
(
1
)
element
.
starAni
.
x
=
element
.
ref
.
x
element
.
starAni
.
y
=
element
.
ref
.
y
this
.
render
(
element
.
starAni
,
zIndexMap
.
animation
)
element
.
starAni
.
play
()
}
this
.
subscribeMapUpEvent
(
element
.
id
,
()
=>
{
if
(
this
.
m_currentSelectedCardID
&&
this
.
m_enableCardMove
){
let
selectedCard
=
this
.
g_cartoon
.
getCartoonElement
(
this
.
m_currentSelectedCardID
)
selectedCard
.
ref
.
x
=
element
.
ref
.
x
selectedCard
.
ref
.
y
=
element
.
ref
.
y
selectedCard
.
release
({
x
:
element
.
ref
.
x
,
y
:
element
.
ref
.
y
-
10
*
this
.
g_mapScale
},
()
=>
{
if
(
this
.
g_formData
.
answerType
==
"
Image
"
){
this
.
alignCenter
(
this
.
m_answerCard_All
,
30
*
this
.
g_mapScale
,
true
)
}
else
{
this
.
alignCenter
(
this
.
m_answerCard_All
,
20
*
this
.
g_mapScale
,
true
)
}
})
selectedCard
.
disable
=
true
;
let
index
=
this
.
m_answerCard_All
.
indexOf
(
element
)
this
.
m_answerCard_All
.
splice
(
index
,
1
,
selectedCard
)
this
.
deleteElementInRender
(
element
.
id
)
this
.
topOfRenderArray
(
this
.
g_cartoon
.
getCartoonElement
(
"
background-main-xia
"
).
ref
)
if
(
selectedCard
.
index
==
element
.
index
){
selectedCard
.
ref
.
x
=
element
.
ref
.
x
selectedCard
.
ref
.
y
=
element
.
ref
.
y
selectedCard
.
release
({
x
:
element
.
ref
.
x
,
y
:
element
.
ref
.
y
-
10
*
this
.
g_mapScale
},
()
=>
{
let
spacing
=
0
if
(
this
.
g_formData
.
answerType
==
"
Image
"
){
spacing
=
20
*
this
.
g_mapScale
}
else
{
spacing
=
20
*
this
.
g_mapScale
}
this
.
alignCenter
(
this
.
m_answerCard_All
,
spacing
,
true
,
()
=>
{
element
.
star
(()
=>
{
let
end
=
true
this
.
m_answerCard_All
.
forEach
(
item
=>
{
if
(
item
.
id
.
indexOf
(
"
answercard
"
)
!=-
1
){
end
=
false
}
})
if
(
end
){
this
.
endGame
()
}
})
})
})
selectedCard
.
disable
=
true
;
selectedCard
.
text_copy
.
ref
.
fontColor
=
"
#608dec
"
let
index
=
this
.
m_answerCard_All
.
indexOf
(
element
)
this
.
m_answerCard_All
.
splice
(
index
,
1
,
selectedCard
)
this
.
deleteElementInRender
(
element
.
id
)
this
.
topOfRenderArray
(
this
.
g_cartoon
.
getCartoonElement
(
"
background-main-xia
"
).
ref
)
}
else
{
selectedCard
.
release
()
this
.
disableMoveAsstant
();
element
.
shake
()
}
}
this
.
g_enableMapUp
=
true
;
return
true
...
...
@@ -650,11 +712,9 @@ export class PlayComponent implements OnInit, OnDestroy {
// 答案卡片 图片
initAnsterCard_Image
(){
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardImage
(
0
,
{}))
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardImage
(
1
,
{}))
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardImage
(
2
,
{}))
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardImage
(
3
,
{}))
this
.
g_formData
.
dataArray
.
forEach
((
element
,
index
)
=>
{
this
.
m_answerCard_All
.
push
(
this
.
createAnswerCardImage
(
index
,
element
))
});
this
.
alignCenter
(
this
.
m_answerCard_All
,
20
*
this
.
g_mapScale
,
true
)
}
...
...
@@ -670,24 +730,70 @@ export class PlayComponent implements OnInit, OnDestroy {
y
:
this
.
g_cartoon
.
getOrigin
().
y
+
720
*
this
.
g_mapScale
-
140
*
this
.
g_mapScale
}
})
element
.
index
=
index
;
element
.
shake
=
(
callback
?)
=>
{
rotateItem
(
element
.
ref
,
10
,
0.1
,
()
=>
{
rotateItem
(
element
.
ref
,
-
10
,
0.2
,
()
=>
{
rotateItem
(
element
.
ref
,
10
,
0.2
,
()
=>
{
rotateItem
(
element
.
ref
,
0
,
0.1
,
()
=>
{
callback
&&
callback
()
})
})
})
})
}
element
.
star
=
(
callback
?)
=>
{
element
.
starAni
=
this
.
g_cartoon
.
createAnimation
(
"
icon_star
"
,
5
,
300
,
()
=>
{
element
.
starAni
.
visible
=
false
;
this
.
deleteElementInRender
(
element
.
starAni
.
id
)
callback
&&
callback
()
})
element
.
starAni
.
setScaleXY
(
1
)
element
.
starAni
.
x
=
element
.
ref
.
x
element
.
starAni
.
y
=
element
.
ref
.
y
this
.
render
(
element
.
starAni
,
zIndexMap
.
animation
)
element
.
starAni
.
play
()
}
this
.
subscribeMapUpEvent
(
element
.
id
,
()
=>
{
if
(
this
.
m_currentSelectedCardID
&&
this
.
m_enableCardMove
){
let
selectedCard
=
this
.
g_cartoon
.
getCartoonElement
(
this
.
m_currentSelectedCardID
)
selectedCard
.
ref
.
x
=
element
.
ref
.
x
selectedCard
.
ref
.
y
=
element
.
ref
.
y
selectedCard
.
release
({
x
:
element
.
ref
.
x
,
y
:
element
.
ref
.
y
-
6
*
this
.
g_mapScale
},
()
=>
{
if
(
this
.
g_formData
.
answerType
==
"
Image
"
){
this
.
alignCenter
(
this
.
m_answerCard_All
,
30
*
this
.
g_mapScale
,
true
)
}
else
{
this
.
alignCenter
(
this
.
m_answerCard_All
,
20
*
this
.
g_mapScale
,
true
)
}
})
selectedCard
.
disable
=
true
;
let
index
=
this
.
m_answerCard_All
.
indexOf
(
element
)
this
.
m_answerCard_All
.
splice
(
index
,
1
,
selectedCard
)
this
.
deleteElementInRender
(
element
.
id
)
this
.
topOfRenderArray
(
this
.
g_cartoon
.
getCartoonElement
(
"
background-main-xia
"
).
ref
)
if
(
selectedCard
.
index
==
element
.
index
){
selectedCard
.
ref
.
x
=
element
.
ref
.
x
selectedCard
.
ref
.
y
=
element
.
ref
.
y
selectedCard
.
release
({
x
:
element
.
ref
.
x
,
y
:
element
.
ref
.
y
-
6
*
this
.
g_mapScale
},
()
=>
{
let
spacing
=
0
if
(
this
.
g_formData
.
answerType
==
"
Image
"
){
spacing
=
20
*
this
.
g_mapScale
}
else
{
spacing
=
20
*
this
.
g_mapScale
}
this
.
alignCenter
(
this
.
m_answerCard_All
,
spacing
,
true
,
()
=>
{
element
.
star
(()
=>
{
let
end
=
true
this
.
m_answerCard_All
.
forEach
(
item
=>
{
if
(
item
.
id
.
indexOf
(
"
answercard
"
)
!=-
1
){
end
=
false
}
})
if
(
end
){
this
.
endGame
()
}
})
})
})
selectedCard
.
disable
=
true
;
let
index
=
this
.
m_answerCard_All
.
indexOf
(
element
)
this
.
m_answerCard_All
.
splice
(
index
,
1
,
selectedCard
)
this
.
deleteElementInRender
(
element
.
id
)
this
.
topOfRenderArray
(
this
.
g_cartoon
.
getCartoonElement
(
"
background-main-xia
"
).
ref
)
}
else
{
selectedCard
.
release
()
this
.
disableMoveAsstant
();
element
.
shake
()
}
}
this
.
g_enableMapUp
=
true
;
return
true
...
...
@@ -698,7 +804,7 @@ export class PlayComponent implements OnInit, OnDestroy {
}
initQuestionBackground
(){
if
(
this
.
g_formData
.
question
.
type
==
"
Audio
"
){
if
(
this
.
g_formData
.
question
.
type
==
"
Long
Audio
"
){
let
element
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
question-audio-bg
"
,
"
bg_kuang2
"
,
(
w
,
h
)
=>
{
return
{
sx
:
this
.
g_cartoon
.
getCartoonElement
(
"
background-main
"
).
ref
.
scaleX
,
...
...
@@ -731,7 +837,7 @@ export class PlayComponent implements OnInit, OnDestroy {
initQuestion
(){
let
audio
=
this
.
initAudioPlayer
()
if
(
this
.
g_formData
.
question
.
type
==
"
Audio
"
){
if
(
this
.
g_formData
.
question
.
type
==
"
LongAudio
"
&&
this
.
g_formData
.
question
.
longAudio_url
!=
""
){
// 进度条
let
progressBar
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
audio-plyer-progress
"
,
"
bg_tiaodi
"
,
(
w
,
h
)
=>
{
return
{
...
...
@@ -818,7 +924,6 @@ export class PlayComponent implements OnInit, OnDestroy {
audioPlay
.
pauseIcon
.
ref
.
visible
=
false
audioPlay
.
audio
.
pause
()
audioPlay
.
isPlaying
=
!
audioPlay
.
isPlaying
slider
.
ref
.
x
=
-
(
476
/
2
)
coverColor
.
width
=
0
;
progressBar
.
currentTimeString
.
ref
.
text
=
"
00:00
"
...
...
@@ -890,7 +995,7 @@ export class PlayComponent implements OnInit, OnDestroy {
}
})
let
image
=
this
.
g_cartoon
.
createImage
(
"
lego-building
"
,
(
w
,
h
)
=>
{
let
image
=
this
.
g_cartoon
.
createImage
(
this
.
g_formData
.
question
.
image_url
,
(
w
,
h
)
=>
{
let
sx
=
590
/
w
let
sy
=
360
/
h
let
s
=
Math
.
min
(
sx
,
sy
)
...
...
@@ -908,78 +1013,106 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
render
(
element
.
ref
,
zIndexMap
.
imageContainer
)
}
}
initAudioPlayer
(){
let
element
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
bg-short-audio
"
,
"
bg_laba
"
,
(
w
,
h
)
=>
{
return
{
sx
:
474
*
this
.
g_mapScale
/
w
,
sy
:
98
*
this
.
g_mapScale
/
h
}
},
(
w
,
h
)
=>
{
let
x
=
0
;
let
y
=
0
if
(
this
.
g_formData
.
question
.
type
==
"
Audio
"
){
x
=
-
235
y
=
-
45
if
(
(
this
.
g_formData
.
question
.
type
==
"
LongAudio
"
&&
this
.
g_formData
.
question
.
longAudio_url
!=
""
)
||
this
.
g_formData
.
question
.
shortAudio_url
!=
""
){
let
audioType
=
"
L
"
let
element
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
bg-short-audio
"
,
"
bg_laba
"
,
(
w
,
h
)
=>
{
return
{
sx
:
474
*
this
.
g_mapScale
/
w
,
sy
:
98
*
this
.
g_mapScale
/
h
}
},
(
w
,
h
)
=>
{
let
x
=
0
;
let
y
=
0
if
(
this
.
g_formData
.
question
.
type
==
"
LongAudio
"
){
x
=
-
235
y
=
-
45
}
else
{
audioType
=
"
S
"
x
=
20
}
return
{
x
:
this
.
g_cartoon
.
getOrigin
().
x
+
(
1280
+
x
)
*
this
.
g_mapScale
,
y
:
this
.
g_cartoon
.
getOrigin
().
y
+
(
220
+
y
)
*
this
.
g_mapScale
}
})
element
.
audioType
=
audioType
element
.
playIcon
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
btn-audio-play
"
,
"
btn_videooff
"
,
(
w
,
h
)
=>
{
return
{
sx
:
91
/
w
,
sy
:
90
/
h
}
},
(
w
,
h
)
=>
{
return
{
x
:
-
140
,
y
:
-
80
}
})
element
.
pauseIcon
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
btn-audio-pause
"
,
"
btn_videoon
"
,
(
w
,
h
)
=>
{
return
{
sx
:
91
/
w
,
sy
:
90
/
h
}
},
(
w
,
h
)
=>
{
return
{
x
:
-
140
,
y
:
-
80
}
})
element
.
pauseIcon
.
ref
.
visible
=
false
;
element
.
ref
.
addChild
(
element
.
playIcon
.
ref
)
element
.
ref
.
addChild
(
element
.
pauseIcon
.
ref
)
if
(
this
.
g_formData
.
question
.
type
==
"
LongAudio
"
){
element
.
audio
=
this
.
g_cartoon
.
audio
.
get
(
this
.
g_formData
.
question
.
longAudio_url
)
}
else
{
x
=
20
}
return
{
x
:
this
.
g_cartoon
.
getOrigin
().
x
+
(
1280
+
x
)
*
this
.
g_mapScale
,
y
:
this
.
g_cartoon
.
getOrigin
().
y
+
(
220
+
y
)
*
this
.
g_mapScale
}
})
element
.
playIcon
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
btn-audio-play
"
,
"
btn_videooff
"
,
(
w
,
h
)
=>
{
return
{
sx
:
91
/
w
,
sy
:
90
/
h
}
},
(
w
,
h
)
=>
{
return
{
x
:
-
140
,
y
:
-
80
}
})
element
.
pauseIcon
=
this
.
g_cartoon
.
createCartoonElementImageFunc
(
"
btn-audio-pause
"
,
"
btn_videoon
"
,
(
w
,
h
)
=>
{
return
{
sx
:
91
/
w
,
sy
:
90
/
h
}
},
(
w
,
h
)
=>
{
return
{
x
:
-
140
,
y
:
-
80
element
.
audio
=
this
.
g_cartoon
.
audio
.
get
(
this
.
g_formData
.
question
.
shortAudio_url
)
}
})
element
.
pauseIcon
.
ref
.
visible
=
false
;
element
.
ref
.
addChild
(
element
.
playIcon
.
ref
)
element
.
ref
.
addChild
(
element
.
pauseIcon
.
ref
)
element
.
isPlaying
=
false
this
.
subscribeMapDownEvent
(
element
.
playIcon
.
id
,
()
=>
{
if
(
element
.
audioType
==
"
L
"
){
if
(
element
.
isPlaying
){
element
.
playIcon
.
ref
.
visible
=
true
element
.
pauseIcon
.
ref
.
visible
=
false
element
.
audio
.
pause
()
element
.
isPlaying
=
!
element
.
isPlaying
}
else
{
element
.
playIcon
.
ref
.
visible
=
false
element
.
pauseIcon
.
ref
.
visible
=
true
element
.
audio
.
play
()
element
.
isPlaying
=
!
element
.
isPlaying
}
this
.
g_enableMapDown
=
true
;
}
else
{
element
.
playIcon
.
ref
.
visible
=
false
element
.
starAni
=
this
.
g_cartoon
.
createAnimation
(
"
btn_laba
"
,
3
,
500
)
element
.
starAni
.
loop
=
true
;
element
.
starAni
.
setScaleXY
(
this
.
g_mapScale
)
element
.
starAni
.
x
=
element
.
ref
.
x
-
140
*
this
.
g_mapScale
element
.
starAni
.
y
=
element
.
ref
.
y
-
80
*
this
.
g_mapScale
this
.
render
(
element
.
starAni
,
zIndexMap
.
animation
)
element
.
starAni
.
play
()
this
.
g_cartoon
.
playAudio
(
this
.
g_formData
.
question
.
shortAudio_url
,
false
,
()
=>
{
element
.
starAni
.
visible
=
false
;
this
.
deleteElementInRender
(
element
.
starAni
.
id
)
element
.
playIcon
.
ref
.
visible
=
true
this
.
g_enableMapDown
=
true
;
})
}
})
this
.
render
(
element
.
ref
,
zIndexMap
.
shortAudio
)
console
.
log
(
element
.
audio
)
return
element
.
audio
}
else
{
return
null
}
element
.
audio
=
this
.
g_cartoon
.
audio
.
get
(
"
default_audio
"
)
element
.
isPlaying
=
false
this
.
subscribeMapDownEvent
(
element
.
playIcon
.
id
,
()
=>
{
if
(
element
.
isPlaying
){
element
.
playIcon
.
ref
.
visible
=
true
element
.
pauseIcon
.
ref
.
visible
=
false
element
.
audio
.
pause
()
element
.
isPlaying
=
!
element
.
isPlaying
}
else
{
element
.
playIcon
.
ref
.
visible
=
false
element
.
pauseIcon
.
ref
.
visible
=
true
element
.
audio
.
play
()
element
.
isPlaying
=
!
element
.
isPlaying
}
this
.
g_enableMapDown
=
true
;
})
this
.
render
(
element
.
ref
,
zIndexMap
.
shortAudio
)
return
element
.
audio
}
...
...
@@ -1623,6 +1756,8 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
m_renderObject
.
forEach
(
item
=>
{
this
.
m_renderArr
.
push
(
item
.
element
)
})
}
else
{
console
.
warn
(
"
Can not found element id:
"
+
id
)
}
}
...
...
@@ -1679,23 +1814,28 @@ export class PlayComponent implements OnInit, OnDestroy {
alignCenter
(
elementArray
,
spacing
,
withAni
?,
callback
?){
let
totlaWidth
=
0
let
length
=
elementArray
.
length
elementArray
.
forEach
(
element
=>
{
let
bd
=
element
.
ref
.
getBoundingBox
()
totlaWidth
+=
bd
.
width
});
totlaWidth
+=
(
elementArray
.
length
-
1
)
*
spacing
let
laseX
=
this
.
g_canvasWidth
/
2
-
totlaWidth
/
2
;
elementArray
.
forEach
(
element
=>
{
elementArray
.
forEach
(
(
element
,
index
)
=>
{
let
bd
=
element
.
ref
.
getBoundingBox
()
if
(
withAni
){
tweenChange
(
element
.
ref
,
{
x
:
laseX
+
bd
.
width
/
2
},
0.2
,
()
=>
{
this
.
g_cartoon
.
saveSize
(
element
.
id
)
callback
&&
callback
()
if
(
length
==
(
index
+
1
)){
callback
&&
callback
()
}
})
}
else
{
element
.
ref
.
x
=
laseX
+
bd
.
width
/
2
this
.
g_cartoon
.
saveSize
(
element
.
id
)
callback
&&
callback
()
if
(
length
==
(
index
+
1
)){
callback
&&
callback
()
}
}
laseX
=
(
laseX
+
bd
.
width
+
spacing
)
...
...
src/assets/play/default/formData/defaultData.js
View file @
40281eec
...
...
@@ -5,5 +5,5 @@ export default {
type
:
"
Image
"
},
answerType
:
"
Text
"
,
dataArray
:
[
"
This is for test
"
,
"
Apple
"
,
"
Building
"
,
"
Lovely Puppy
"
]
dataArray
:
[
"
One
"
,
"
Two
"
,
"
Three
"
,
"
Four
"
]
}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment