rudimentary test with tauri and rust retrieval
This commit is contained in:
parent
d0b9381437
commit
d6e3f840b4
34
index.html
34
index.html
|
@ -4,7 +4,7 @@
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="stylesheet" href="/src/styles.css" />
|
<link rel="stylesheet" href="/src/styles.css" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Tauri App</title>
|
<title>Snotes Deck</title>
|
||||||
<script type="module" src="/src/main.ts" defer></script>
|
<script type="module" src="/src/main.ts" defer></script>
|
||||||
<style>
|
<style>
|
||||||
.logo.vite:hover {
|
.logo.vite:hover {
|
||||||
|
@ -19,38 +19,18 @@
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h1>Welcome to Tauri!</h1>
|
<h1>Snotes Deck Test</h1>
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<a href="https://vitejs.dev" target="_blank">
|
|
||||||
<img src="/src/assets/vite.svg" class="logo vite" alt="Vite logo" />
|
|
||||||
</a>
|
|
||||||
<a href="https://tauri.app" target="_blank">
|
|
||||||
<img
|
|
||||||
src="/src/assets/tauri.svg"
|
|
||||||
class="logo tauri"
|
|
||||||
alt="Tauri logo"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a href="https://www.typescriptlang.org/docs" target="_blank">
|
|
||||||
<img
|
|
||||||
src="/src/assets/typescript.svg"
|
|
||||||
class="logo typescript"
|
|
||||||
alt="typescript logo"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p>Click on the Tauri logo to learn more about the framework</p>
|
<form class="row" id="create-form">
|
||||||
|
<input id="create-input" placeholder="Note..." />
|
||||||
<form class="row" id="greet-form">
|
<input id="create-tag" placeholder="Tag..." />
|
||||||
<input id="greet-input" placeholder="Type your note here..." />
|
|
||||||
<button type="submit">Save</button>
|
<button type="submit">Save</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<p id="greet-msg"></p>
|
<p id="create-msg"></p>
|
||||||
|
|
||||||
<button id="show-notes-button">Show Notes</button>
|
<button class="row" id="show-notes-button">Refresh Notes</button>
|
||||||
<p style="white-space: pre-line" id="notes-list"></p>
|
<p style="white-space: pre-line" id="notes-list"></p>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
[package]
|
[package]
|
||||||
name = "snotes-deck"
|
name = "snotes-deck"
|
||||||
version = "0.0.0"
|
version = "0.0.0"
|
||||||
description = "A Tauri App"
|
description = "A simple little Note App"
|
||||||
authors = ["you"]
|
authors = ["you"]
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
|
|
|
@ -15,9 +15,17 @@ fn get_notes_list() -> String {
|
||||||
format!("{}", notes)
|
format!("{}", notes)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[tauri::command]
|
||||||
|
fn create_note(content: &str, tag: &str) -> bool {
|
||||||
|
println!("reached");
|
||||||
|
libsnotes::create_note(&content.to_string(), &tag.to_string()).unwrap();
|
||||||
|
|
||||||
|
true
|
||||||
|
}
|
||||||
|
|
||||||
fn main() {
|
fn main() {
|
||||||
tauri::Builder::default()
|
tauri::Builder::default()
|
||||||
.invoke_handler(tauri::generate_handler![greet, get_notes_list])
|
.invoke_handler(tauri::generate_handler![greet, get_notes_list, create_note])
|
||||||
.run(tauri::generate_context!())
|
.run(tauri::generate_context!())
|
||||||
.expect("error while running tauri application");
|
.expect("error while running tauri application");
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
},
|
},
|
||||||
"package": {
|
"package": {
|
||||||
"productName": "snotes-deck",
|
"productName": "snotes-deck",
|
||||||
"version": "0.0.0"
|
"version": "0.0.1"
|
||||||
},
|
},
|
||||||
"tauri": {
|
"tauri": {
|
||||||
"allowlist": {
|
"allowlist": {
|
||||||
|
@ -20,7 +20,7 @@
|
||||||
},
|
},
|
||||||
"windows": [
|
"windows": [
|
||||||
{
|
{
|
||||||
"title": "snotes-deck",
|
"title": "Snotes Deck",
|
||||||
"width": 800,
|
"width": 800,
|
||||||
"height": 600
|
"height": 600
|
||||||
}
|
}
|
||||||
|
@ -31,7 +31,7 @@
|
||||||
"bundle": {
|
"bundle": {
|
||||||
"active": true,
|
"active": true,
|
||||||
"targets": "all",
|
"targets": "all",
|
||||||
"identifier": "com.tauri.dev",
|
"identifier": "space.maidsin.snotes-deck",
|
||||||
"icon": [
|
"icon": [
|
||||||
"icons/32x32.png",
|
"icons/32x32.png",
|
||||||
"icons/128x128.png",
|
"icons/128x128.png",
|
||||||
|
|
56
src/main.ts
56
src/main.ts
|
@ -1,32 +1,66 @@
|
||||||
import { invoke } from "@tauri-apps/api/tauri";
|
import { invoke } from "@tauri-apps/api/tauri";
|
||||||
|
//import { Note } from "./model";
|
||||||
|
|
||||||
let greetInputEl: HTMLInputElement | null;
|
|
||||||
let greetMsgEl: HTMLElement | null;
|
|
||||||
|
|
||||||
let notesMsgEl: HTMLElement | null;
|
let notesMsgEl: HTMLElement | null;
|
||||||
|
//let createMsgEl: HTMLElement | null;
|
||||||
|
|
||||||
async function greet() {
|
let createNoteContentEl: HTMLInputElement | null;
|
||||||
if (greetMsgEl && greetInputEl) {
|
let createNoteTagEl: HTMLInputElement | null;
|
||||||
// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
|
|
||||||
greetMsgEl.textContent = await invoke("greet", {
|
// create
|
||||||
name: greetInputEl.value,
|
async function createNote() {
|
||||||
|
console.log("reached ssssjs")
|
||||||
|
if (createNoteContentEl && createNoteTagEl) {
|
||||||
|
console.log("reached js")
|
||||||
|
await invoke("create_note", {
|
||||||
|
content: createNoteContentEl.value,
|
||||||
|
tag: createNoteTagEl.value
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// read
|
||||||
async function showNotes() {
|
async function showNotes() {
|
||||||
if (notesMsgEl) {
|
if (notesMsgEl) {
|
||||||
notesMsgEl.textContent = await invoke("get_notes_list");
|
notesMsgEl.textContent = await invoke("get_notes_list");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// TODO: read better array of note elements with id iterable the whole thing
|
||||||
|
|
||||||
|
// update
|
||||||
|
// async function updateNote() {
|
||||||
|
// if (true) {
|
||||||
|
// await invoke("update_note", {
|
||||||
|
// id: null,
|
||||||
|
// content: null,
|
||||||
|
// tag: null
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// delete
|
||||||
|
// async function deleteNote() {
|
||||||
|
// if (true) {
|
||||||
|
// await invoke("delete_note", {
|
||||||
|
// id: null
|
||||||
|
// }
|
||||||
|
// )
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
window.addEventListener("DOMContentLoaded", () => {
|
window.addEventListener("DOMContentLoaded", () => {
|
||||||
greetInputEl = document.querySelector("#greet-input");
|
createNoteContentEl = document.querySelector("#create-input");
|
||||||
greetMsgEl = document.querySelector("#greet-msg");
|
createNoteTagEl = document.querySelector("#create-tag");
|
||||||
|
// createMsgEl = document.querySelector("#create-msg");
|
||||||
notesMsgEl = document.querySelector("#notes-list");
|
notesMsgEl = document.querySelector("#notes-list");
|
||||||
document.querySelector("#greet-form")?.addEventListener("submit", (e) => {
|
showNotes();
|
||||||
|
document.querySelector("#create-form")?.addEventListener("submit", (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
greet();
|
createNote();
|
||||||
|
showNotes();
|
||||||
});
|
});
|
||||||
document.querySelector("#show-notes-button")?.addEventListener("click", (e) => {
|
document.querySelector("#show-notes-button")?.addEventListener("click", (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
|
@ -0,0 +1,6 @@
|
||||||
|
export type Note = {
|
||||||
|
id: Number,
|
||||||
|
content: String,
|
||||||
|
date: String,
|
||||||
|
tag: String;
|
||||||
|
};
|
|
@ -84,6 +84,11 @@ button {
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#show-notes-button {
|
||||||
|
max-width: 30%;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
#greet-input {
|
#greet-input {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue