Probably a noob deal.


My custom theme has a simple JS attachment in the .info file like so:

scripts[] = jchwebdev.js

The code runs fine so long as no one is logged in, or so long as the logged in user is -not- the Admin. Actually, what I mean is that the code runs fine so long as the -toolbar- is not loaded.

In the Firebug Console I see this error (but again, only when the toolbar is displayed.)

TypeError: $.cookie is not a function

nodeName(j=Object[div#toolbar.toolbar], s=function(),  v=div#toolbar.toolbar)jquery.js?v=1.4.4 (line 34)

toArray(j=function(), s=undefined)jquery.js?v=1.4.4 (line 27)

once(id="toolbar", fn=function())jquery...s?v=1.2 (line 55)

attach(context=Document config)toolbar.js?mnxwdq (line 12)

(?)()drupal.js?mnxwdq (line 55)

nodeName(j=Object { overlayParent={...}, contextualLinks={...}, initColorbox={...}, more...}, s=function(), v=undefined)jquery.js?v=1.4.4 (line 34)

attachBehaviors(context=Document config, settings=Object { basePath="/", ajaxPageState={...}, colorbox={...}, more...})drupal.js?mnxwdq (line 53)

(?)()drupal.js?mnxwdq (line 391)

noConflict(j=function())jquery.js?v=1.4.4 (line 30)
inArray()jquery.js?v=1.4.4 (line 38)
[Break On This Error]   
var collapsed = $.cookie('Drupal.toolbar.collapsed');

So I'm assuming that I have an error in my little JS module because when I remove that JS the console error goes away. But I can't figure out why the two are related?


Below is the source JS:

        (function ($) {
            Drupal.behaviors.myfunction = {
                attach: function (context, settings) {

        //Start of xfadeshow


                jchSlider: function(options) {
                     //Set the default values, use comma to separate the settings, example:

                    var defaults = {
                            padding: 20,
                            delayTime: 7000,
                            func : {}

                    var options =  jQuery.extend(defaults, options);

                    return this.each(function() {
                         var o = options;   

                    var slider = jQuery(this);
                    var lSlider = slider.children().size();         
                    var sliderID = jQuery(slider).attr('id');
                    var selector = jQuery(this).next();
                    var selectorID = jQuery(slider).attr('id');
                    var animationType = jQuery(slider).hasClass("fade");

                    var play;
                    var jQueryactive = jQuery(selector).children('li:first');
                    var jQuerysactive  = jQuery(slider).children('li:first');       
                    var maxh = 0;


                    // alert( jQuery(slider).html() );

                    jQuery(slider).children().each(function(i) {
                            maxh = Math.max(maxh, jQuery(this).height());           

                        jQuery(slider).css('height', maxh);

                        jQuery(selector).children().click(function(e) {
                            jQueryactive  = jQuery(this);

                            //normally there is no <a> required. Click on li to navigate
                            // if clicked on an <a> link inside the slideshow
                            if( jQuery(e.target).prop('tagName') == 'A' )
                                return true;

                            var inD = jQuery('#selector li').index(this);               
                            jQuerysactive = jQuery('#slideshow > li:eq(' + inD + ')' );

                            //Reset Timer
                            clearInterval(play); //Stop the rotation
                            slideShow(); //Trigger rotation immediately
                            slideSwitch(); // Resume rotation
                            return false;

                     //On Hover
                     jQuery(slider).children('> li').hover( function() {
                             clearInterval(play); //Stop the rotation
                     }, function() {
                            jQueryactive = jQuery(selector).children('li.active').next();
                            jQuerysactive = jQuery(slider).children('li.active').next(); //go back to first                                         
                                    if ( jQueryactive.length === 0) { //If paging reaches the end...
                                        jQueryactive = jQuery(selector).children('li:first'); //go back to first
                                        jQuerysactive = jQuery(slider).children('li:first'); //go back to first                     
                            slideShow(); //Trigger rotation immediately
                            slideSwitch(); // Resume rotation

                     var slideSwitch = function( func ) {
                            // alert( typeof func);              
                            if( typeof func == 'function'  ) {
                                inD = jQueryactive.index();
                            // alert('inD-SW ' + inD);

        //                  sCurrentIndex = jQueryactive.index();
        //                  if( sCurrentIndex = lSlider-1)

                            jQuery(selector).children().removeClass('active'); //Remove all active class
                            jQuery(slider).children().removeClass('active'); //Remove all active class

                        //Rotation + Timing Event
                     var slideShow = function(){        
                            play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds
                            jQueryactive = jQueryactive.next();
                            jQuerysactive = jQuerysactive.next(); //go back to first                                            
                            if ( jQueryactive.length === 0) { //If paging reaches the end...
                                jQueryactive = jQuery(selector).children('li:first'); //go back to first
                                jQuerysactive = jQuery(slider).children('li:first'); //go back to first                     
                            slideSwitch(o.func);}, o.delayTime); //Timer speed in milliseconds (3 seconds)



             }    // options

             });  // extends

        //End of slideshow
            jQuery('#home-slideshow').jchSlider({delayTime: 4000, func: function(inD){ 
                 if(inD==6) jQuery('#top_slogan').css('opacity',0); else jQuery('#top_slogan').css('opacity',1);                                                                                                                                              // if(inD==7) jQuery('#get_started').show(); else jQuery('#get_started').hide(); 

        // don't touch anything below here
  • Are you using the contrib Admin Menu or the default toolbar? Can you provide a link or the html within #slideshow-wrapper & #home-slideshow so that I can test it? Also, can you confirm that toolbar.js is being attached (Trying to figure out if only the library is missing or all of the toolbar module attachments). – Chris Rockwell Jun 21 '13 at 20:47
  • The default toolbar. I just added the URL: drupal.christmate.com. -My- JS -is- being loaded, but the console gives an error with the -cookie- from the toolbar which makes me think there's something in my function drupal dislikes. You won't see the error though, since you're not the Admin. – jchwebdev Jun 21 '13 at 20:55
  • I'll look at it more later, but I was able to copy your html,css, and js, throw in some dummy images and it works fine for me with the core toolbar enabled. What version of jQuery? – Chris Rockwell Jun 21 '13 at 21:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.