All Apps and Add-ons

ButtonSwitcher and JavaScript

paulathome
Path Finder

So I've added a new HTML module to the ButtonSwitcher in the default Search view (flashtimeline).
I put it first in the line up and it shows up in the first load of the page just fine.
I have also added a customBehavior so that OnContextChange it will hide the HTML module, which is a good start. But what I really want is to not hide the HTML but rather switch the "tabs" to the Event List when someone performs their first search.

Here are snippets of my code:

In the XML:

independent
True
splIcon-homepage
True

  <module name="HTML" layoutPanel="panel_row1_col1">
     <param name="customBehavior">switchTabsOnContextChange</param>
     <param name="html"><![CDATA[ <p>My Announcement here</p> ]]></param>
  </module>

In the application.js file:
if (typeof(Sideview)!="undefined") {
Sideview.utils.declareCustomBehavior("switchTabsOnContextChange", function(myTabSwitcher) {
// now override the onContextChange method
myTabSwitcher.onContextChange = function() {
this.hide("customBehavior hides the module initially");
alert("We are here");
}
});
}

What code do I need in my JavaScript to make the ButtonSwitcher go from the first tab to the second?

Thank you,
Paul

paulathome
Path Finder

Thanks Nick for the response, I had already started down the road of wrapping the ButtonSwitcher:

In the flashtimeline.xml I added a customBehavior module before the ButtonSwitcher and my custom ResultsHeader before the other three result tabs (Event list, Table and Chart).


switchTabsOnContextChange

if (typeof(Sideview)!="undefined") {
Sideview.utils.declareCustomBehavior("switchTabsOnContextChange", function(myTabSwitcher) {
var methodReference = myTabSwitcher.onContextChange.bind(myTabSwitcher);
myTabSwitcher.onContextChange = function() {
var buttonswitcher = this._children[0];
var activechildindex = buttonswitcher._activeChildIndex;
if (activechildindex == 0) {
buttonswitcher.setActiveChild(1);
}
return(methodReference);
}
});
}

And all of this appears to be working fine except that the checkCompatibilities code is acting up, so an events list search will often pick my home page tab.

My first query is 'system' and I will see my results in the event list as my custom code switched it to the second tab.

My second query is 'system | timechart c by host' and I click it to the chart tab.
Now if I run just 'system' again, it flips to my home page tab instead of the event list tab. Almost like the setActiveChild is going to 0 instead of using the tab title of Event List.
Would marking my tab as Incompatible be a good approach?

I must be missing something simple.

Or should I start over using a Switcher module?

So you are saying to insert a Switcher after my customBehavior and before the ButtonSwitcher and have a custom behavior use getModifiedContext()?

I'll look at the examples and try this way as well, I've got nothing but knowledge to gain.

Thanks again,
Paul

0 Karma

sideview
SplunkTrust
SplunkTrust

You're right in that ButtonSwitcher doesn't have a customBehavior param - only Sideview modules have that param, because the whole mechanism is part of Sideview Utils.

You could in theory patch ButtonSwitcher in application.js. It would look something like this:

if (Splunk.util.getCurrentView() == "my_view") {

    ....

    if (Splunk.Module.ButtonSwitcher) {
        Splunk.Module.ButtonSwitcher = $.klass(Splunk.Module.ButtonSwitcher, {
            onContextChange: function($super) {
                if (this._children.length>1) {
                    this.setActiveChild(1);
                }
                return $super();
            }
        });
    }

    ...

}

But this kind of patch is a bit tricky and probably there are some nuances that would lead you from ButtonSwitcher to it's superclass TabSwitcher and its superclass Switcher, and it's a wild ride.

What I recommend if you're using Sideview Utils already, is just use a Sideview Utils Switcher module to do the switching part, and then have a simple CustomBehavior module upstream from the switcher that returns the relevant context key from getModifiedContext() only on the very first push. If you need some examples of customBehaviors that implement getModifiedContext, there should be a few in Sideview Utils itself.

0 Karma

paulathome
Path Finder

After a lot of additional reading I've realized a few things.
A ButtonSwitcher can not have a custom behavior.
I don't really want to hide the first tab, I just want to switch tabs to the second one when a search is started.
A tab module under the ButtonSwitcher can capture an onContextChange event, but I can't figure out how to call the ButtonSwitcher's setActiveChild method to switch from the first tab to the second tab.

Does this mean that I need to wrap the ButtonSwitcher module with something that can have a custom behavior or find a way to call the parent's setActiveChild method?
Paul

0 Karma
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...