not yet in v31
new snipt encoded id: uSw2 Simple SniptBox Prototype Widget - Snipt.org

The Easiest Way to Save and Share Code Snippets on the web

Your snipt has been migrated to #newsnipt successfully.

Simple SniptBox Prototype Widget

javascript | by: swirleydude

last edit: Jun, 23rd 2009 | jump to bottom

<html>
  <!-- To use this widget call 'new com.JawTek.widgets.snipt.SniptBox('username', 'htmlElement');' -->
 
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>
      My Snipt Box
    </title>
  </head>
 
  <body>
    <div id="snipts">
    </div>
    <script src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js"
    type="text/javascript" language="javascript" charset="utf-8">
    </script>
    <script type="text/javascript" language="javascript" charset="utf-8">
      var com = com || {};
      com.JawTek = com.JawTek || {};
      com.JawTek.widgets = com.JawTek.widgets || {};
      com.JawTek.widgets.snipt = com.JawTek.widgets.snipt || {};
      com.JawTek.widgets.snipt.snipt_callbacks = com.JawTek.widgets.snipt.snipt_callbacks || {};
      com.JawTek.widgets.snipt.SniptBox = Class.create({
        initialize: function(username, container) {
          this.username = username;
          this.container = $(container);
          var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22http%3A%2F%2Fsnipt.org%2Fbox%2F" + encodeURIComponent(this.username) + "%2F%22%20and%20xpath%3D'%2F%2Fdiv%5B%40id%3D%22accordian%22%5D%2F*'&format=json&callback=";
          this.makeCallback(url, this.sniptBoxCallback.bind(this));
        },
        makeCallback: function(url, callback) {
          var uid = (new Date()).getTime();
          com.JawTek.widgets.snipt.snipt_callbacks[uid] = function(json) {
            delete com.JawTek.widgets.snipt.snipt_callbacks[uid];
            callback(json);
          };
          url = url + encodeURIComponent("com.JawTek.widgets.snipt.snipt_callbacks[" + uid + "]");
          var script = new Element('script', {
            src: url
          });
          $$('body')[0].insert(script);
        },
        sniptBoxCallback: function(json) {
          var snipt = json.query.results;
          var cnt = 0;
          for (var i = 1; i < snipt.div.length; i = i + 2) {
            var item = {};
            item.title = snipt.div[i].div[0].p;
            item.lang = snipt.div[i].div[1].p;
            item.link = snipt.a[cnt].href;
            item.id = item.link.substring(item.link.length - 3);
            cnt++;
            var div = new Element('div', {
              id: 'snipt-' + item.id
            });
            var url = 'http://jania.pe.kr/u/jsonp.cgi?url=' + encodeURIComponent('http://snipt.org/embed/widget.js.php?snipt=' + item.id) + '&callback=';
            this.makeCallback(url, this.sniptItemCallback.bind(item));
            this.container.insert(div);
          }
 
        },
        sniptItemCallback: function(json) {
          var script = json.content;
          var rgx = new RegExp("var content = '(.*)';");
          var snipet = rgx.exec(script);
          $('snipt-' + this.id).update(snipet[1]);
          $('snipt-' + this.id).down('.snipt_widget_code').hide();
          $('snipt-' + this.id).down('.snipt_widget_meta_container').observe('click',
          function() {
            $$('.snipt_widget_code').invoke('hide');
            $('snipt-' + this.id).down('.snipt_widget_code').show();
          }.bind(this));
 
        }
      });
      Event.observe(window, "load",
      function(e) {
        var sniptBox = new com.JawTek.widgets.snipt.SniptBox('swirleydude', $('snipts'));
        var link = new Element('link', {
          type: "text/css",
          rel: "stylesheet",
          href: "http://snipt.org/embed/widget.css"
        });
        $$('head')[0].insert(link);
      })
    </script>
  </body>
 
</html>
38 views