first

.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,54 @@
+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 \
+                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
+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 jrosell/ambhtmx devOpifex/ambiorix devOpifex/scilis devOpifex/signaculum
+
+# 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,80 @@
+---
+title: ambhtmx.card3d
+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**
+
+## Deployment options
+
+### Hugging Face Spaces
+
+When you push 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.
+
+Try the demo here: 
+
+* Direct URL to the deployed app: https://jrosell-ambhtmx-crud.hf.space/
+* Space URL: https://huggingface.co/spaces/jrosell/ambhtmx.card3d
+
+
+### Runing the example in Docker
+
+All in one:
+
+```
+bash deploy_docker.sh
+```
+
+Step by step:
+
+1. Building the ambhtmx-image:
+
+```
+docker build -f Dockerfile -t ambhtmx-card3d-image . && 
+    docker run -p 7860:7860 --name ambhtmx-card3d-container --rm ambhtmx-card3d-image
+```
+
+2. Check the app on http://127.0.0.1:3000
+
+4. Stoping and removing the ambhtmx-card3d-container:
+
+```
+docker container rm -f ambhtmx-card3d-container
+```
+
+5. Removing the image
+```
+docker images 'ambhtmx-card3d-image' -a -q
+docker rmi ID
+
+## Troubleshooting
+
+If you want to see the logs:
+
+```
+docker build -f Dockerfile  --no-cache --progress=plain -t ambhtmx-card3d-image . 2>&1 | tee build.log
+```
+
+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).
+
+
+git init
+git add -A
+git branch -M main
+git remote add origin [email protected]:jrosell/ambhtx.card3d.git
+git remote add hg [email protected]:spaces/jrosell/ambhtmx.card3d
+git remote -v
+git remote set-url --add --push origin [email protected]:jrosell/ambhtmx.card3d.git
+git remote set-url --add --push origin [email protected]:spaces/jrosell/ambhtmx.card3d
+git push -u origin main

app.R

@@ -0,0 +1,34 @@
+# remotes::install_github("jrosell/ambhtmx", force = TRUE)
+library(ambhtmx)
+# devtools::load_all()
+
+card_3d_demo <- \() {  
+  card <- "card"
+  tryCatch(
+    expr = {
+      # Original python code credit: https://fastht.ml/
+      # Design credit: https://codepen.io/markmiro/pen/wbqMPa
+      bgurl <- "https://ucarecdn.com/35a0e8a7-fcc5-48af-8a3f-70bb96ff5c48/-/preview/750x1000/"
+      card_styles <- "font-family: 'Arial Black', 'Arial Bold', Gadget, sans-serif; perspective: 1500px;"
+      card_3d <- \(text, bgurl, amt, left_align) {
+        align <- ifelse(left_align, 'left', 'right')
+        scr <- script_from_js_tpl('card3d.js', amt = amt)	      
+        sty <- style_from_css_tpl(
+          'card3d.css', bgurl = glue('url({bgurl})'), align = align
+        )   
+        div(text, div(), scr, sty, align = align)
+      }
+      card <- card_3d("Mouseover me", bgurl, amt = 1.5, left_align = T)
+    },
+    error = \(e) print(e)
+  )
+  div(card, style = card_styles)
+}
+
+app <- ambhtmx_app(host = "0.0.0.0", port = "3000", protocol ="http")$app
+
+app$get("/", \(req, res) {
+  card_3d_demo() |> send_page(res)
+})
+
+app$start()

card3d.css

@@ -0,0 +1,15 @@
+me {
+    position: relative; width: 225px; height: 300px; padding: 1em; display: flex;
+    flex-direction: column; justify-content: flex-end;
+    font-weight: bold; text-align: var(--tpl-align); text-shadow: 0 0 4px #000; color: #ddd;
+    -webkit-text-stroke: 1px black; margin: 1em; font-size: 1.25em;
+    box-shadow: 0 1px 5px #00000099; border-radius: 10px; background: var(--tpl-bgurl) center/cover;
+    transition: .3s ease-out; transition-property: transform, box-shadow;
+    touch-action: none; /* Prevents scrolling on touch devices */
+}
+me:hover { transition-duration: .15s; box-shadow: 0 5px 20px 5px #00000044; }
+me > div {
+    position: absolute; inset: 0; border-radius: 10px;
+    background-image: radial-gradient(circle at 90% -20%, #ffffff55, #0000000f);
+    pointer-events: none; /* Allows touch events to pass through */
+}

card3d.js

@@ -0,0 +1,44 @@
+me().on('mouseenter', ev => {
+    let e = me(ev)
+    e.bounds = e.getBoundingClientRect()
+    e.on('mousemove', e.rotateToPointer)
+}).on('mouseleave', ev => {
+    let e = me(ev)
+    e.off('mousemove', e.rotateToPointer)
+    e.style.transform = e.style.background = ''
+})
+
+// Use a separate function for touch events to allow passive listener
+function handleTouchStart(ev) {
+    let e = me(ev)
+    e.bounds = e.getBoundingClientRect()
+    e.addEventListener('touchmove', e.rotateToPointer, { passive: true })
+    e.addEventListener('touchend', handleTouchEnd, { passive: true })
+}
+
+function handleTouchEnd(ev) {
+    let e = me(ev.target)
+    e.removeEventListener('touchmove', e.rotateToPointer)
+    e.removeEventListener('touchend', handleTouchEnd)
+    e.style.transform = e.style.background = ''
+}
+
+me().addEventListener('touchstart', handleTouchStart, { passive: true })
+
+me().rotateToPointer = ev => {
+    let e = me(ev.target), b = e.bounds
+    let x, y
+    if (ev.type === 'touchmove') {
+        x = ev.touches[0].clientX - b.x - b.width / 2
+        y = ev.touches[0].clientY - b.y - b.height / 2
+    } else {
+        x = ev.clientX - b.x - b.width / 2
+        y = ev.clientY - b.y - b.height / 2
+    }
+    let d = Math.hypot(x,y)
+    let amt = {amt}
+    e.style.transform = `scale3d(${ 1 + 0.07 * amt }, ${ 1 + 0.07 * amt }, 1.0)
+                         rotate3d(${ y/100*amt }, ${ -x/100*amt }, 0, ${ Math.log(d)*2*amt }deg)`
+    me('div', e).style.backgroundImage = `radial-gradient(
+        circle at ${ x*2 + b.width/2 }px ${ y*2 + b.height/2 }px, #ffffff77, #0000000f)`
+}

deploy_docker.sh

@@ -0,0 +1,4 @@
+(docker container rm -f ambhtmx-card3d-container || true)\
+		&& (docker rmi $(docker images --format '{{.Repository}}:{{.ID}}'| egrep 'ambhtmx-card3d' | cut -d':' -f2 | uniq) --force || true) \
+		&& docker build -f Dockerfile -t ambhtmx-card3d-image . \
+		&& docker run --env-file=.Renviron -p 7860:7860 --name ambhtmx-card3d-container --rm ambhtmx-card3d-image