daattali / shinycssloaders

⌛ Add loading animations to a Shiny output while it's recalculating
https://daattali.com/shiny/shinycssloaders-demo/
Other
399 stars 45 forks source link

including loader in bigger container #13

Closed Nicolabo closed 2 years ago

Nicolabo commented 6 years ago

This PR solves two issues:

1.possibility to include non-shiny inputs (such text, img etc). within withSpinner (inside tagList),

In current version, withSpinner hides only shiny objects:

$("#"+id).siblings(".load-container").siblings('.shiny-bound-output, .shiny-output-error').css('visibility', 'hidden’);

This problematic especially when your app has several plots and each has a title. To overcome, I modified .js code, in order to include all stuff in tagList.

For example,

mainPanel(
                  withSpinner(
                        tagList(
                              h3("The plot"),
                              plotOutput("distPlot")      
                        )     
                  )
)

2.possibility to include loader on the whole app - especially useful when your app needs some time to load all elements at the beginning.

Typically, your app consists of sidebarPanel and mainPanel. It’s not gonna work If you put everything into withSpinner:

withSpinner(
    tagList(
        sidebarPanel(),
        mainPanel()
    )
)

PR includes necessary changes in order to deal with such situations. Also if you have navbarPage or tabsetPanel layout, you can add withSpinner in each tabPanel.

tabPanel(
    title = "Tab1",
    withSpinner(
        tagList(
            sidebarPanel(),
            mainPanel()
        )
   )
)

However, this PR doesn’t deal with implementing loader properly in bigger app for instance, when we have nested tabsetPanel.

andrewsali commented 6 years ago

Thanks very much for this contribution. I apologize for not having had time to take a look yet. It is on my radar and I will try to get to reviewing it as soon as feasible, but it still might be some time.

daattali commented 4 years ago

@Nicolabo The javascript has changed a lot in the past few months, but the feature you wrote in this PR is a great feature to add. If you're able to reimplement it using today's base, it'd be a very welcomed PR

daattali commented 4 years ago

@Nicolabo I know this is very very old but if you're still available to make this PR, I'd be happy to help incorporating it into the new version

javierdiegof commented 4 years ago

I'm having to deal with this exact same issue right now. It would be a great addition. I haven't looked at the code of the PR request, but the solution that comes to my mind would consist on generalizing the behaviour of the package so that the spinner is displayed whenever a descendant becomes invalidated and not just when the immediate children is. That would probably increase the computational complexity a bit but would achieve the goal.

daattali commented 4 years ago

It would indeed be a nice feature if implemented well, but I will not be making it myself. I'm leaving this PR open in case anyone else wants to jump in and implement it. It would need to be heavily tested so as to not break any existing behaviour

Nicolabo commented 4 years ago

Hi @daattali, I would really want to help but unfortunately, I don't work in JS since then. So probably I wouldn't be the right person to do it right.

daattali commented 2 years ago

I'm going to close this PR as it's been inactive for a very long time. If anyone in the future wants to try to revive it, that would always be welcomed.