FlexDashboard - spinner? And/or detecting page events

I'm writing lots of FlexDashboard apps at the moment - they're quick and fun to write.

To give an indication of "busy" while data loads I'm using a "spinner" based on https://stephanwagner.me/only-css-loading-spinner

I can get this to show using the shiny recalculating class:

@keyframes spinner {
  to {transform: rotate(360deg);}

.recalculating:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  margin-left: -10px;
  border-radius: 50%;
  border: 2px solid #ccc;
  border-top-color: #000;
  animation: spinner .6s linear infinite;

This solution works really well within a page.

However, it doesn't work so well across pages - when a user clicks between pages, then the shiny binding logic is what tells the chart shims to update - so there isn't a recalculating event to hook into.

Can anyone suggest any way to hook into the page change events in Flex/Shiny - or to hook into the Shiny binding refresh mechanism (when a shim becomes visible) - if there was some way to set another class when that happens it'd make adding spinners much easier.

Open to all ideas really!

1 Like

This topic was automatically closed 54 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.