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
Get Updates on the Splunk Community!

Splunk Observability Cloud | Unified Identity - Now Available for Existing Splunk ...

Raise your hand if you’ve already forgotten your username or password when logging into an account. (We can’t ...

Index This | How many sides does a circle have?

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

Registration for Splunk University is Now Open!

Are you ready for an adventure in learning?   Brace yourselves because Splunk University is back, and it's ...