Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
J
JM_4-2
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
JM_4-2
Commits
47dcdb23
Commit
47dcdb23
authored
Aug 02, 2021
by
limingzhe
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
fix: 不刷新
parent
3ebcc061
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
48 additions
and
34 deletions
+48
-34
play.component.html
src/app/play/play.component.html
+18
-18
play.component.ts
src/app/play/play.component.ts
+29
-15
index.html
src/index.html
+1
-1
No files found.
src/app/play/play.component.html
View file @
47dcdb23
...
...
@@ -9,7 +9,7 @@
<!-- 背景图 -->
<div
style=
"width: 100%; height: 100%; position: absolute;"
>
<img
src=
"
../../
assets/play/bg.jpg"
style=
"width: 100%; height: 100%; position: absolute; "
/>
<img
src=
"assets/play/bg.jpg"
style=
"width: 100%; height: 100%; position: absolute; "
/>
</div>
<!-- 标题 -->
...
...
@@ -20,27 +20,27 @@
<!-- 中间句子面板 -->
<div
style=
"text-align: center; margin-top: 20vh; position: absolute; text-align: center; "
>
<!-- 背景图 -->
<img
src=
"
../../
assets/play/sentence_bg.png"
style=
"height: 28vh; width: auto;"
>
<img
src=
"assets/play/sentence_bg.png"
style=
"height: 28vh; width: auto;"
>
<!-- 小圈 -->
<div
style=
"position: relative; top: -33.9vh; "
>
<img
[
src
]="'
../../
assets
/
play
/
circle_1
'+
(
countDownNum
>
3 ? '' : '_red') +'.png'" style="height: 11.8vh; width: auto; ">
<img
[
src
]="'
assets
/
play
/
circle_1
'+
(
countDownNum
>
3 ? '' : '_red') +'.png'" style="height: 11.8vh; width: auto; ">
<div
style=
"position: relative; height: 11.8vh; top: -11.8vh; display: flex; align-items: center; justify-content: center;"
>
<label
style=
"font-family: Aileron-Black; font-size: 4.3vh;"
[
style
.
color
]="
countDownNum
>
3 ? '#3b9d31' : '#ffffff'">{{countDownNum}}
</label>
</div>
<div
*
ngIf=
"countDownNum > 3"
style=
"position: relative; height: 11.8vh; top: -23.6vh; display: flex; align-items: center; justify-content: center;"
>
<img
[
style
.
height
]="
tweenItem
?.
circleHeight
+
'
vh
'"
[
style
.
opacity
]="
tweenItem
?.
opacity
"
src=
"
../../
assets/play/circle_2.png"
style=
"width: auto; "
>
<img
[
style
.
height
]="
tweenItem
?.
circleHeight
+
'
vh
'"
[
style
.
opacity
]="
tweenItem
?.
opacity
"
src=
"assets/play/circle_2.png"
style=
"width: auto; "
>
</div>
</div>
<!-- 喇叭 -->
<div
style=
"position: absolute; top: 0; margin-top: -0.7vh; right: 3%;"
(
click
)="
playSentenceAudio
()"
>
<img
src=
"
../../
assets/play/sound_bg.png"
style=
"height: 8.1vh; width: auto; "
>
<img
src=
"assets/play/sound_bg.png"
style=
"height: 8.1vh; width: auto; "
>
<div
style=
"position: relative; top: -8.1vh; left: 0.8vh; overflow: hidden; height: 8.1vh; width: 4.9368vh; display: flex; align-items: center;"
>
<img
[
src
]="'
../../
assets
/
play
/
sound_icon_
'+
curSoundIconIndex
+'.
png
'"
style=
"height: 4.2vh; width: auto;"
>
<img
[
src
]="'
assets
/
play
/
sound_icon_
'+
curSoundIconIndex
+'.
png
'"
style=
"height: 4.2vh; width: auto;"
>
</div>
</div>
<!-- 页码 -->
<div
style=
"position: absolute; top: 0; margin-top: 19.7vh; right: -0.7%;"
>
<img
src=
"
../../
assets/play/page_num_bg.png"
style=
"height: 7.1vh; width: auto; "
>
<img
src=
"assets/play/page_num_bg.png"
style=
"height: 7.1vh; width: auto; "
>
<div
style=
"position: relative; height: 8.1vh; top: -8.1vh; display: flex; align-items: center; justify-content: center;"
>
<label
style=
"margin-left: -0.5vw; font-family: DroidSansFallback; font-size: 3.8vh; color:#ffffff"
>
{{curPage + ' / ' + totalPage}}
</label>
</div>
...
...
@@ -57,13 +57,13 @@
</div>
<!-- 面板阴影 -->
<div
style=
"width: 100%; position: absolute; top:0; margin-top: 20.8vh; text-align: center;"
>
<img
src=
"
../../
assets/play/sentence_bg_shadow.png"
style=
"width: auto; height: 12.9vh;"
/>
<img
src=
"assets/play/sentence_bg_shadow.png"
style=
"width: auto; height: 12.9vh;"
/>
</div>
<!-- 提交按钮 -->
<div
style=
"position: absolute; width: 100%; top: 0; margin-top: 40%; z-index: 1;"
>
<img
src=
"
../../
assets/play/btn.png"
style=
"height: 9.5vh; width: auto; "
>
<img
src=
"assets/play/btn.png"
style=
"height: 9.5vh; width: auto; "
>
<div
style=
"position: relative; height: 9.5vh; top: -9.5vh; display: flex; align-items: center; justify-content: center;"
>
<label
style=
"margin-left: -0.5vw; font-family: Aileron-Black; font-size: 3.8vh; color:#ffffff"
>
{{'Submit'}}
</label>
...
...
@@ -74,7 +74,7 @@
</div>
<div
style=
"width: 100%; position: absolute; top:0; margin-top: 49.5vh; text-align: center;"
>
<img
src=
"
../../
assets/play/btn_shadow.png"
style=
"width: auto; height: 12.9vh;"
/>
<img
src=
"assets/play/btn_shadow.png"
style=
"width: auto; height: 12.9vh;"
/>
</div>
</div>
...
...
@@ -85,15 +85,15 @@
<div
*
ngIf=
"isShowResult"
style=
"z-index: 5; position: absolute; top:0; width: 100%; height: 100%; background-size: cover; display: flex; align-items: center; flex-direction: column;"
>
<!-- 背景图 -->
<div
style=
"width: 100%; height: 100%; position: absolute;"
>
<img
src=
"
../../
assets/play/bg.jpg"
style=
"width: 100%; height: 100%; position: absolute; "
/>
<img
src=
"assets/play/bg.jpg"
style=
"width: 100%; height: 100%; position: absolute; "
/>
</div>
<!-- 面板 -->
<div
style=
"width: 100%; height: 68.7vh; position: absolute; top: 0; margin-top: 13vh;; text-align: center;"
>
<img
src=
"
../../
assets/play/result_panel.png"
style=
"width: auto; height: 68.7vh; "
/>
<img
src=
"assets/play/result_panel.png"
style=
"width: auto; height: 68.7vh; "
/>
<!-- 标题 -->
<div
style=
"position: absolute; margin-top: -71.7vh; width: 100%; text-align: center;"
>
<div>
<img
src=
"
../../
assets/play/result_panel_item.png"
style=
"width: auto; height: 10vh; "
/>
<img
src=
"assets/play/result_panel_item.png"
style=
"width: auto; height: 10vh; "
/>
</div>
<div
style=
"position: relative; height: 10vh; top: -9.5vh; display: flex; align-items: center; justify-content: center;"
>
<label
style=
"font-family: Aileron-Black; font-size: 3.1vh; color:#ffffff"
>
{{'Check'}}
</label>
...
...
@@ -110,7 +110,7 @@
<!-- 纠正信息 -->
<div
*
ngIf=
"!rs.isRight"
style=
"background-color: #3b962e; margin-top:0.5vh; border-radius: 3.55vh; height: 7.1vh; width: 108.9vh; display: flex; align-items: center;"
>
<div
style=
"margin-left: 2vh; margin-top:-0.5vh;"
>
<img
src=
"
../../
assets/play/info_icon.png"
style=
"width: auto; height: 3.6vh; "
/>
<img
src=
"assets/play/info_icon.png"
style=
"width: auto; height: 3.6vh; "
/>
</div>
<div
style=
"margin-left: 2vh"
>
<label
style=
"font-family: Aileron-Black; font-size: 2.6vh; color:#ffe9b1"
>
{{rs.answerRight}}
</label>
...
...
@@ -125,13 +125,13 @@
</div>
<!-- 面板阴影 -->
<div
style=
"width: 100%; position: absolute; top:0; margin-top: 60.8vh; text-align: center;"
>
<img
src=
"
../../
assets/play/result_panel_shadow.png"
style=
"width: auto; height: 12.9vh;"
/>
<img
src=
"assets/play/result_panel_shadow.png"
style=
"width: auto; height: 12.9vh;"
/>
</div>
</div>
<!-- 按钮 -->
<div
style=
"position: absolute; top: 0; margin-top: 87vh;"
>
<div
style=
"z-index: 2; position: relative; "
>
<img
src=
"
../../
assets/play/big_btn.png"
style=
"height: 9.5vh; width: auto; z-index: 12;"
>
<img
src=
"assets/play/big_btn.png"
style=
"height: 9.5vh; width: auto; z-index: 12;"
>
</div>
<div
style=
"z-index: 2; position: relative; height: 9.5vh; top: -9.5vh; display: flex; align-items: center; justify-content: center;"
>
<label
style=
"margin-left: -0.5vw; font-family: Aileron-Black; font-size: 3.8vh; color:#ffffff"
>
{{'更多练习'}}
</label>
...
...
@@ -140,7 +140,7 @@
</div>
<!-- 按钮阴影 -->
<div
style=
"z-index: 1; width: 100%; position: absolute; top:0; margin-top: 2.5vh; text-align: center;"
>
<img
src=
"
../../
assets/play/big_btn_shadow.png"
style=
"width: auto; height: 11.3vh;"
/>
<img
src=
"assets/play/big_btn_shadow.png"
style=
"width: auto; height: 11.3vh;"
/>
</div>
</div>
...
...
@@ -153,6 +153,6 @@
<!-- </div> -->
<!-- <div style="background: url('
../..
/assets/play/bg.jpg'); width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-size:contain; z-index: -1;">
<!-- <div style="background: url('/assets/play/bg.jpg'); width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-size:contain; z-index: -1;">
</div> -->
src/app/play/play.component.ts
View file @
47dcdb23
...
...
@@ -137,7 +137,6 @@ export class PlayComponent implements OnInit, OnDestroy {
@
HostListener
(
'
window:resize
'
,
[
'
$event
'
])
onResize
(
event
)
{
this
.
winResizeEventStream
.
next
();
}
...
...
@@ -149,7 +148,7 @@ export class PlayComponent implements OnInit, OnDestroy {
async
ngOnInit
()
{
await
loadFonts
();
//
await loadFonts();
const
getData
=
(
<
any
>
window
).
courseware
.
getData
;
...
...
@@ -178,11 +177,21 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
init
()
//
this.init()
// this.initAudio();
// this.initImg();
// this.initListener();
this
.
initData
();
this
.
stopSoundAnim
();
// this.playSentenceAudio();
this
.
update
();
this
.
addServerListener
();
window
[
'
air
'
].
hideAirClassLoading
(
this
.
KEY
,
this
.
data
);
},
this
.
KEY
);
...
...
@@ -473,6 +482,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
loadResources
().
then
(()
=>
{
// this.setfontData();
this
.
addServerListener
();
window
[
'
air
'
].
hideAirClassLoading
(
this
.
KEY
,
this
.
data
);
...
...
@@ -481,8 +491,10 @@ export class PlayComponent implements OnInit, OnDestroy {
}
loadEnd
(
cb
)
{
this
.
init
();
this
.
update
();
this
.
playSentenceAudio
();
// this.init();
// this.update();
cb
()
}
...
...
@@ -513,11 +525,10 @@ export class PlayComponent implements OnInit, OnDestroy {
}
c
.
onEvent
(
'
game_start
'
,
(
data
,
next
)
=>
{
this
.
gameStart
();
if
(
next
)
{
next
();
}
c
.
onEvent
(
'
course-in-screen
'
,
(
data
,
next
)
=>
{
this
.
loadEnd
(()
=>
{
next
();
});
});
}
...
...
@@ -552,7 +563,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
playSentenceAudio
();
this
.
update
();
//
this.update();
// this.initResultView();
}
...
...
@@ -607,6 +618,9 @@ export class PlayComponent implements OnInit, OnDestroy {
playHtmlAudio
(
mp3Url
,
cb
=
null
)
{
if
(
!
mp3Url
)
{
if
(
cb
)
{
cb
();
}
return
;
}
const
mp3
=
new
Audio
(
mp3Url
);
...
...
@@ -635,13 +649,13 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
showCircleAnim
();
if
(
this
.
countDownNum
==
3
)
{
this
.
countDownAudio3
=
this
.
playHtmlAudio
(
"
../../
assets/play/music/time_3.mp3
"
)
this
.
countDownAudio3
=
this
.
playHtmlAudio
(
"
assets/play/music/time_3.mp3
"
)
}
if
(
this
.
countDownNum
<=
0
)
{
this
.
countDownStop
();
this
.
countDownAudio0
=
this
.
playHtmlAudio
(
"
../../
assets/play/music/time_0.mp3
"
,
()
=>
{
this
.
countDownAudio0
=
this
.
playHtmlAudio
(
"
assets/play/music/time_0.mp3
"
,
()
=>
{
this
.
submitAnswer
();
})
return
;
...
...
@@ -673,7 +687,7 @@ export class PlayComponent implements OnInit, OnDestroy {
changeNextQuestion
()
{
this
.
cleanAudio
();
this
.
playHtmlAudio
(
'
../../
assets/play/music/submit.mp3
'
);
this
.
playHtmlAudio
(
'
assets/play/music/submit.mp3
'
);
if
(
this
.
curPage
>=
this
.
totalPage
)
{
this
.
countDownStop
();
...
...
@@ -747,7 +761,7 @@ export class PlayComponent implements OnInit, OnDestroy {
moreBtnClick
()
{
console
.
log
(
'
in moreBtnClick
'
);
this
.
playHtmlAudio
(
"
../../
assets/play/music/more.mp3
"
)
this
.
playHtmlAudio
(
"
assets/play/music/more.mp3
"
)
}
inputTouch
()
{
...
...
src/index.html
View file @
47dcdb23
...
...
@@ -7,7 +7,7 @@
<!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">-->
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1"
>
<link
rel=
"icon"
type=
"image/x-icon"
href=
"favicon.ico"
>
<script
type=
"text/javascript"
src=
"https://staging-teach.cdn.ireadabc.com/h5template/h5-static-lib/js/air
_online_open
.js"
></script>
<script
type=
"text/javascript"
src=
"https://staging-teach.cdn.ireadabc.com/h5template/h5-static-lib/js/air.js"
></script>
</head>
<body>
...
...
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