git.oblomov.eu Git - ff_comments.user.js/blob - ff_comments.user.js

   1 // ==UserScript==
   2 // @name        FriendFeed comments
   3 // @description Add FriendFeed 'likes' and comments to any page
   4 // @namespace   http://oblomov.myopenid.com
   5 // @include     http://*
   6 // @exclude     http://friendfeed.com/*
   7 // @exclude     http://*.friendfeed.com/*
   8 // @exclude     http://friendfeed-api.com/*
   9 // @author      Giuseppe "Oblomov" Bilotta
  10 // @version     20091218
  11 // ==/UserScript==
  12
  13 if (typeof(unsafeWindow) == 'undefined') unsafeWindow = window;
  14
  15 (function() {
  16
  17  var ff_preload = new Image();
  18  ff_preload.src = 'http://friendfeed.com/favicon.ico';
  19  ff_preload.src = 'http://friendfeed.com/static/images/logo-small.png';
  20
  21 unsafeWindow.ujs_ff_load = function(url) {
  22         var e = unsafeWindow.document.createElement('script');
  23         e.type = 'text/javascript';
  24         e.src = url;
  25         unsafeWindow.document.getElementsByTagName('head')[0].appendChild(e);
  26 };
  27
  28 unsafeWindow.ujs_ff_load_entries = function(str) {
  29         if (str.entries && str.entries.length > 0) {
  30                 var doc = unsafeWindow.document;
  31
  32                 var pdiv = doc.getElementById('ujs_friendfeed');
  33                 var div;
  34                 if (pdiv) {
  35                         div = pdiv.lastChild;
  36                 } else {
  37                         pdiv = doc.createElement('div');
  38                         pdiv.setAttribute('id', 'ujs_friendfeed');
  39                         pdiv.setAttribute('title', 'FriendFeed comments on this page');
  40                         pdiv.style.position = 'absolute';
  41                         pdiv.style.top = 0;
  42                         pdiv.style.left = 0;
  43                         pdiv.style.zIndex = 100000;
  44                         pdiv.style.maxWidth = '30%';
  45                         pdiv.style.height='auto';
  46                         pdiv.style.border='3px outset lightblue';
  47                         pdiv.style.margin = 0;
  48                         pdiv.style.padding = 0;
  49                         pdiv.style.textAlign = 'center';
  50                         pdiv.style.fontSize = '0px';
  51                         pdiv.style.lineHeight = 1;
  52                         //  pdiv.style.opacity = 0.7;
  53                         pdiv.style.backgroundColor = 'white';
  54
  55                         doc.body.appendChild(pdiv);
  56
  57                         var logo = doc.createElement('img');
  58                         logo.src = 'http://friendfeed.com/favicon.ico';
  59                         logo.setAttribute('alt', 'FriendFeed logo');
  60                         logo.setAttribute('title', 'FriendFeed logo');
  61                         logo.style.margin='0 auto 0 auto';
  62                         logo.style.padding=0;
  63                         pdiv.appendChild(logo);
  64
  65                         div = doc.createElement('div');
  66                         div.style.fontSize = 'small';
  67                         div.style.display = 'none';
  68                         pdiv.appendChild(div);
  69
  70                         function displayToggle() {
  71                                 // don't toggle if we were dragging
  72                                 if (pdiv.dragged) {
  73                                         pdiv.dragged = false;
  74                                         return;
  75                                 }
  76                                 var d = pdiv.lastChild;
  77                                 if (d.style.display == 'none') {
  78                                         d.style.display = 'block';
  79                                         logo.src = 'http://friendfeed.com/static/images/logo-small.png';
  80                                         logo.style.padding = '5px';
  81                                 } else {
  82                                         d.style.display = 'none';
  83                                         logo.src = 'http://friendfeed.com/favicon.ico';
  84                                         logo.style.padding = 0;
  85                                 }
  86                         };
  87
  88                         logo.addEventListener('click', displayToggle, false);
  89
  90                         var dragging=false;
  91                         pdiv.dragged=false;
  92                         function drag(ev) {
  93                                 if (dragging) {
  94                                         var dx = ev.pageX - dragging.x;
  95                                         var dy = ev.pageY - dragging.y;
  96                                         pdiv.style.left = (parseInt(pdiv.style.left) + dx) + 'px';
  97                                         pdiv.style.top = (parseInt(pdiv.style.top) + dy) + 'px';
  98                                         dragging.x = ev.pageX;
  99                                         dragging.y = ev.pageY;
 100                                         ev.preventDefault();
 101                                         ev.stopPropagation();
 102
 103                                         pdiv.dragged = true;
 104                                 }
 105                         }
 106                         logo.addEventListener('mousedown',
 107                                         function (ev) {
 108                                                 dragging=new Object();
 109                                                 dragging.x = ev.pageX;
 110                                                 dragging.y = ev.pageY;
 111                                                 ev.preventDefault();
 112                                                 ev.stopPropagation();
 113                                         }, false);
 114                         logo.addEventListener('mouseup',
 115                                         function (ev) {
 116                                                 dragging=false;
 117                                                 ev.preventDefault();
 118                                                 ev.stopPropagation();
 119                                         }, false);
 120                         // handle on the whole document because otherwise fast
 121                         // movements will make the mouse get out of the logo, thus
 122                         // 'dropping' the drag
 123                         doc.addEventListener('mousemove', drag, false);
 124                 }
 125
 126
 127                 var ecount = str.entries.length;
 128                 for (var i=0; i < ecount; ++i) {
 129                         var entry = str.entries[i];
 130
 131                         var date2link = function(d, l) {
 132                                 var day = d.substring(0, 10);
 133                                 var tm = d.substring(11, 19);
 134                                 if (l)
 135                                         return '<a href="' + l + '">' + day + ' at ' + tm + '</a>';
 136                                 else
 137                                         return day + ' at ' + tm;
 138                         }
 139
 140                         var from2link = function(from) {
 141                                 return '<a href="http://friendfeed.com/' + from.id + '">' + from.name + '</a>';
 142                         }
 143
 144                         var from2linkimg = function(from) {
 145                                 return '<a style="margin: 0 1ex .5ex 0;float:left;" href="http://friendfeed.com/' + from.id + '"><img src="http://friendfeed-api.com/v2/picture/' + from.id + '?size=small" /></a>';
 146                         }
 147
 148
 149                         var fed = '<p>Fed by ' + from2link(entry.from);
 150                         fed += ' on ' + date2link(entry.date, entry.url);
 151                         var ediv = doc.createElement('div');
 152                         ediv.style.margin=0;
 153                         ediv.style.padding='.5ex';
 154                         ediv.style.borderTop='.25ex dashed lightblue';
 155                         ediv.style.textAlign = 'justify';
 156                         ediv.innerHTML = fed
 157                         div.appendChild(ediv);
 158
 159                         var likes = entry.likes || [];
 160                         var jcount = likes.length;
 161                         if (jcount > 0) {
 162                                 var liked = '<p style="margin:0 2ex;text-indent:-2ex">Liked by ';
 163                                 for (var j=0; j < jcount; ++j) {
 164                                         var like = likes[j];
 165                                         if (like.from)
 166                                                 liked += (j > 0 ? ', ' : '') + from2link(like.from);
 167                                         else
 168                                                 liked += ' and ' + like.body;
 169                                 }
 170
 171                                 var ldiv = doc.createElement('div');
 172                                 ldiv.innerHTML = liked;
 173                                 ediv.appendChild(ldiv);
 174                         }
 175
 176                         var comments = entry.comments || [];
 177                         jcount = comments.length;
 178                         if (jcount > 0) {
 179                                 for (var j=0 ; j < jcount; ++j) {
 180                                         var comment = comments[j];
 181                                         var cdiv = doc.createElement('div');
 182                                         cdiv.style.borderTop = '.1ex dotted blue';
 183                                         cdiv.style.padding = '1ex .5ex';
 184                                         ediv.appendChild(cdiv);
 185
 186                                         if (comment.from) {
 187                                                 cdiv.innerHTML = from2linkimg(comment.from) +
 188                                                         '<p style="margin:0;font-size:smaller">' + date2link(comment.date) + ' by ' + from2link(comment.from) +
 189                                                         '<p style="margin:0">' + comment.body;
 190                                         } else {
 191                                                 cdiv.innerHTML += comment.body;
 192                                         }
 193                                 }
 194
 195                         }
 196                 }
 197         }
 198 };
 199
 200 // escape() does not escape +, but we want it escaped too
 201 var encoded_loc = escape(unsafeWindow.location.toString()).replace('+','%2b');
 202 var ff_url = 'http://friendfeed-api.com/v2/url?url=' + encoded_loc + '&callback=ujs_ff_load_entries&cache=' + Math.floor(Math.random()*1024*1024);
 203
 204 unsafeWindow.ujs_ff_load(ff_url);
 205
 206 ff_url = 'http://friendfeed-api.com/v2/search?q=' + encoded_loc + '&callback=ujs_ff_load_entries&cache=' + Math.floor(Math.random()*1024*1024);
 207
 208 unsafeWindow.ujs_ff_load(ff_url);
 209
 210 })();
 211