Giter Club home page Giter Club logo

Comments (2)

DivadNojnarg avatar DivadNojnarg commented on August 25, 2024

This is what I get from the shiny trace:

Listening on http://127.0.0.1:3013
SEND {"config":{"workerId":"","sessionId":"eba824b9842bfd3e1daf2b8c11a99b50","user":null}}
RECV {"method":"init","data":{".clientdata_output_plot_width":788,".clientdata_output_plot_height":400,".clientdata_output_plot_hidden":false,".clientdata_output_distPlot_hidden":true,".clientdata_pixelratio":1,".clientdata_url_protocol":"http:",".clientdata_url_hostname":"127.0.0.1",".clientdata_url_port":"3013",".clientdata_url_pathname":"/",".clientdata_url_search":"",".clientdata_url_hash_initial":"",".clientdata_url_hash":"",".clientdata_singletons":"7874ab6bc8e88ce841e7bc770d9fcdcd0e0032e3",".clientdata_allowDataUriScheme":true}}
SEND {"busy":"busy"}
SEND {"recalculating":{"name":"plot","status":"recalculating"}}
SEND {"recalculating":{"name":"plot","status":"recalculated"}}
SEND {"busy":"idle"}
SEND {"errors":[],"values":{"plot":{"src":"data:image/png;[base64 data]","width":788,"height":400,"coordmap":{"panels":[{"domain":{"left":-1,"right":26,"bottom":-0.68,"top":17.68},"range":{"left":59.04,"right":757.76,"bottom":325.56,"top":58.04},"log":{"x":null,"y":null},"mapping":{}}],"dims":{"width":788,"height":400}}}},"inputMessages":[]}

As you can see, the distPlot is hidden even when the collapse button is clicked. This mean that I need to create a jQuery event that will make the card content show when collapse is pressed, and inversely.

This is what happens between tabs in the sidebar and in the body: without jQuery nothing is displayed. See below (in shinydashboard.js):

// When document is ready, if there is a sidebar menu with no activated tabs,
// activate the one specified by `data-start-selected`, or if that's not
// present, the first one.
var ensureActivatedTab = function() {
  var $tablinks = $(".sidebar-menu a[data-toggle='tab']");

  // If there's a `data-start-selected` attribute and we can find a tab with
  // that name, activate it.
  var $startTab = $tablinks.filter("[data-start-selected='1']");
  if ($startTab.length === 0) {
    // If no tab starts selected, use the first one, if present
    $startTab = $tablinks.first();
  }

  // If there are no tabs, $startTab.length will be 0.
  if ($startTab.length !== 0) {
    $startTab.tab("show");

    // This is indirectly setting the value of the Shiny input by setting
    // an attribute on the html element it is bound to. We cannot use the
    // inputBinding's setValue() method here because this is called too
    // early (before Shiny has fully initialized)
    $(".sidebarMenuSelectedTabItem").attr("data-value",
      $startTab.attr("data-value"));
  }
};

If no tab is selected by the user, the first one is selected. They also add the "show" even to the related tab so that the content is displayed.

By the way, I need to see in the bootstrap 4 documentation what is available for card since it is different from a tab.

from bs4dash.

DivadNojnarg avatar DivadNojnarg commented on August 25, 2024

I also fixed the icon: + then the card is collapsed and - when it is uncollapsed

from bs4dash.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.