parent
e7b0c6b8d8
commit
90afe5725f
12 changed files with 272 additions and 89 deletions
@ -0,0 +1,12 @@ |
||||
|
||||
added 1 package, and audited 148 packages in 3s |
||||
|
||||
35 packages are looking for funding |
||||
run `npm fund` for details |
||||
|
||||
1 low severity vulnerability |
||||
|
||||
To address all issues, run: |
||||
npm audit fix |
||||
|
||||
Run `npm audit` for details. |
||||
@ -0,0 +1,98 @@ |
||||
|
||||
import { writeFile, BaseDirectory, exists, mkdir } from '@tauri-apps/plugin-fs'; |
||||
import { path } from '@tauri-apps/api'; |
||||
import { invoke } from '@tauri-apps/api/core'; |
||||
|
||||
export default function Input(){ |
||||
|
||||
async function onUploadFile(e){ |
||||
e.preventDefault(); |
||||
const fileInput = e.target.querySelector('input[type="file"]'); |
||||
if (fileInput.files.length > 0) { |
||||
|
||||
|
||||
// create folder if not exists |
||||
|
||||
const folder=await path.appDataDir(); |
||||
|
||||
if (!(await exists(folder))) { |
||||
|
||||
console.log('Creating folder:', folder); |
||||
await mkdir(folder); |
||||
} |
||||
|
||||
|
||||
const file = fileInput.files[0]; |
||||
console.log('File selected:', file); |
||||
|
||||
// save file to Tauri's BaseDirectory |
||||
const contents=await file.arrayBuffer(); |
||||
|
||||
const res=await writeFile(file.name, contents, { |
||||
baseDir: BaseDirectory.AppData, |
||||
}); |
||||
console.log('File saved:', `${folder}/${file.name}`); |
||||
|
||||
// send osc to TD |
||||
await invoke('send_osc_message', { |
||||
key: '/upload', |
||||
host:`0.0.0.0:0`, |
||||
target: '127.0.0.1:8787', |
||||
message: `${folder}/${file.name}`, |
||||
}); |
||||
|
||||
|
||||
} else { |
||||
console.log('No file selected'); |
||||
} |
||||
fileInput.value = ''; // Clear the input after upload |
||||
} |
||||
|
||||
function onSendNumber(e){ |
||||
e.preventDefault(); |
||||
const input = e.target.elements.input; |
||||
const number = input.value.trim(); |
||||
|
||||
if (number) { |
||||
console.log('Number sent:', number); |
||||
// Here you can handle the number submission logic |
||||
input.value = ''; // Clear the input after submission |
||||
} else { |
||||
console.log('No number entered'); |
||||
} |
||||
|
||||
} |
||||
|
||||
return ( |
||||
|
||||
<div className="flex flex-col items-stretch p-2 gap-4"> |
||||
<form className="flex flex-row justify-start *:border-4 gap-4" onSubmit={onUploadFile}> |
||||
<label className="border-none">File</label> |
||||
<input type="file" accept="image/*" className="self-end" /> |
||||
<button type="submit" className="uppercase">Send</button> |
||||
</form> |
||||
<div className='flex flex-row gap-2'> |
||||
<label>control_strength</label> |
||||
<input type="range" className="" min="0" max="100" step="1" defaultValue="0" |
||||
onChange={(e) => { |
||||
const value = e.target.value; |
||||
console.log('Range value changed:', value); |
||||
|
||||
invoke('send_osc_message', { |
||||
key:'/control_strength', |
||||
message: (value/100.0).toString(), |
||||
host:`0.0.0.0:0`, |
||||
target: '127.0.0.1:8787', |
||||
}); |
||||
}} |
||||
/> |
||||
</div> |
||||
{/* <form className="flex flex-row justify-start *:border-4 gap-4" onSubmit={onSendNumber} autoComplete="off"> |
||||
<span className="border-none">Number</span> |
||||
<input id="input" name="input" required className="self-stretch" autoComplete="off" type="number"/> |
||||
<button type="submit" className="uppercase">Send</button> |
||||
</form> */} |
||||
|
||||
</div> |
||||
) |
||||
} |
||||
Loading…
Reference in new issue