Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
N
Neos
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Locked Files
Issues
0
Issues
0
List
Boards
Labels
Service Desk
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Security & Compliance
Security & Compliance
Dependency List
License Compliance
Packages
Packages
List
Container Registry
Analytics
Analytics
CI / CD
Code Review
Insights
Issues
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
love_飞影
Neos
Commits
2d88c2dc
Commit
2d88c2dc
authored
Jan 13, 2023
by
chechunchi
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
add FixedSlot
parent
6b2d3fe5
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
110 additions
and
184 deletions
+110
-184
src/ui/Duel/fixedSlot.tsx
src/ui/Duel/fixedSlot.tsx
+104
-0
src/ui/Duel/magics.tsx
src/ui/Duel/magics.tsx
+3
-85
src/ui/Duel/monsters.tsx
src/ui/Duel/monsters.tsx
+3
-99
No files found.
src/ui/Duel/fixedSlot.tsx
0 → 100644
View file @
2d88c2dc
import
*
as
BABYLON
from
"
@babylonjs/core
"
;
import
*
as
CONFIG
from
"
../../config/ui
"
;
import
{
store
}
from
"
../../store
"
;
import
{
CardState
}
from
"
../../reducers/duel/generic
"
;
import
{
useRef
}
from
"
react
"
;
import
{
useClick
}
from
"
./hook
"
;
import
{
sendSelectPlaceResponse
}
from
"
../../api/ocgcore/ocgHelper
"
;
import
{
ygopro
}
from
"
../../api/ocgcore/idl/ocgcore
"
;
import
{
clearMonsterPlaceInteractivities
,
setCardModalImgUrl
,
setCardModalInteractivies
,
setCardModalIsOpen
,
setCardModalText
,
}
from
"
../../reducers/duel/mod
"
;
const
shape
=
CONFIG
.
CardSlotShape
();
const
FixedSlot
=
(
props
:
{
state
:
CardState
;
position
:
BABYLON
.
Vector3
;
rotation
:
BABYLON
.
Vector3
;
deffenseRotation
?:
BABYLON
.
Vector3
;
})
=>
{
const
planeRef
=
useRef
(
null
);
const
rotation
=
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
DEFENSE
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEUP_DEFENSE
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_DEFENSE
?
props
.
deffenseRotation
||
CONFIG
.
CardSlotDefenceRotation
()
:
props
.
rotation
;
const
edgesWidth
=
2.0
;
const
edgesColor
=
BABYLON
.
Color4
.
FromColor3
(
BABYLON
.
Color3
.
Yellow
());
const
dispatch
=
store
.
dispatch
;
const
faceDown
=
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_DEFENSE
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_ATTACK
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN
;
useClick
(
(
_event
)
=>
{
if
(
props
.
state
.
placeInteractivities
)
{
sendSelectPlaceResponse
(
props
.
state
.
placeInteractivities
.
response
);
dispatch
(
clearMonsterPlaceInteractivities
(
0
));
dispatch
(
clearMonsterPlaceInteractivities
(
1
));
}
else
if
(
props
.
state
.
occupant
)
{
dispatch
(
setCardModalText
([
props
.
state
.
occupant
.
text
.
name
,
props
.
state
.
occupant
.
text
.
desc
,
])
);
dispatch
(
setCardModalImgUrl
(
`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/
${
props
.
state
.
occupant
.
id
}
.jpg`
)
);
dispatch
(
setCardModalInteractivies
([]));
// TODO
dispatch
(
setCardModalIsOpen
(
true
));
}
},
planeRef
,
[
props
.
state
]
);
return
(
<
plane
name=
{
`fixedslot-${props.state.location.sequence}`
}
ref=
{
planeRef
}
width=
{
shape
.
width
}
height=
{
shape
.
height
}
position=
{
props
.
position
}
rotation=
{
rotation
}
enableEdgesRendering
edgesWidth=
{
props
.
state
.
placeInteractivities
||
props
.
state
.
idleInteractivities
.
length
>
0
?
edgesWidth
:
0
}
edgesColor=
{
edgesColor
}
>
<
standardMaterial
name=
{
`fixedslot-mat-${props.state.location.sequence}`
}
diffuseTexture=
{
props
.
state
.
occupant
?
faceDown
?
new
BABYLON
.
Texture
(
`http://localhost:3030/images/card_back.jpg`
)
:
new
BABYLON
.
Texture
(
`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/${props.state.occupant.id}.jpg`
)
:
new
BABYLON
.
Texture
(
`http://localhost:3030/images/card_slot.png`
)
}
alpha=
{
props
.
state
.
occupant
?
1
:
0
}
></
standardMaterial
>
</
plane
>
);
};
export
default
FixedSlot
;
src/ui/Duel/magics.tsx
View file @
2d88c2dc
import
*
as
BABYLON
from
"
@babylonjs/core
"
;
import
*
as
BABYLON
from
"
@babylonjs/core
"
;
import
*
as
CONFIG
from
"
../../config/ui
"
;
import
*
as
CONFIG
from
"
../../config/ui
"
;
import
{
selectMeMagics
,
selectOpMagics
}
from
"
../../reducers/duel/magicSlice
"
;
import
{
selectMeMagics
,
selectOpMagics
}
from
"
../../reducers/duel/magicSlice
"
;
import
{
useClick
}
from
"
./hook
"
;
import
{
CardState
}
from
"
../../reducers/duel/generic
"
;
import
{
CardState
}
from
"
../../reducers/duel/generic
"
;
import
{
store
}
from
"
../../store
"
;
import
{
useAppSelector
}
from
"
../../hook
"
;
import
{
useAppSelector
}
from
"
../../hook
"
;
import
{
useRef
}
from
"
react
"
;
import
{
sendSelectPlaceResponse
}
from
"
../../api/ocgcore/ocgHelper
"
;
import
{
clearMagicPlaceInteractivities
,
setCardModalImgUrl
,
setCardModalIsOpen
,
setCardModalText
,
}
from
"
../../reducers/duel/mod
"
;
import
{
ygopro
}
from
"
../../api/ocgcore/idl/ocgcore
"
;
import
{
zip
}
from
"
./util
"
;
import
{
zip
}
from
"
./util
"
;
import
FixedSlot
from
"
./fixedSlot
"
;
// TODO: use config
// TODO: use config
const
left
=
-
2.15
;
const
left
=
-
2.15
;
...
@@ -31,7 +21,7 @@ const Magics = () => {
...
@@ -31,7 +21,7 @@ const Magics = () => {
<>
<>
{
zip
(
meMagics
,
meMagicPositions
).
map
(([
magic
,
position
])
=>
{
{
zip
(
meMagics
,
meMagicPositions
).
map
(([
magic
,
position
])
=>
{
return
(
return
(
<
CMagic
<
FixedSlot
state=
{
magic
}
state=
{
magic
}
key=
{
magic
.
location
.
sequence
}
key=
{
magic
.
location
.
sequence
}
position=
{
position
}
position=
{
position
}
...
@@ -41,7 +31,7 @@ const Magics = () => {
...
@@ -41,7 +31,7 @@ const Magics = () => {
})
}
})
}
{
zip
(
opMagics
,
opMagicPositions
).
map
(([
magic
,
position
])
=>
{
{
zip
(
opMagics
,
opMagicPositions
).
map
(([
magic
,
position
])
=>
{
return
(
return
(
<
CMagic
<
FixedSlot
state=
{
magic
}
state=
{
magic
}
key=
{
magic
.
location
.
sequence
}
key=
{
magic
.
location
.
sequence
}
position=
{
position
}
position=
{
position
}
...
@@ -53,78 +43,6 @@ const Magics = () => {
...
@@ -53,78 +43,6 @@ const Magics = () => {
);
);
};
};
const
CMagic
=
(
props
:
{
state
:
CardState
;
position
:
BABYLON
.
Vector3
;
rotation
:
BABYLON
.
Vector3
;
})
=>
{
const
state
=
props
.
state
;
const
planeRef
=
useRef
(
null
);
const
faceDown
=
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN
||
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_ATTACK
||
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_DEFENSE
;
const
edgesWidth
=
2.0
;
const
edgesColor
=
BABYLON
.
Color4
.
FromColor3
(
BABYLON
.
Color3
.
Yellow
());
const
dispatch
=
store
.
dispatch
;
useClick
(
(
_event
)
=>
{
if
(
state
.
placeInteractivities
)
{
sendSelectPlaceResponse
(
state
.
placeInteractivities
.
response
);
dispatch
(
clearMagicPlaceInteractivities
(
0
));
dispatch
(
clearMagicPlaceInteractivities
(
1
));
}
else
if
(
state
.
occupant
)
{
dispatch
(
setCardModalText
([
state
.
occupant
.
text
.
name
,
state
.
occupant
.
text
.
desc
])
);
dispatch
(
setCardModalImgUrl
(
`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/
${
state
.
occupant
.
id
}
.jpg`
)
);
dispatch
(
setCardModalIsOpen
(
true
));
}
},
planeRef
,
[
state
]
);
return
(
<
plane
name=
{
`magic-${state.location.sequence}`
}
ref=
{
planeRef
}
width=
{
shape
.
width
}
height=
{
shape
.
height
}
position=
{
props
.
position
}
rotation=
{
props
.
rotation
}
enableEdgesRendering
edgesWidth=
{
state
.
placeInteractivities
||
state
.
idleInteractivities
.
length
>
0
?
edgesWidth
:
0
}
edgesColor=
{
edgesColor
}
>
<
standardMaterial
name=
{
`magic-mat-${props.state.location.sequence}`
}
diffuseTexture=
{
state
.
occupant
?
faceDown
?
new
BABYLON
.
Texture
(
`http://localhost:3030/images/card_back.jpg`
)
:
new
BABYLON
.
Texture
(
`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/${state.occupant.id}.jpg`
)
:
new
BABYLON
.
Texture
(
`http://localhost:3030/images/card_slot.png`
)
}
alpha=
{
state
.
occupant
?
1
:
0
}
></
standardMaterial
>
</
plane
>
);
};
const
magicPositions
=
(
player
:
number
,
magics
:
CardState
[])
=>
{
const
magicPositions
=
(
player
:
number
,
magics
:
CardState
[])
=>
{
const
x
=
(
sequence
:
number
)
=>
const
x
=
(
sequence
:
number
)
=>
player
==
0
?
left
+
gap
*
sequence
:
-
left
-
gap
*
sequence
;
player
==
0
?
left
+
gap
*
sequence
:
-
left
-
gap
*
sequence
;
...
...
src/ui/Duel/monsters.tsx
View file @
2d88c2dc
import
*
as
BABYLON
from
"
@babylonjs/core
"
;
import
*
as
BABYLON
from
"
@babylonjs/core
"
;
import
*
as
CONFIG
from
"
../../config/ui
"
;
import
*
as
CONFIG
from
"
../../config/ui
"
;
import
{
useClick
}
from
"
./hook
"
;
import
{
store
}
from
"
../../store
"
;
import
{
CardState
}
from
"
../../reducers/duel/generic
"
;
import
{
CardState
}
from
"
../../reducers/duel/generic
"
;
import
"
react-babylonjs
"
;
import
"
react-babylonjs
"
;
import
{
useRef
}
from
"
react
"
;
import
{
sendSelectPlaceResponse
}
from
"
../../api/ocgcore/ocgHelper
"
;
import
{
clearMonsterPlaceInteractivities
,
setCardModalImgUrl
,
setCardModalInteractivies
,
setCardModalIsOpen
,
setCardModalText
,
}
from
"
../../reducers/duel/mod
"
;
import
{
useAppSelector
}
from
"
../../hook
"
;
import
{
useAppSelector
}
from
"
../../hook
"
;
import
{
import
{
selectMeMonsters
,
selectMeMonsters
,
selectOpMonsters
,
selectOpMonsters
,
}
from
"
../../reducers/duel/monstersSlice
"
;
}
from
"
../../reducers/duel/monstersSlice
"
;
import
{
ygopro
}
from
"
../../api/ocgcore/idl/ocgcore
"
;
import
{
zip
}
from
"
./util
"
;
import
{
zip
}
from
"
./util
"
;
import
FixedSlot
from
"
./fixedSlot
"
;
const
shape
=
CONFIG
.
CardSlotShape
();
const
shape
=
CONFIG
.
CardSlotShape
();
const
left
=
-
2.15
;
// TODO: config
const
left
=
-
2.15
;
// TODO: config
...
@@ -35,7 +24,7 @@ const Monsters = () => {
...
@@ -35,7 +24,7 @@ const Monsters = () => {
<>
<>
{
zip
(
meMonsters
,
meMonsterPositions
).
map
(([
monster
,
position
],
idx
)
=>
{
{
zip
(
meMonsters
,
meMonsterPositions
).
map
(([
monster
,
position
],
idx
)
=>
{
return
(
return
(
<
CommonMonster
<
FixedSlot
state=
{
monster
}
state=
{
monster
}
key=
{
idx
}
key=
{
idx
}
position=
{
position
}
position=
{
position
}
...
@@ -46,7 +35,7 @@ const Monsters = () => {
...
@@ -46,7 +35,7 @@ const Monsters = () => {
})
}
})
}
{
zip
(
opMonsters
,
opMonsterPositions
).
map
(([
monster
,
position
],
idx
)
=>
{
{
zip
(
opMonsters
,
opMonsterPositions
).
map
(([
monster
,
position
],
idx
)
=>
{
return
(
return
(
<
CommonMonster
<
FixedSlot
state=
{
monster
}
state=
{
monster
}
key=
{
idx
}
key=
{
idx
}
position=
{
position
}
position=
{
position
}
...
@@ -61,91 +50,6 @@ const Monsters = () => {
...
@@ -61,91 +50,6 @@ const Monsters = () => {
);
);
};
};
const
CommonMonster
=
(
props
:
{
state
:
CardState
;
position
:
BABYLON
.
Vector3
;
rotation
:
BABYLON
.
Vector3
;
deffenseRotation
:
BABYLON
.
Vector3
;
})
=>
{
const
planeRef
=
useRef
(
null
);
const
rotation
=
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
DEFENSE
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEUP_DEFENSE
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_DEFENSE
?
props
.
deffenseRotation
:
props
.
rotation
;
const
edgesWidth
=
2.0
;
const
edgesColor
=
BABYLON
.
Color4
.
FromColor3
(
BABYLON
.
Color3
.
Yellow
());
const
dispatch
=
store
.
dispatch
;
const
faceDown
=
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_DEFENSE
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN_ATTACK
||
props
.
state
.
location
.
position
===
ygopro
.
CardPosition
.
FACEDOWN
;
useClick
(
(
_event
)
=>
{
if
(
props
.
state
.
placeInteractivities
)
{
sendSelectPlaceResponse
(
props
.
state
.
placeInteractivities
.
response
);
dispatch
(
clearMonsterPlaceInteractivities
(
0
));
dispatch
(
clearMonsterPlaceInteractivities
(
1
));
}
else
if
(
props
.
state
.
occupant
)
{
dispatch
(
setCardModalText
([
props
.
state
.
occupant
.
text
.
name
,
props
.
state
.
occupant
.
text
.
desc
,
])
);
dispatch
(
setCardModalImgUrl
(
`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/
${
props
.
state
.
occupant
.
id
}
.jpg`
)
);
dispatch
(
setCardModalInteractivies
([]));
// TODO
dispatch
(
setCardModalIsOpen
(
true
));
}
},
planeRef
,
[
props
.
state
]
);
return
(
<
plane
name=
{
`monster-${props.state.location.sequence}`
}
ref=
{
planeRef
}
width=
{
shape
.
width
}
height=
{
shape
.
height
}
position=
{
props
.
position
}
rotation=
{
rotation
}
enableEdgesRendering
edgesWidth=
{
props
.
state
.
placeInteractivities
||
props
.
state
.
idleInteractivities
.
length
>
0
?
edgesWidth
:
0
}
edgesColor=
{
edgesColor
}
>
<
standardMaterial
name=
{
`monster-mat-${props.state.location.sequence}`
}
diffuseTexture=
{
props
.
state
.
occupant
?
faceDown
?
new
BABYLON
.
Texture
(
`http://localhost:3030/images/card_back.jpg`
)
:
new
BABYLON
.
Texture
(
`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/${props.state.occupant.id}.jpg`
)
:
new
BABYLON
.
Texture
(
`http://localhost:3030/images/card_slot.png`
)
}
alpha=
{
props
.
state
.
occupant
?
1
:
0
}
></
standardMaterial
>
</
plane
>
);
};
// TODO: use props and redux
// TODO: use props and redux
const
ExtraMonsters
=
()
=>
{
const
ExtraMonsters
=
()
=>
{
const
xs
=
[
-
1.1
,
1
];
const
xs
=
[
-
1.1
,
1
];
...
...
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