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

wip send msg

Browse Source
This commit is contained in:
simplonco
2022-12-26 23:20:19 +01:00
parent 863679f029
commit 11039be876
5 changed files with 224 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -2778,8 +2778,8 @@ var app = (function () {
let current;
let mounted;
let dispose;
const default_slot_template = /*#slots*/ ctx[6].default;
const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[5], null);
const default_slot_template = /*#slots*/ ctx[7].default;
const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[6], null);
const block = {
c: function create() {
@@ -2787,10 +2787,10 @@ var app = (function () {
p = element("p");
if (default_slot) default_slot.c();
attr_dev(p, "class", "svelte-j5z24r");
add_location(p, file$m, 18, 1, 368);
attr_dev(button, "class", button_class_value = "" + (null_to_empty(/*my_class*/ ctx[0]) + " svelte-j5z24r"));
add_location(p, file$m, 25, 1, 441);
attr_dev(button, "title", /*my_title*/ ctx[1]);
add_location(button, file$m, 17, 0, 299);
attr_dev(button, "class", button_class_value = "" + (null_to_empty(/*my_class*/ ctx[0]) + " svelte-j5z24r"));
add_location(button, file$m, 24, 0, 352);
},
l: function claim(nodes) {
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -2806,33 +2806,48 @@ var app = (function () {
current = true;
if (!mounted) {
dispose = listen_dev(button, "click", /*update_layout*/ ctx[2], false, false, false);
dispose = [
listen_dev(button, "click", /*update_layout*/ ctx[3], false, false, false),
listen_dev(
button,
"click",
function () {
if (is_function(/*on_click*/ ctx[2])) /*on_click*/ ctx[2].apply(this, arguments);
},
false,
false,
false
)
];
mounted = true;
}
},
p: function update(ctx, [dirty]) {
p: function update(new_ctx, [dirty]) {
ctx = new_ctx;
if (default_slot) {
if (default_slot.p && (!current || dirty & /*$$scope*/ 32)) {
if (default_slot.p && (!current || dirty & /*$$scope*/ 64)) {
update_slot_base(
default_slot,
default_slot_template,
ctx,
/*$$scope*/ ctx[5],
/*$$scope*/ ctx[6],
!current
? get_all_dirty_from_scope(/*$$scope*/ ctx[5])
: get_slot_changes(default_slot_template, /*$$scope*/ ctx[5], dirty, null),
? get_all_dirty_from_scope(/*$$scope*/ ctx[6])
: get_slot_changes(default_slot_template, /*$$scope*/ ctx[6], dirty, null),
null
);
}
}
if (!current || dirty & /*my_class*/ 1 && button_class_value !== (button_class_value = "" + (null_to_empty(/*my_class*/ ctx[0]) + " svelte-j5z24r"))) {
attr_dev(button, "class", button_class_value);
}
if (!current || dirty & /*my_title*/ 2) {
attr_dev(button, "title", /*my_title*/ ctx[1]);
}
if (!current || dirty & /*my_class*/ 1 && button_class_value !== (button_class_value = "" + (null_to_empty(/*my_class*/ ctx[0]) + " svelte-j5z24r"))) {
attr_dev(button, "class", button_class_value);
}
},
i: function intro(local) {
if (current) return;
@@ -2847,7 +2862,7 @@ var app = (function () {
if (detaching) detach_dev(button);
if (default_slot) default_slot.d(detaching);
mounted = false;
dispose();
run_all(dispose);
}
};
@@ -2869,13 +2884,14 @@ var app = (function () {
let { my_title = "" } = $$props;
let { layout = "" } = $$props;
let { new_layout = "" } = $$props;
let { on_click = "" } = $$props;
function update_layout() {
$$invalidate(3, layout = new_layout);
$$invalidate(4, layout = new_layout);
console.log(layout);
}
const writable_props = ['my_class', 'my_title', 'layout', 'new_layout'];
const writable_props = ['my_class', 'my_title', 'layout', 'new_layout', 'on_click'];
Object.keys($$props).forEach(key => {
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$6.warn(`<Chat_button> was created with unknown prop '${key}'`);
@@ -2884,9 +2900,10 @@ var app = (function () {
$$self.$$set = $$props => {
if ('my_class' in $$props) $$invalidate(0, my_class = $$props.my_class);
if ('my_title' in $$props) $$invalidate(1, my_title = $$props.my_title);
if ('layout' in $$props) $$invalidate(3, layout = $$props.layout);
if ('new_layout' in $$props) $$invalidate(4, new_layout = $$props.new_layout);
if ('$$scope' in $$props) $$invalidate(5, $$scope = $$props.$$scope);
if ('layout' in $$props) $$invalidate(4, layout = $$props.layout);
if ('new_layout' in $$props) $$invalidate(5, new_layout = $$props.new_layout);
if ('on_click' in $$props) $$invalidate(2, on_click = $$props.on_click);
if ('$$scope' in $$props) $$invalidate(6, $$scope = $$props.$$scope);
};
$$self.$capture_state = () => ({
@@ -2894,21 +2911,32 @@ var app = (function () {
my_title,
layout,
new_layout,
on_click,
update_layout
});
$$self.$inject_state = $$props => {
if ('my_class' in $$props) $$invalidate(0, my_class = $$props.my_class);
if ('my_title' in $$props) $$invalidate(1, my_title = $$props.my_title);
if ('layout' in $$props) $$invalidate(3, layout = $$props.layout);
if ('new_layout' in $$props) $$invalidate(4, new_layout = $$props.new_layout);
if ('layout' in $$props) $$invalidate(4, layout = $$props.layout);
if ('new_layout' in $$props) $$invalidate(5, new_layout = $$props.new_layout);
if ('on_click' in $$props) $$invalidate(2, on_click = $$props.on_click);
};
if ($$props && "$$inject" in $$props) {
$$self.$inject_state($$props.$$inject);
}
return [my_class, my_title, update_layout, layout, new_layout, $$scope, slots];
return [
my_class,
my_title,
on_click,
update_layout,
layout,
new_layout,
$$scope,
slots
];
}
class Chat_button extends SvelteComponentDev {
@@ -2918,8 +2946,9 @@ var app = (function () {
init(this, options, instance$n, create_fragment$n, safe_not_equal, {
my_class: 0,
my_title: 1,
layout: 3,
new_layout: 4
layout: 4,
new_layout: 5,
on_click: 2
});
dispatch_dev("SvelteRegisterComponent", {
@@ -2961,6 +2990,14 @@ var app = (function () {
set new_layout(value) {
throw new Error("<Chat_button>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
}
get on_click() {
throw new Error("<Chat_button>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
}
set on_click(value) {
throw new Error("<Chat_button>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
}
}
/* src/pieces/chat/Layout_home.svelte generated by Svelte v3.53.1 */
@@ -3316,7 +3353,7 @@ var app = (function () {
/* src/pieces/chat/Layout_room.svelte generated by Svelte v3.53.1 */
const file$k = "src/pieces/chat/Layout_room.svelte";
// (13:1) <Button bind:layout new_layout={back} my_class="back icon" my_title="go back {back}">
// (38:1) <Button bind:layout new_layout={back} my_class="back icon" my_title="go back {back}">
function create_default_slot_3$4(ctx) {
let t;
@@ -3336,14 +3373,14 @@ var app = (function () {
block,
id: create_default_slot_3$4.name,
type: "slot",
source: "(13:1) <Button bind:layout new_layout={back} my_class=\\\"back icon\\\" my_title=\\\"go back {back}\\\">",
source: "(38:1) <Button bind:layout new_layout={back} my_class=\\\"back icon\\\" my_title=\\\"go back {back}\\\">",
ctx
});
return block;
}
// (18:1) <Button bind:layout new_layout="room_set" my_class="room_name transparent">
// (43:1) <Button bind:layout new_layout="room_set" my_class="room_name transparent">
function create_default_slot_2$8(ctx) {
let t;
@@ -3363,14 +3400,14 @@ var app = (function () {
block,
id: create_default_slot_2$8.name,
type: "slot",
source: "(18:1) <Button bind:layout new_layout=\\\"room_set\\\" my_class=\\\"room_name transparent\\\">",
source: "(43:1) <Button bind:layout new_layout=\\\"room_set\\\" my_class=\\\"room_name transparent\\\">",
ctx
});
return block;
}
// (23:1) <Button bind:layout new_layout="close" my_class="close icon">
// (48:1) <Button bind:layout new_layout="close" my_class="close icon">
function create_default_slot_1$8(ctx) {
let t;
@@ -3390,14 +3427,14 @@ var app = (function () {
block,
id: create_default_slot_1$8.name,
type: "slot",
source: "(23:1) <Button bind:layout new_layout=\\\"close\\\" my_class=\\\"close icon\\\">",
source: "(48:1) <Button bind:layout new_layout=\\\"close\\\" my_class=\\\"close icon\\\">",
ctx
});
return block;
}
// (67:1) <Button my_class="send">
// (98:1) <Button my_class="send" on_click={send_msg}>
function create_default_slot$a(ctx) {
let t;
@@ -3417,7 +3454,7 @@ var app = (function () {
block,
id: create_default_slot$a.name,
type: "slot",
source: "(67:1) <Button my_class=\\\"send\\\">",
source: "(98:1) <Button my_class=\\\"send\\\" on_click={send_msg}>",
ctx
});
@@ -3475,9 +3512,11 @@ var app = (function () {
let t28;
let button3;
let current;
let mounted;
let dispose;
function button0_layout_binding(value) {
/*button0_layout_binding*/ ctx[2](value);
/*button0_layout_binding*/ ctx[6](value);
}
let button0_props = {
@@ -3496,7 +3535,7 @@ var app = (function () {
binding_callbacks.push(() => bind(button0, 'layout', button0_layout_binding));
function button1_layout_binding(value) {
/*button1_layout_binding*/ ctx[3](value);
/*button1_layout_binding*/ ctx[7](value);
}
let button1_props = {
@@ -3514,7 +3553,7 @@ var app = (function () {
binding_callbacks.push(() => bind(button1, 'layout', button1_layout_binding));
function button2_layout_binding(value) {
/*button2_layout_binding*/ ctx[4](value);
/*button2_layout_binding*/ ctx[8](value);
}
let button2_props = {
@@ -3534,6 +3573,7 @@ var app = (function () {
button3 = new Chat_button({
props: {
my_class: "send",
on_click: /*send_msg*/ ctx[4],
$$slots: { default: [create_default_slot$a] },
$$scope: { ctx }
},
@@ -3600,54 +3640,54 @@ var app = (function () {
t28 = space();
create_component(button3.$$.fragment);
attr_dev(p0, "class", "name svelte-opnow1");
add_location(p0, file$k, 32, 4, 637);
add_location(br, file$k, 33, 30, 691);
add_location(p0, file$k, 57, 4, 966);
add_location(br, file$k, 58, 30, 1020);
attr_dev(p1, "class", "msg svelte-opnow1");
add_location(p1, file$k, 33, 4, 665);
add_location(p1, file$k, 58, 4, 994);
attr_dev(div0, "class", "chat_msg blub svelte-opnow1");
add_location(div0, file$k, 31, 3, 605);
add_location(div0, file$k, 56, 3, 934);
attr_dev(p2, "class", "name svelte-opnow1");
add_location(p2, file$k, 36, 4, 768);
add_location(p2, file$k, 61, 4, 1097);
attr_dev(p3, "class", "msg svelte-opnow1");
add_location(p3, file$k, 37, 4, 795);
add_location(p3, file$k, 62, 4, 1124);
attr_dev(div1, "class", "chat_msg blob svelte-opnow1");
add_location(div1, file$k, 35, 3, 736);
add_location(div1, file$k, 60, 3, 1065);
attr_dev(p4, "class", "name svelte-opnow1");
add_location(p4, file$k, 40, 4, 863);
add_location(p4, file$k, 65, 4, 1192);
attr_dev(p5, "class", "msg svelte-opnow1");
add_location(p5, file$k, 41, 4, 891);
add_location(p5, file$k, 66, 4, 1220);
attr_dev(div2, "class", "chat_msg me svelte-opnow1");
add_location(div2, file$k, 39, 3, 833);
add_location(div2, file$k, 64, 3, 1162);
attr_dev(p6, "class", "name svelte-opnow1");
add_location(p6, file$k, 44, 4, 959);
add_location(p6, file$k, 69, 4, 1288);
attr_dev(p7, "class", "msg svelte-opnow1");
add_location(p7, file$k, 45, 4, 986);
add_location(p7, file$k, 70, 4, 1315);
attr_dev(div3, "class", "chat_msg me svelte-opnow1");
add_location(div3, file$k, 43, 3, 929);
add_location(div3, file$k, 68, 3, 1258);
attr_dev(p8, "class", "name svelte-opnow1");
add_location(p8, file$k, 48, 4, 1056);
add_location(p8, file$k, 73, 4, 1385);
attr_dev(p9, "class", "msg svelte-opnow1");
add_location(p9, file$k, 49, 4, 1084);
add_location(p9, file$k, 74, 4, 1413);
attr_dev(div4, "class", "chat_msg bleb svelte-opnow1");
add_location(div4, file$k, 47, 3, 1024);
add_location(div4, file$k, 72, 3, 1353);
attr_dev(p10, "class", "name svelte-opnow1");
add_location(p10, file$k, 52, 4, 1156);
add_location(p10, file$k, 77, 4, 1485);
attr_dev(p11, "class", "msg svelte-opnow1");
add_location(p11, file$k, 53, 4, 1183);
add_location(p11, file$k, 78, 4, 1512);
attr_dev(div5, "class", "chat_msg SERVER svelte-opnow1");
add_location(div5, file$k, 51, 3, 1122);
add_location(div5, file$k, 76, 3, 1451);
attr_dev(div6, "class", "msg_thread svelte-opnow1");
add_location(div6, file$k, 28, 2, 535);
add_location(div6, file$k, 53, 2, 864);
attr_dev(div7, "class", "panel panel_msg svelte-opnow1");
add_location(div7, file$k, 27, 1, 503);
add_location(div7, file$k, 52, 1, 832);
attr_dev(div8, "class", "text_area svelte-opnow1");
attr_dev(div8, "id", "chat_msg_write");
attr_dev(div8, "contenteditable", "true");
add_location(div8, file$k, 61, 2, 1310);
if (/*msg*/ ctx[2] === void 0) add_render_callback(() => /*div8_input_handler*/ ctx[9].call(div8));
add_location(div8, file$k, 86, 2, 1639);
attr_dev(div9, "class", "panel_write svelte-opnow1");
add_location(div9, file$k, 60, 1, 1282);
add_location(div9, file$k, 85, 1, 1611);
attr_dev(div10, "class", "grid_box svelte-opnow1");
add_location(div10, file$k, 9, 0, 115);
add_location(div10, file$k, 34, 0, 444);
},
l: function claim(nodes) {
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -3697,16 +3737,31 @@ var app = (function () {
append_dev(div10, t27);
append_dev(div10, div9);
append_dev(div9, div8);
if (/*msg*/ ctx[2] !== void 0) {
div8.innerHTML = /*msg*/ ctx[2];
}
/*div8_binding*/ ctx[10](div8);
append_dev(div10, t28);
mount_component(button3, div10, null);
current = true;
if (!mounted) {
dispose = [
listen_dev(div8, "input", /*div8_input_handler*/ ctx[9]),
listen_dev(div8, "keypress", /*send_msg_if*/ ctx[5], false, false, false)
];
mounted = true;
}
},
p: function update(ctx, [dirty]) {
const button0_changes = {};
if (dirty & /*back*/ 2) button0_changes.new_layout = /*back*/ ctx[1];
if (dirty & /*back*/ 2) button0_changes.my_title = "go back " + /*back*/ ctx[1];
if (dirty & /*$$scope*/ 32) {
if (dirty & /*$$scope*/ 2048) {
button0_changes.$$scope = { dirty, ctx };
}
@@ -3719,7 +3774,7 @@ var app = (function () {
button0.$set(button0_changes);
const button1_changes = {};
if (dirty & /*$$scope*/ 32) {
if (dirty & /*$$scope*/ 2048) {
button1_changes.$$scope = { dirty, ctx };
}
@@ -3732,7 +3787,7 @@ var app = (function () {
button1.$set(button1_changes);
const button2_changes = {};
if (dirty & /*$$scope*/ 32) {
if (dirty & /*$$scope*/ 2048) {
button2_changes.$$scope = { dirty, ctx };
}
@@ -3743,9 +3798,14 @@ var app = (function () {
}
button2.$set(button2_changes);
if (dirty & /*msg*/ 4 && /*msg*/ ctx[2] !== div8.innerHTML) {
div8.innerHTML = /*msg*/ ctx[2];
}
const button3_changes = {};
if (dirty & /*$$scope*/ 32) {
if (dirty & /*$$scope*/ 2048) {
button3_changes.$$scope = { dirty, ctx };
}
@@ -3771,7 +3831,10 @@ var app = (function () {
destroy_component(button0);
destroy_component(button1);
destroy_component(button2);
/*div8_binding*/ ctx[10](null);
destroy_component(button3);
mounted = false;
run_all(dispose);
}
};
@@ -3791,6 +3854,28 @@ var app = (function () {
validate_slots('Layout_room', slots, []);
let { layout = "" } = $$props;
let { back = "" } = $$props;
let msg = "";
let text_area;
function send_msg() {
$$invalidate(2, msg = msg.trim());
if (msg.length > 0) {
//socket.emit('sendmsg', msg);
add_message("me", msg);
}
$$invalidate(2, msg = "");
text_area.focus();
}
function send_msg_if(evt) {
if (evt.shiftKey && evt.key === "Enter") {
evt.preventDefault();
send_msg();
}
}
const writable_props = ['layout', 'back'];
Object.keys($$props).forEach(key => {
@@ -3812,16 +3897,38 @@ var app = (function () {
$$invalidate(0, layout);
}
function div8_input_handler() {
msg = this.innerHTML;
$$invalidate(2, msg);
}
function div8_binding($$value) {
binding_callbacks[$$value ? 'unshift' : 'push'](() => {
text_area = $$value;
$$invalidate(3, text_area);
});
}
$$self.$$set = $$props => {
if ('layout' in $$props) $$invalidate(0, layout = $$props.layout);
if ('back' in $$props) $$invalidate(1, back = $$props.back);
};
$$self.$capture_state = () => ({ Button: Chat_button, layout, back });
$$self.$capture_state = () => ({
Button: Chat_button,
layout,
back,
msg,
text_area,
send_msg,
send_msg_if
});
$$self.$inject_state = $$props => {
if ('layout' in $$props) $$invalidate(0, layout = $$props.layout);
if ('back' in $$props) $$invalidate(1, back = $$props.back);
if ('msg' in $$props) $$invalidate(2, msg = $$props.msg);
if ('text_area' in $$props) $$invalidate(3, text_area = $$props.text_area);
};
if ($$props && "$$inject" in $$props) {
@@ -3831,9 +3938,15 @@ var app = (function () {
return [
layout,
back,
msg,
text_area,
send_msg,
send_msg_if,
button0_layout_binding,
button1_layout_binding,
button2_layout_binding
button2_layout_binding,
div8_input_handler,
div8_binding
];
}

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

File diff suppressed because one or more lines are too long

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

@@ -1,127 +0,0 @@
<div class="close" id="chat_box">
<!--
classes:
1. close -> layout close
2. home -> layout home
3. room -> layout room
4. new -> layout new
5. settings -> layout settings
6. room_set -> layout room_set
7. protected -> layout protected
8. create -> layout create
9. mute -> layout mute
10. user -> layout user
11. _blocked -> for user layout : user is blocked
12. _muted -> for user layout : user is muted
13. _admin -> for user layout : you are admin
14. _room_set -> for user layout : comes from room_set
15. _settings -> for user layout : comes from settings
classes for layout must replace the entire previous class
but classes starting with "_" must be added to existing class
-->
<p class="chat_item chat_create" id="chat_create" >create</p>
<p class="chat_item chat_user" id="chat_user" >&lt;user_name&gt;</p>
<!-- --------------------------------
PANELS
- HOME
- MSG
- NEW
- SETTINGS
- ROOM SET
- PROTECTED
- CREATE
- USER
- MUTE
- WRITE
--------------------------------- -->
</div>
<style>
@import './chat_style/chat__global.css';
@import './chat_style/layout_close.css';
@import './chat_style/layout_home.css';
@import './chat_style/layout_room.css';
@import './chat_style/layout_new.css';
@import './chat_style/layout_settings.css';
@import './chat_style/layout_room_set.css';
@import './chat_style/layout_protected.css';
@import './chat_style/layout_create.css';
@import './chat_style/layout_user.css';
@import './chat_style/layout_mute.css';
@import './chat_style/chat_panels.css';
@import './chat_style/chat_buttons.css';
@import './chat_style/chat_back.css';
@import './chat_style/chat_close.css';
@import './chat_style/chat_write.css';
@import './chat_style/chat_msg.css';
@import './chat_style/chat_blocked.css';
@import './chat_style/chat_form.css';
/*
GRID
*/
#chat_box * {
display: flex;
flex-direction: column;
position: relative;
box-sizing: border-box;
padding: 0px;
margin: auto;
}
#chat_box .chat_item {
display: none;
/*
border: 1px solid black;
*/
width: 100%;
height: 100%;
}
.chat_item#chat_chat { grid-area: chat;}
.chat_item#chat_close { grid-area: close;}
.chat_item#chat_new { grid-area: new;}
.chat_item#chat_settings { grid-area: settings;}
.chat_item#chat_room_name { grid-area: room_name;}
.chat_item#chat_send { grid-area: send;}
.chat_item#chat_create { grid-area: create;}
.chat_item#chat_user { grid-area: user;}
.chat_item#chat_back { grid-area: back;}
.chat_item#chat_panel_home { grid-area: panel_home;}
.chat_item#chat_panel_new { grid-area: panel_new;}
.chat_item#chat_panel_msg { grid-area: panel_msg;}
.chat_item#chat_panel_write { grid-area: panel_write;}
.chat_item#chat_panel_settings { grid-area: panel_settings;}
.chat_item#chat_panel_room_set { grid-area: panel_room_set;}
.chat_item#chat_panel_protected { grid-area: panel_protected;}
.chat_item#chat_panel_create { grid-area: panel_create;}
.chat_item#chat_panel_user { grid-area: panel_user;}
.chat_item#chat_panel_mute { grid-area: panel_mute;}
#chat_box {
display: grid;
position: fixed;
bottom: 20px;
right: 20px;
gap: 5px;
padding: 5px;
width: 300px;
height: 400px;
border: 1px solid black;
}
</style>

11
srcs/requirements/svelte/api_front/src/pieces/chat/Chat_button.svelte
View File

@@ -1,6 +1,12 @@
<!--
<Button bind:layout={layout} new_layout="" my_title="">
<Button
bind:layout
new_layout=""
on_click={}
my_class=""
my_title=""
>
value
</Button>
-->
@@ -11,6 +17,7 @@
export let my_title = "";
export let layout = "";
export let new_layout = "";
export let on_click = "";
function update_layout() {
layout = new_layout;
@@ -19,7 +26,7 @@
</script>
<button class={my_class} on:click={update_layout} title={my_title}>
<button on:click={update_layout} on:click={on_click} title={my_title} class={my_class}>
<p><slot></slot></p>
</button>

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

@@ -5,6 +5,31 @@
export let layout = "";
export let back = "";
let msg = "";
let text_area;
function send_msg()
{
msg = msg.trim();
if (msg.length > 0) {
//socket.emit('sendmsg', msg);
add_message("me", msg);
}
msg = "";
text_area.focus();
}
function send_msg_if(evt)
{
if (evt.shiftKey && evt.key === "Enter")
{
evt.preventDefault();
send_msg();
}
}
</script>
<div class="grid_box">
@@ -59,12 +84,18 @@
<!-- write -->
<div class="panel_write">
<div class="text_area" id="chat_msg_write" contenteditable="true">
<div
class="text_area"
bind:innerHTML={msg}
bind:this={text_area}
on:keypress={send_msg_if}
contenteditable="true"
>
</div>
</div>
<!-- send -->
<Button my_class="send">
<Button my_class="send" on_click={send_msg}>
send
</Button>