title: Should every object have a method 'addEventListener'?
body: <p>I needed a function to generate a pseudo-random integer between m and n, and so I thought, "I know, I'll extend Math with a <code>randrange</code> method, similar to Python's".</p>
  
  <pre><code>Math.constructor.prototype.rand = function rand(min, max) {
      return min + Math.floor(Math.random() * (max + 1 - min));
  };
  </code></pre>
  
  <p>This seems to work, but when I put it into my integrated code, I experienced multiple problems with error messages like "[that function] has no method 'addEventListener'".</p>
  
  <p>The gist of my question is this: Is there something fundamentally wrong with the way I've extended <code>Math</code> here? Should that function have such a method, and if not, why is jwplayer asking for it?</p>
  
  <p>I've attached much more detail below, but if you're already bored and want to start postulating answers, you can skip the rest.</p>
  
  <hr>
  
  <p>When I went to test the integrated code I saw this error:</p>
  
  <pre><code>jwplayer.js:1 Uncaught TypeError: Object function rand(min, max) {
          return min + Math.floor(Math.random() * (max + 1 - min));
      } has no method 'addEventListener'
  jwplayer.js:1 a.plugins.pluginloader.load
  jwplayer.js:1 a.embed
  jwplayer.js:1 b.api.setup
  script.js:155 (anonymous function)
  jquery-1.6.4.js:660 jQuery.extend.each
  jquery-1.6.4.js:274 jQuery.fn.jQuery.each
  script.js:150 jQuery.click.window.Modernizr.input.required
  jquery-1.6.4.js:1016 jQuery.extend._Deferred.deferred.resolveWith
  jquery-1.6.4.js:437 jQuery.extend.ready
  jquery-1.6.4.js:923 DOMContentLoaded
  </code></pre>
  
  <p>Here's a snippet from script.js that the above refers to:</p>
  
  <pre><code>// Setup the video player:
  $("video").each(function (i, e) {
      // Switching out ids like this is a horrible hack,
      // but apparently it's the only way jwplayer will load.
      var oldId = $(e).attr('id');
      $(e).attr("id", "tmpVideoSetup");
      jwplayer("tmpVideoSetup").setup({
          flashplayer: window.CDN + "/js/libs/mediaplayer-5.7-licensed/player.swf",
          levels: [
              // TODO: set this up to dynamically choose the videos to play.
              { file: window.CDN + "/videos/LK_About.mp4" },
              { file: window.CDN + "/videos/LK_About.wmv" }
          ]
      });
      $(e).attr("id", oldId);
  });
  </code></pre>
  
  <p>When I remove the video-loading code, everything else behaves as expected.</p>