Splunk HTML/JS Cache

[jeffrey_charbon]

I am looking to add a Splunk footer link and another div to display a message to the footer. I've made several changes to html and js files without seeing the results in splunkweb though. I've emptied out the cache in splunk/var/run/splunk/appserver, tried the _bump url and set the 3 cache variables in web.conf. I am still unable to see any changes in the webpages.

Files Changed:

(added in a test div between the footer tags)
- splunk/share/splunk/search_mrsparkle/exposed/build/simplexml/index.js
- splunk/share/splunk/search_mrsparkle/exposed/js/build/simplexml.min/config.js
- splunk/share/splunk/search_mrsparkle/exposed/js/build/simplexml/config.js
- splunk/share/splunk/search_mrsparkle/exposed/js/build/splunkjs.min/config.js
- splunk/share/splunk/search_mrsparkle/exposed/js/build/splunkjs/config.js
- splunk/shate/splunk/search_mrsparkle/exposed/js/views/shared/Page.js

(attempted to append to the html)
- splunk/share/splunk/search_mrsparkle/exposed/js/splunkjs/mvc/footerview.js

(added a link)
- splunk/share/splunk/search_mrsparkle/exposed/js/views/shared/footer/Master.html

[alacercogitatus · Accepted solution]

No, no, no. 😄 You should never edit search_mrsparkle. The better way is to write some JS modules, and include them into the dashboard. This will update your footers dynamically on dashboard load. Much javascript, better, wow.

EDIT: So, for any links that you want, put them in the new_links array.

Put this in $APP_HOME/appserver/static/dashboard.js. Then hit the _bump endpoint.

require(['jquery', 'underscore', 'splunkjs/mvc', 'splunkjs/mvc/simplexml/ready!'],
function ($, _, mvc) {
var re = /^footer$/i,
    new_links = [ {"href": "www.google.com", "text": "Google"}]
_(mvc.Components.toJSON()).chain().filter(function (el) {
        var myId = $(el).attr("id") || "undefined",
        should_include = false;
    var isMyIDUndefined = (myId === "undefined");
    if (!isMyIDUndefined) {
        var matches = myId.match(re);
        var isMatchesNull = (matches === null);
        if (!isMatchesNull) {
            should_include = true;
        }
    }
    if (should_include) {
        console.log("returning " + $(el).attr("id"));
        return el;
    }
}).each(function (mytableView) {
    console.log(mytableView);
    var footer_div = $(mytableView.$el[0].childNodes[0].childNodes[0]);
    for (var k = 0; k < new_links.length; k++){
        footer_div.append('<a href="'+new_links[k].href+'" target="_blank">'+new_links[k].text+'</a>')
    }
    console.log(footer_div);
});
});

[jeffrey_charbon]

You Sir/Madam are a credit to society and deserve a medal!

I largely considered this impossible without a large rewrite of their code and nothing to find on Google. Since you're here (the other things I wrote off), instead of dashboard.js, is there another named.js to get the changes site wide? Also, do you happen to have a suggestion on adding a new div to the footer? So the html would read:

<footer role="contentinfo">
     <div>
          <div class="nav-pages>
              <a href>About</a>
              <a href>Support</a>
              <a href>etc...</a>
          </div>
          <div class="copyright-pages-enterprise></div>
     </div>
     <new div></new div>
</footer>

[alacercogitatus]

Well, I do have a fez. 😄 Adding a new div is easy. Just modify lines 23-25 in the example to do whatever you feel like to the Footer div. Append away!

And no, the most "site wide" you can do is dashboard.js in each app you have. And it only then applies to dashboards. There is not a "globally overwritten" js that I am aware of.

[alacercogitatus]

also, @jeffrey_charbonnet, find me in Slack or IRC. Lots of good resources for stuff like this. http://splk.it/slack

[richgalloway]

Have you tried restarting Splunk?