Bookmarklet templates for #rusichackday

basic.js

/**
 * Basic bookmarklet template.
 *
 * Change the `iframeSrc` variable to point to your space's new idea
 * page. You can adjust the iframe styles and position using the
 * `iframeStyle` variable.
 *
 * For turning this script into a bookmarklet, you should probably take
 * a look at https://gist.github.com/1856012.
 */
(function() {

  // This is the page that will display inside the iframe.
  var iframeSrc = 'http://hq.rusic.com/ideas/new';

  // Styles for the iframe.
  var iframeStyle = 'position: fixed; z-index: 999999; width: 500px; height: 300px; right: 0; top: 0; border: none; overflow: hidden; background-color: white;';

  // Create an iframe element and set some attributes.
  var iframe = document.createElement('iframe');
  iframe.setAttribute('src', iframeSrc);
  iframe.setAttribute('id', 'rusic-modal');
  iframe.setAttribute('style', iframeStyle);

  // Inject the iframe into the host page.
  var body = document.getElementsByTagName('body')[0];
  body.appendChild(iframe);

}).call(this);

index.js

(function(document) {

  // Grab the video id from the vimeo oembed api, then post it across to the space.

  var xhr = new XMLHttpRequest();

  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
      var iframe = document.createElement('iframe');
      iframe.setAttribute('src', 'http://hectic.rusic.com/ideas/new?custom1=' + JSON.parse(xhr.responseText).video_id);
      iframe.setAttribute('id', 'rusic-modal');
      iframe.setAttribute('style', 'position: fixed; z-index: 999999; width: 500px; height: 300px; right: 0; top: 0; border: none; overflow: hidden;');
      body = document.getElementsByTagName('body')[0];
      body.appendChild(iframe);
    }
  };

  xhr.open('GET', 'http://vimeo.com/api/oembed.json?url=' + encodeURIComponent(window.location.href), true);
  xhr.send(null);

})(document);

For a script to compile bookmarklets, check out the comments on this gist.