import { createRepo, commit, whoAmI } from "@huggingface/hub"; const c = console; const FILES_TO_UPLOAD = [ `${window.location.origin}/mobilenet/model.json`, `${window.location.origin}/mobilenet/group1-shard1of2`, `${window.location.origin}/mobilenet/group1-shard2of2`, `${window.location.origin}/mobilenet/coffee.jpg`, `${window.location.origin}/mobilenet/README.md`, ]; function filenameFromURL(url) { return url.substring(url.lastIndexOf("/") + 1); } window.document.addEventListener("DOMContentLoaded", () => { const tokenEl = document.querySelector("#token"); const repoNameEl = document.querySelector("#repo_name"); const button = document.querySelector("#submit"); const output = document.querySelector("#logs"); const form = document.getElementsByTagName("form")[0]; const storedToken = window.localStorage.getItem("hf_token"); if (storedToken) { tokenEl.value = storedToken; /// ^to help in dev. } repoNameEl.value = `tfjs-mobilenet-${Date.now() % 1_000}`; /// "random" repo name form.addEventListener("submit", async (event) => { event.preventDefault(); const token = tokenEl.value; const repoName = repoNameEl.value; if (!token || !repoName) { alert("You need a token and a repo name"); return; } button.setAttribute("disabled", "disabled"); const credentials = { accessToken: token, }; try { const { name: username } = await whoAmI({ credentials }); const name = `${username}/${repoName}`; const { repoUrl } = await createRepo({ repo: { type: "model", name, }, credentials, }); const operations = await Promise.all(FILES_TO_UPLOAD.map(async (file) => { return { operation: "addOrUpdate", path: filenameFromURL(file), // upload remote file content: new URL(file), }; })); const commitOutput = await commit({ repo: { type: "model", name, }, credentials, title: "upload model", operations, }); c.log(commitOutput); button.insertAdjacentHTML("afterend", `
🎉 Upload complete! Model page is ${repoUrl}
`); } catch (err) { console.error(err); output.append("\n" + err); } button.removeAttribute("disabled"); }); });