42/42_INT_14_transcendence
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wip chat in room, now broadcast with name

Browse Source
This commit is contained in:
simplonco
2023-01-04 21:57:01 +01:00
parent 1c2d202ec1
commit a4a2b4bf76
9 changed files with 96 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
srcs/requirements/svelte/api_front/public/build/bundle.js
View File

@@ -7855,13 +7855,17 @@ var app = (function () {
/* src/pieces/chat/Chat_socket.svelte generated by Svelte v3.53.1 */
const address = `http://${'transcendance'}:${'8080'}`;
const socket$1 = lookup(address, { path: '/chat' });
const userPomise = fetch(`${address}/api/v2/user`).then(x => x.json());
let user;
let socket$1;
const address = `http://${'transcendance'}:${'8080'}`;
userPomise.then(data => {
fetch(`${address}/api/v2/user`).then(resp => resp.json()).then(data => {
user = data;
socket$1 = lookup(address, {
path: '/chat',
query: { username: user.username }
});
});
/* src/pieces/chat/Layout_room.svelte generated by Svelte v3.53.1 */
@@ -7875,7 +7879,7 @@ var app = (function () {
return child_ctx;
}
// (56:1) <Button bind:layout new_layout={back} my_class="back icon" my_title="go back {back}">
// (54:1) <Button bind:layout new_layout={back} my_class="back icon" my_title="go back {back}">
function create_default_slot_4$2(ctx) {
let t;
@@ -7895,14 +7899,14 @@ var app = (function () {
block,
id: create_default_slot_4$2.name,
type: "slot",
source: "(56:1) <Button bind:layout new_layout={back} my_class=\\\"back icon\\\" my_title=\\\"go back {back}\\\">",
source: "(54:1) <Button bind:layout new_layout={back} my_class=\\\"back icon\\\" my_title=\\\"go back {back}\\\">",
ctx
});
return block;
}
// (61:1) <Button bind:layout new_layout="room_set" my_class="room_name transparent">
// (59:1) <Button bind:layout new_layout="room_set" my_class="room_name transparent">
function create_default_slot_3$4(ctx) {
let t;
@@ -7922,14 +7926,14 @@ var app = (function () {
block,
id: create_default_slot_3$4.name,
type: "slot",
source: "(61:1) <Button bind:layout new_layout=\\\"room_set\\\" my_class=\\\"room_name transparent\\\">",
source: "(59:1) <Button bind:layout new_layout=\\\"room_set\\\" my_class=\\\"room_name transparent\\\">",
ctx
});
return block;
}
// (66:1) <Button bind:layout new_layout="close" my_class="close icon">
// (64:1) <Button bind:layout new_layout="close" my_class="close icon">
function create_default_slot_2$8(ctx) {
let t;
@@ -7949,14 +7953,14 @@ var app = (function () {
block,
id: create_default_slot_2$8.name,
type: "slot",
source: "(66:1) <Button bind:layout new_layout=\\\"close\\\" my_class=\\\"close icon\\\">",
source: "(64:1) <Button bind:layout new_layout=\\\"close\\\" my_class=\\\"close icon\\\">",
ctx
});
return block;
}
// (74:4) <Msg name={msg.name}>
// (72:4) <Msg name={msg.name}>
function create_default_slot_1$8(ctx) {
let html_tag;
let raw_value = /*msg*/ ctx[4].content + "";
@@ -7985,14 +7989,14 @@ var app = (function () {
block,
id: create_default_slot_1$8.name,
type: "slot",
source: "(74:4) <Msg name={msg.name}>",
source: "(72:4) <Msg name={msg.name}>",
ctx
});
return block;
}
// (73:3) {#each msgs as msg}
// (71:3) {#each msgs as msg}
function create_each_block$4(ctx) {
let msg_1;
let current;
@@ -8042,14 +8046,14 @@ var app = (function () {
block,
id: create_each_block$4.name,
type: "each",
source: "(73:3) {#each msgs as msg}",
source: "(71:3) {#each msgs as msg}",
ctx
});
return block;
}
// (91:1) <Button my_class="send" on_click={send_msg}>
// (89:1) <Button my_class="send" on_click={send_msg}>
function create_default_slot$a(ctx) {
let t;
@@ -8069,7 +8073,7 @@ var app = (function () {
block,
id: create_default_slot$a.name,
type: "slot",
source: "(91:1) <Button my_class=\\\"send\\\" on_click={send_msg}>",
source: "(89:1) <Button my_class=\\\"send\\\" on_click={send_msg}>",
ctx
});
@@ -8196,17 +8200,17 @@ var app = (function () {
t4 = space();
create_component(button3.$$.fragment);
attr_dev(div0, "class", "msg_thread svelte-1quyp80");
add_location(div0, file$m, 71, 2, 1256);
add_location(div0, file$m, 69, 2, 1224);
attr_dev(div1, "class", "panel panel_msg svelte-1quyp80");
add_location(div1, file$m, 70, 1, 1224);
add_location(div1, file$m, 68, 1, 1192);
attr_dev(div2, "class", "text_area svelte-1quyp80");
attr_dev(div2, "contenteditable", "true");
if (/*msg*/ ctx[4] === void 0) add_render_callback(() => /*div2_input_handler*/ ctx[10].call(div2));
add_location(div2, file$m, 80, 2, 1429);
add_location(div2, file$m, 78, 2, 1397);
attr_dev(div3, "class", "panel_write svelte-1quyp80");
add_location(div3, file$m, 79, 1, 1401);
add_location(div3, file$m, 77, 1, 1369);
attr_dev(div4, "class", "grid_box svelte-1quyp80");
add_location(div4, file$m, 52, 0, 836);
add_location(div4, file$m, 50, 0, 804);
},
l: function claim(nodes) {
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -8385,10 +8389,10 @@ var app = (function () {
let { $$slots: slots = {}, $$scope } = $$props;
validate_slots('Layout_room', slots, []);
socket$1.on('message', data => {
console.log("received msg :");
console.log(data);
add_msg("other", data);
socket$1.on('message', (name, message) => {
console.log(name);
console.log(message);
add_msg(name, message);
});
let { layout = "" } = $$props;
@@ -8397,14 +8401,12 @@ var app = (function () {
let text_area;
let msgs = [];
function add_msg(from, the_msg) {
$$invalidate(3, msgs = [...msgs, { content: the_msg, name: from }]);
function add_msg(from, message) {
if (from === user.username) from = "me";
$$invalidate(3, msgs = [...msgs, { content: message, name: from }]);
}
function send_msg() {
console.log("user:");
console.log(user);
console.log(user.username);
$$invalidate(4, msg = msg.trim());
if (msg.length > 0) {
@@ -13989,7 +13991,9 @@ var app = (function () {
validate_slots('Chat', slots, []);
let { color = "transparent" } = $$props;
onMount(async => {
onMount(async () => {
await socket$1;
socket$1.on('connect', function () {
console.log("socket.io connected");
});

2
srcs/requirements/svelte/api_front/public/build/bundle.js.map
View File

File diff suppressed because one or more lines are too long

3
srcs/requirements/svelte/api_front/src/pieces/chat/Chat.svelte
View File

@@ -9,7 +9,8 @@
*/
import { socket } from './Chat_socket.svelte';
onMount(async => {
onMount(async() => {
await socket;
socket.on('connect', function(){
console.log("socket.io connected");
});

22
srcs/requirements/svelte/api_front/src/pieces/chat/Chat_socket.svelte
View File

@@ -1,17 +1,25 @@
<script context="module">
import io from 'socket.io-client';
export let user;
export let socket;
const address = `http://${process.env.WEBSITE_HOST}:${process.env.WEBSITE_PORT}`;
export const socket = io(address, {
path: '/chat'
});
const userPomise = fetch(`${address}/api/v2/user`).then((x) => x.json());
export let user
userPomise.then((data) => {
fetch(`${address}/api/v2/user`)
.then((resp) => resp.json())
.then((data) =>
{
user = data;
socket = io(address,
{
path: '/chat',
query:
{
username: user.username,
},
});
});
</script>

18
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_room.svelte
View File

@@ -5,10 +5,10 @@
import Msg from './Chat_msg.svelte';
import { socket, user } from './Chat_socket.svelte';
socket.on('message', (data) => {
console.log("received msg :");
console.log(data);
add_msg("other", data);
socket.on('message', (name, message) => {
console.log(name)
console.log(message)
add_msg(name, message);
});
export let layout = "";
@@ -18,17 +18,15 @@
let text_area;
let msgs = [];
function add_msg(from, the_msg)
function add_msg(from, message)
{
msgs = [...msgs, { content: the_msg, name: from }];
if (from === user.username)
from = "me";
msgs = [...msgs, { content: message, name: from }];
}
function send_msg()
{
console.log("user:");
console.log(user);
console.log(user.username);
msg = msg.trim();
if (msg.length > 0) {
socket.emit('message', msg);