mirror of
https://github.com/TxtDot/vigi.git
synced 2024-12-03 16:26:21 +03:00
fix: tabs removing, state management, commands, loading animation
This commit is contained in:
parent
a23bead7d8
commit
1488604772
8 changed files with 112 additions and 82 deletions
|
@ -10,13 +10,28 @@ use tauri::async_runtime::Mutex;
|
|||
use types::{VigiError, VigiJsState, VigiState};
|
||||
use utils::{read_or_create_jsonl, read_or_create_number};
|
||||
|
||||
// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
|
||||
#[tauri::command]
|
||||
async fn update_input(
|
||||
input: String,
|
||||
state: tauri::State<'_, Mutex<VigiState>>,
|
||||
) -> Result<(), VigiError> {
|
||||
state.lock().await.update_input(input).await
|
||||
state.lock().await.update_input(input);
|
||||
|
||||
Ok(())
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
async fn load_input(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
|
||||
state.lock().await.load_input().await?;
|
||||
|
||||
Ok(())
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
async fn load_input_force(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
|
||||
state.lock().await.load_input_force().await?;
|
||||
|
||||
Ok(())
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
|
@ -29,17 +44,12 @@ async fn select_tab(
|
|||
index: usize,
|
||||
state: tauri::State<'_, Mutex<VigiState>>,
|
||||
) -> Result<(), VigiError> {
|
||||
state.lock().await.select_tab(index).await
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
async fn load_tab(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
|
||||
state.lock().await.load_tab().await
|
||||
state.lock().await.select_tab(index)
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
async fn add_tab(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
|
||||
state.lock().await.add_tab()
|
||||
state.lock().await.add_tab().await
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
|
@ -57,10 +67,11 @@ fn main() {
|
|||
update_input,
|
||||
get_js_state,
|
||||
select_tab,
|
||||
load_tab,
|
||||
add_tab,
|
||||
remove_tab,
|
||||
setup
|
||||
setup,
|
||||
load_input,
|
||||
load_input_force
|
||||
])
|
||||
.run(tauri::generate_context!())
|
||||
.expect("error while running tauri application");
|
||||
|
@ -120,7 +131,7 @@ async fn setup(
|
|||
state.current_tab_index_path = local_data_dir.join("current_tab_index");
|
||||
state.current_tab_index = read_or_create_number(&state.current_tab_index_path);
|
||||
|
||||
state.update_top_bar_input();
|
||||
state.update_top_bar_input()?;
|
||||
|
||||
println!("---Setup done---");
|
||||
|
||||
|
|
|
@ -12,6 +12,7 @@ pub enum VigiError {
|
|||
StateUpdate,
|
||||
Filesystem,
|
||||
Config,
|
||||
GetTab,
|
||||
}
|
||||
|
||||
#[derive(Serialize, Debug, Clone)]
|
||||
|
@ -77,24 +78,33 @@ impl VigiState {
|
|||
}
|
||||
}
|
||||
|
||||
pub async fn select_tab(&mut self, new_index: usize) -> Result<(), VigiError> {
|
||||
self.current_tab_index = new_index;
|
||||
self.write_current_tab_index()?;
|
||||
|
||||
self.update_top_bar_input();
|
||||
pub fn select_tab(&mut self, new_index: usize) -> Result<(), VigiError> {
|
||||
self.update_current_tab_index(new_index)?;
|
||||
self.update_top_bar_input()?;
|
||||
Ok(())
|
||||
}
|
||||
|
||||
pub fn update_top_bar_input(&mut self) {
|
||||
self.top_bar_input = self.tabs[self.current_tab_index].url.clone();
|
||||
}
|
||||
fn update_current_tab_index(&mut self, new_index: usize) -> Result<(), VigiError> {
|
||||
self.current_tab_index = new_index;
|
||||
|
||||
fn write_current_tab_index(&mut self) -> Result<(), VigiError> {
|
||||
fs::write(
|
||||
&self.current_tab_index_path,
|
||||
self.current_tab_index.to_string(),
|
||||
)
|
||||
.map_err(|_| VigiError::StateUpdate)
|
||||
.map_err(|_| VigiError::StateUpdate)?;
|
||||
|
||||
Ok(())
|
||||
}
|
||||
|
||||
pub fn update_top_bar_input(&mut self) -> Result<(), VigiError> {
|
||||
self.top_bar_input = self
|
||||
.tabs
|
||||
.get(self.current_tab_index)
|
||||
.ok_or(VigiError::StateUpdate)?
|
||||
.url
|
||||
.clone();
|
||||
|
||||
Ok(())
|
||||
}
|
||||
|
||||
fn write_id_counter(&mut self) -> Result<(), VigiError> {
|
||||
|
@ -155,12 +165,15 @@ impl VigiState {
|
|||
Ok(())
|
||||
}
|
||||
|
||||
pub async fn update_input(&mut self, input: String) -> Result<(), VigiError> {
|
||||
pub fn update_input(&mut self, input: String) {
|
||||
self.top_bar_input = input;
|
||||
}
|
||||
|
||||
pub async fn load_input_force(&mut self) -> Result<(), VigiError> {
|
||||
self.process_input(true).await
|
||||
}
|
||||
|
||||
pub async fn load_tab(&mut self) -> Result<(), VigiError> {
|
||||
pub async fn load_input(&mut self) -> Result<(), VigiError> {
|
||||
self.process_input(false).await
|
||||
}
|
||||
|
||||
|
@ -177,7 +190,7 @@ impl VigiState {
|
|||
}
|
||||
}
|
||||
|
||||
pub fn add_tab(&mut self) -> Result<(), VigiError> {
|
||||
pub async fn add_tab(&mut self) -> Result<(), VigiError> {
|
||||
self.tabs_id_counter += 1;
|
||||
self.tabs.push(Tab::new(
|
||||
"Home".to_string(),
|
||||
|
@ -188,23 +201,22 @@ impl VigiState {
|
|||
self.write_id_counter()?;
|
||||
write_tabs(&self.local_tabs_path, &self.tabs)?;
|
||||
|
||||
self.current_tab_index = self.tabs.len() - 1;
|
||||
self.write_current_tab_index()?;
|
||||
|
||||
self.update_top_bar_input();
|
||||
self.select_tab(self.tabs.len() - 1)?;
|
||||
self.load_input().await?;
|
||||
|
||||
Ok(())
|
||||
}
|
||||
|
||||
pub fn remove_tab(&mut self, index: usize) -> Result<(), VigiError> {
|
||||
if self.tabs.len() - 1 == index && self.current_tab_index == index {
|
||||
if self.current_tab_index >= index {
|
||||
if self.current_tab_index > 0 {
|
||||
self.current_tab_index -= 1;
|
||||
|
||||
self.write_current_tab_index()?;
|
||||
self.select_tab(self.current_tab_index - 1)?;
|
||||
}
|
||||
}
|
||||
|
||||
self.cached_inputs
|
||||
.remove(&self.tabs.get(index).ok_or(VigiError::GetTab)?.url);
|
||||
|
||||
self.tabs.remove(index);
|
||||
write_tabs(&self.local_tabs_path, &self.tabs)?;
|
||||
|
||||
|
|
|
@ -10,8 +10,10 @@
|
|||
--min-bg: #96e28a;
|
||||
--max-bg: #193815;
|
||||
|
||||
--max-text: #bef5b5;
|
||||
--min-text: #fff;
|
||||
--min-text: #bef5b5;
|
||||
--max-text: #fff;
|
||||
|
||||
--colorspace: oklch;
|
||||
|
||||
/* Dark */
|
||||
/* --min: #818181;
|
||||
|
|
|
@ -39,7 +39,7 @@
|
|||
{/if}
|
||||
|
||||
<button
|
||||
class="tab"
|
||||
class={`tab${loading && active ? " animate-pulse" : ""}`}
|
||||
class:active
|
||||
transition:slide={{ duration: 100 }}
|
||||
bind:this={tabElement}
|
||||
|
@ -49,11 +49,11 @@
|
|||
}
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<!-- <div class="static right-0">
|
||||
{#if loading && active}
|
||||
<GooLoad />
|
||||
{/if}
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div>
|
||||
{tab.title}
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
import SidebarLeft from "$lib/icons/SidebarLeft.svelte";
|
||||
import SidebarRight from "$lib/icons/SidebarRight.svelte";
|
||||
import { state } from "$lib/stores";
|
||||
import { updateInput } from "$lib/utils";
|
||||
import { updateAndLoadInput } from "$lib/utils";
|
||||
import Block from "./Block.svelte";
|
||||
import Button from "./Button.svelte";
|
||||
|
||||
|
@ -36,7 +36,7 @@
|
|||
</Button>
|
||||
<Button onClick={onBack}><ArrowLeft /></Button>
|
||||
<Button onClick={onForward}><ArrowRight /></Button>
|
||||
<Button onClick={() => updateInput(input)}><Reload /></Button>
|
||||
<Button onClick={() => updateAndLoadInput(input)}><Reload /></Button>
|
||||
</Block>
|
||||
|
||||
<input
|
||||
|
@ -47,7 +47,7 @@
|
|||
bind:this={iEl}
|
||||
on:keypress={(e) => {
|
||||
if (e.key === "Enter") {
|
||||
updateInput(currentInput);
|
||||
updateAndLoadInput(currentInput);
|
||||
iEl.blur();
|
||||
}
|
||||
}}
|
||||
|
|
|
@ -11,11 +11,14 @@ export async function updateVigiState() {
|
|||
}
|
||||
}
|
||||
|
||||
export async function updateInput(input: string) {
|
||||
export async function updateAndLoadInput(input: string) {
|
||||
await invoke("update_input", { input });
|
||||
await updateVigiState();
|
||||
|
||||
isLoading.set(true);
|
||||
|
||||
try {
|
||||
await invoke("update_input", { input });
|
||||
await invoke("load_input_force");
|
||||
await updateVigiState();
|
||||
} catch (e) {
|
||||
writeError(e, input);
|
||||
|
@ -27,26 +30,25 @@ export async function updateInput(input: string) {
|
|||
export async function addTab() {
|
||||
await invoke("add_tab");
|
||||
await updateVigiState();
|
||||
await loadTab();
|
||||
}
|
||||
|
||||
export async function selectTab(index: number) {
|
||||
await invoke("select_tab", { index });
|
||||
await updateVigiState();
|
||||
await loadTab();
|
||||
await loadInput();
|
||||
}
|
||||
|
||||
export async function removeTab(index: number) {
|
||||
await invoke("remove_tab", { index });
|
||||
await updateVigiState();
|
||||
await loadTab();
|
||||
setTimeout(loadInput, 150);
|
||||
}
|
||||
|
||||
export async function loadTab() {
|
||||
export async function loadInput() {
|
||||
isLoading.set(true);
|
||||
|
||||
try {
|
||||
await invoke("load_tab");
|
||||
await invoke("load_input");
|
||||
await updateVigiState();
|
||||
} catch (e) {
|
||||
writeError(e);
|
||||
|
|
|
@ -1,44 +1,44 @@
|
|||
<script lang="ts">
|
||||
import "../app.css";
|
||||
import "../app.css";
|
||||
|
||||
import TopBar from "$lib/components/TopBar.svelte";
|
||||
import Sidebar from "$lib/components/Sidebar.svelte";
|
||||
import BrowserWindow from "$lib/components/BrowserWindow.svelte";
|
||||
import TopBar from "$lib/components/TopBar.svelte";
|
||||
import Sidebar from "$lib/components/Sidebar.svelte";
|
||||
import BrowserWindow from "$lib/components/BrowserWindow.svelte";
|
||||
|
||||
import { invoke } from "@tauri-apps/api/tauri";
|
||||
import { loadTab, updateVigiState } from "$lib/utils";
|
||||
import { isLoading } from "$lib/stores";
|
||||
import { invoke } from "@tauri-apps/api/tauri";
|
||||
import { loadInput, updateVigiState } from "$lib/utils";
|
||||
import { isLoading } from "$lib/stores";
|
||||
|
||||
let sidebarOpen = true;
|
||||
let sidebarOpen = true;
|
||||
|
||||
(async () => {
|
||||
isLoading.set(true);
|
||||
await invoke("setup");
|
||||
await updateVigiState();
|
||||
await loadTab();
|
||||
isLoading.set(false);
|
||||
})();
|
||||
(async () => {
|
||||
isLoading.set(true);
|
||||
await invoke("setup");
|
||||
await updateVigiState();
|
||||
await loadInput();
|
||||
isLoading.set(false);
|
||||
})();
|
||||
|
||||
document.addEventListener("keypress", (e: KeyboardEvent) => {
|
||||
if (
|
||||
["INPUT", "TEXTAREA", "SELECT", "OPTION"].includes(
|
||||
(e.target as Element).tagName
|
||||
)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
if (e.code === "KeyQ") sidebarOpen = !sidebarOpen;
|
||||
});
|
||||
document.addEventListener("keypress", (e: KeyboardEvent) => {
|
||||
if (
|
||||
["INPUT", "TEXTAREA", "SELECT", "OPTION"].includes(
|
||||
(e.target as Element).tagName,
|
||||
)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
if (e.code === "KeyQ") sidebarOpen = !sidebarOpen;
|
||||
});
|
||||
</script>
|
||||
|
||||
<div
|
||||
class={`common-window${sidebarOpen ? "" : " collapsed"}`}
|
||||
data-tauri-drag-region
|
||||
class={`common-window${sidebarOpen ? "" : " collapsed"}`}
|
||||
data-tauri-drag-region
|
||||
>
|
||||
<Sidebar bind:collapsed={sidebarOpen} />
|
||||
<Sidebar bind:collapsed={sidebarOpen} />
|
||||
|
||||
<div class="main-window">
|
||||
<TopBar bind:sidebarOpen />
|
||||
<BrowserWindow />
|
||||
</div>
|
||||
<div class="main-window">
|
||||
<TopBar bind:sidebarOpen />
|
||||
<BrowserWindow />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -3,10 +3,10 @@ let textColors = {};
|
|||
|
||||
for (let i = 0; i <= 100; i += 5) {
|
||||
bgColors[`vigi-${i}`] =
|
||||
`color-mix(in oklch, var(--max-bg) ${i}%, var(--min-bg))`;
|
||||
`color-mix(in var(--colorspace), var(--max-bg) ${i}%, var(--min-bg))`;
|
||||
|
||||
textColors[`vigi-${i}`] =
|
||||
`color-mix(in oklch, var(--max-text) ${i}%, var(--min-text))`;
|
||||
`color-mix(in var(--colorspace), var(--min-text) ${i}%, var(--max-text))`;
|
||||
}
|
||||
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
|
@ -16,6 +16,9 @@ export default {
|
|||
extend: {
|
||||
colors: bgColors,
|
||||
textColor: textColors,
|
||||
animation: {
|
||||
pulse: "pulse 0.7s linear infinite",
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
|
|
Loading…
Add table
Reference in a new issue