Fluid userscript for Friendfeed and Mento

posted 12:07AM Apr 26, 2008 with tags fluid friendfeed greasekit growl macosx mashup mento by Lars Trieloff

Being alone this evening I had the opportunity to spend some time programming interesting stuff. As I am currently researching lifestreaming applications, in particular Friendfeed, which is an excellent implementation of this concept I wrote a plugin for Blogbridge that will automatically send "pinned" entries to Friendfeed, similar to "shared items" in Google reader. Secondly, I got an invite to Mento, a social link sharing application (not bookmarking) that is focused around finding interesting links and sending them to friends, services (like Twitter, Friendfeed or del.icio.us/trieloff) or channels, which lead to my third activity: Integrating Friendfeed and Mento.

As Friendfeed is giving me lots of input from interesting people, I would like to save some links directly from the Friendfeed interface. Additionally, I am using Fluid in order to create a site-specific browser (SSB) for Friendfeed, basically a small desktop application that does nothing but running Friendfeed. Aside from this interesting concept, which is also being implemented by Mozilla Prism for instance, Fluid is currently the best implementation of this concept. Todd, the developer is working hard to integrate it with Mac OS X and make it a seamless user experience and he is adding easy programmability as one of the core aspects to SSBs. With Fluid it is possible to run userscripts that not only change the appearance and behavior of the website, these userscripts are also able to invoke advanced desktop integration features like adding an "unread items" badge to the dock item or display Growl notifications.

The small user script you find below does two things: on the one hand it adds a "Share" button to all links posted on Friendfeed. Clicking the "Share" button will invoke the Mento bookmarklet which allows you to send the link to friends and colleagues. On the other hand, the script will track which links have been added to the feed while the Friendfeed window has been in the background. For each new, unread item, it will increase the counter in the badge and display a Growl notification.

Sharing a link on Mento
Sharing a link on Mento

Growl showing an update Notification
Growl showing an update notification. (In the background there is Dashcode, the IDE I have been using to write this userscript)

One unread item
There is one unread item waiting for me in Friendfeed.

The user script that accomplishes this can be found here. You are free to use and modify and redistribute it of course.

// ==UserScript==
// @name        Share With Mento
// @namespace   http://fluidapp.com
// @description Adds a Share link to links listed on friendfeed.
// @include     *
// @author      Lars Trieloff http://weblogs.goshaky.com/weblogs/lars
// ==/UserScript==

(function () {
  var knownclusters = {};
  var unknownclusters = 0;

  function updateMento() {
    refreshMento(true);
  }
  
  function initMento() {
    refreshMento(false);
  }
  
  function refreshMento(background) {
    var infos = document.getElementsByClassName("info");
    for (var i=0;i<infos.length;i++) {
      var link = infos[i].previousSibling.previousSibling.firstChild;
      var parent = infos[i].parentNode.parentNode.parentNode.parentNode;
      var eventid = parent.getAttribute("eid");
      var header = 
      $(parent).find(".summary").get(0).innerHTML.replace(/<(.|\n)+?>/g, "");
      var description = 
      infos[i].previousSibling.previousSibling.innerHTML.replace(/<(.|\n)+?>/g, "");
      
      if (eventid in knownclusters) {
        
      } else {
        unknownclusters++;
        knownclusters[eventid] = "a";
        if (background) {
          window.fluid.showGrowlNotification({
            title: header, 
            description: description, 
            priority: 1, 
            sticky: false,
            identifier: eventid,
          });
        }
        if (link.href) {
        //alert(link.innerHTML);
        
        infos[i].innerHTML = infos[i].innerHTML + " - <a href=\"javascript:(" +
        "function(){o='location=0,width=515,height=375,resizable=1';u='http:" + 
        "//www.mento.info/qp/#v=bk&vn=1&';w=window;d=w.top.document;e=encode" +
        "URIComponent;u+='title='+'"+encodeURIComponent(link.innerHTML)+"'+'" +
        "&url='+'"+encodeURIComponent(link.href)+"'+'&via='+'"
        +encodeURIComponent("http://friendfeed.com/e/"
        +parent.getAttribute("eid"))+"';var%20mw=w.open(u,'_blank',o);if(mw)" +
        "setTimeout(function(){mw.focus()},%20250);else{alert('A%20popup%20b" + 
        "locker%20got%20in%20the%20way.%20Hold%20the%20CTRL%20key%20and%20tr" +
        "y%20again.');}})();\">Share</a>";
        }
      }
      if (background) {
        if (unknownclusters==0) {
          window.fluid.dockBadge = "";
        } else {
          window.fluid.dockBadge = unknownclusters;
        }
      } else {
        window.fluid.dockBadge = "";
        unknownclusters = 0;
      }
      
    }
  }

  function jquery_wait() {
    
    if(typeof window.jQuery == 'undefined') { 
      window.setTimeout(jquery_wait,100); 
    }
    else {
      $ = window.jQuery; initMento();
      window.setInterval(updateMento, 1000); 
    }
  }

    if (window.fluid) {
    window.onfocus = initMento;
    //initMento(true);
    jquery_wait();
    }
})();

Power 150, an impressive OPML and RSS Mashup

posted 06:17PM Feb 05, 2007 with tags marketing mashup opml rss web20 by Lars Trieloff

Marjolein Hoekstra writes about Power 150, an impressive example for the power of mashups. This web application is a search engine that is based on the 150 most influential marketing weblogs and contains everything you need for blog-based marketing research with a small number of hand-picked sources.

In her weblog she describes how to orchestrate OPML, RSS and Grazr to accomplish this mashup.