Reimar/video-compressor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix selecting file with keyboard

Browse Source
This commit is contained in:
Reimar 2026-01-06 10:47:03 +01:00
parent ef6fbd3e04
commit b9389df7cb
Signed by: Reimar
GPG Key ID: 93549FA07F0AE268
3 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
build.sh
View File

@ -13,4 +13,3 @@ mkdir -p public/assets/scripts
fetch ffmpeg 0.12.15 fetch ffmpeg 0.12.15
fetch core 0.12.10 fetch core 0.12.10

5
public/assets/scripts/main.js
View File

@ -50,6 +50,11 @@ function openFileSelector() {
document.getElementById("file-drop-area").onclick = openFileSelector; document.getElementById("file-drop-area").onclick = openFileSelector;
document.getElementById("change-file").onclick = openFileSelector; document.getElementById("change-file").onclick = openFileSelector;
document.getElementById("file-drop-area").onkeydown = event => {
if (['Enter', 'Space'].includes(event.code))
openFileSelector();
};
document.getElementById("file-input").oninput = () => { document.getElementById("file-input").oninput = () => {
setTimeout(() => { setTimeout(() => {
const file = document.getElementById("file-input").files[0]; const file = document.getElementById("file-input").files[0];

4
public/index.html
View File

@ -13,7 +13,7 @@
<p>Compress video files to a specific file size, so you can upload them to your favorite social media and messaging apps!</p> <p>Compress video files to a specific file size, so you can upload them to your favorite social media and messaging apps!</p>
<section id="file-picker-section"> <section id="file-picker-section">
<div id="file-drop-area" onkeydown="['Enter', 'Space'].includes(event.code) && openFileSelector()" tabindex="0"> <div id="file-drop-area" tabindex="0">
<span>Drag and drop a file here!</span> <span>Drag and drop a file here!</span>
</div> </div>
<input id="file-input" type="file" accept="video/*" tabindex="-1"> <input id="file-input" type="file" accept="video/*" tabindex="-1">
@ -31,7 +31,7 @@
<option value="mb" selected>MB</option> <option value="mb" selected>MB</option>
</select> </select>
<button id="compress" class="primary">Go!</button> <button id="compress" class="primary">Compress</button>
</section> </section>
<section id="loading-section" style="opacity: 0; display: none;"> <section id="loading-section" style="opacity: 0; display: none;">