Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
E
et_21
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
et_21
Commits
9d55a4bb
Commit
9d55a4bb
authored
Mar 29, 2021
by
liujiaxin
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
lrc scroll
parent
f880511b
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
101 additions
and
18 deletions
+101
-18
karaoke.js
play/assets/et_21/components/karaoke/scripts/karaoke.js
+25
-9
scene.fire
play/assets/et_21/scene/scene.fire
+1
-1
scene.js
play/assets/et_21/script/scene.js
+75
-8
No files found.
play/assets/et_21/components/karaoke/scripts/karaoke.js
View file @
9d55a4bb
...
@@ -206,6 +206,7 @@ cc.Class({
...
@@ -206,6 +206,7 @@ cc.Class({
// this.node.height = area.rect.width;
// this.node.height = area.rect.width;
// this.node.parent.zIndex = 99999
// this.node.parent.zIndex = 99999
const
karaokeConf
=
gameData
.
lrcData
const
karaokeConf
=
gameData
.
lrcData
this
.
_lrcData
=
karaokeConf
&&
karaokeConf
.
lyrics
?
karaokeConf
.
lyrics
:
[];
this
.
_lrcData
=
karaokeConf
&&
karaokeConf
.
lyrics
?
karaokeConf
.
lyrics
:
[];
...
@@ -391,10 +392,9 @@ cc.Class({
...
@@ -391,10 +392,9 @@ cc.Class({
console
.
log
(
'
this.sentenceTimePhase
'
,
this
.
sentenceTimePhase
)
console
.
log
(
'
this.sentenceTimePhase
'
,
this
.
sentenceTimePhase
)
// this.resetLRC();
// this.resetLRC();
// this.renderLRC(this._lrcData[0].time)
// this.renderHighlight();
this
.
resetLRC
();
this
.
renderHighlight
();
window
.
test
=
this
;
window
.
test
=
this
;
//#region smart flow lrc
//#region smart flow lrc
...
@@ -567,6 +567,7 @@ cc.Class({
...
@@ -567,6 +567,7 @@ cc.Class({
},
},
justifyContentPosition
(){
justifyContentPosition
(){
console
.
log
(
'
justifyContentPosition
'
)
let
{
height
:
h
}
=
this
.
calcHighlightRichText
.
node
.
getContentSize
();
let
{
height
:
h
}
=
this
.
calcHighlightRichText
.
node
.
getContentSize
();
if
(
this
.
magicHeight
===
null
)
{
if
(
this
.
magicHeight
===
null
)
{
this
.
magicHeight
=
h
-
this
.
richText
.
lineHeight
;
this
.
magicHeight
=
h
-
this
.
richText
.
lineHeight
;
...
@@ -580,13 +581,28 @@ cc.Class({
...
@@ -580,13 +581,28 @@ cc.Class({
// this.calcSentenceRichText.string = '';
// this.calcSentenceRichText.string = '';
// h = Math.min(h, h - sh + this.node.h)
// h = Math.min(h, h - sh + this.node.h)
// }
// }
if
(
this
.
richText
.
node
.
height
>
this
.
node
.
height
)
{
const
nodeHeight
=
this
.
richText
.
_labelHeight
;
let
posY
=
(
this
.
node
.
height
-
this
.
richText
.
node
.
height
)
/
2
;
// const nodeHeight = h;
// if (nodeHeight > this.node.height) {
// let posY = (this.node.height - nodeHeight ) / 2;
// // if (h > this.node.height){
// // posY = posY + (h - this.node.height);
// // }
// this.richText.node.y = posY;// + this.magicHeight;
// }
if
(
this
.
richText
.
_labelHeight
>
this
.
node
.
height
)
{
let
posY
=
(
this
.
node
.
height
-
this
.
richText
.
_labelHeight
)
/
2
;
if
(
h
>
this
.
node
.
height
){
if
(
h
>
this
.
node
.
height
){
posY
=
posY
+
(
h
-
this
.
node
.
height
);
posY
=
posY
+
(
h
-
this
.
node
.
height
);
}
}
const
b4
=
this
.
richText
.
node
.
y
;
this
.
richText
.
node
.
y
=
posY
;
// + this.magicHeight;
// setTimeout(() => {
this
.
richText
.
node
.
y
=
posY
;
// + this.magicHeight;
// }, 0)
// console.log('this.richText.node.y',b4 , this.richText.node.y, posY)
}
}
},
},
findSentenceIndexByWords
(
s
,
sentenceIndexObj
)
{
findSentenceIndexByWords
(
s
,
sentenceIndexObj
)
{
...
@@ -776,7 +792,7 @@ cc.Class({
...
@@ -776,7 +792,7 @@ cc.Class({
const
textForCalc
=
`
${
played
}${
this
.
_playedContent
.
length
?
"
"
:
''
}${
playing
}${
this
.
_playingContent
.
length
?
"
"
:
''
}
`
const
textForCalc
=
`
${
played
}${
this
.
_playedContent
.
length
?
"
"
:
''
}${
playing
}${
this
.
_playingContent
.
length
?
"
"
:
''
}
`
// const textForCalc = `${played}${playing}`
// const textForCalc = `${played}${playing}`
this
.
calcHighlightRichText
.
string
=
t
otalArr
.
join
(
SPACE
)
;
this
.
calcHighlightRichText
.
string
=
t
extForCalc
;
this
.
richText
.
string
=
totalArr
.
join
(
SPACE
);
//`${textForCalc}${remained}`;
this
.
richText
.
string
=
totalArr
.
join
(
SPACE
);
//`${textForCalc}${remained}`;
this
.
justifyContentPosition
();
this
.
justifyContentPosition
();
...
@@ -795,7 +811,7 @@ cc.Class({
...
@@ -795,7 +811,7 @@ cc.Class({
},
},
getPlayedColor
()
{
getPlayedColor
()
{
return
this
.
lrcBgColor
.
toHEX
();
if
(
this
.
__currentInteractivateMode
==
this
.
PLAY_MODE
.
MODE1
)
{
if
(
this
.
__currentInteractivateMode
==
this
.
PLAY_MODE
.
MODE1
)
{
return
this
.
lrcPlayingColor
.
toHEX
();
return
this
.
lrcPlayingColor
.
toHEX
();
}
else
if
(
this
.
__currentInteractivateMode
==
this
.
PLAY_MODE
.
MODE2
)
{
}
else
if
(
this
.
__currentInteractivateMode
==
this
.
PLAY_MODE
.
MODE2
)
{
...
...
play/assets/et_21/scene/scene.fire
View file @
9d55a4bb
...
@@ -817,7 +817,7 @@
...
@@ -817,7 +817,7 @@
},
},
{
{
"__type__": "cc.Node",
"__type__": "cc.Node",
"_name": "
New RichTex
t",
"_name": "
lrcConten
t",
"_objFlags": 0,
"_objFlags": 0,
"_parent": {
"_parent": {
"__id__": 14
"__id__": 14
...
...
play/assets/et_21/script/scene.js
View file @
9d55a4bb
...
@@ -121,7 +121,35 @@ cc.Class({
...
@@ -121,7 +121,35 @@ cc.Class({
getDefaultData
()
{
getDefaultData
()
{
const
data
=
{
"
songArr
"
:[{
"
lrcData
"
:{
"
audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/3fa65d5f667a2ef9059d3dfc5df74a4d.mp3
"
,
"
fontSize
"
:
24
,
"
lineHeight
"
:
32
,
"
lyrics
"
:[{
"
time
"
:
4.81026
,
"
data
"
:
"
AAA
"
,
"
newLine
"
:
true
},{
"
time
"
:
8.63464
,
"
data
"
:
"
aaaaa vbbbb ccc ddd
"
,
"
newLine
"
:
true
},{
"
time
"
:
10.489051
,
"
data
"
:
"
eeee fffff gg hhh
"
,
"
newLine
"
:
false
}]},
"
pic_url
"
:
"
http://staging-teach.cdn.ireadabc.com/c8abf7383d65bcbdba8f390785cece60.png
"
,
"
accompany_audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/22e9facddfbf087ecdf2b60dba6019ef.mp3
"
},{
"
lrcData
"
:{
"
audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/2a25aaff4b6c84b859b4d77f944de57a.mp3
"
,
"
fontSize
"
:
24
,
"
lineHeight
"
:
32
,
"
lyrics
"
:[{
"
time
"
:
19.06
,
"
data
"
:
"
安静地离去
"
,
"
newLine
"
:
true
},{
"
time
"
:
21.7
,
"
data
"
:
"
和孤单一起
"
,
"
newLine
"
:
true
},{
"
time
"
:
26.55
,
"
data
"
:
"
拥挤的回忆时间抹去
"
,
"
newLine
"
:
true
}]},
"
pic_url
"
:
"
http://staging-teach.cdn.ireadabc.com/f6f4bbef497409fef3c8f1d375893829.png
"
,
"
accompany_audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/86614bd904f63ab02fc69304e99618c6.mp3
"
},{},{}],
"
title
"
:
"
Let's play
"
,
"
title_audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/cd8daa8b4d8ff707b3a3680e80bc4761.mp3
"
}
const
data
=
{
"
songArr
"
:[
/*{"lrcData":{
"audio_url":"http://staging-teach.cdn.ireadabc.com/3fa65d5f667a2ef9059d3dfc5df74a4d.mp3",
"fontSize":24,
"lineHeight":32,
"lyrics":[
{"time":4.81026,"data":"AAA","newLine":true},
{"time":8.63464,"data":"aaaaa vbbbb ccc ddd","newLine":true},
{"time":10.489051,"data":"eeee fffff gg hhh","newLine":false}
]},
"pic_url":"http://staging-teach.cdn.ireadabc.com/c8abf7383d65bcbdba8f390785cece60.png","accompany_audio_url":"http://staging-teach.cdn.ireadabc.com/22e9facddfbf087ecdf2b60dba6019ef.mp3"
},*/
{
"
lrcData
"
:{
"
audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/2a25aaff4b6c84b859b4d77f944de57a.mp3
"
,
"
fontSize
"
:
24
,
"
lineHeight
"
:
32
,
"
lyrics
"
:[
{
"
time
"
:
11.09
,
"
data
"
:
"
yi shan yi shan liang jing jing
"
,
"
newLine
"
:
true
},
{
"
time
"
:
14.9
,
"
data
"
:
"
1111满天都是小星星
"
,
"
newLine
"
:
true
},
{
"
time
"
:
19.31
,
"
data
"
:
"
挂在天上放光明
"
,
"
newLine
"
:
true
},
{
"
time
"
:
23.62
,
"
data
"
:
"
好像许多小眼睛
"
,
"
newLine
"
:
true
},
{
"
time
"
:
27.93
,
"
data
"
:
"
一闪一闪亮晶晶
"
,
"
newLine
"
:
true
},
{
"
time
"
:
32.32
,
"
data
"
:
"
满天都是小星星
"
,
"
newLine
"
:
true
},{
"
time
"
:
41.1
,
"
data
"
:
"
一闪一闪亮晶晶
"
,
"
newLine
"
:
true
},{
"
time
"
:
45.45
,
"
data
"
:
"
满天都是小星星
"
,
"
newLine
"
:
true
},{
"
time
"
:
49.74
,
"
data
"
:
"
挂在天上放光明
"
,
"
newLine
"
:
true
},{
"
time
"
:
54.16
,
"
data
"
:
"
好像许多小眼睛
"
,
"
newLine
"
:
true
},{
"
time
"
:
58.39
,
"
data
"
:
"
一闪一闪亮晶晶
"
,
"
newLine
"
:
true
},{
"
time
"
:
62.9
,
"
data
"
:
"
满天都是小星星
"
,
"
newLine
"
:
true
},{
"
time
"
:
76.36
,
"
data
"
:
"
一闪一闪亮晶晶
"
,
"
newLine
"
:
true
},{
"
time
"
:
80.28
,
"
data
"
:
"
满天都是小星星
"
,
"
newLine
"
:
true
},{
"
time
"
:
84.65
,
"
data
"
:
"
挂在天上放光明
"
,
"
newLine
"
:
true
},{
"
time
"
:
88.92
,
"
data
"
:
"
好像许多小眼睛
"
,
"
newLine
"
:
true
},{
"
time
"
:
93.41
,
"
data
"
:
"
一闪一闪亮晶晶
"
,
"
newLine
"
:
true
},
{
"
time
"
:
97.72
,
"
data
"
:
"
满天都是小星星
"
,
"
newLine
"
:
true
}
]},
"
pic_url
"
:
"
http://staging-teach.cdn.ireadabc.com/f6f4bbef497409fef3c8f1d375893829.png
"
,
"
accompany_audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/86614bd904f63ab02fc69304e99618c6.mp3
"
}
],
"
title
"
:
"
Let's play
"
,
"
title_audio_url
"
:
"
http://staging-teach.cdn.ireadabc.com/cd8daa8b4d8ff707b3a3680e80bc4761.mp3
"
}
return
data
;
return
data
;
},
},
...
@@ -260,11 +288,27 @@ cc.Class({
...
@@ -260,11 +288,27 @@ cc.Class({
musicBtn
:
null
,
musicBtn
:
null
,
singBtn
:
null
,
singBtn
:
null
,
initSongControler
()
{
initSongControler
()
{
if
(
!
this
.
itemArr
[
0
])
{
return
}
const
songBgSize
=
getSprNode
(
'
song_bg
'
);
const
disH
=
-
songBgSize
.
height
*
this
.
_mapScaleMin
-
40
*
this
.
_mapScaleMin
;
const
disW
=
40
*
this
.
_mapScaleMin
;
songBgSize
.
scale
=
this
.
_mapScaleMin
;
let
pxo
,
pyo
let
baseX
=
pxo
=
-
songBgSize
.
width
*
this
.
_mapScaleMin
/
2
-
disW
/
2
;
let
baseY
=
pyo
=
80
*
this
.
_mapScaleMin
;
pxo
+=
(
this
.
itemArr
[
0
].
width
*
this
.
_mapScaleMin
+
disW
)
// pxo = baseX;
// pyo += disH;
const
parent
=
cc
.
find
(
'
Canvas
'
);
const
parent
=
cc
.
find
(
'
Canvas
'
);
let
px
=
this
.
itemArr
[
1
].
x
+
240
*
this
.
_mapScaleMin
;
let
px
=
pxo
+
240
*
this
.
_mapScaleMin
;
let
py
=
this
.
itemArr
[
1
].
y
+
170
*
this
.
_mapScaleMin
;
let
py
=
pyo
+
170
*
this
.
_mapScaleMin
;
const
singBtn
=
this
.
addSingBtn
(
parent
,
px
,
py
);
const
singBtn
=
this
.
addSingBtn
(
parent
,
px
,
py
);
px
=
singBtn
.
x
-
100
*
this
.
_mapScaleMin
;
px
=
singBtn
.
x
-
100
*
this
.
_mapScaleMin
;
...
@@ -361,6 +405,7 @@ cc.Class({
...
@@ -361,6 +405,7 @@ cc.Class({
||
!
item
.
lrcData
||
!
item
.
lrcData
||
!
item
.
lrcData
.
audio_url
||
!
item
.
lrcData
.
audio_url
},
},
initItem
()
{
initItem
()
{
this
.
itemArr
=
[];
this
.
itemArr
=
[];
...
@@ -374,6 +419,9 @@ cc.Class({
...
@@ -374,6 +419,9 @@ cc.Class({
let
baseX
=
px
=
-
songBgSize
.
width
*
this
.
_mapScaleMin
/
2
-
disW
/
2
;
let
baseX
=
px
=
-
songBgSize
.
width
*
this
.
_mapScaleMin
/
2
-
disW
/
2
;
let
baseY
=
py
=
80
*
this
.
_mapScaleMin
;
let
baseY
=
py
=
80
*
this
.
_mapScaleMin
;
for
(
let
i
=
0
;
i
<
arr
.
length
;
i
++
)
{
for
(
let
i
=
0
;
i
<
arr
.
length
;
i
++
)
{
console
.
log
(
`arr[
${
i
}
]`
,
arr
[
i
]);
console
.
log
(
`arr[
${
i
}
]`
,
arr
[
i
]);
if
(
this
.
isSkipItem
(
arr
[
i
]))
{
if
(
this
.
isSkipItem
(
arr
[
i
]))
{
...
@@ -388,11 +436,14 @@ cc.Class({
...
@@ -388,11 +436,14 @@ cc.Class({
px
=
baseX
;
px
=
baseX
;
py
+=
disH
;
py
+=
disH
;
}
}
this
.
addItemImg
(
item
,
arr
[
i
]);
if
(
arr
[
i
].
pic_url
)
{
this
.
addItemScript
(
item
,
arr
[
i
]);
this
.
addItemImg
(
item
,
arr
[
i
]);
this
.
addItemListener
(
item
);
this
.
addItemScript
(
item
,
arr
[
i
]);
this
.
addItemBorder
(
item
);
this
.
addItemListener
(
item
);
this
.
addItemBorder
(
item
);
}
this
.
itemArr
.
push
(
item
);
this
.
itemArr
.
push
(
item
);
}
}
...
@@ -412,12 +463,16 @@ cc.Class({
...
@@ -412,12 +463,16 @@ cc.Class({
},
},
addItemImg
(
item
,
data
)
{
addItemImg
(
item
,
data
)
{
if
(
!
data
.
pic_url
)
{
return
}
const
imgLen
=
170
;
const
imgLen
=
170
;
getSprNodeByUrl
(
data
.
pic_url
,
(
spr
)
=>
{
getSprNodeByUrl
(
data
.
pic_url
,
(
spr
)
=>
{
spr
.
node
.
parent
=
item
;
spr
.
node
.
parent
=
item
;
const
tmpNode
=
new
cc
.
Node
();
const
tmpNode
=
new
cc
.
Node
();
spr
.
node
.
name
=
'
ItemImage
'
const
g
=
tmpNode
.
addComponent
(
cc
.
Graphics
);
const
g
=
tmpNode
.
addComponent
(
cc
.
Graphics
);
g
.
fillColor
=
cc
.
Color
.
RED
;
g
.
fillColor
=
cc
.
Color
.
RED
;
g
.
fillRect
(
0
,
0
,
imgLen
,
imgLen
);
g
.
fillRect
(
0
,
0
,
imgLen
,
imgLen
);
...
@@ -431,12 +486,24 @@ cc.Class({
...
@@ -431,12 +486,24 @@ cc.Class({
},
},
addItemScript
(
item
,
data
)
{
addItemScript
(
item
,
data
)
{
if
(
!
data
.
pic_url
)
{
return
}
const
lrcNode
=
cc
.
instantiate
(
this
.
lrcPrefab
)
const
lrcNode
=
cc
.
instantiate
(
this
.
lrcPrefab
)
lrcNode
.
parent
=
item
;
//lrcPrefab
lrcNode
.
parent
=
item
;
//lrcPrefab
const
lrcScript
=
lrcNode
.
getComponent
(
'
adapter
'
)
const
lrcScript
=
lrcNode
.
getComponent
(
'
adapter
'
)
lrcScript
.
setData
(
data
,
this
.
_mapScaleMin
);
lrcScript
.
setData
(
data
,
this
.
_mapScaleMin
);
item
.
lrcScript
=
lrcScript
;
item
.
lrcScript
=
lrcScript
;
// lrcScript.lrc.node.width =
// lrcScript.lrc.node.height
console
.
log
(
111
,
item
);
lrcScript
.
lrc
.
node
.
name
=
'
aaaaa
'
lrcScript
.
lrc
.
node
.
height
=
item
.
height
-
50
;
console
.
log
(
'
aaaa y
'
,
lrcScript
.
lrc
.
node
.
y
);
lrcScript
.
stopSong
();
lrcNode
.
y
=
-
lrcScript
.
lrc
.
node
.
height
/
2
*
lrcScript
.
lrc
.
node
.
scale
+
90
*
this
.
_mapScaleMin
;
lrcNode
.
y
=
-
lrcScript
.
lrc
.
node
.
height
/
2
*
lrcScript
.
lrc
.
node
.
scale
+
90
*
this
.
_mapScaleMin
;
},
},
...
...
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