Stratus 2, jQuery and Adobe Muse

3.8k Views Asked by At

I am having trouble with the "Stratus 2" web-player on my website. I have downloaded and put "Jquery" into the public folder. It is named jquery.js

I have then attached the following code right before the end body tag.

<html class="html">
<head>

<script type="text/javascript">
   if(typeof Muse == "undefined") window.Muse = {}; window.Muse.assets = {"required":["jquery-1.8.3.min.js", "museutils.js", "jquery.scrolleffects.js", "jquery.musepolyfill.bgsize.js", "jquery.watch.js", "webpro.js", "musewpslideshow.js", "jquery.museoverlay.js", "touchswipe.js", "index.css"], "outOfDate":[]};
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://stratus.sc/stratus.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
    $.stratus({
      download: false,
      align: 'top',
      user:false,
      color:'E8C58B',
      links: 'https://soundcloud.com/man-in-a-loft-downtown/sets/the-latest'
    });
  });
</script>

I have also tried entering the code in the head tags too. The player doesn't show. Any thoughts?

I'm getting this error on the console

$.stratus is not a function

But I see that the stratus.js file did load.

FULL HEAD CODE: http://shrib.com/aA2V6JqX

Please take a look and edit accordingly.

2

There are 2 best solutions below

0
On BEST ANSWER

I'm listening to your music player right now after mucking around in your site, sounds nice!

You are loading two different versions of jQuery.

// version 1.8.3
window.Muse.assets = {"required":["jquery-1.8.3.min.js", "museutils.js", "jquery.scrolleffects.js", "jquery.musepolyfill.bgsize.js", "jquery.watch.js", "webpro.js", "musewpslideshow.js", "jquery.museoverlay.js", "touchswipe.js", "index.css"], "outOfDate":[]};

And 1.7.2

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

If you examine the generated HTML, you'll see that Muse is loading jQuery after your stratus plugin is loaded, therefore overwriting it.

A bad, but working solution is to wait until jQuery that Muse loads is loaded, but I don't know of an easy way to detect that, so you can just give it a busy wait. Remove your line that loads 1.7.2 and change your initialization script to

function checkjQuery() {
    if (window.jQuery) {
      $.getScript( "http://stratus.sc/stratus.js", function() {
        $.stratus({
          download: false,
          align: 'top',
          user:false,
          color:'E8C58B',
          links: 'https://soundcloud.com/man-in-a-loft-downtown/sets/the-latest'
        });
      });
    } else {
      setTimeout(checkjQuery, 10);
    }
}
checkjQuery();
2
On

Upgrade your jQuery version to 1.7 or more,And change $('body').stratus( insted of $.stratus(

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://stratus.sc/stratus.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$('body').stratus({
  links: 'https://soundcloud.com/iagoofficial/iago-hold-back'
 });
});
</script>
</head>
<body>
</body>
</html>