custom javascript in an app

[hiddenkirby]

Any good documentation or examples on this? ive seen several questions/answers involving jquery helping modules do custom things.

I'd love to see the baby steps first.

i assume the custom.js and jquery library go in the appserver/static folder but im not sure how to hook into splunk with javascript.

am i close?

[emma]

Hi Kirby,

It depends on what you're interested in doing. If you want to use your own custom JQuery in an app to affect the way app content is presented, you can do this and quite easily. I suggest you check out the Getting Started app that ships with Splunk. This app contains JQuery/custom JS that is used to show/hide menu items and TOC. That should be enough to get you started building your own custom JS into your app.

The other option for including custom JS is building a custom event renderer. This is useful if you want to change the way your events are displayed in Splunk Web. Documentation for this is here: http://www.splunk.com/base/Documentation/latest/Developer/EventRendering. In fact, I'd suggest perusing that entire section of the Developer Manual, since there are other options for customization that might work for you: http://www.splunk.com/base/Documentation/latest/Developer/CustomizationOptions

If you want to change the modules, as Nick mentioned, there is no documentation on this and there is no real support for doing this, yet.

Can you clarify what exactly you're interested in doing with your JS/JQuery and then we can give you more specific instructions?

Thanks!

--Emma

[hiddenkirby]

Thank you Emma!

[sideview · Accepted solution]

No im afraid there is no documentation and there are no public examples. We had our hands full designing, building, documenting and testing the UI and the view-development layer and getting it all out there. We totally know that we'll have to open up and document a deeper layer for more developer use cases, and whatever the decision, we'll have to spend time building examples and tools where today there are none or almost none. There's a fair bit of anxiety as to what any of that even means. It may be resulting in another major rewrite of the entire front-end codebase again but I'm less involved so i dont really know.

Short version - my caveat on the other question is for real - to put it more starkly the only way to proceed is going to involve a lot of time digging through source code. If you dont have several hours at the beginning to do masochistic random walks through the codebase and the comments, you wont make it out the other side.

but your app can have a single JS file that it contributes, and you put that file at 'appserver/static/application.js'. I dont think any other file will get picked up.

You dont have to put jquery in yourself because it will already be there courtesy of splunk.

to go back up to 10,000 feet, custom development as a general topic falls into the following bullets:

• accept the limited things you can do at the custom css layer. http://www.splunk.com/base/Documentation/4.1.2/Developer/UseCSS
• create an application.js file in your app, and do some cosmetic/prosthetic surgery on existing modules as I mentioned in http://answers.splunk.com/questions/2381/form-input-suggestions-google-suggest If you're familiar with jquery and you are comfortable with ajax development you could achieve some success with this approach.
• using the IFrameInclude module to pull some limited piece of content in from another place. If this content becomes 'functionality' this becomes a great deal harder. There's one example in the 4.1 ui_examples but there's essentially no docs again.
• using a very simple view with no nav and no chrome and putting that view inside an iframe within some other UI. Again if you want crosstalk between the functionality in one and the other, we have no docs, utils nor debugging tools so this will be very hard at the moment.
• developing your own module class. While theoretically not very hard there's a ton of hoops and obstacles we inadvertently left in your way by not paying attention to this use case during 4.0 release. I do NOT recommend attempting it until some example exists in the ui_examples app
• using the core splunk javascript classes over in your own UI in your own webserver, and creating a proxy from your host and port over to splunkd's management port so you dont hit the brick wall of XSS security stuff. (core splunk classes have NO documentation anywhere beyond the comments in the files, so unless you have a master JS reverse-engineerer, i'd avoid it until we have docs and tools)
• build everything yourself on top of webserver/appserver of your choice, and integrate against the rest API

[hiddenkirby]

You rock my friend. Keep up the great work. It is indeed appreciated. This is a great product.