cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
601
Views
1
Helpful
3
Replies

Can a gadget determine whether at page level or within tab

andysteel
Level 1
Level 1

Hi,

What's the best way for a gadget to determine whether it's configured at the Page level (i.e. like the Call Control Toolbar) or under a specific Tab. I'd like to make the gadget behave/appear differently between the two scenarios. Especially the removal of the gadget header and padding - which I know how to do, but want to see if it's possible to do this based upon deployment configuration.

thanks

1 Accepted Solution

Accepted Solutions

Actually I found a more preferable way without changing the XML.

I call the following function, which will return the id of the tab that the gadget is within. If at page level then it'll return null. I just check the return and if not null do whatever I need to the gadget appearance.

finesse.containerservices.ContainerServices.getMyTabId();


Here's how I use the code, which works in 11.5 (not checked earlier versions yet)

  /**

   * adjustDisplay()

   *

   * If this gadget is embedded within a Finesse TAB then optionally remove the padding

   * and tab title, and anything else.

   *

   * Call this after finesse container services have been initialised.

   *

   * options : { hidePadding:true,

   *             hideTitle:true,

   *             hideGadget:false,

   *             callback:function(tabid, gadgetid, elemTitle, elemContent)

   *           }

   */

  adjustDisplay: function (options) {

    if (!finesse || !finesse.containerservices || !finesse.containerservices.ContainerServices) {

      throw "finesse container services not initialised yet!";

    }

    options = options || {};

    var myGadgetId = finesse.containerservices.ContainerServices.getMyGadgetId(); /*10*/

    var c = "#gadgets-gadget-content-" + myGadgetId; /* content */

    var t = "#finesse_gadget_" + myGadgetId + "_title"; /* title */

    var myTabId = finesse.containerservices.ContainerServices.getMyTabId(); /*FraudHub*/

    if (myTabId)

    {

      /* within a tab so want to remove padding and gadget title, unless told otherwise */

      if (options.hidePadding || (typeof options.hidePadding === 'undefined')) {

        parent.window.$(c).css({"padding":"0px"});

      }

      if (options.hideTitle || (typeof options.hideTitle === 'undefined')) {

        parent.window.$(t).hide();

      }

    }

    /* within page or tab */

    if (options.hideGadget) {

      /* hide title + content */

      parent.window.$(t).hide();

      parent.window.$(c).hide();

    }

    /* optional callback function */

    if (options.callback)

    {

      /* callback option */

      options.callback(myTabId, myGadgetId, t, c);

    }

  },

View solution in original post

3 Replies 3

dekwan
Cisco Employee
Cisco Employee

Hi Andy,

I don't know of a way for the gadget to know if it is in the Page level or under a specific tab, but I have an idea for you. Since you have to manually modify the Finesse desktop layout to put the gadget either at a page level or at a tab level, what if you added a parameter to the gadget that you can use as a flag in your gadget.

What I mean is, you can do something like <gadget>/3rdpartygadget/files/myGadget.xml?gadgetLocation=Page</gadget> and <gadget>/3rdpartygadget/files/myGadget.xml?gadgetLocation=Tab</gadget>.


Then in the gadget, you can parse out the value of gadgetLocation and use that to make the gadget appear differently. If you want an example on how to parse out the parameters, take a look at the _initializeGadgetURLParams method of the SparkTeamAnnouncementGadget.

I hope this idea works for you.

Thanx,

Denise

Actually I found a more preferable way without changing the XML.

I call the following function, which will return the id of the tab that the gadget is within. If at page level then it'll return null. I just check the return and if not null do whatever I need to the gadget appearance.

finesse.containerservices.ContainerServices.getMyTabId();


Here's how I use the code, which works in 11.5 (not checked earlier versions yet)

  /**

   * adjustDisplay()

   *

   * If this gadget is embedded within a Finesse TAB then optionally remove the padding

   * and tab title, and anything else.

   *

   * Call this after finesse container services have been initialised.

   *

   * options : { hidePadding:true,

   *             hideTitle:true,

   *             hideGadget:false,

   *             callback:function(tabid, gadgetid, elemTitle, elemContent)

   *           }

   */

  adjustDisplay: function (options) {

    if (!finesse || !finesse.containerservices || !finesse.containerservices.ContainerServices) {

      throw "finesse container services not initialised yet!";

    }

    options = options || {};

    var myGadgetId = finesse.containerservices.ContainerServices.getMyGadgetId(); /*10*/

    var c = "#gadgets-gadget-content-" + myGadgetId; /* content */

    var t = "#finesse_gadget_" + myGadgetId + "_title"; /* title */

    var myTabId = finesse.containerservices.ContainerServices.getMyTabId(); /*FraudHub*/

    if (myTabId)

    {

      /* within a tab so want to remove padding and gadget title, unless told otherwise */

      if (options.hidePadding || (typeof options.hidePadding === 'undefined')) {

        parent.window.$(c).css({"padding":"0px"});

      }

      if (options.hideTitle || (typeof options.hideTitle === 'undefined')) {

        parent.window.$(t).hide();

      }

    }

    /* within page or tab */

    if (options.hideGadget) {

      /* hide title + content */

      parent.window.$(t).hide();

      parent.window.$(c).hide();

    }

    /* optional callback function */

    if (options.callback)

    {

      /* callback option */

      options.callback(myTabId, myGadgetId, t, c);

    }

  },

Hi Andy,

I'm glad that you found a solution to your issue. Thank you for sharing your solution for others to use too.

Thanx,

Denise