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