2011-04-29 26 views
1

我在我的網站上有一個Twitter小部件。唯一的問題是,當您點擊「大約5小時前..」時,它會爲鏈接創建無效的URLS。Twitter Jquery Widget:創建無效的URLS

示例:如果您點擊最近的推文,它會將您帶到此鏈接,該鏈接無效: http://twitter.com/#!/ohshititsjake/statuses/63741419709411330

正確的URL是: http://twitter.com/#!/ohshititsjake/statuses/63741419709411328

這是劇本,我相信的部分問題:

 
` function build_url() { 
     var proto = ('https:' == document.location.protocol ? 'https:' : 'http:'); 
     if (s.list) { 
     return proto+"//api.twitter.com/1/"+s.username[0]+"/lists/"+s.list+"/statuses.json?per_page="+s.count+"&callback=? "; 
     } else if (s.query == null && s.username.length == 1) { 
     return proto+'//api.twitter.com/1/statuses/user_timeline.json?screen_name='+s.username[0]+'&count='+s.count+'&callback=?'; 
     } else { 
     var query = (s.query || 'from:'+s.username.join(' OR from:')); 
     return proto+'//search.twitter.com/search.json?&q='+escape(query)+'&rpp='+s.count+'&callback=?'; 
     } 
    } 
` 

下面是完整的JavaScript:

(function($) { 

    $.fn.tweet = function(o){ 
    var s = { 
     username: ["ohshititsjake"],    
     list: null,        
     avatar_size: 20,      
     count: 3,        
     intro_text: null,      
     outro_text: null,      
     join_text: null,      
     auto_join_text_default: "I said:<br/>",  
     auto_join_text_ed: "I",     
     auto_join_text_ing: "I said:<br/>",    
     auto_join_text_reply: "I replied to", 
     auto_join_text_url: "I was looking at", 
     loading_text: null,      
     query: null        
    }; 

    if(o) $.extend(s, o); 

    $.fn.extend({ 
     linkUrl: function() { 
     var returning = []; 
     var regexp = /((ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?)/gi; 
     this.each(function() { 
      returning.push(this.replace(regexp,"<a href=\"$1\">$1</a>")); 
     }); 
     return $(returning); 
     }, 
     linkUser: function() { 
     var returning = []; 
     var regexp = /[\@]+([A-Za-z0-9-_]+)/gi; 
     this.each(function() { 
      returning.push(this.replace(regexp,"<a href=\"http://twitter.com/$1\">@$1</a>")); 
     }); 
     return $(returning); 
     }, 
     linkHash: function() { 
     var returning = []; 
     var regexp = /(?:^|)[\#]+([A-Za-z0-9-_]+)/gi; 
     this.each(function() { 
      returning.push(this.replace(regexp, ' <a href="http://search.twitter.com/search?q=&tag=$1&lang=all&from='+s.username.join("%2BOR%2B")+'">#$1</a>')); 
     }); 
     return $(returning); 
     }, 
     capAwesome: function() { 
     var returning = []; 
     this.each(function() { 
      returning.push(this.replace(/\b(awesome)\b/gi, '<span class="awesome">$1</span>')); 
     }); 
     return $(returning); 
     }, 
     capEpic: function() { 
     var returning = []; 
     this.each(function() { 
      returning.push(this.replace(/\b(epic)\b/gi, '<span class="epic">$1</span>')); 
     }); 
     return $(returning); 
     }, 
     makeHeart: function() { 
     var returning = []; 
     this.each(function() { 
      returning.push(this.replace(/(&lt;)+[3]/gi, "<tt class='heart'>&#x2665;</tt>")); 
     }); 
     return $(returning); 
     } 
    }); 

    function parse_date(date_str) { 
     // The non-search twitter APIs return inconsistently-formatted dates, which Date.parse 
     // cannot handle in IE. We therefore perform the following transformation: 
     // "Wed Apr 29 08:53:31 +0000 2009" => "Wed, Apr 29 2009 08:53:31 +0000" 
     return Date.parse(date_str.replace(/^([a-z]{3})([a-z]{3} \d\d?)(.*)(\d{4})$/i, '$1,$2$4$3')); 
    } 

    function relative_time(time_value) { 
     var parsed_date = parse_date(time_value); 
     var relative_to = (arguments.length > 1) ? arguments[1] : new Date(); 
     var delta = parseInt((relative_to.getTime() - parsed_date)/1000); 
     var pluralize = function (singular, n) { 
     return '' + n + ' ' + singular + (n == 1 ? '' : 's'); 
     }; 
     if(delta < 60) { 
     return 'less than a minute ago'; 
     } else if(delta < (60*60)) { 
     return 'about ' + pluralize("minute", parseInt(delta/60)) + ' ago'; 
     } else if(delta < (24*60*60)) { 
     return 'about ' + pluralize("hour", parseInt(delta/3600)) + ' ago'; 
     } else { 
     return 'about ' + pluralize("day", parseInt(delta/86400)) + ' ago'; 
     } 
    } 

    function build_url() { 
     var proto = ('https:' == document.location.protocol ? 'https:' : 'http:'); 
     if (s.list) { 
     return proto+"//api.twitter.com/1/"+s.username[0]+"/lists/"+s.list+"/statuses.json?per_page="+s.count+"&callback=? "; 
     } else if (s.query == null && s.username.length == 1) { 
     return proto+'//api.twitter.com/1/statuses/user_timeline.json?screen_name='+s.username[0]+'&count='+s.count+'&callback=?'; 
     } else { 
     var query = (s.query || 'from:'+s.username.join(' OR from:')); 
     return proto+'//search.twitter.com/search.json?&q='+escape(query)+'&rpp='+s.count+'&callback=?'; 
     } 
    } 

    return this.each(function(i, widget){ 
     var list = $('<ul class="tweet_list">').appendTo(widget); 
     var intro = '<p class="tweet_intro">'+s.intro_text+'</p>'; 
     var outro = '<p class="tweet_outro">'+s.outro_text+'</p>'; 
     var loading = $('<p class="loading">'+s.loading_text+'</p>'); 

     if(typeof(s.username) == "string"){ 
     s.username = [s.username]; 
     } 

     if (s.loading_text) $(widget).append(loading); 
     $.getJSON(build_url(), function(data){ 
     if (s.loading_text) loading.remove(); 
     if (s.intro_text) list.before(intro); 
     var tweets = (data.results || data); 
     $.each(tweets, function(i,item){ 
      // auto join text based on verb tense and content 
      if (s.join_text == "auto") { 
      if (item.text.match(/^(@([A-Za-z0-9-_]+)) .*/i)) { 
       var join_text = s.auto_join_text_reply; 
      } else if (item.text.match(/(^\w+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+) .*/i)) { 
       var join_text = s.auto_join_text_url; 
      } else if (item.text.match(/^((\w+ed)|just) .*/im)) { 
       var join_text = s.auto_join_text_ed; 
      } else if (item.text.match(/^(\w*ing) .*/i)) { 
       var join_text = s.auto_join_text_ing; 
      } else { 
       var join_text = s.auto_join_text_default; 
      } 
      } else { 
      var join_text = s.join_text; 
      }; 

      var from_user = item.from_user || item.user.screen_name; 
      var profile_image_url = item.profile_image_url || item.user.profile_image_url; 
      var join_template = '<span class="tweet_join"> '+join_text+' </span>'; 
      var join = ((s.join_text) ? join_template : ' '); 
      var avatar_template = '<a class="tweet_avatar" href="http://twitter.com/'+from_user+'"><img src="'+profile_image_url+'" height="'+s.avatar_size+'" width="'+s.avatar_size+'" alt="'+from_user+'\'s avatar" title="'+from_user+'\'s avatar" border="0"/></a>'; 
      var avatar = (s.avatar_size ? avatar_template : ''); 
      var date = '<span class="tweet_time"><a href="http://twitter.com/'+from_user+'/statuses/'+item.id+'" title="view tweet on twitter">'+relative_time(item.created_at)+'</a></span>'; 
      var text = '<span class="tweet_text">' +$([item.text]).linkUrl().linkUser().linkHash().makeHeart().capAwesome().capEpic()[0]+ '</span>'; 

      // until we create a template option, arrange the items below to alter a tweet's display. 
      list.append('<li>' + avatar + date + join + text + '</li>'); 

      list.children('li:first').addClass('tweet_first'); 
      list.children('li:odd').addClass('tweet_even'); 
      list.children('li:even').addClass('tweet_odd'); 
     }); 
     if (s.outro_text) list.after(outro); 
     $(widget).trigger("loaded").trigger((tweets.length == 0 ? "empty" : "full")); 
     }); 

    }); 
    }; 
})(jQuery); 
+0

在問題中,您的「應該是此鏈接」似乎與您剛纔描述爲無效的那個相同,並且在您點擊它們時似乎都無效。 – RwwL 2011-04-29 20:04:47

+0

謝謝,糾正它。 – jake 2011-04-29 21:00:52

回答

1

查看該用戶帳戶上的固定鏈接的ID,它們與您的帖子中生成的ID不匹配。答案很可能是在這個崗位:

Why a wrong tweet id is returned from twitter API?

所以嘗試改變這一行:

var date = '<span class="tweet_time"><a href="http://twitter.com/'+from_user+'/statuses/'+item.id+'" title="view tweet on twitter">'+relative_time(item.created_at)+'</a></span>'; 

這樣:

var date = '<span class="tweet_time"><a href="http://twitter.com/'+from_user+'/statuses/'+item.id_str+'" title="view tweet on twitter">'+relative_time(item.created_at)+'</a></span>'; 

實際上,它只是改變item.id項.id_str.in在該行的中間。

+0

嘿,我很抱歉,但我新的twitter API的東西。你可以再詳細一點嗎? – jake 2011-04-29 21:00:26

+0

當然...編輯答案... – RwwL 2011-04-29 21:57:08

+1

啊哈,這裏是對此的規範解釋/原因:http://groups.google.com/group/twitter-api-announce/browse_thread/thread/6a16efa375532182 – RwwL 2011-04-29 22:54:42