view/theme/diabook/js/jquery.twitter.search.js

   1 /*!
   2  * jQuery Twitter Search Plugin
   3  * Examples and documentation at: http://jquery.malsup.com/twitter/
   4  * Copyright (c) 2010 M. Alsup
   5  * Version: 1.04 (15-SEP-2011)
   6  * Dual licensed under the MIT and GPL licenses:
   7  * http://www.opensource.org/licenses/mit-license.php
   8  * http://www.gnu.org/licenses/gpl.html
   9  * Requires: jQuery v1.3.2 or later
  10  */
  11
  12 ;(function($) {
  13         $.fn.twitterSearch = function(options) {
  14                 if (typeof options == 'string')
  15                         options = { term: options };
  16                 return this.each(function() {
  17                         var grabFlag = false,
  18                                 grabbing = false,
  19                                 $frame = $(this), text, $text, $title, $bird, $cont, height, paused = false,
  20                                 opts = $.extend(true, {}, $.fn.twitterSearch.defaults, options || {}, $.metadata ? $frame.metadata() : {});
  21
  22                         opts.formatter = opts.formatter || $.fn.twitterSearch.formatter;
  23                         opts.filter = opts.filter || $.fn.twitterSearch.filter;
  24
  25                         if (!opts.applyStyles) { // throw away all style defs
  26                                 for (var css in opts.css)
  27                                         opts.css[css] = {};
  28                         }
  29
  30                         if (opts.title === null) // user can set to '' to suppress title
  31                                 opts.title = opts.term;
  32
  33                         opts.title = opts.title || '';
  34                         text = opts.titleLink ? ('<a href="'+ opts.titleLink +'">'+ opts.title + '</a>') : ('<span>' + opts.title +'</span>');
  35                         $text = $(text);
  36                         if (opts.titleLink)
  37                                 $text.css(opts.css['titleLink']);
  38                         $title = $('<div class="twitterSearchTitle"></div>').append($text).appendTo($frame).css(opts.css['title']);
  39                         if (opts.bird) {
  40                                 $bird = $('<img class="twitterSearchBird" src="'+opts.birdSrc+'" />').appendTo($title).css(opts.css['bird']);
  41                                 if (opts.birdLink)
  42                                         $bird.wrap('<a href="'+ opts.birdLink +'"></a>');
  43                         }
  44                         $cont = $('<div class="twitterSearchContainter"></div>').appendTo($frame).css(opts.css['container']);
  45                         cont = $cont[0];
  46                         if (opts.colorExterior)
  47                                 $title.css('background-color',opts.colorExterior);
  48                         if (opts.colorInterior)
  49                                 $cont.css('background-color',opts.colorInterior);
  50
  51                         $frame.css(opts.css['frame']);
  52                         if (opts.colorExterior)
  53                                 $frame.css('border-color',opts.colorExterior);
  54
  55                         height = $frame.innerHeight() - $title.outerHeight();
  56                         $cont.height(height);
  57
  58                         if (opts.pause)
  59                                 $cont.hover(function(){paused = true;},function(){paused = false;});
  60
  61                         $('<div class="twitterSearchLoading">Loading tweets..</div>').css(opts.css['loading']).appendTo($cont);
  62
  63                         grabTweets();
  64
  65                         function grabTweets() {
  66                                 var url = opts.url + opts.term;
  67                                 grabFlag = false;
  68                                 grabbing = true;
  69                                 // grab twitter stream
  70                                 $.getJSONP({
  71                                         url: url,
  72                                         timeout: 30000,
  73                                         error: function(xhr, status, e) {
  74                                                 failWhale(e);
  75                                         },
  76                                         complete: function() {
  77                                                 grabbing = false;
  78                                                 if (opts.refreshSeconds)
  79                                                         setTimeout(regrab, opts.refreshSeconds * 1000);
  80                                         },
  81                                         success: function(json) {
  82                                                 if (json.error) {
  83                                                         failWhale(json.error);
  84                                                         return;
  85                                                 }
  86                                                 $cont.fadeOut('fast',function() {
  87                                                         $cont.empty();
  88
  89                                                         // iterate twitter results
  90                                                         $.each(json.results, function(i) {
  91                                                                 if (!opts.filter.call(opts, this))
  92                                                                         return; // skip this tweet
  93                                                                 var $img, $text, w,
  94                                                                         tweet = opts.formatter(this, opts),
  95                                                                         $tweet = $(tweet);
  96                                                                 $tweet.css(opts.css['tweet']);
  97                                                                 $img = $tweet.find('.twitterSearchProfileImg').css(opts.css['img']);
  98                                                                 $tweet.find('.twitterSearchUser').css(opts.css['user']);
  99                                                                 $tweet.find('.twitterSearchTime').css(opts.css['time']);
 100                                                                 $tweet.find('a').css(opts.css['a']);
 101                                                                 $tweet.appendTo($cont);
 102                                                                 $text = $tweet.find('.twitterSearchText').css(opts.css['text']);
 103                                                                 if (opts.avatar) {
 104                                                                         w = $img.outerWidth() + parseInt($tweet.css('paddingLeft'));
 105                                                                         $text.css('paddingLeft', w);
 106                                                                 }
 107                                                         });
 108
 109                                                         $cont.fadeIn('fast');
 110
 111                                                         if (json.results.length < 2) {
 112                                                                 if (opts.refreshSeconds)
 113                                                                         setTimeout(grabTweets, opts.refreshSeconds * 1000);
 114                                                                 return;
 115                                                         }
 116
 117                                                         // stage first animation
 118                                                         setTimeout(go, opts.timeout);
 119                                                 });
 120                                         }
 121                                 });
 122                         };
 123
 124                         function regrab() {
 125                                 grabFlag = true;
 126                         }
 127
 128                         function failWhale(msg) {
 129                                 var $fail = $('<div class="twitterSearchFail">' + msg + '</div>').css(opts.css['fail']);
 130                                 $cont.empty().append($fail);
 131                         };
 132
 133                         function go() {
 134                                 if (paused || grabbing) {
 135                                         setTimeout(go, 500);
 136                                         return;
 137                                 }
 138                                 var h, $el = $cont.children(':first'), el = $el[0];
 139                                 $el.animate(opts.animOut, opts.animOutSpeed, function() {
 140                                         h = $el.outerHeight();
 141                                         $el.animate({ marginTop: -h }, opts.animInSpeed, function() {
 142                                                 $el.css({ marginTop: 0, opacity: 1 });
 143                                                 /*@cc_on
 144                                                 try { el.style.removeAttribute('filter'); } // ie cleartype fix
 145                                                 catch(smother) {}
 146                                                 @*/
 147                                                 $el.css(opts.css['tweet']).show().appendTo($cont);
 148
 149                                                 setTimeout(grabFlag ? grabTweets : go, opts.timeout);
 150                                         });
 151                                 });
 152                         }
 153                 });
 154         };
 155
 156         $.fn.twitterSearch.filter = function(tweet) {
 157                 return true;
 158         };
 159
 160         $.fn.twitterSearch.formatter = function(json, opts) {
 161                 var str, pretty,
 162                         text = json.text;
 163                 if (opts.anchors) {
 164                         text = json.text.replace(/(http:\/\/\S+)/g, '<a href="$1">$1</a>');
 165                         text = text.replace(/\@(\w+)/g, '<a href="http://twitter.com/$1">@$1</a>');
 166                 }
 167                 str = '<div class="twitterSearchTweet">';
 168                 if (opts.avatar)
 169                         str += '<img class="twitterSearchProfileImg" src="' + json.profile_image_url + '" />';
 170                 str += '<div><span class="twitterSearchUser"><a href="http://www.twitter.com/'+ json.from_user+'/status/'+ json.id_str +'">'
 171                   + json.from_user + '</a></span>';
 172                 pretty = prettyDate(json.created_at);
 173                 if (opts.time && pretty)
 174                         str += ' <span class="twitterSearchTime">('+ pretty +')</span>'
 175                  str += '<div class="twitterSearchText">' + text + '</div></div></div>';
 176                  return str;
 177         };
 178
 179         $.fn.twitterSearch.defaults = {
 180                 url: 'http://search.twitter.com/search.json?callback=?&q=',
 181                 anchors: true,                          // true or false (enable embedded links in tweets)
 182                 animOutSpeed: 500,                      // speed of animation for top tweet when removed
 183                 animInSpeed: 500,                       // speed of scroll animation for moving tweets up
 184                 animOut: { opacity: 0 },        // animation of top tweet when it is removed
 185                 applyStyles: true,                      // true or false (apply default css styling or not)
 186                 avatar: true,                           // true or false (show or hide twitter profile images)
 187                 bird: true,                                     // true or false (show or hide twitter bird image)
 188                 birdLink: false,                        // url that twitter bird image should like to
 189                 birdSrc: 'http://cloud.github.com/downloads/malsup/twitter/tweet.gif', // twitter bird image
 190                 colorExterior: null,        // css override of frame border-color and title background-color
 191                 colorInterior: null,        // css override of container background-color
 192                 filter: null,               // callback fn to filter tweets:  fn(tweetJson) { /* return false to skip tweet */ }
 193                 formatter: null,                        // callback fn to build tweet markup
 194                 pause: false,                           // true or false (pause on hover)
 195                 refreshSeconds: 0,          // number of seconds to wait before polling for newer tweets
 196                 term: '',                                       // twitter search term
 197                 time: true,                                     // true or false (show or hide the time that the tweet was sent)
 198                 timeout: 4000,                          // delay betweet tweet scroll
 199                 title: null,                            // title text to display when frame option is true (default = 'term' text)
 200                 titleLink: null,                        // url for title link
 201                 css: {
 202                         // default styling
 203                         a:     { textDecoration: 'none', color: '#3B5998' },
 204                         bird:  { width: '50px', height: '20px', position: 'absolute', left: '-30px', top: '-20px', border: 'none' },
 205                         container: { overflow: 'hidden', backgroundColor: '', height: '600px', width: '170px' },
 206                         fail:  { background: '#6cc5c3 url(http://cloud.github.com/downloads/malsup/twitter/failwhale.png) no-repeat 50% 50%', height: '100%', padding: '10px' },
 207                         frame: { border: '0px solid #C2CFF1', borderRadius: '0px', '-moz-border-radius': '0px', '-webkit-border-radius': '0px' },
 208                         tweet: { padding: '5px 10px', clear: 'left' },
 209                         img:   { 'float': 'left', margin: '5px', width: '48px', height: '48px' },
 210                         loading: { padding: '20px', textAlign: 'center', color: '#888' },
 211                         text:  {},
 212                         time:  { fontSize: 'smaller', color: '#888' },
 213                         title: { 'display': 'none'},
 214                         titleLink: { textDecoration: 'none', color: '#3B5998' },
 215                         user:  { fontWeight: 'bold' }
 216                 }
 217         };
 218
 219     // fn to handle jsonp with timeouts and errors
 220     // hat tip to Ricardo Tomasi for the timeout logic
 221     $.getJSONP = function(s) {
 222         s.dataType = 'jsonp';
 223         $.ajax(s);
 224
 225         // figure out what the callback fn is
 226         var $script = $(document.getElementsByTagName('head')[0].firstChild);
 227         var url = $script.attr('src') || '';
 228         var cb = (url.match(/callback=(\w+)/)||[])[1];
 229         if (!cb)
 230             return; // bail
 231         var t = 0, cbFn = window[cb];
 232
 233         $script[0].onerror = function(e) {
 234             $script.remove();
 235             handleError(s, {}, "error", e);
 236             clearTimeout(t);
 237         };
 238
 239         if (!s.timeout)
 240             return;
 241
 242         window[cb] = function(json) {
 243             clearTimeout(t);
 244             cbFn(json);
 245             cbFn = null;
 246         };
 247
 248         t = setTimeout(function() {
 249             $script.remove();
 250             handleError(s, {}, "timeout");
 251             if (cbFn)
 252                 window[cb] = function(){};
 253         }, s.timeout);
 254
 255         function handleError(s, xhr, msg, e) {
 256                         s.error && s.error.call(s.context, xhr, msg, e);
 257                         s.global && $.event.trigger("ajaxError", [xhr, s, e || msg]);
 258                         s.complete && s.complete.call(s.context, xhr, e || msg);
 259         }
 260     };
 261
 262         /*
 263          * JavaScript Pretty Date
 264          * Copyright (c) 2008 John Resig (jquery.com)
 265          * Licensed under the MIT license.
 266          */
 267         // converts ISO time to casual time
 268         function prettyDate(time){
 269                 var date = new Date((time || "").replace(/-/g,"/").replace(/TZ/g," ")),
 270                         diff = (((new Date()).getTime() - date.getTime()) / 1000),
 271                         day_diff = Math.floor(diff / 86400);
 272
 273                 if ( isNaN(day_diff) || day_diff < 0 || day_diff >= 31 )
 274                         return;
 275                 var v = day_diff == 0 && (
 276                                 diff < 60 && "just now" ||
 277                                 diff < 120 && "1 minute ago" ||
 278                                 diff < 3600 && Math.floor( diff / 60 ) + " minutes ago" ||
 279                                 diff < 7200 && "1 hour ago" ||
 280                                 diff < 86400 && Math.floor( diff / 3600 ) + " hours ago") ||
 281                         day_diff == 1 && "Yesterday" ||
 282                         day_diff < 7 && day_diff + " days ago" ||
 283                         day_diff < 31 && Math.ceil( day_diff / 7 ) + " weeks ago";
 284                 if (!v)
 285                         window.console && console.log(time);
 286                 return v ? v : '';
 287         }
 288
 289 })(jQuery);