이준성 / khuwitch

Go to a project
Toggle navigation Toggle navigation pinning
ijunseong
a0ccab1f 1 parent 006a6ef7

Update: listen and quit event

Inline Side-by-side
Showing 1 changed file with 12 additions and 13 deletions
...@@ -24,11 +24,13 @@ socket.on('chat message', (name, msg)=>{ ...@@ -24,11 +24,13 @@ socket.on('chat message', (name, msg)=>{
24 24
25 // 해당 채널을 재생하고자할 때 실행시켜주세요. 25 // 해당 채널을 재생하고자할 때 실행시켜주세요.
26 const listen = (channelName)=>{ 26 const listen = (channelName)=>{
27 + console.log(`listen ${channelName}`);
27 socket.emit("joinRoom", channelName, "dummy name") // name이 뭔지 대연이도 잘 모름. 28 socket.emit("joinRoom", channelName, "dummy name") // name이 뭔지 대연이도 잘 모름.
28 } 29 }
29 30
30 // 해당 채널을 재생 안하도록 할 때 실행시켜주세요. 31 // 해당 채널을 재생 안하도록 할 때 실행시켜주세요.
31 const quit = (channelName)=>{ 32 const quit = (channelName)=>{
33 + console.log(`quit ${channelName}`);
32 socket.emit("leaveRoom". channelName, "dummy name") // name이 뭔지 대연이도 잘 모름. 34 socket.emit("leaveRoom". channelName, "dummy name") // name이 뭔지 대연이도 잘 모름.
33 } 35 }
34 36
...@@ -63,15 +65,6 @@ export class ChannelList extends React.Component { ...@@ -63,15 +65,6 @@ export class ChannelList extends React.Component {
63 {"id": "umi0410", "nickname": "진수", "view": 123124124, "category": "game2" , "url": "https://www.twitch.tv/umi0410", "isPlay": false}, 65 {"id": "umi0410", "nickname": "진수", "view": 123124124, "category": "game2" , "url": "https://www.twitch.tv/umi0410", "isPlay": false},
64 {"id": "name1", "nickname": "nick", "view": 999, "category": "game1" ,"url": "https://www.twitch.tv", "thumbnail": "https://upload.wikimedia.org/wikipedia/commons/2/26/Twitch_logo.svg", "isPlay": false}, 66 {"id": "name1", "nickname": "nick", "view": 999, "category": "game1" ,"url": "https://www.twitch.tv", "thumbnail": "https://upload.wikimedia.org/wikipedia/commons/2/26/Twitch_logo.svg", "isPlay": false},
65 {"id": "name2", "nickname": "nick","view": 123124124, "category": "game2" , "url": "https://www.twitch.tv", "isPlay": false}, 67 {"id": "name2", "nickname": "nick","view": 123124124, "category": "game2" , "url": "https://www.twitch.tv", "isPlay": false},
66 - /* {"id": "name1", "nickname": "nick","view": 999, "category": "game1" ,"url": "https://www.twitch.tv", "thumbnail": "https://upload.wikimedia.org/wikipedia/commons/2/26/Twitch_logo.svg", "isPlay": false},
67 - {"id": "name2", "nickname": "nick","view": 123124124, "category": "game2" , "url": "https://www.twitch.tv", "isPlay": false},
68 - {"id": "name1", "nickname": "nick","view": 999, "category": "game1" ,"url": "https://www.twitch.tv", "thumbnail": "https://upload.wikimedia.org/wikipedia/commons/2/26/Twitch_logo.svg", "isPlay": false},
69 - {"id": "name2", "nickname": "nick","view": 123124124, "category": "game2" , "url": "https://www.twitch.tv", "isPlay": false},
70 - {"id": "name1", "nickname": "nick","view": 999, "category": "game1" ,"url": "https://www.twitch.tv", "thumbnail": "https://upload.wikimedia.org/wikipedia/commons/2/26/Twitch_logo.svg", "isPlay": false},
71 - {"id": "name2", "nickname": "nick","view": 123124124, "category": "game2" , "url": "https://www.twitch.tv", "isPlay": false},
72 - {"id": "name1", "nickname": "nick","view": 999, "category": "game1" ,"url": "https://www.twitch.tv", "thumbnail": "https://upload.wikimedia.org/wikipedia/commons/2/26/Twitch_logo.svg", "isPlay": false},
73 - {"id": "name2", "nickname": "nick","view": 123124124, "category": "game2" , "url": "https://www.twitch.tv", "isPlay": false}, */
74 -
75 ] 68 ]
76 69
77 this.state = { 70 this.state = {
...@@ -85,8 +78,10 @@ export class ChannelList extends React.Component { ...@@ -85,8 +78,10 @@ export class ChannelList extends React.Component {
85 // 버튼을 누른 채널이 재생중일때 78 // 버튼을 누른 채널이 재생중일때
86 if (channel.isPlay === true) { 79 if (channel.isPlay === true) {
87 channels[index].isPlay = false; 80 channels[index].isPlay = false;
88 - console.log(channels[index].isPlay); 81 +
89 - console.log(channels); 82 + // 기존 채널 재생 중지
83 + quit(channels[index].id);
84 +
90 this.setState({ 85 this.setState({
91 channels: channels, 86 channels: channels,
92 xisPlaying: null, 87 xisPlaying: null,
...@@ -95,18 +90,22 @@ export class ChannelList extends React.Component { ...@@ -95,18 +90,22 @@ export class ChannelList extends React.Component {
95 90
96 // 버튼을 누른 채널이 재생중이 아닐 때 91 // 버튼을 누른 채널이 재생중이 아닐 때
97 else { 92 else {
98 - console.log(channels[index].isPlay);
99 - console.log(channels);
100 // xisPlaying이 null이 아닐 때 93 // xisPlaying이 null이 아닐 때
101 if (this.state.xisPlaying !== null) { 94 if (this.state.xisPlaying !== null) {
102 // 기존에 재생되던 채널의 isPlay를 false로, 클릭 이벤트가 발생한 채널의 isPlay를 true로 변경 95 // 기존에 재생되던 채널의 isPlay를 false로, 클릭 이벤트가 발생한 채널의 isPlay를 true로 변경
103 channels[this.state.xisPlaying].isPlay = false; 96 channels[this.state.xisPlaying].isPlay = false;
104 channels[index].isPlay = true; 97 channels[index].isPlay = true;
98 +
99 + // 기존 채널 재생을 중지하고 새로운 채널을 listen
100 + quit(channels[this.state.xisPlaying].id);
101 + listen(channels[index].id);
105 } 102 }
106 103
107 // xisPlaying이 null일 때 104 // xisPlaying이 null일 때
108 else { 105 else {
109 channels[index].isPlay = true; 106 channels[index].isPlay = true;
107 + // 채널 listen
108 + listen(channels[index].id);
110 } 109 }
111 110
112 this.setState({ 111 this.setState({
......