deepanshu88 / shinyeditor Goto Github PK
View Code? Open in Web Editor NEWRich Text Editor in Shiny App
Home Page: https://www.listendata.com/2021/03/shinyeditor-rich-text-editor-in-shiny.html
Rich Text Editor in Shiny App
Home Page: https://www.listendata.com/2021/03/shinyeditor-rich-text-editor-in-shiny.html
Hi !
First, thanks for this usefull package.
UpdateEditor does not seem to update the editor, even the minimum exemple.
Would you have a suggestion ?.
Ben
library(shiny)
library(ShinyEditor)
# UI
ui <- fluidPage(
# Setup
use_editor("API-Key"),
titlePanel("HTML Generator"),
editor(id='textcontent'),
actionButton("updatedata", "Update Editor", icon = icon("edit"))
)
# Server
server <- function(input, output, session) {
observeEvent(input$updatedata, {
print("ok")
UpdateEditor(session,
id = "textcontent",
text = "ca marche !")
})
}
# Run App
shinyApp(ui = ui, server = server)
Here is my sessionInfo()
R version 4.0.5 (2021-03-31)
Platform: x86_64-pc-linux-gnu (64-bit)
Running under: Ubuntu 20.04.2 LTS
Matrix products: default
BLAS: /usr/lib/x86_64-linux-gnu/blas/libblas.so.3.9.0
LAPACK: /usr/lib/x86_64-linux-gnu/lapack/liblapack.so.3.9.0
locale:
[1] LC_CTYPE=fr_FR.UTF-8 LC_NUMERIC=C LC_TIME=fr_FR.UTF-8 LC_COLLATE=fr_FR.UTF-8 LC_MONETARY=fr_FR.UTF-8 LC_MESSAGES=fr_FR.UTF-8
[7] LC_PAPER=fr_FR.UTF-8 LC_NAME=C LC_ADDRESS=C LC_TELEPHONE=C LC_MEASUREMENT=fr_FR.UTF-8 LC_IDENTIFICATION=C
attached base packages:
[1] stats graphics grDevices utils datasets methods base
other attached packages:
[1] ShinyEditor_0.1.0 shiny_1.6.0
loaded via a namespace (and not attached):
[1] Rcpp_1.0.6 digest_0.6.27 later_1.1.0.1 mime_0.10 R6_2.5.0 jsonlite_1.7.2 lifecycle_1.0.0 xtable_1.8-4 magrittr_2.0.1
[10] cachem_1.0.4 rlang_0.4.10 promises_1.2.0.1 jquerylib_0.1.3 bslib_0.2.4 ellipsis_0.3.1 tools_4.0.5 httpuv_1.5.5 fastmap_1.1.0
[19] compiler_4.0.5 htmltools_0.5.1.1 sass_0.3.1
Hi @deepanshu88,
Just found this package and hoping it will work for our use case!
I'm finding that the editor shows up as a basic text box if it doesn't start visible and is made visible by user action. Alternatively, if it starts visible, it loads, but when it's hidden and then made visible again, it's back to a basic textbox.
A reprex is as follows:
library(shiny)
library(ShinyEditor)
require(shinyjs)
require(rlang)
# UI
ui <- fluidPage(
tags$head(
# Setup
use_editor(Sys.getenv("TINYMCE_KEY")),
shinyjs::useShinyjs()
),
titlePanel("TinyMCE Bug when beginning non-visible"),
# Text Input 1
fluidRow(
column(6,
actionButton(
"notepad",
"Notepad",
shiny::icon("book")
)),
column(
width = 6,
uiOutput("note_panel")
)
)
)
# Server
server <- function(input, output, session) {
content <- reactiveVal()
# Generate HTML
hide <- TRUE
observeEvent(input$notepad, {
editorText(session, editorid = 'textcontent', outputid = 'mytext')
content(enc2utf8(rlang::`%||%`(input$mytext, "")))
hide <<- if (hide)
FALSE
else
TRUE
})
output$note_panel <- renderUI({
absolutePanel(
class = ifelse(hide, "shinyjs-hide", ""),
shiny::div(
ShinyEditor::editor(
"textcontent",
text = content(),
options = "branding: false,
height: 300,
plugins: ['lists', 'table', 'link', 'image', 'code'],
toolbar1: 'bold italic forecolor backcolor | formatselect fontselect fontsizeselect | alignleft aligncenter alignright alignjustify',
toolbar2: 'undo redo removeformat bullist numlist table blockquote code superscript subscript strikethrough link image'"
)
),
top = "45px",
left = "40px",
draggable = TRUE
)
})
}
# Run App
shinyApp(ui = ui, server = server)
Any ideas on how to fix the issue?
First off - excellent package from what I have used so far!
The issue I have come across is that when I have an editor updated by a reactive element, it loads OK initially and then after the update defaults to a plain textArea input.
I am building an app at the moment where we store comments about KPIs in a local MySQL database.
But the same comment field will be used and then have it's content updated depending on which region you select in an input.
output$stx_pnu <- renderUI({
#NOTE: Import Data from local DB based on region input
db <- dbxConnect(adapter = RMariaDB::MariaDB(), group = "SCERr-db")
df <- dbGetQuery(db, paste0("SELECT id, comment FROM comments WHERE id = '", input$region, "_pnu'"))
dbxDisconnect(db)
#SAMPLE DATA: (with image removed)
# df <- data.frame(
# id=c("Eastern_pnu"),
# comment=c("<p>Test this <strong>out</strong></p><p><span style="background-color: #fbeeb8;">new test</span></p><p><em>Hello <strong>Goodbye</strong></em></p>")
# )
#NOTE: UI output
fluidRow(
fluidRow(
column(
width = 12,
editor('TINYtx_comment_pnu',
text = as.character(df$comment),
options = "branding: false,
height: 600,
plugins: ['autoresize', 'image', 'lists', 'charmap', 'insertdatetime', 'table', 'emoticons'],
toolbar1: 'undo redo | bold italic forecolor backcolor | fontselect fontsizeselect | alignleft aligncenter alignright alignjustify | bullist numlist table blockquote link image',
menubar: false"
)
)
),
br(),
#NOTE: Submit button to save changes to DB
fluidRow(
actionButton("tx_submit_pnu", label = "Save changes", icon = icon("floppy-disk", lib = "glyphicon"), class = "btn-success")
)
)
})
Hi -
See this example where the editor is within a modal dialog. When you open it the first time, it's fine. Open it again and it's just a text area input box.
library(shiny)
library(ShinyEditor)
# UI
ui <- fluidPage(
# Setup
use_editor(Sys.getenv("TINY_EDITOR_API_KEY")),
titlePanel("Editor in Modal Dialog Bug"),
# Text Input 1
fluidRow(
column(
width = 6,
p("Open modal, dismiss, then open again"),
actionButton(
"show_modal",
"Show Modal"
))
)
)
# Server
server <- function(input, output, session) {
# Generate HTML
observeEvent(input$show_modal, {
showModal(
modalDialog(
editor("editor",text = "<p>Some HTML</p>")
)
)
})
}
# Run App
shinyApp(ui = ui, server = server)
Hi -
First, thanks for a useful package! I have just started using it, but I am running into an issue. See below for a slightly modified version of your minimal example. Note that you have to press the button twice to actually get the output text to print. On the first press, the value is NULL. How can I access the output text/html immediately after editorText()? For example, if I wanted to write the text to a file.
library(shiny)
library(ShinyEditor)
# UI
ui <- fluidPage(
# Setup
use_editor(Sys.getenv("TINY_EDITOR_API_KEY")),
titlePanel("HTML Generator"),
# Text Input 1
fluidRow(
column(
width = 6,
editor('textcontent'),
br(),
actionButton(
"print",
"Print HTML to Console"
))
)
)
# Server
server <- function(input, output, session) {
# Generate HTML
observeEvent(input$print, {
editorText(session, editorid = 'textcontent', outputid = 'mytext')
print(input$mytext)
})
}
# Run App
shinyApp(ui = ui, server = server)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.