Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

htmltools rendered #92

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

htmltools rendered #92

wants to merge 4 commits into from

Conversation

JohnCoene
Copy link
Collaborator

This is a first draft at fully rendering htmltools.

The core of it sits here:

inline_dependencies <- function(deps) {

The idea is to check whether the tags contain an <html> tag, if found it treats it like a "page" and attempts to render a full HTML document.

Otherwise, it works as it currently does.

Then it becomes real easy to create something that resembles a more "traditional" shiny app.

library(ambiorix)
library(plotly)
library(echarts4r)
library(htmltools)
library(highcharter)

data(penguins, package = "palmerpenguins")

page <- function(...) {
  tags$html(
    tags$head(
      tags$title("The page title!"),
      tags$link(
        rel = "stylesheet",
        href = "https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
      )
    ),
    tags$body(...)
  )
}

# core app
app <- Ambiorix$new()

app$get("/", \(req, res){
  ec <- cars |>
    echarts4r::e_charts(speed) |>
    echarts4r::e_scatter(dist)

  pl <- plot_ly(midwest, x = ~percollege, color = ~state, type = "box")

  hc <- hchart(
    penguins,
    "scatter",
    hcaes(x = flipper_length_mm, y = bill_length_mm, group = species)
  )

  p <- page(
    h1("Dashboard"),
    div(
      class = "grid",
      tags$article(pl),
      tags$article(ec),
      tags$article(hc)
    )
  )

  res$send(p)
})

app$start()

What do you think? @kennedymwavu

@JohnCoene JohnCoene added the feature New feature label Jan 16, 2025
@JohnCoene JohnCoene self-assigned this Jan 16, 2025
@JohnCoene
Copy link
Collaborator Author

Now it supports href! woohoo.

library(ambiorix)
library(plotly)
library(calcite)
library(echarts4r)
library(htmltools)
library(highcharter)

data(penguins, package = "palmerpenguins")

page <- function(...) {
  tags$html(
    tags$head(
      tags$title("The page title!"),
    ),
    tags$body(...)
  )
}

# core app
app <- Ambiorix$new()

app$get("/", \(req, res){
  shell <- calcite_shell(
    calcite_navigation(
      slot = "header",
      calcite_navigation_logo(
        slot = "logo",
        heading = "Snow Plow Map",
        description = "City of AcmeCo"
      ),
      calcite_menu(
        slot = "content-end",
        calcite_menu_item(text = "Drivers", `icon-start` = "license", `text-enabled` = TRUE),
        calcite_menu_item(text = "Routes", `icon-start` = "road-sign", `text-enabled` = TRUE),
        calcite_menu_item(text = "Forecast", `icon-start` = "snow", `text-enabled` = TRUE)
      ),
      calcite_navigation(
        slot = "navigation-secondary",
        calcite_menu(
          slot = "content-start",
          calcite_menu_item(breadcrumb = TRUE, text = "All Routes", `icon-start` = "book", `text-enabled` = TRUE),
          calcite_menu_item(breadcrumb = TRUE, text = "South Hills", `icon-start` = "apps", `text-enabled` = TRUE, active = TRUE)
        )
      ),
      calcite_navigation_user(slot = "user", `full-name` = "Wendell Berry", username = "w_berry")
    )
  )

  ec <- cars |>
    echarts4r::e_charts(speed) |>
    echarts4r::e_scatter(dist)

  pl <- plot_ly(midwest, x = ~percollege, color = ~state, type = "box")

  hc <- hchart(
    penguins,
    "scatter",
    hcaes(x = flipper_length_mm, y = bill_length_mm, group = species)
  )

  p <- page(
    h1("Dashboard"),
    shell,
    div(
      class = "grid",
      tags$article(pl),
      tags$article(ec),
      tags$article(hc)
    )
  )

  res$send(p)
})

app$start()

@kennedymwavu
Copy link
Contributor

this is great!!

i'm on chrome, everything is displayed well. but when i inspect the page, i get this on the R console, can't tell why:

image

# htmltools::renderDependencies(..., srcType = "href")
# does not work
rendered_deps <- htmltools::renderDependencies(deps)
href_deps <- grep("http", strsplit(rendered_deps, "\n")[[1]], value = TRUE)
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We only take href here so you should not see this in your console, can you make sure you're on the latest?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature New feature
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants