My changes

.gitattributes

@@ -0,0 +1,35 @@
+*.7z filter=lfs diff=lfs merge=lfs -text
+*.arrow filter=lfs diff=lfs merge=lfs -text
+*.bin filter=lfs diff=lfs merge=lfs -text
+*.bz2 filter=lfs diff=lfs merge=lfs -text
+*.ckpt filter=lfs diff=lfs merge=lfs -text
+*.ftz filter=lfs diff=lfs merge=lfs -text
+*.gz filter=lfs diff=lfs merge=lfs -text
+*.h5 filter=lfs diff=lfs merge=lfs -text
+*.joblib filter=lfs diff=lfs merge=lfs -text
+*.lfs.* filter=lfs diff=lfs merge=lfs -text
+*.mlmodel filter=lfs diff=lfs merge=lfs -text
+*.model filter=lfs diff=lfs merge=lfs -text
+*.msgpack filter=lfs diff=lfs merge=lfs -text
+*.npy filter=lfs diff=lfs merge=lfs -text
+*.npz filter=lfs diff=lfs merge=lfs -text
+*.onnx filter=lfs diff=lfs merge=lfs -text
+*.ot filter=lfs diff=lfs merge=lfs -text
+*.parquet filter=lfs diff=lfs merge=lfs -text
+*.pb filter=lfs diff=lfs merge=lfs -text
+*.pickle filter=lfs diff=lfs merge=lfs -text
+*.pkl filter=lfs diff=lfs merge=lfs -text
+*.pt filter=lfs diff=lfs merge=lfs -text
+*.pth filter=lfs diff=lfs merge=lfs -text
+*.rar filter=lfs diff=lfs merge=lfs -text
+*.safetensors filter=lfs diff=lfs merge=lfs -text
+saved_model/**/* filter=lfs diff=lfs merge=lfs -text
+*.tar.* filter=lfs diff=lfs merge=lfs -text
+*.tar filter=lfs diff=lfs merge=lfs -text
+*.tflite filter=lfs diff=lfs merge=lfs -text
+*.tgz filter=lfs diff=lfs merge=lfs -text
+*.wasm filter=lfs diff=lfs merge=lfs -text
+*.xz filter=lfs diff=lfs merge=lfs -text
+*.zip filter=lfs diff=lfs merge=lfs -text
+*.zst filter=lfs diff=lfs merge=lfs -text
+*tfevents* filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -0,0 +1,3 @@
+.Renviron
+*.sqlite
+build.log

Dockerfile

@@ -0,0 +1,73 @@
+ARG GITHUB_PAT
+
+FROM rocker/r2u:22.04
+
+ENV RUSTUP_HOME=/usr/local/rustup \
+    CARGO_HOME=/usr/local/cargo \
+    PATH=/usr/local/cargo/bin:$PATH
+
+# Install system packages
+RUN set -eux; \
+        apt-get update; \
+        apt-get install -y --no-install-recommends \
+                git \
+                sudo \
+                sqlite3 \
+                make \
+                libcurl4-openssl-dev \
+                libssl-dev \
+                libxml2-dev \
+                zlib1g-dev \
+                libfontconfig1-dev \
+                libfreetype6-dev \
+                libpng-dev \
+                libtiff5-dev \
+                libjpeg-dev \
+                libharfbuzz-dev \
+                libfribidi-dev \
+                libpq-dev \
+                libgit2-dev \
+                gdal-bin libgdal-dev \
+                libudunits2-dev \
+                pandoc \
+                ca-certificates \
+                gcc \
+                libc6-dev \
+                wget \
+                && sed -i.bkp -e 's/%sudo\s\+ALL=(ALL\(:ALL\)\?)\s\+ALL/%sudo ALL=NOPASSWD:ALL/g' /etc/sudoers \
+                && sed -i -e '/^suppressMessages(bspm::enable())$/i options(bspm.sudo=TRUE)' /etc/R/Rprofile.site \
+                ; \
+        \
+        url="https://static.rust-lang.org/rustup/dist/x86_64-unknown-linux-gnu/rustup-init"; \
+        wget "$url"; \
+        chmod +x rustup-init; \
+        ./rustup-init -y --no-modify-path --default-toolchain beta --default-host x86_64-unknown-linux-gnu; \
+        rm rustup-init; \
+        chmod -R a+w $RUSTUP_HOME $CARGO_HOME; \
+        rustup --version; \
+        cargo --version; \
+        rustc --version; \
+        \
+        apt-get remove -y --auto-remove \
+            wget \
+            ; \
+        rm -rf /var/lib/apt/lists/*;
+        
+# Install R packages
+RUN install2.r --error -s --deps TRUE htmltools tibble dplyr purrr rlang glue this.path DBI pool RSQLite remotes promises assertthat log here zeallot dbplyr stringr tidyverse rmarkdown plotly
+RUN Rscript -e "install.packages('b64', repos = c('https://extendr.r-universe.dev', getOption('repos')))" 
+RUN Rscript -e "install.packages('uwu', repos = c('https://josiahparry.r-universe.dev', getOption('repos')))" 
+RUN --mount=type=secret,id=GITHUB_PAT GITHUB_PAT=$(cat /run/secrets/GITHUB_PAT) \
+    installGithub.r devOpifex/ambiorix devOpifex/scilis devOpifex/signaculum
+RUN --mount=type=secret,id=GITHUB_PAT GITHUB_PAT=$(cat /run/secrets/GITHUB_PAT) \
+    installGithub.r jrosell/ambhtmx
+
+# Prepare the user
+ENV HOME=/workspace \
+	PATH=/workspace/.local/bin:$PATH
+WORKDIR /workspace
+COPY . .
+
+# Entry
+EXPOSE 7860
+CMD R -e "print(nchar(Sys.getenv('GITHUB_PAT'))); source('app.R'); "

README.md

@@ -0,0 +1,68 @@
+---
+title: ambhtmx.tonejs
+emoji: 🏃
+colorFrom: pink
+colorTo: pink
+sdk: docker
+pinned: false
+---
+
+<!-- badges: start -->
+
+[![Lifecycle:
+experimental](https://img.shields.io/badge/lifecycle-experimental-orange.svg)](https://www.tidyverse.org/lifecycle/#experimental)
+
+<!-- badges: end -->
+
+**THIS IS A WORK IN PROGRESS, DO NOT USE**
+
+See the demo here: 
+
+* Direct URL to the deployed app: https://jrosell-ambhtmx-tonejs.hf.space/
+* Space URL: https://huggingface.co/spaces/jrosell/ambhtmx.tonejs
+
+Or test it locally:
+
+```
+git clone [email protected]:jrosell/ambhtmx.tonejs.git
+cd ambhtmx.tonejs
+echo GITHUB_PAT="Your token from github" >> .Renviron
+bash docker_run.sh
+```
+
+If you want, you can remove docker containers and images:
+```
+bash docker_rm.sh
+```
+
+## How to use Github and Hugging Face Spaces for my project
+
+When you pushing a repository to a Hugging Face Spaces with the option to deploy Dockerfile and include a Dockerfile, Hugging Face will start building and running your app in the Space.
+
+Customize this example, to enable Hugging Face Spaces as additional remote:
+
+```
+git init
+git add -A
+git status
+git commit -m "My changes"
+git remote add origin [email protected]:jrosell/ambhtmx.tonejs.git
+git remote add gh [email protected]:jrosell/ambhtmx.tonejs.git
+git remote add hf [email protected]:spaces/jrosell/ambhtmx.tonejs
+git remote -v
+```
+
+Then, to depoly to Hugging Face Spaces run:
+
+```
+bash deploy_hf.sh
+```
+
+## Troubleshooting
+
+Kown issues:
+
+* Only updates when refreshing the whole page. WIP should rerender on innerHTML replace.
+
+Check the [known issues](https://github.com/jrosell/ambhtmx/issues), and if you have another issue? Please, [let me know](https://github.com/jrosell/ambhtmx/issues).
+

app.R

@@ -0,0 +1,161 @@
+# remotes::install_github("jrosell/ambhtmx", force = TRUE)
+library(ambhtmx)
+
+page_title <- "ambhtmx tonejs example"
+
+head_tags <- htmltools::tagList(      
+  tags$link(href = "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css", rel = "stylesheet", integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH",  crossorigin="anonymous"),
+  tags$script(src = "https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js", integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz", crossorigin="anonymous"),
+  htmltools::HTML('<script src="https://cdn.jsdelivr.net/gh/gnat/surreal@main/surreal.js"></script><script src="https://cdn.jsdelivr.net/gh/gnat/css-scope-inline@main/script.js"></script>'),
+  htmltools::HTML('<script src="http://unpkg.com/tone"></script>'),
+  htmltools::HTML('<style>input[type="radio"] {margin: 0 5px 0 20px}</style>')
+)
+
+amb_tonejs <- \(
+      id,
+      button_text,
+      pitch_name,
+      pitch_octave,
+      duration_value,
+      duration_unit,
+      duration_dotted = ""
+    ) {
+  pitch <- paste0(pitch_name, pitch_octave, collapse = "")
+  dotted <- if (!is.null(duration_dotted)) { "." } else { "" }
+  duration <- paste0(duration_value, duration_unit, dotted, collapse = "")
+  script_chr <- paste0('
+    document.querySelector("#', id, '")?.addEventListener("click", async () => {
+        const synth = new Tone.Synth().toDestination();
+        synth.triggerAttackRelease("', pitch, '", "', duration, '");
+        await Tone.start();
+        console.log("audio is ready");
+     });',
+     collapse = ""
+  )
+  div(
+    class = paste0("amb_tonejs ", id),
+    style = "margin : 10px; float: left;",    
+    button(id = id, button_text),         
+    script(HTML(script_chr)),    
+    a("x", style = "color: red; text-decoration: none", href = "/", hx_delete="/delete", hx_confirm = glue('Are you sure you want to delete "{button_text}"?'), hx_swap = "outerHTML", hx_target = glue(".{id}"))
+  )
+}
+
+#' Starting the app and defining the routes
+app <- ambhtmx(host = "0.0.0.0", port = "7860")$app$
+  get("/", \(req, res){  
+    div(
+      id = "page", style = "margin: 20px", h1(page_title),
+      div(id = "main",
+        div(
+          style ="margin-bottom: 10px",
+          span("Pitch name", div(
+            label(input(name = "pitch_name", type = "radio", value = "A", "A", checked = "checked")),
+            label(input(name = "pitch_name", type = "radio", value = "B", "B")),
+            label(input(name = "pitch_name", type = "radio", value = "C", "C")),
+            label(input(name = "pitch_name", type = "radio", value = "D", "D")),
+            label(input(name = "pitch_name", type = "radio", value = "E", "E")),
+            label(input(name = "pitch_name", type = "radio", value = "F", "F"))
+          ))
+        ),
+        div(
+          style ="margin-bottom: 10px",
+          label("Pitch octave", div(
+            input(name = "pitch_octave", type = "range", min = 0, max = 9, value = 4)
+          ))
+        ),
+        div(
+          style ="margin-bottom: 10px",
+          label("Duration value", div(
+            input(name = "duration_value", type = "range", min = 0.25, max = 8, step = 0.25, value = 0.25)
+          ))
+        ),
+        div(
+          style ="margin-bottom: 10px",
+          span("Duration unit", div(
+            label(input(name = "duration_unit", type = "radio", value = "n", "note", checked = "checked")),
+            label(input(name = "duration_unit", type = "radio", value = "t", "triplet")),
+            label(input(name = "duration_unit", type = "radio", value = "m", "measures"))
+          ))
+        ),
+        div(
+          style ="margin-bottom: 10px",
+          label(
+            input(name = "duration_dotted", type = "checkbox", value = "."),
+            "Duration dotted",
+          )
+        ),
+        div(
+          style = "margin: 10px",
+          button(
+            "Add",
+            style = "margin-right: 20px",
+            hx_post = "/add",
+            hx_include = '[name="pitch_name"], [name="pitch_octave"], [name="duration_value"],[name="duration_unit"], [name="duration_dotted"]',
+            hx_vals = 'js:{id: document.querySelectorAll(".amb_tonejs").length + 1}',
+            hx_target = "#list",
+            hx_swap = "beforeend"
+          ),
+          button(
+            "Reset",
+            hx_delete = "/delete",
+            hx_target = "#list",
+            hx_swap = "innerHTML",
+            hx_confirm = glue('Are you sure you want to reset all the notes?')
+          )
+        ),
+        div(
+          id = "list",
+          amb_tonejs(
+            id = "amb_tonejs_1",
+            "Play c4 for 4n",
+            pitch_name = 'c',
+            pitch_octave = '4',
+            duration_value = 4,
+            duration_unit = 'n'
+          ),
+          amb_tonejs(
+            id = "amb_tonejs_2",
+            "Play c5 for 8n",
+            pitch_name = 'c',
+            pitch_octave = '5',
+            duration_value = 8,
+            duration_unit = 'n'
+          )
+        )
+      )
+    ) |>
+    send_page(res)
+  })$
+  post("/add", \(req, res) {
+    tryCatch(
+      {
+        params <- parse_multipart(req)
+        print(params)
+        amb_tonejs_id <- paste0("amb_tonejs_", params$id, collapse = "")
+        pitch <- paste0(params$pitch_name, params$pitch_octave, collapse = "")
+        dotted <- if (!is.null(params$duration_dotted)) { "." } else { "" }
+        duration <- paste0(params$duration_value, params$duration_unit, dotted, collapse = "")
+        text <- glue("Play {pitch} for {duration}")
+        html_tags <- amb_tonejs(
+          id = amb_tonejs_id,
+          glue("Play {pitch} for {duration}"),
+          pitch_name = params$pitch_name,
+          pitch_octave = params$pitch_octave,
+          duration_value = params$duration_value,
+          duration_unit = params$duration_unit,
+          duration_dotted = params$duration_dotted
+        ) |> 
+        send_tags(res)
+      },
+      error = \(e) {
+        print(e)
+        res$send("Error")
+      }
+    )
+  })$
+  delete("/delete", \(req, res) {
+    res$send("")
+  })
+
+app$start(open = FALSE)

deploy_hf.sh

@@ -0,0 +1,4 @@
+echo `date` > last_depoy.txt
+git add last_depoy.txt
+git commit -m "deploy"
+git push hf main

docker_rm.sh

@@ -0,0 +1,2 @@
+(docker container rm -f ambhtmx-tonejs-container || true) \
+		&& (docker rmi $(docker images --format '{{.Repository}}:{{.ID}}'| egrep 'ambhtmx-tonejs-image' | cut -d':' -f2 | uniq) --force || true)

docker_run.sh

@@ -0,0 +1,2 @@
+(docker build -f Dockerfile -t ambhtmx-tonejs-image . || true) \
+		&& docker run --env-file=.Renviron -p 7860:7860 --name ambhtmx-tonejs-container --rm ambhtmx-tonejs-image

last_depoy.txt

@@ -0,0 +1 @@
+mar 06 ago 2024 17:29:11 CEST