nickcoutsos / keymap-editor

A web based graphical editor of ZMK keymaps.
http://nickcoutsos.github.io/keymap-editor
MIT License
1.27k stars 320 forks source link

feature request: Webusb dfu and github artifacts api integration #236

Open Vaisakhkm2625 opened 4 months ago

Vaisakhkm2625 commented 4 months ago

Thanks for this wonderful project

I came here to ask if it is possible to directly flash firmwire to keyboard from webeditor?

i know i can have a local set up for making the interation easier, but it's seems even more convient..

will it be possible to integrate

https://docs.github.com/en/rest/actions/artifacts?apiVersion=2022-11-28

https://devanlai.github.io/webdfu/dfu-util/

i was thinking of trying to impliment it myself, but i came to realize that repo is no longer open source :( , though i can make a poc website and share it here...

nickcoutsos commented 4 months ago

If it's possible it's beyond me. I understand it relies on WebUSB which isn't support in Firefox and therefore not something I've explored. Do you know that this supports UF2? If it's as simple as discovering/opening a USB device and feeding in the file data then that sounds doable (but a PoC would be super helpful).

ZMK has gotten started on work for ZMK Studio which will support runtime keymap updates (no compilation needed) which people have been looking forward to for some time and may be available before I can get much done here.

Vaisakhkm2625 commented 4 months ago

If it's possible it's beyond me. I understand it relies on WebUSB which isn't support in Firefox and therefore not something I've explored. Do you know that this supports UF2? If it's as simple as discovering/opening a USB device and feeding in the file data then that sounds doable (but a PoC would be super helpful).

ZMK has gotten started on work for ZMK Studio which will support runtime keymap updates (no compilation needed) which people have been looking forward to for some time and may be available before I can get much done here.

i thought we can access any device that uses dfu to and upload the firmware in webdfu, but that seems not be the case, the firmware of the device should support webusb protocol, or at-least i guess, anyway it seems extremely hard to pull off..

but i tried another way, for my nice!nano, accessing folder using file system access api and uploading downloading the file directly to nano, but it seems the downloaded files has some difference with file uploaded by dragging and dropping, not sure.. as nice!nano didn't gone out of frameware update mode even-though the files is visible there image

image so i manually tried dragging and dropping, there is clearly some difference between the files

image

Vaisakhkm2625 commented 4 months ago

sorry my bad, the file system api example i copied for trying it out was for text files. updated it to handle binary stream and it worked...

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>test</title>
</head>
<body>
  <input type="file" id="fileInput">
  <button id="saveBtn">Save to Different Folder</button>
  <script >

document.getElementById('fileInput').addEventListener('change', handleFileUpload);
document.getElementById('saveBtn').addEventListener('click', saveFileToDifferentFolder);

let fileContent;
let fileName;

async function handleFileUpload(event) {
  const file = event.target.files[0];
  if (file) {
    fileName = file.name;
    fileContent = await file.arrayBuffer();
    alert(`file "${fileName}" uploaded successfully.`);
  }
}

async function saveFileToDifferentFolder() {
  if (!fileContent) {
    alert('please upload a file first.');
    return;
  }

  try {
    const handle = await window.showDirectoryPicker();
    const fileHandle = await handle.getFileHandle(fileName, { create: true });
    const writable = await fileHandle.createWritable();
    await writable.write(new Uint8Array(fileContent));
    await writable.close();
    alert('file saved');
  } catch (error) {
    console.error('Error:', error);
  }
}

        </script>
</body>
</html>

we could store the location to localstoage, so user only have to pick location one time,

but here also the issue issues are;

(for temporally getting secure context i used http://localhost.run to a make ssh tunnel to get link with tsl )

Vaisakhkm2625 commented 4 months ago

ZMK has gotten started on work for ZMK Studio which will support runtime keymap updates (no compilation needed) which people have been looking forward to for some time and may be available before I can get much done here.

so better to wait for zmk studio :)