Update UI multiple times in a row in R Shiny
I'm trying to make a button blink (cycle through colors) a number of times before finally stopping. Sort of to simulate a lottery draw.
The final color in the end will be determined by a calculation, but first I need to figure out how to make it blink the initial n times before it stops.
This is what I tried to make, but it only updates the colors a part of the time, like 2 or 3 times.
library(shiny)
ui <- fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
values$color <- '#FF0000'
observe({ values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto") })
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20", "purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
observeEvent(input$Generator, { values$go <- 1 })
observeEvent(values$go, {
if(values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
Sys.sleep(0.1)
}
})
output$ColorButton <- renderUI({ actionButton(inputId = 'ColorButton', label = NULL, style = values$style)})
}
shinyApp(ui = ui, server = server)
css r loops shiny
add a comment |
I'm trying to make a button blink (cycle through colors) a number of times before finally stopping. Sort of to simulate a lottery draw.
The final color in the end will be determined by a calculation, but first I need to figure out how to make it blink the initial n times before it stops.
This is what I tried to make, but it only updates the colors a part of the time, like 2 or 3 times.
library(shiny)
ui <- fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
values$color <- '#FF0000'
observe({ values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto") })
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20", "purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
observeEvent(input$Generator, { values$go <- 1 })
observeEvent(values$go, {
if(values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
Sys.sleep(0.1)
}
})
output$ColorButton <- renderUI({ actionButton(inputId = 'ColorButton', label = NULL, style = values$style)})
}
shinyApp(ui = ui, server = server)
css r loops shiny
add a comment |
I'm trying to make a button blink (cycle through colors) a number of times before finally stopping. Sort of to simulate a lottery draw.
The final color in the end will be determined by a calculation, but first I need to figure out how to make it blink the initial n times before it stops.
This is what I tried to make, but it only updates the colors a part of the time, like 2 or 3 times.
library(shiny)
ui <- fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
values$color <- '#FF0000'
observe({ values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto") })
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20", "purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
observeEvent(input$Generator, { values$go <- 1 })
observeEvent(values$go, {
if(values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
Sys.sleep(0.1)
}
})
output$ColorButton <- renderUI({ actionButton(inputId = 'ColorButton', label = NULL, style = values$style)})
}
shinyApp(ui = ui, server = server)
css r loops shiny
I'm trying to make a button blink (cycle through colors) a number of times before finally stopping. Sort of to simulate a lottery draw.
The final color in the end will be determined by a calculation, but first I need to figure out how to make it blink the initial n times before it stops.
This is what I tried to make, but it only updates the colors a part of the time, like 2 or 3 times.
library(shiny)
ui <- fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
values$color <- '#FF0000'
observe({ values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto") })
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20", "purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
observeEvent(input$Generator, { values$go <- 1 })
observeEvent(values$go, {
if(values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
Sys.sleep(0.1)
}
})
output$ColorButton <- renderUI({ actionButton(inputId = 'ColorButton', label = NULL, style = values$style)})
}
shinyApp(ui = ui, server = server)
css r loops shiny
css r loops shiny
edited Nov 27 '18 at 11:54
SeGa
4,5133935
4,5133935
asked Nov 24 '18 at 0:26
MarkMark
581523
581523
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
I slightly modified your example and included invalidateLater
and isolate
in an observer which changes the color and in another observer I handle the case when values$go
is 0, so the ColorButton has an initial color.
library(shiny)
ui <- {fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)}
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20",
"purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
observe({
if (values$go == 0) {
values$color <- '#FF0000'
values$go <- values$go +1
}
})
observeEvent(input$Generator, {
if (values$go == 20) {
values$color <- '#FF0000'
values$go <- 0
}
})
observe({
req(input$Generator)
invalidateLater(500, session)
isolate({
if (values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
}
})
})
observe({
values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto")
})
output$ColorButton <- renderUI({
actionButton(inputId = 'ColorButton', label = NULL, style = values$style)
})
}
shinyApp(ui = ui, server = server)
cool, that works. How does invalidateLater make it work while without it it doesnt?
– Mark
Nov 27 '18 at 22:26
p.s. we need to add some more code I think, because now there is no reset to 0 and the button only fires the first time
– Mark
Nov 27 '18 at 22:29
Just edited the answer and added a reset to 0. If you removeinvalidateLater
, that observe will only fire when the Generator button is clicked, otherwise it will refire every 500ms. If you also remove theisolate
it will fire whenever the reactiveValuevalues
is updated and every 500 ms. So it will go from 0 to 20, but it will fire too fast, that it appears only two colors where picked.
– SeGa
Nov 27 '18 at 23:53
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53454179%2fupdate-ui-multiple-times-in-a-row-in-r-shiny%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
I slightly modified your example and included invalidateLater
and isolate
in an observer which changes the color and in another observer I handle the case when values$go
is 0, so the ColorButton has an initial color.
library(shiny)
ui <- {fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)}
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20",
"purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
observe({
if (values$go == 0) {
values$color <- '#FF0000'
values$go <- values$go +1
}
})
observeEvent(input$Generator, {
if (values$go == 20) {
values$color <- '#FF0000'
values$go <- 0
}
})
observe({
req(input$Generator)
invalidateLater(500, session)
isolate({
if (values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
}
})
})
observe({
values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto")
})
output$ColorButton <- renderUI({
actionButton(inputId = 'ColorButton', label = NULL, style = values$style)
})
}
shinyApp(ui = ui, server = server)
cool, that works. How does invalidateLater make it work while without it it doesnt?
– Mark
Nov 27 '18 at 22:26
p.s. we need to add some more code I think, because now there is no reset to 0 and the button only fires the first time
– Mark
Nov 27 '18 at 22:29
Just edited the answer and added a reset to 0. If you removeinvalidateLater
, that observe will only fire when the Generator button is clicked, otherwise it will refire every 500ms. If you also remove theisolate
it will fire whenever the reactiveValuevalues
is updated and every 500 ms. So it will go from 0 to 20, but it will fire too fast, that it appears only two colors where picked.
– SeGa
Nov 27 '18 at 23:53
add a comment |
I slightly modified your example and included invalidateLater
and isolate
in an observer which changes the color and in another observer I handle the case when values$go
is 0, so the ColorButton has an initial color.
library(shiny)
ui <- {fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)}
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20",
"purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
observe({
if (values$go == 0) {
values$color <- '#FF0000'
values$go <- values$go +1
}
})
observeEvent(input$Generator, {
if (values$go == 20) {
values$color <- '#FF0000'
values$go <- 0
}
})
observe({
req(input$Generator)
invalidateLater(500, session)
isolate({
if (values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
}
})
})
observe({
values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto")
})
output$ColorButton <- renderUI({
actionButton(inputId = 'ColorButton', label = NULL, style = values$style)
})
}
shinyApp(ui = ui, server = server)
cool, that works. How does invalidateLater make it work while without it it doesnt?
– Mark
Nov 27 '18 at 22:26
p.s. we need to add some more code I think, because now there is no reset to 0 and the button only fires the first time
– Mark
Nov 27 '18 at 22:29
Just edited the answer and added a reset to 0. If you removeinvalidateLater
, that observe will only fire when the Generator button is clicked, otherwise it will refire every 500ms. If you also remove theisolate
it will fire whenever the reactiveValuevalues
is updated and every 500 ms. So it will go from 0 to 20, but it will fire too fast, that it appears only two colors where picked.
– SeGa
Nov 27 '18 at 23:53
add a comment |
I slightly modified your example and included invalidateLater
and isolate
in an observer which changes the color and in another observer I handle the case when values$go
is 0, so the ColorButton has an initial color.
library(shiny)
ui <- {fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)}
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20",
"purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
observe({
if (values$go == 0) {
values$color <- '#FF0000'
values$go <- values$go +1
}
})
observeEvent(input$Generator, {
if (values$go == 20) {
values$color <- '#FF0000'
values$go <- 0
}
})
observe({
req(input$Generator)
invalidateLater(500, session)
isolate({
if (values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
}
})
})
observe({
values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto")
})
output$ColorButton <- renderUI({
actionButton(inputId = 'ColorButton', label = NULL, style = values$style)
})
}
shinyApp(ui = ui, server = server)
I slightly modified your example and included invalidateLater
and isolate
in an observer which changes the color and in another observer I handle the case when values$go
is 0, so the ColorButton has an initial color.
library(shiny)
ui <- {fluidPage(
uiOutput('ColorButton'),
actionButton(inputId = 'Generator', label = 'Show colors', style = "background-color: #fff; color: #FF0000; border-color: #FF0000;
border-width: 2px; font-size: 20px; font-weight: bolder;
border-radius: 6px; height: 60px; display: block; margin-top: 100px; margin-left: auto; margin-right: auto"
)
)}
colors <- c("darkgray", "blue", "red", "green", "orange", "darkblue", "yellow", "gray20",
"purple", "black", "cyan", "violet", "beige", "magenta", "pink", "brown")
server <- function(input, output, session) {
values <- reactiveValues(go = 0)
observe({
if (values$go == 0) {
values$color <- '#FF0000'
values$go <- values$go +1
}
})
observeEvent(input$Generator, {
if (values$go == 20) {
values$color <- '#FF0000'
values$go <- 0
}
})
observe({
req(input$Generator)
invalidateLater(500, session)
isolate({
if (values$go > 0 & values$go < 20) {
sampled <- sample(c(1:12), 1)
values$color <- colors[sampled]
values$go <- values$go +1
}
})
})
observe({
values$style = paste("background-color:", values$color, ";height:300px; width: 300px; border-radius: 150px;
display: block; margin-top: 100px; margin-left: auto; margin-right: auto")
})
output$ColorButton <- renderUI({
actionButton(inputId = 'ColorButton', label = NULL, style = values$style)
})
}
shinyApp(ui = ui, server = server)
edited Nov 27 '18 at 23:42
answered Nov 27 '18 at 20:45
SeGaSeGa
4,5133935
4,5133935
cool, that works. How does invalidateLater make it work while without it it doesnt?
– Mark
Nov 27 '18 at 22:26
p.s. we need to add some more code I think, because now there is no reset to 0 and the button only fires the first time
– Mark
Nov 27 '18 at 22:29
Just edited the answer and added a reset to 0. If you removeinvalidateLater
, that observe will only fire when the Generator button is clicked, otherwise it will refire every 500ms. If you also remove theisolate
it will fire whenever the reactiveValuevalues
is updated and every 500 ms. So it will go from 0 to 20, but it will fire too fast, that it appears only two colors where picked.
– SeGa
Nov 27 '18 at 23:53
add a comment |
cool, that works. How does invalidateLater make it work while without it it doesnt?
– Mark
Nov 27 '18 at 22:26
p.s. we need to add some more code I think, because now there is no reset to 0 and the button only fires the first time
– Mark
Nov 27 '18 at 22:29
Just edited the answer and added a reset to 0. If you removeinvalidateLater
, that observe will only fire when the Generator button is clicked, otherwise it will refire every 500ms. If you also remove theisolate
it will fire whenever the reactiveValuevalues
is updated and every 500 ms. So it will go from 0 to 20, but it will fire too fast, that it appears only two colors where picked.
– SeGa
Nov 27 '18 at 23:53
cool, that works. How does invalidateLater make it work while without it it doesnt?
– Mark
Nov 27 '18 at 22:26
cool, that works. How does invalidateLater make it work while without it it doesnt?
– Mark
Nov 27 '18 at 22:26
p.s. we need to add some more code I think, because now there is no reset to 0 and the button only fires the first time
– Mark
Nov 27 '18 at 22:29
p.s. we need to add some more code I think, because now there is no reset to 0 and the button only fires the first time
– Mark
Nov 27 '18 at 22:29
Just edited the answer and added a reset to 0. If you remove
invalidateLater
, that observe will only fire when the Generator button is clicked, otherwise it will refire every 500ms. If you also remove the isolate
it will fire whenever the reactiveValue values
is updated and every 500 ms. So it will go from 0 to 20, but it will fire too fast, that it appears only two colors where picked.– SeGa
Nov 27 '18 at 23:53
Just edited the answer and added a reset to 0. If you remove
invalidateLater
, that observe will only fire when the Generator button is clicked, otherwise it will refire every 500ms. If you also remove the isolate
it will fire whenever the reactiveValue values
is updated and every 500 ms. So it will go from 0 to 20, but it will fire too fast, that it appears only two colors where picked.– SeGa
Nov 27 '18 at 23:53
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53454179%2fupdate-ui-multiple-times-in-a-row-in-r-shiny%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown