hideEnvironment - Hide web elements in Header & Toolbar in embedded iFrame dashboard

Comments

9 comments

  • Avatar
    Tripti Jaiswal

    Hi Mitch,

    Try this.Replace the code.

    prism.run([function() {
    var supportedRoles = ['consumer']; // case sensitive
    prism.on("dashboardloaded", function(se,ev) {
    ev.dashboard.on("widgetrender", function(se,ev) {
    if ($("div iframe").length > 0) {
    if (supportedRoles.indexOf(prism.user.roleName) > -1) {
    $(".prism-header__logo").hide();
    $('.header-toolbar__link.js--user-menu').hide();
    $('.header-menu__link.js--menu-link-analytics').hide();
    }
    }
    });
    });
    }])

    Hope this works.

    Thanks
    Tripti

    QBeeQ

    qbeeq.pl

    Official Sisense Partner

    2019 Sisense Partner of the year

    0
    Comment actions Permalink
  • Avatar
    Mitch Siwy

    Hi Tripti,

    Thanks for the code and missing element piece. Unfortunately the code did not work in our environment running v8.1. I'm afraid the latest update broke something that's not allowing the code to work. 

    0
    Comment actions Permalink
  • Avatar
    Moti Granovsky (Edited )

    Hi Mitch!

    With version 8.1 the entire header component was re-designed and there is now a brand new Javascript API dedicated to it!

    You can find more information about it in the version's release notes, and in the API reference

    For example, to hide the logo instead of:

    $(lmnt).find('.prism-header__logo').hide()

    Which relies on a specific CSS class name, you can now use:

    // Do this only once in your code
    var headerAPI = prism.getApi('api.v1.header');

    // And hide the logo when needed
    headerAPI.hideLogo();

    Additional functionality to modify any other element, such as the user icon, is also available!

    0
    Comment actions Permalink
  • Avatar
    Ravid Paldi

    Moti Granovsky, this is superb! 

    Mitch, following Moti's tip, if you wish to entirely hide the header you can use a much simpler code.

    Here is a quick code snippet that should do the trick (yes, that single line should replace the ENTIRE code of the plugin)

    prism.run([function() {
      prism.getApi('api.v1.header').hide();
    }

    Let me know if it worked and if you need any further assistance. 

    Cheers,

    Ravid

    Paldi Solutions

     

    0
    Comment actions Permalink
  • Avatar
    Moti Granovsky

    Thanks Ravid! The DevX team worked really hard on this API module and any feedback on the new approach we're taking is greatly appreciated!

    Just a note about replacing the code: Not all of it, since the plugin also detects if the Sisense application is opened in an iFrame and checks the user's role - these parts of the code should remain in place.

    Additionally, when using only the new header API, there is no need for `prism.run`! Over time as we release new API modules using this approach the need to use `prism.run` will decrease, making plugin code cleaner and easier to work with.

    0
    Comment actions Permalink
  • Avatar
    Ravid Paldi

    Moti Granovsky, you are correct. I'll revise the code snippet. 

    For now, I'll keep in inside the prism.run as I'm not sure which other usage they would want to do with this function. 

    This HeaderAPI and in general this new approach of providing that functionality over a unified API is great and highly appreciated direction. Well Done DevX Team! 

     

    Mitch, here is the revised that should do the trick:

    prism.run([function() {
    const supportedRoles = ['consumer']; // case sensitive

    const isInIframe = window.location != window.parent.location;
    const isSupportedRole = supportedRoles.indexOf(prism.user.roleName) > -1;

    if(isInIframe && isSupportedRole){
    prism.getApi('api.v1.header').hide();
    }
    }

     

    0
    Comment actions Permalink
  • Avatar
    Mitch Siwy

    Hey Guys,

    Thanks for the help and feedback, much appreciated. Unfortunately I haven't been able to get it working with the supplied samples above or my code below. What am I doing wrong?

    prism.run([function() {
    var supportedRoles = ['consumer']; // case sensitive
    var headerAPI = prism.getApi('api.v1.header');
    prism.on("dashboardloaded", function(se,ev) {
    ev.dashboard.on("widgetrender", function(se,ev) {
    if ($("div iframe").length > 0) {
    if (supportedRoles.indexOf(prism.user.roleName) > -1) {
    headerAPI.hideLogo();
    }
    }
    });
    });
    }]) 

    0
    Comment actions Permalink
  • Avatar
    Moti Granovsky

    Hi Mitch,

    Could you check if you're getting any errors?

    If not, check what's the value of the 'headerAPI' variable - I've seen some cases where the 'getApi' method fails because during installation a file needed for this API wasn't deployed correctly, and while our team investigates this issue to make sure it won't happen anymore I can provide you with the missing file and instructions if that's the issue.

    0
    Comment actions Permalink
  • Avatar
    Mitch Siwy

    I'm testing with the latest 8.1.1 version and still no luck. The console isn't throwing my any errors with the above code. I only get errors when I have the wrong code for the hideEnvironment widget.

     

    If you think you have a solution, I'm all hears. My support ticket is (# 129640).

    Mitch

     

     

    0
    Comment actions Permalink

Please sign in to leave a comment.