Skip to content

Commit

Permalink
fix(terminal): fix password dialog on terminal page (#198)
Browse files Browse the repository at this point in the history
  • Loading branch information
@ravenclaw900
ravenclaw900 committed Apr 3, 2022
1 parent 7681d67 commit 807f954
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 24 deletions.
3 changes: 2 additions & 1 deletion src/backend/src/socket_handlers.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,8 @@ pub async fn term_handler(socket: warp::ws::WebSocket) {

if crate::CONFIG.pass {
let token = socket_recv.next().await.unwrap().unwrap();
let token = token.to_str().unwrap();
// Stop from panicking, return from function with invalid token instead
let token = token.to_str().unwrap_or("");
if token.get(..5) == Some("token") {
if !validate_token(&token[5..]) {
return;
Expand Down
27 changes: 13 additions & 14 deletions src/frontend/src/App.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -157,6 +157,7 @@
// Remove legacy "token" setting
localStorage.removeItem("token");
localStorage.removeItem("tokens");
token = "";
pollServer(window.location.pathname);
}
}
Expand Down Expand Up @@ -272,11 +273,11 @@
>
{#if loginDialog}
<div
class="fixed inset-0 bg-gray-600/50 h-screen w-screen flex items-center justify-center z-20"
class="flex fixed inset-0 z-20 justify-center items-center w-screen h-screen bg-gray-600/50"
transition:fade
>
<div
class="bg-white dark:bg-black w-1/2 h-1/3 rounded-md flex items-center flex-col justify-center text-xl z-40 gap-5 dark:text-white"
class="flex z-40 flex-col gap-5 justify-center items-center w-1/2 h-1/3 text-xl bg-white rounded-md dark:bg-black dark:text-white"
>
<h6>Please login:</h6>
<form
Expand All @@ -285,12 +286,12 @@
>
<input
type="password"
class="outline-none bg-gray-100 border border-gray-400 dark:border-gray-700 rounded focus:bg-gray-200 dark:bg-gray-900 dark:focus:bg-gray-800"
class="bg-gray-100 rounded border border-gray-400 outline-none dark:border-gray-700 focus:bg-gray-200 dark:bg-gray-900 dark:focus:bg-gray-800"
bind:value={password}
/>
<button
type="submit"
class="border-gray-500 hover:bg-gray-100 dark:hover:bg-gray-900 focus:outline-none border p-2 rounded active:bg-gray-200 dark:active:bg-gray-800"
class="p-2 rounded border border-gray-500 hover:bg-gray-100 dark:hover:bg-gray-900 focus:outline-none active:bg-gray-200 dark:active:bg-gray-800"
>Login</button
>
</form>
Expand All @@ -309,7 +310,7 @@
id="sidebarMenu"
>
<div
class="hidden lg:flex whitespace-nowrap h-12 bg-dplime-dark text-2xl items-center justify-center"
class="hidden justify-center items-center h-12 text-2xl whitespace-nowrap lg:flex bg-dplime-dark"
>
DietPi Dashboard
</div>
Expand All @@ -335,10 +336,10 @@
><NavbarLink icon={faFolder}>File Browser</NavbarLink></span
>
</div>
<div class="w-5/6 flex flex-col flex-grow min-h-full">
<header class="bg-dplime h-12 grid grid-cols-3 items-center">
<div class="flex flex-col flex-grow w-5/6 min-h-full">
<header class="grid grid-cols-3 items-center h-12 bg-dplime">
<span on:click={() => (menu = !menu)} class="justify-self-start"
><Fa icon={faBars} class="btn ml-1 p-1" size="3x" /></span
><Fa icon={faBars} class="p-1 ml-1 btn" size="3x" /></span
>
<a
href="https://dietpi.com"
Expand Down Expand Up @@ -388,7 +389,7 @@
</div>
</header>
{#if notificationsShown}
<div class="bg-gray-50 dark:bg-gray-800 p-2" transition:slide>
<div class="p-2 bg-gray-50 dark:bg-gray-800" transition:slide>
<div class="min-h-10">
<table class="w-full">
{#if update}
Expand All @@ -401,7 +402,7 @@
</div>
{/if}
{#if settingsShown}
<div class="bg-gray-50 dark:bg-gray-800 p-2" transition:slide>
<div class="p-2 bg-gray-50 dark:bg-gray-800" transition:slide>
<div class="min-h-10">
<table class="w-full">
<select bind:value={node} class="w-full">
Expand Down Expand Up @@ -433,9 +434,7 @@
<Route path="software"
><Software {socketData} {socketSend} /></Route
>
<Route path="terminal"
><Terminal {loginDialog} {node} /></Route
>
<Route path="terminal"><Terminal {node} {token} /></Route>
<Route path="management"
><Management {socketSend} {socketData} /></Route
>
Expand All @@ -457,7 +456,7 @@
{/if}
</div>
<footer
class="border-t bg-gray-200 dark:bg-gray-800 dark:border-gray-700 border-gray-300 min-h-16 flex flex-col justify-center items-center dark:text-white"
class="flex flex-col justify-center items-center bg-gray-200 border-t border-gray-300 dark:bg-gray-800 dark:border-gray-700 min-h-16 dark:text-white"
>
<div>
DietPi-Dashboard <a
Expand Down
24 changes: 15 additions & 9 deletions src/frontend/src/pages/Terminal.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,20 +5,23 @@
import { onDestroy } from "svelte";
export let loginDialog: boolean;
export let node: string;
export let token: string;
let termDiv: HTMLDivElement;
let proto = window.location.protocol == "https:" ? "wss" : "ws";
const socket = new WebSocket(`${proto}://${node}/ws/term`);
let socket = new WebSocket(`${proto}://${node}/ws/term`);
const attachAddon = new AttachAddon(socket);
$: token,
node,
(socket.onopen = () => {}),
((socket = new WebSocket(`${proto}://${node}/ws/term`)),
(socket.onopen = socketOpen));
const fitAddon = new FitAddon();
let terminal = new Terminal();
terminal.loadAddon(attachAddon);
terminal.loadAddon(fitAddon);
const sendSize = (e: ITerminalDimensions) => {
Expand All @@ -32,20 +35,23 @@
fitAddon.fit();
};
socket.onopen = () => {
let obj = JSON.parse(localStorage.getItem("tokens"));
if (obj != null && obj[node] != null) {
socket.send(`token${obj[node]}`);
let socketOpen = () => {
if (token) {
socket.send(`token${token}`);
}
termDiv.replaceChildren();
const attachAddon = new AttachAddon(socket);
terminal.loadAddon(attachAddon);
terminal.open(termDiv);
fitAddon.fit();
sendSize({ cols: terminal.cols, rows: terminal.rows });
};
onDestroy(() => socket.close(1000));
</script>

<div bind:this={termDiv} class="h-full{loginDialog ? ' hidden' : ''}" />
<div bind:this={termDiv} class="h-full" />

<style>
@import "xterm/css/xterm.css";
Expand Down

0 comments on commit 807f954

Please sign in to comment.