wip password, and better catch error http request

This commit is contained in:
simplonco
2023-01-14 18:40:18 +01:00
parent 0449262398
commit efc836eac0
16 changed files with 185 additions and 167 deletions

View File

@@ -30,8 +30,8 @@
*/
function set_layouts($layout)
{
console.log("layouts:", layouts);
console.log("layout:", $layout);
//console.log("layouts:", layouts);
//console.log("layout:", $layout);
if ($layout.length === 0)
layout.set(layouts[0]);
else if ($layout === "close")
@@ -42,7 +42,7 @@
layouts = [$layout, "home"];
else
layouts = [$layout, layouts[0]];
console.log("- layouts:", layouts);
//console.log("- layouts:", layouts);
}
$: set_layouts($layout);

View File

@@ -14,7 +14,6 @@
onMount(async() => {
let response = await fetch('/api/v2/chat/allowedchars');
let data = await response.json();
console.log("data:", data);
allowed_chars = data.chars;
//regex = new RegExp(`^[a-zA-Z0-9\\s${allowed_chars}]+$`);
});
@@ -40,12 +39,14 @@
};
if (is_protected === true)
room.password = room_password;
// send the new room
response = await create_room(room);
show_error = response.display;
// go to room
if (response.status === 200)
if (response.error)
show_error = response.error;
else
await change_room(response.room);
}

View File

@@ -1,6 +1,6 @@
<script>
import { layout, msgs, user } from './Store_chat';
import { layout, msgs, user, current_room } from './Store_chat';
import { change_room, get_room_messages, get_my_rooms } from './Request_rooms';
import { onMount } from 'svelte';
import Button from './Element_button.svelte';
@@ -12,9 +12,16 @@
{
console.log("inside go_to_room");
console.log("room:", room);
await change_room(room);
await get_room_messages();
if (room.protection)
{
await current_room.set(room);
layout.set("protected");
}
else
{
await change_room(room);
await get_room_messages();
}
}
</script>

View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { layout, user, current_room_name } from './Store_chat';
import { layout, user, current_room } from './Store_chat';
import { get_all_users, invite_user } from './Request_rooms';
import Button from './Element_button.svelte';
@@ -38,7 +38,7 @@
<!-- room_name -->
<Button my_class="room_name deactivate __border_top">
{$current_room_name}
{$current_room.name}
</Button>
<!-- panel_new -->

View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { layout, msgs, user, socket } from './Store_chat';
import { layout, msgs, user, socket, current_room } from './Store_chat';
import { join_room, change_room, get_room_messages, get_all_rooms } from './Request_rooms';
import Button from './Element_button.svelte';
@@ -13,11 +13,12 @@
{
console.log("inside join_room");
console.log("room:", room);
const updated_room = await join_room(room);
console.log("updated room:", updated_room);
if (room.protection)
if (updated_room.protection)
{
current_room.set(updated_room);
layout.set("protected");
}
else
await change_room(updated_room);
}

View File

@@ -1,6 +1,6 @@
<script lang="ts">
import { layout, current_room_name, current_room_type } from './Store_chat';
import { layout, current_room } from './Store_chat';
import { change_room, send_password } from './Request_rooms';
import { FetchResponse } from './Types_chat';
import Button from './Element_button.svelte';
@@ -14,23 +14,27 @@
async function handleSubmit(evt)
{
console.log("in handleSubmit");
let formIsValid = evt.target.checkValidity();
if (!formIsValid)
return;
let room = {
name: current_room_name,
type: current_room_type,
name: $current_room.name,
type: $current_room.type,
protection: true,
password: room_password,
};
// send password
response = await send_password(room);
show_error = response.display;
// go to room
if (response.status === 200)
if (response.error)
show_error = response.error;
else
await change_room(response.room);
}
@@ -56,12 +60,6 @@
<!-- panel_protected -->
<div class="panel panel_protected __border_top">
<p class="title __center">this room is protected</p>
<form>
<label for="chat_pswd"><p>password :</p></label>
<input id="chat_pswd" type="password" required>
<input type="submit" value="&#x2BA1">
</form>
<form on:submit|preventDefault={handleSubmit}>
{#if show_error}
<Warning content={response.message}/>
@@ -70,11 +68,8 @@
<input id="chat_pswd" bind:value={room_password} type="password" placeholder="minimum 8 characters" minlength="8" name="password" required>
<input type="submit" value="&#x2BA1">
</form>
</div>
</div>
<style>

View File

@@ -1,6 +1,6 @@
<script>
import { layout, socket, msgs, add_msg, current_room_name } from './Store_chat';
import { layout, socket, msgs, add_msg, current_room } from './Store_chat';
import Button from './Element_button.svelte';
import Msg from './Element_msg.svelte';
@@ -42,7 +42,7 @@
<!-- room_name -->
<Button new_layout="room_set" my_class="room_name transparent">
{$current_room_name}
{$current_room.name}
</Button>
<!-- close -->

View File

@@ -1,6 +1,6 @@
<script>
import { layout, current_room_name, current_room_type } from './Store_chat';
import { layout, current_room } from './Store_chat';
import { get_room_users, leave_room } from './Request_rooms';
import Button from './Element_button.svelte';
@@ -31,7 +31,7 @@
<!-- room_name -->
<Button my_class="room_name deactivate">
{$current_room_name}
{$current_room.name}
</Button>
<!-- close -->
@@ -41,7 +41,7 @@
<!-- panel_room_set -->
<div class="panel panel_room_set __border_top">
{#if $current_room_type !== "direct"}
{#if $current_room.type !== "direct"}
<Button on_click={user_leave_room}>
leave
</Button>

View File

@@ -1,4 +1,4 @@
import { msgs, user, layout, socket, current_room_name, current_room_type } from './Store_chat';
import { msgs, user, layout, socket, current_room } from './Store_chat';
import { Room, FetchResponse, FetchMethod } from './Types_chat';
import { fetch_chat_request, set_client_name_on_room, fill_fetch_response } from './Request_utils';
@@ -26,7 +26,9 @@ export async function create_room(room: Room)
{
console.log("in create_room");
console.log("room sent to create:", room);
let response: FetchResponse = await fetch_chat_request('create', FetchMethod.POST, room);
console.log("room returned from create:", response.room);
return response;
}
@@ -35,7 +37,9 @@ export async function join_room(room: Room)
{
console.log("in join_room");
console.log("room sent to join:", room);
let response: FetchResponse = await fetch_chat_request('join', FetchMethod.POST, room);
console.log("room returned from join:", response.room);
return response.room;
}
@@ -44,14 +48,15 @@ export async function change_room(room: Room)
{
console.log("in change_room");
await fetch_chat_request('change', FetchMethod.POST, room);
console.log("room sent to change:", room);
let response: FetchResponse = await fetch_chat_request('change', FetchMethod.POST, room);
console.log("room returned from change:", response.room);
await get_room_messages();
set_client_name_on_room(room);
current_room_name.set(room.client_name);
current_room_type.set(room.type);
current_room.set(room);
layout.set("room");
}
@@ -60,7 +65,9 @@ export async function send_password(room: Room)
{
console.log("in send_password");
console.log("room sent to set password:", room);
let response: FetchResponse = await fetch_chat_request('password', FetchMethod.POST, room);
console.log("room returned from set password:", response.room);
return response;
}

View File

@@ -3,6 +3,8 @@ import { Room, FetchResponse, FetchInit, FetchMethod } from './Types_chat';
export async function fetch_chat_request(route: string, fetchMethod: FetchMethod, param?: any)
{
console.log("in fetch_chat_request");
let response: FetchResponse = { status: 0 };
let fetch_params: FetchInit = {
@@ -12,30 +14,31 @@ export async function fetch_chat_request(route: string, fetchMethod: FetchMethod
if (param)
fetch_params.body = JSON.stringify(param);
try {
try
{
const resp = await fetch(`/api/v2/chat/${route}`, fetch_params);
response.status = resp.status;
if (!resp.ok)
throw new Error(resp.statusText);
let data = await resp.json();
fill_fetch_response(response, data);
if (!resp.ok)
throw new Error(data.message);
}
catch (error)
{
console.error('Error', error);
console.error(error.message);
}
console.log("response:", response);
return response;
}
export function set_client_name_on_room(room: Room)
{
console.log("in set_client_name_on_room, for room:", room);
console.log("in set_client_name_on_room");
if (room.type === 'direct')
{
console.log("in direct room");
room.client_name = room.users[0];
if (room.client_name === user.username)
room.client_name = room.users[1];
@@ -47,11 +50,10 @@ export function set_client_name_on_room(room: Room)
export function fill_fetch_response(response: FetchResponse, data: any)
{
console.log("data:", data);
console.log("in fill_fetch_response");
Object.keys(data).forEach(key =>
{
console.log(key)
response[key] = data[key];
});
console.log(response);
}

View File

@@ -1,9 +1,13 @@
import { writable } from 'svelte/store';
import { Room } from './Types_chat';
export let msgs = writable([]);
export let layout = writable("close");
export let current_room_name = writable("");
export let current_room_type = writable("");
export let current_room: Room = writable({
name: "",
type: "",
protection: false,
});
export let user;
export let socket;

View File

@@ -1,17 +1,17 @@
export interface Room
{
name: string;
type: "public" | "protected" | "private" | "direct" | "user";
type: "public" | "private" | "direct" | "user";
users?: string[];
client_name?: string;
protection?: boolean;
protection: boolean;
}
export interface FetchResponse
{
status: number;
error?: boolean;
code?: string;
display?: boolean;
message?: string;
room?: Room;
}