adding file select

This commit is contained in:
2024-02-18 19:51:53 +01:00
parent 035d72fd56
commit ea2f60f3c2
10 changed files with 1632 additions and 46 deletions

16
src/event_handler.js Normal file
View File

@ -0,0 +1,16 @@
const { listen } = window.__TAURI__.event
document.getElementById("fileLocation").innerHTML = "hey";
// listen to the `click` event and get a function to remove the event listener
// there's also a `once` function that subscribes to an event and automatically unsubscribes the listener on the first event
const unlisten = await listen('my_event', (event) => {
// event.event is the event name (useful if you want to use a single callback fn for multiple event types)
// event.payload is the payload object
document.getElementById("fileLocation").innerHTML = "hello";
})
// emits the `click` event with the object payload
emit('click', {
theMessage: 'Tauri is awesome!',
})

View File

@ -5,17 +5,20 @@
<link rel="stylesheet" href="styles.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Rusty slicer</title>
<script src="main.js"></script>
<script type="module" src="/main.js" defer></script>
<script type="module" src="/event_handler.js" defer></script>
</head>
<!-- Made by ayabusa (www.ayabusa.dev) with pain, because making html and css is awfully painfull :) -->
<!-- UI made by ayabusa (www.ayabusa.dev) with pain,
because making html and css is awfully painfull :) -->
<body>
<div class="main-container">
<h3>Welcome to the Rusty slicer! <img src="assets/cat-vibe-vibe-cat.gif"></h1>
<div class="select-file">
<p><b> Input file </b> <br> no location choosen </p>
<button type="file-button">choose file 📂</button>
<p><b> Input file </b> <br></p>
<p id="fileLocation"> no location choosen </p>
<button id="fileButton">choose file 📂</button>
</div>
<div class="chapter-list">
@ -24,7 +27,7 @@
<div class="select-file">
<p><b> Output folder </b> <br> no location choosen </p>
<button type="file-button">choose folder 📂</button>
<button id="folderButton">choose folder 📂</button>
</div>
<div class="select-file">
@ -37,9 +40,8 @@
</select>
</div>
<button onclick="myFunction()" class="slice-button"> Slice 🔪</button>
<p id="demo">ddqdz</p>
<button class="slice-button" type="button"> Slice 🔪</button>
<footer>
<br>
made by ayabusa ;D</footer>

View File

@ -1,6 +1,17 @@
const { invoke } = window.__TAURI__.tauri;
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
invoke("slice")
invoke("debug_call", { message: 'JS init' });
function select_file_button_pressed(){
let t = invoke("select_file_button");
}
function select_folder_button_pressed(){
invoke("select_folder_button")
}
document.getElementById("folderButton").addEventListener("click", select_folder_button_pressed);
document.getElementById("fileButton").addEventListener("click", select_file_button_pressed);