plugins/Realtime/realtimeupdate.js

   1 // add a notice encoded as JSON into the current timeline
   2 //
   3 // TODO: i18n
   4
   5 RealtimeUpdate = {
   6      _userid: 0,
   7      _replyurl: '',
   8      _favorurl: '',
   9      _deleteurl: '',
  10      _updatecounter: 0,
  11
  12      init: function(userid, replyurl, favorurl, deleteurl)
  13      {
  14         RealtimeUpdate._userid = userid;
  15         RealtimeUpdate._replyurl = replyurl;
  16         RealtimeUpdate._favorurl = favorurl;
  17         RealtimeUpdate._deleteurl = deleteurl;
  18
  19         DT = document.title;
  20
  21         $(window).blur(function() {
  22           $('#notices_primary .notice').css({
  23             'border-top-color':$('#notices_primary .notice:last').css('border-top-color'),
  24             'border-top-style':'dotted'
  25           });
  26
  27           $('#notices_primary .notice:first').css({
  28             'border-top-color':'#AAAAAA',
  29             'border-top-style':'solid'
  30           });
  31
  32           RealtimeUpdate._updatecounter = 0;
  33           document.title = DT;
  34
  35           return false;
  36         });
  37      },
  38
  39      receive: function(data)
  40      {
  41           setTimeout(function() {
  42               id = data.id;
  43
  44               // Don't add it if it already exists
  45               if ($("#notice-"+id).length > 0) {
  46                    return;
  47               }
  48
  49               var noticeItem = RealtimeUpdate.makeNoticeItem(data);
  50               $("#notices_primary .notices").prepend(noticeItem);
  51               $("#notices_primary .notice:first").css({display:"none"});
  52               $("#notices_primary .notice:first").fadeIn(1000);
  53               NoticeReply();
  54
  55               RealtimeUpdate._updatecounter += 1;
  56               document.title = '('+RealtimeUpdate._updatecounter+') ' + DT;
  57           }, 500);
  58      },
  59
  60      makeNoticeItem: function(data)
  61      {
  62           user = data['user'];
  63           html = data['html'].replace(/&amp;/g,'&').replace(/&lt;/g,'<').replace(/&gt;/g,'>').replace(/&quot;/g,'"');
  64           source = data['source'].replace(/&amp;/g,'&').replace(/&lt;/g,'<').replace(/&gt;/g,'>').replace(/&quot;/g,'"');
  65
  66           ni = "<li class=\"hentry notice\" id=\"notice-"+data['id']+"\">"+
  67                "<div class=\"entry-title\">"+
  68                "<span class=\"vcard author\">"+
  69                "<a href=\""+user['profile_url']+"\" class=\"url\">"+
  70                "<img src=\""+user['profile_image_url']+"\" class=\"avatar photo\" width=\"48\" height=\"48\" alt=\""+user['screen_name']+"\"/>"+
  71                "<span class=\"nickname fn\">"+user['screen_name']+"</span>"+
  72                "</a>"+
  73                "</span>"+
  74                "<p class=\"entry-content\">"+html+"</p>"+
  75                "</div>"+
  76                "<div class=\"entry-content\">"+
  77                "<a class=\"timestamp\" rel=\"bookmark\" href=\""+data['url']+"\" >"+
  78                "<abbr class=\"published\" title=\""+data['created_at']+"\">a few seconds ago</abbr>"+
  79                "</a> "+
  80                "<span class=\"source\">"+
  81                "from "+
  82                 "<span class=\"device\">"+source+"</span>"+ // may have a link
  83                "</span>";
  84           if (data['in_reply_to_status_id']) {
  85                ni = ni+" <a class=\"response\" href=\""+data['in_reply_to_status_url']+"\">in context</a>";
  86           }
  87
  88           ni = ni+"</div>"+
  89             "<div class=\"notice-options\">";
  90
  91           if (RealtimeUpdate._userid != 0) {
  92                var input = $("form#form_notice fieldset input#token");
  93                var session_key = input.val();
  94                ni = ni+RealtimeUpdate.makeFavoriteForm(data['id'], session_key);
  95                ni = ni+RealtimeUpdate.makeReplyLink(data['id'], data['user']['screen_name']);
  96                if (RealtimeUpdate._userid == data['user']['id']) {
  97                     ni = ni+RealtimeUpdate.makeDeleteLink(data['id']);
  98                }
  99           }
 100
 101           ni = ni+"</div>"+
 102                "</li>";
 103           return ni;
 104      },
 105
 106      makeFavoriteForm: function(id, session_key)
 107      {
 108           var ff;
 109
 110           ff = "<form id=\"favor-"+id+"\" class=\"form_favor\" method=\"post\" action=\""+RealtimeUpdate._favorurl+"\">"+
 111                 "<fieldset>"+
 112                "<legend>Favor this notice</legend>"+
 113                "<input name=\"token-"+id+"\" type=\"hidden\" id=\"token-"+id+"\" value=\""+session_key+"\"/>"+
 114                "<input name=\"notice\" type=\"hidden\" id=\"notice-n"+id+"\" value=\""+id+"\"/>"+
 115                "<input type=\"submit\" id=\"favor-submit-"+id+"\" name=\"favor-submit-"+id+"\" class=\"submit\" value=\"Favor\" title=\"Favor this notice\"/>"+
 116                 "</fieldset>"+
 117                "</form>";
 118           return ff;
 119      },
 120
 121      makeReplyLink: function(id, nickname)
 122      {
 123           var rl;
 124           rl = "<a class=\"notice_reply\" href=\""+RealtimeUpdate._replyurl+"?replyto="+nickname+"\" title=\"Reply to this notice\">Reply <span class=\"notice_id\">"+id+"</span></a>";
 125           return rl;
 126         },
 127
 128      makeDeleteLink: function(id)
 129      {
 130           var dl, delurl;
 131           delurl = RealtimeUpdate._deleteurl.replace("0000000000", id);
 132
 133           dl = "<a class=\"notice_delete\" href=\""+delurl+"\" title=\"Delete this notice\">Delete</a>";
 134
 135           return dl;
 136      },
 137
 138      addPopup: function(url, timeline, iconurl)
 139      {
 140          $('#notices_primary').css({'position':'relative'});
 141          $('#notices_primary').prepend('<button id="realtime_timeline" title="Pop up in a window">Pop up</button>');
 142
 143          $('#realtime_timeline').css({
 144              'margin':'0 0 11px 0',
 145              'background':'transparent url('+ iconurl + ') no-repeat 0% 30%',
 146              'padding':'0 0 0 20px',
 147              'display':'block',
 148              'position':'absolute',
 149              'top':'-20px',
 150              'right':'0',
 151              'border':'none',
 152              'cursor':'pointer',
 153              'color':$("a").css("color"),
 154              'font-weight':'bold',
 155              'font-size':'1em'
 156          });
 157
 158          $('#realtime_timeline').click(function() {
 159              window.open(url,
 160                          timeline,
 161                          'toolbar=no,resizable=yes,scrollbars=yes,status=yes');
 162
 163              return false;
 164          });
 165      },
 166
 167      initPopupWindow: function()
 168      {
 169          window.resizeTo(500, 550);
 170          $('address').hide();
 171          $('#content').css({'width':'93.5%'});
 172
 173          $('#form_notice').css({
 174             'margin':'18px 0 18px 1.795%',
 175             'width':'93%',
 176             'max-width':'451px'
 177          });
 178
 179          $('#form_notice label[for=notice_data-text], h1').css({'display': 'none'});
 180
 181          $('.notices li:first-child').css({'border-top-color':'transparent'});
 182
 183          $('#form_notice label[for="notice_data-attach"], #form_notice #notice_data-attach').css({'top':'0'});
 184
 185          $('#form_notice #notice_data-attach').css({
 186             'left':'auto',
 187             'right':'0'
 188          });
 189      }
 190 }
 191