Greetings, I am trying to directly modify some files in the persona theme to include the slick carousel slider as a header. I've added it as an inline script in header.tpl and also changed my requirejs-config accordingly:
require.config({
baseUrl: "{relative_path}/src/modules",
waitSeconds: 3,
urlArgs: "{config.cache-buster}",
paths: {
'jquery': '../../vendor/jquery/js/jquery',
'forum': '../client',
'admin': '../admin',
'vendor': '../../vendor',
'mousetrap': '../../bower/mousetrap/mousetrap',
'slick': 'http://cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min'
},
shim: {
'slick' : ['jquery']
}
});
I find that the slider and site is working fine only on a fresh page load/reload. On a click of any button to navigate, the slider breaks and i get these errors:
Uncaught TypeError: $(...).timeago is not a function
Uncaught TypeError: $(...).tooltip is not a function
Uncaught TypeError: widgetAreas.find(...).timeago is not a function
Probably suggesting that jQuery was loaded more than once. I'm inclined to think that this has got something to do with how I've changed the requirejs above. However leaving out the above change will lead to:
Uncaught TypeError: Cannot read property 'fn' of undefined in slick.min.js
Possibly suggesting the jQuery wasn't loaded?
I've also looked and followed the tips here but nothing seems to work. I just feel that I'm really close to getting it done.