Search code examples
javascriptjquerysoundmanager2

Javascript/JQuery: How to redefine something?

Please pardon my "layman language", but I've been working at this for all day. I almost done customizing this but I just can't seem to wrap my head around this. I'm using Soundmanager (playlist). There's this part in the script that reads:

thisSound._data = {
          oLink: o, // DOM reference within SM2 object event handlers
          oLI: oLI,
          oControls: self.select('controls',oLI),
          oStatus: self.select('statusbar',oLI),
          oLoading: self.select('loading',oLI),
          oPosition: self.select('position',oLI), // HERE IT IS
          .......

        };

(This is what is setup after the page has finished loading):

controlTemplate = document.getElementById("my_sounds");
controlTemplate.innerHTML = [

      // control markup inserted dynamically after each page player link
      // if you want to change the UI layout, this is the place to do it.

      '  <div class="controls">',
      '   <div class="statusbar">',
      '    <div class="loading"></div>',
      '    <div class="position"></div>', // HERE'S WHAT "oPosition" IS CONNECTING TOO
      '   </div>',
      '  </div>'

    ].join('\n');

Now, I'm not using what Soundmanager has setup for me (<div class="position">...), but instead, I have a div somewhere on the page that'd I'd like to be the "new" oPosition (<div class="my_new_position_div">...).

So, in short, I want to have use my_new_position_div as my progress bar instead of the other div.

How do you redefine "oPosition" in this Soundmanger script?

full soundmanager script: page_player.js

Solution

  • I've erased my previous answer. I realized that wouldn't work a second after I posted it. The reason why is because the _data property is only set when it is first needed in a handleClick event (this is pretty bad coding). I was hoping I could find a way to keep the script in tact as much as possible, so you are not stuck with a patched version of somebody elses' handy work. But now it seems there is no other way non-intrusive way then to just replace the oPosition line with:

    oPosition: document.getElementById('my_new_position_div');

    You need to change <div class="my_new_position_div"> to <div id="my_new_position_div"> also.

    I suggest you place some big comments around this patched code. This will help you or somebody else working on this code to upgrade to newer versions in the future.