Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
bora-it
Commits
ad0019ea
Commit
ad0019ea
authored
Jul 05, 2021
by
우지원
Browse files
onClick추가
parent
566d7109
Changes
2
Show whitespace changes
Inline
Side-by-side
client/src/components/Room/ChannelList.js
View file @
ad0019ea
...
...
@@ -53,38 +53,45 @@ const ChannelList = () => {
<
div
className
=
"
overflow-auto
"
style
=
{{
height
:
"
610px
"
}}
>
<
div
className
=
"
mb-3
"
>
<
div
className
=
"
m-3 p-
2
row
"
style
=
{{
backgroundColor
:
"
#
C4C4C4
"
}}
>
<
img
className
=
"
col-auto
"
src
=
"
/fullSpeaker.png
"
width
=
"
30
px
"
height
=
"
30
px
"
/>
<
h5
className
=
"
col
"
>
회의
<
/h5
>
<
div
className
=
"
m-3 p-
1
row
"
style
=
{{
backgroundColor
:
"
#
ab9aba
"
}}
>
<
img
className
=
"
col-auto
mt-2
"
src
=
"
/fullSpeaker.png
"
width
=
"
25
px
"
height
=
"
25
px
"
/>
<
h5
className
=
"
col
mt-2
"
>
회의
<
/h5
>
<
/div
>
<
div
className
=
"
mx-5
"
>
<
ChannelSingle
/>
<
/div
>
<
/div
>
<
div
className
=
"
mb-3
"
>
<
div
className
=
"
m-3 p-2
"
style
=
{{
backgroundColor
:
"
#C4C4C4
"
}}
>
<
h5
>
사담
<
/h5
>
<
div
className
=
"
m-3 p-1 row
"
style
=
{{
backgroundColor
:
"
#ab9aba
"
}}
>
<
img
className
=
"
col-auto mt-2
"
src
=
"
/emptySpeaker.png
"
width
=
"
25px
"
height
=
"
25px
"
/>
<
h5
className
=
"
col mt-2
"
>
사담
<
/h5
>
<
/div
>
<
div
className
=
"
mx-5
"
>
<
ChannelSingle
/>
<
/div
>
<
/div
>
<
div
className
=
"
mb-3
"
>
<
div
className
=
"
m-3 p-2
"
style
=
{{
backgroundColor
:
"
#C4C4C4
"
}}
>
<
h5
>
공지
<
/h5
>
<
div
className
=
"
m-3 p-1 row
"
style
=
{{
backgroundColor
:
"
#ab9aba
"
}}
>
<
img
className
=
"
col-auto mt-2
"
src
=
"
/emptySpeaker.png
"
width
=
"
25px
"
height
=
"
25px
"
/>
<
h5
className
=
"
col mt-2
"
>
공지1
<
/h5
>
<
/div
>
<
div
className
=
"
mx-5
"
>
<
ChannelSingle
/>
<
/div
>
<
/div
>
<
div
className
=
"
mb-3
"
>
<
div
className
=
"
m-3 p-2
"
style
=
{{
backgroundColor
:
"
#C4C4C4
"
}}
>
<
h5
>
공지
<
/h5
>
<
div
className
=
"
m-3 p-1 row
"
style
=
{{
backgroundColor
:
"
#ab9aba
"
}}
>
<
img
className
=
"
col-auto mt-2
"
src
=
"
/emptySpeaker.png
"
width
=
"
25px
"
height
=
"
25px
"
/>
<
h5
className
=
"
col mt-2
"
>
공지2
<
/h5
>
<
/div
>
<
div
className
=
"
mx-5
"
>
<
ChannelSingle
/>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"
d-flex flex-row-reverse
"
>
...
...
client/src/components/Room/Controller.js
View file @
ad0019ea
...
...
@@ -5,30 +5,54 @@ import mic_btn from '../../micbtn.png'
import
videooff_btn
from
'
../../videooffbtn.png
'
import
speakeroff_btn
from
'
../../speakeroffbtn.png
'
import
micoff_btn
from
'
../../micoffbtn.png
'
import
React
,
{
useState
}
from
'
react
'
;
const
Controller
=
()
=>
{
const
[
mic
,
setMic
]
=
useState
(
"
true
"
)
const
[
video
,
setVideo
]
=
useState
(
"
true
"
)
const
[
speaker
,
setSpeaker
]
=
useState
(
"
true
"
)
const
micOn
=
(()
=>
setMic
(
false
));
const
micOff
=
(()
=>
setMic
(
true
));
const
speakerOn
=
(()
=>
setSpeaker
(
false
));
const
speakerOff
=
(()
=>
setSpeaker
(
true
));
const
videoOn
=
(()
=>
setVideo
(
false
));
const
videoOff
=
(()
=>
setVideo
(
true
));
return
(
<
div
className
=
"
container
"
>
<
div
className
=
"
row
"
>
<
div
className
=
"
col d-flex justify-content-center
"
style
=
{{
backgroundColor
:
'
#C4C4C4
'
,
position
:
'
absolute
'
,
bottom
:
0
}}
style
=
{{
backgroundColor
:
'
#C4C4C4
'
,
position
:
'
absolute
'
,
bottom
:
0
}}
>
{
/* <div className="col d-flex justify-content-center">
<button type="button" className="btn">
<img src={mic_btn} width="45" height="40" />
</button>
</div> */
}
<
div
className
=
"
col d-flex justify-content-center
"
>
<
button
type
=
"
button
"
className
=
"
btn
"
onClick
>
{
mic
?
<
div
className
=
"
col d-flex justify-content-center
"
>
<
button
type
=
"
button
"
className
=
"
btn
"
onClick
=
{
micOn
}
>
<
img
src
=
{
micoff_btn
}
width
=
"
45
"
height
=
"
40
"
/>
<
/button
>
<
/div
>
<
div
className
=
"
col d-flex justify-content-center
"
>
<
button
type
=
"
button
"
className
=
"
btn
"
>
:
<
div
className
=
"
col d-flex justify-content-center
"
>
<
button
type
=
"
button
"
className
=
"
btn
"
onClick
=
{
micOff
}
>
<
img
src
=
{
mic_btn
}
width
=
"
45
"
height
=
"
40
"
/>
<
/button
>
<
/div
>
}
{
speaker
?
<
div
className
=
"
col d-flex justify-content-center
"
>
<
button
type
=
"
button
"
className
=
"
btn
"
onClick
=
{
speakerOn
}
>
<
img
src
=
{
speakeroff_btn
}
width
=
"
45
"
/>
<
/button
>
<
/div> : <div className="col d-flex justify-content-center"
>
<
button
type
=
"
button
"
className
=
"
btn
"
onClick
=
{
speakerOff
}
>
<
img
src
=
{
speaker_btn
}
width
=
"
45
"
/>
<
/button
>
<
/div
>
<
div
className
=
"
col d-flex justify-content-center
"
>
}
{
video
?
<
div
className
=
"
col d-flex justify-content-center
"
>
<
button
type
=
"
button
"
className
=
"
btn
"
...
...
@@ -36,10 +60,16 @@ const Controller = () => {
data
-
bs
-
target
=
"
#exampleModal
"
src
=
{
video_btn
}
onClick
=
"
location.href='ScreenSelect.js'
"
onClick
=
{
videoOn
}
>
<
img
src
=
{
videooff_btn
}
width
=
"
45
"
/>
<
/button
>
<
/div
>
<
/div>
:
<
div
className
=
"
col d-flex justify-content-center
"
>
<
button
type
=
"
button
"
className
=
"
btn
"
onClick
=
{
videoOff
}
>
<
img
src
=
{
video_btn
}
width
=
"
45
"
/>
<
/button
>
<
/div>
}
<
/div
>
<
ScreenSelect
/>
<
/div
>
...
...
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