Hi everyone. I need an help to insert in a Modal View one splunk visualization contained in Event Timeline App. I wrote this code with splunk dev help ticketModalTest.js require([ 'underscore', 'backbone', '../app/Optimus/components/ModalViewTest', 'splunkjs/mvc', 'splunkjs/mvc/searchmanager', 'splunkjs/mvc/simplexml/ready!' ], function(_, Backbone, ModalView, mvc, SearchManager) { var ticket_modal_1 = mvc.Components.get('ticket_modal_1'); var tokens = mvc.Components.getInstance("submitted"); var detailSearch7 = new SearchManager({ id: "detailSearch7", earliest_time: "0", latest_time: "now", preview: true, cache: false, search: "index=optimus_execution_statistics_idx | stats latest(script_name) as script_name latest(execution_status) as execution_status latest(execution_started) as execution_started latest(execution_ended) as execution_ended latest(category_name) as category_name latest(execution_host) as execution_host by _time execution_id | where _time = $tok_snapshot_earliest$ | eval execution_started_unix = strptime(execution_started, \"%Y-%m-%d %H:%M:%S\")| sort limit=0 - execution_started| where _time >= relative_time(now(), \"-2d@d\")| stats values(execution_ended) as execution_ended values(eval(execution_id.\"|\".execution_host.\"|\".execution_started.\"|\".execution_ended)) as fullid by execution_started execution_id execution_host _time script_name execution_status| streamstats max(execution_ended) as execution_ended by execution_id | sort 0 _time| streamstats time_window=1h values(eval(execution_id.\"|\".execution_host.\"|\".execution_started.\"|\".execution_ended.\"|\".script_name)) as prev_fullid| mvexpand prev_fullid| rex field=prev_fullid \"(?<prev_execution_id>.*)\\|(?<prev_execution_host>.*)\\|(?<prev_execution_started>.*)\|(?<prev_execution_ended>.*)\\|(?<prev_script_name>.*)\"| fields - fullid prev_fullid| table execution_started execution_ended execution_id execution_host *| eval overlap = if(execution_started >= prev_execution_started AND execution_started <= prev_execution_ended, 1, 0)| eval cat = prev_execution_id| eval execution_started_unix = strptime(execution_started, \"%Y-%m-%d %H:%M:%S\")| eval execution_ended_unix = strptime(execution_ended, \"%Y-%m-%d %H:%M:%S\")| eval end=if(execution_status=\"In Progress\",now(),execution_ended_unix)| eval exclude=if(execution_started_unix = (relative_time(now(),\"@d\")-1) AND execution_ended_unix=(execution_started_unix-1) AND execution_status=\"Closed\",1,0)| eval start = execution_started_unix| eval color = case(execution_status=\"Closed\" and exclude=\"0\",\"#4FA484\", execution_status=\"Error\",\"#AF575A\", execution_status=\"Restarted\",\"#EC9960\", execution_status=\"In Progress\",\"#006d9c\")| eval group = if(len(substr(prev_execution_host, 8, len(prev_execution_host))) = 1, \"FCACLIP0\" + substr(prev_execution_host, 8, len(prev_execution_host)), \"FCACLIP\" + substr(prev_execution_host, 8, len(prev_execution_host)))| strcat cat \"|\" prev_script_name cat| eval label=cat | sort group| eval tooltip=cat | eval label=null|dedup tooltip | table label start end group color tooltip" },{tokens: true, tokenNamespace: "submitted"}); ticket_modal_1.on("click", function(e) { e.preventDefault(); if(e.data['click.name'] === '_time') { var tok_snapshot_earliest= e.data['click.value']; tokens.set('tok_snapshot_earliest',tok_snapshot_earliest); var _title = tok_snapshot_earliest +"Panels" var modal = new ModalView({ title: _title, search7: detailSearch7 }); modal.show(); } }); }); ModalViewTest.js define([ 'underscore', 'backbone', 'jquery', 'splunkjs/mvc', 'splunkjs/mvc/searchmanager', 'splunkjs/mvc/simplexml/element/table', 'splunkjs/mvc/visualizationregistry' ], function(_, Backbone, $, mvc, SearchManager, TableElement, VisualizationRegistry) { var modalTemplate = "<div id=\"pivotModal2\" class=\"modal\">" + "<div class=\"modal-header\"><h3><%- title %></h3><button class=\"close\">Close</button></div>" + "<div class=\"modal-body\"></div>" + "<div class=\"modal-footer\"></div>" + "</div>" + "<div class=\"modal-backdrop\"></div>"; var ModalView = Backbone.View.extend({ defaults: { title: 'Not set' }, initialize: function(options) { this.options = options; this.options = _.extend({}, this.defaults, this.options); this.childViews = []; console.log('Hello from the modal window: ', this.options.title); this.template = _.template(modalTemplate); }, events: { 'click .close': 'close', 'click .modal-backdrop': 'close' }, render: function() { var data = { title : this.options.title }; this.$el.html(this.template(data)); return this; }, show: function() { $(document.body).append(this.render().el); $(this.el).find('.modal-body').append('<div id="modalVizualizationTest"></div>'); $(this.el).find('.modal').css({ width:'90%', height:'80%', position: 'fixed', right: '0', left: '0', 'margin-right': 'auto', 'margin-left': 'auto', height: '80vh', 'overflow-y': 'auto', }); var customViz = VisualizationRegistry.getVisualizer('event-timeline-viz','event-timeline-viz'); var search7 = mvc.Components.get(this.options.search7.id); var myViz = new customViz({ id: "myViz", managerid: search7.name, drilldown: "none", el: $('modalVizualizationTest'), showPager: false, "link.openSearch.visible": "false", "link.exportResults.visible": "false", "link.inspectSearch.visible": "false", "refresh.link.visible": "false", "showLastUpdated": false }).render(); this.childViews.push(myViz); search7.startSearch(); }, close: function() { this.unbind(); this.remove(); _.each(this.childViews, function(childView) { childView.unbind(); childView.remove(); }); } }); return ModalView; }); Any suggestion about why this code doesn't work? Thanks
... View more