Security

Uncaught TypeError: showcase.Cloud9Carousel is not a function

nagar57
Communicator

I am trying to implement animations as mentioned in below post:

https://www.splunk.com/blog/2017/04/25/animate-simplexml-dashboard-elements-with-a-carousel.html

Below is my carousel.js file:

 require([
        'underscore',
        'jquery',
        'splunkjs/mvc',
        'splunkjs/mvc/simplexml/ready!',
        '/static/app/search/js/lib/jquery.cloud9carousel.js'
    ], function(_, $, mvc, Carousel) {
    var showcase = $("#showcase");

    showcase.Cloud9Carousel( {
        yOrigin: 42,
        yRadius: 40,
        itemClass: "dashboard-cell",
        autoPlay: 1,
        bringToFront: true,
        onLoaded: function() {
          showcase.css( 'visibility', 'visible' )
          showcase.css( 'display', 'none' )
          showcase.fadeIn( 1500 )
        }
      } )

});

Below is my carousel.css file:

#showcase {
      height: 570px;
      overflow: visible !important;
    }

My cloud9carousel.js is placed at "/static/app/search/js/lib/jquery.cloud9carousel.js"
I even tried adding below at the starting of jquery.cloud9carousel.js file:

require([
'jquery'
], function($) {

But still no luck.
I am getting following error in my javascript developer console on browser:

Uncaught TypeError: showcase.Cloud9Carousel is not a function
     at eval (eval at globalEval (common.js:15), <anonymous>:17:11)
     at Object.execCb (eval at module.exports (common.js:139), <anonymous>:1658:33)
     at Module.check (eval at module.exports (common.js:139), <anonymous>:874:51)
     at Module.eval (eval at module.exports (common.js:139), <anonymous>:1121:34)
     at eval (eval at module.exports (common.js:139), <anonymous>:132:23)
     at eval (eval at module.exports (common.js:139), <anonymous>:1164:21)
     at each (eval at module.exports (common.js:139), <anonymous>:57:31)
     at Module.emit (eval at module.exports (common.js:139), <anonymous>:1163:17)
     at Module.check (eval at module.exports (common.js:139), <anonymous>:925:30)
     at Module.enable (eval at module.exports (common.js:139), <anonymous>:1151:22)
 VM650:766 Uncaught TypeError: depMaps.slice is not a function
     at Module.init (eval at module.exports (common.js:139), <anonymous>:766:51)
     at eval (eval at module.exports (common.js:139), <anonymous>:1424:36)

Can anyone help and guide me what I am doing wrong? I added row id="showcase" in my dashboard as well.

Tags (1)
0 Karma
Got questions? Get answers!

Join the Splunk Community Slack to learn, troubleshoot, and make connections with fellow Splunk practitioners in real time!

Meet up IRL or virtually!

Join Splunk User Groups to connect and learn in-person by region or remotely by topic or industry.

Get Updates on the Splunk Community!

Meet Splunk Observability Studio: AI-Assisted OpenTelemetry Instrumentation Without ...

Instrumentation is usually the last step or even an afterthought when building out a project. The feature ...

Federated Search for Cisco Security and Analytics Logging (SAL) is now GA on Splunk ...

Federated Search for Cisco  Security Analytics and Logging (SAL) is now generally available as part of the ...

Your Path to AgenticOps: AI Experiences for Every Splunk Practitioner

Your Path to AgenticOps: AI Experiences for Every Splunk Practitioner   Join us for a demo-driven look at how ...