hippoz/waffle
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

improve config entry names and fix selected channel persistance

Browse source
This commit is contained in:
hippoz 2022-08-04 02:00:55 +03:00
parent 8d45594d03
commit ad8e6315ed
Signed by: hippoz
GPG key ID: 7C52899193467641
6 changed files with 24 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
frontend/public/global.css
View file

@ -11,8 +11,8 @@
:root { :root {
--background-color-0: hsl(180, 11%, 6%); --background-color-0: hsl(180, 11%, 6%);
--background-color-1: hsl(180, 11%, 7%); --background-color-1: hsl(180, 11%, 7%);
--background-color-2: hsl(180, 11%, 11%); --background-color-2: hsl(180, 11%, 10%);
--background-color-3: hsl(180, 11%, 15%); --background-color-3: hsl(180, 11%, 13%);
--foreground-color-1: rgb(253, 254, 255); --foreground-color-1: rgb(253, 254, 255);
--foreground-color-2: rgb(218, 219, 220); --foreground-color-2: rgb(218, 219, 220);
--foreground-color-3: rgb(153, 154, 155); --foreground-color-3: rgb(153, 154, 155);
@ -98,6 +98,10 @@ body {
flex-shrink: 0; flex-shrink: 0;
} }
.top-bar.darker {
background-color: var(--background-color-0);
}
.top-bar-heading { .top-bar-heading {
margin-left: var(--space-xxs); margin-left: var(--space-xxs);
} }

4
frontend/src/animations.js
View file

@ -2,11 +2,11 @@ import { fade, fly } from "svelte/transition";
import { getItem } from "./storage"; import { getItem } from "./storage";
export function maybeFly(...e) { export function maybeFly(...e) {
if (getItem("app:behavior:doAnimations")) if (getItem("ui:doAnimations"))
return fly(...e); return fly(...e);
} }
export function maybeFade(...e) { export function maybeFade(...e) {
if (getItem("app:behavior:doAnimations")) if (getItem("ui:doAnimations"))
return fade(...e); return fade(...e);
} }

2
frontend/src/components/Main.svelte
View file

@ -45,7 +45,7 @@
<OverlayProvider /> <OverlayProvider />
{#if !$gatewayStatus.ready} {#if !$gatewayStatus.ready}
<div class="top-bar"> <div class="top-bar darker">
<CloudIcon /> <CloudIcon />
<span class="h5 top-bar-heading">connecting...</span> <span class="h5 top-bar-heading">connecting...</span>
</div> </div>

2
frontend/src/logging.js
View file

@ -2,7 +2,7 @@ import { getItem } from "./storage";
export default function logger(sink) { export default function logger(sink) {
return (...args) => { return (...args) => {
if (getItem(`loggingSink:${sink}`)) { if (getItem(`log:${sink}`)) {
console.log( console.log(
`%c[${sink}]`, `%c[${sink}]`,
"color: #8f3f71; font-weight: bold;", "color: #8f3f71; font-weight: bold;",

11
frontend/src/storage.js
View file

@ -2,11 +2,12 @@ const defaults = {
"server:apiBase": `${window.location.origin}/api/v1`, "server:apiBase": `${window.location.origin}/api/v1`,
"server:gatewayBase": `${location.protocol === "https:" ? "wss" : "ws"}://${location.host}/gateway`, "server:gatewayBase": `${location.protocol === "https:" ? "wss" : "ws"}://${location.host}/gateway`,
"auth:token": "", "auth:token": "",
"app:behavior:doAnimations": true, "ui:doAnimations": true,
"app:cache:openChannelId": -1, "ui:theme": "dark",
"app:visual:theme": "dark", "state:openChannelId": -1,
"loggingSink:Gateway": false, "log:Gateway": false,
"loggingSink:Store": false "log:Store": false,
"ui:stateful:presistSelectedChannel": true
}; };
const store = new Map(Object.entries(defaults)); const store = new Map(Object.entries(defaults));
const persistentProvider = localStorage; const persistentProvider = localStorage;

15
frontend/src/stores.js
View file

@ -59,6 +59,9 @@ class ChannelsStore extends Store {
gateway.subscribe(GatewayEventType.Ready, ({ channels }) => { gateway.subscribe(GatewayEventType.Ready, ({ channels }) => {
this.value = channels; this.value = channels;
if (getItem("ui:stateful:presistSelectedChannel")) {
selectedChannel.set({ id: getItem("state:openChannelId"), name: "none", creator_id: -1 });
}
if (channels.length >= 1) { if (channels.length >= 1) {
if (!selectedChannel.value || selectedChannel.value.id === -1) { if (!selectedChannel.value || selectedChannel.value.id === -1) {
selectedChannel.set(channels[0]); selectedChannel.set(channels[0]);
@ -327,8 +330,8 @@ export const selectedChannel = new Store({ id: -1, name: "none", creator_id: -1
export const showSidebar = new Store(true, "showSidebar"); export const showSidebar = new Store(true, "showSidebar");
export const smallViewport = new Store(false, "smallViewport"); export const smallViewport = new Store(false, "smallViewport");
export const showChannelView = new Store(true, "showChannelView"); export const showChannelView = new Store(true, "showChannelView");
export const theme = new StorageItemStore("app:visual:theme"); export const theme = new StorageItemStore("ui:theme");
export const doAnimations = new StorageItemStore("app:behavior:doAnimations"); export const doAnimations = new StorageItemStore("ui:doAnimations");
export const channels = new ChannelsStore(); export const channels = new ChannelsStore();
export const gatewayStatus = new GatewayStatusStore(); export const gatewayStatus = new GatewayStatusStore();
export const messagesStoreProvider = new MessagesStoreProvider(); export const messagesStoreProvider = new MessagesStoreProvider();
@ -350,9 +353,7 @@ export const allStores = {
}; };
selectedChannel.watch((newSelectedChannel) => { selectedChannel.watch((newSelectedChannel) => {
setItem("app:cache:openChannelId", newSelectedChannel.id); if (getItem("ui:stateful:presistSelectedChannel")) {
}); setItem("state:openChannelId", newSelectedChannel.id);
}
gateway.subscribe(GatewayEventType.Authenticate, () => {
selectedChannel.set("app:cache:openChannelId");
}); });