#ajax #jquery #twitter
#ajax #jquery #Twitter
Вопрос:
Я использую jquery ajax для извлечения из twitter api, я уверен, что есть простой способ, но я не могу найти его о том, как заставить «tweet» отображать любые ссылки, которые были отправлены в твиттере, в виде ссылки. Сейчас это всего лишь текст.
$.ajax({
type : 'GET',
dataType : 'jsonp',
url : 'http://search.twitter.com/search.json?q=nettutsamp;rpp=2',
success : function(tweets) {
var twitter = $.map(tweets.results, function(obj, index) {
return {
username : obj.from_user,
tweet : obj.text,
imgSource : obj.profile_image_url,
geo : obj.geo
};
});
Обновить:
Следующая функция (плагин) работает отлично.
(function($) {
$.socialFader = function(options) {
var settings = {
tweetHolder : null,
tweetCount : 100,
fadeSpeed : 500,
tweetName: 'jquery'
};
if (options) {
$.extend(settings, options);
};
var URL = "http://search.twitter.com/search.json?q=" settings.tweetName "amp;rpp=" settings.tweetCount "amp;callback=?";
function relative_time(time_value) {
var values = time_value.split(" ");
time_value = values[1] " " values[2] ", " values[5] " " values[3];
var parsed_date = Date.parse(time_value);
var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
delta = delta (relative_to.getTimezoneOffset() * 60);
var r = '';
if (delta < 60) {
r = 'a minute ago';
} else if(delta < 120) {
r = 'couple of minutes ago';
} else if(delta < (45*60)) {
r = (parseInt(delta / 60)).toString() ' minutes ago';
} else if(delta < (90*60)) {
r = 'an hour ago';
} else if(delta < (24*60*60)) {
r = '' (parseInt(delta / 3600)).toString() ' hours ago';
} else if(delta < (48*60*60)) {
r = '1 day ago';
} else {
r = (parseInt(delta / 86400)).toString() ' days ago';
}
return r;
};
String.prototype.hashify = function() {
return this.replace(/#([A-Za-z0-9/.]*)/g, function(m) {
return '<a target="_new" href="http://twitter.com/search?q=' m.replace('#','') '">' m "</a>";
});
};
String.prototype.linkify = function(){
return this.replace(/[A-Za-z] ://[A-Za-z0-9-_] .[A-Za-z0-9-_:%amp;?/.=] /, function(m) {
return m.link(m);
});
};
String.prototype.atify = function() {
return this.replace(/@[w] /g, function(m) {
return '<a href="http://www.twitter.com/' m.replace('@','') '">' m "</a>";
});
};
$.getJSON(URL, function(JSON) {
$.each(JSON.results, function(i, tweet) {
var profilePicture = tweet.profile_image_url;
var userLink = tweet.from_user;
var text = tweet.text;
text = text.linkify().atify().hashify();
var createdAt = new Date(tweet.created_at);
var myTweet = '<a href="http://www.twitter.com/' userLink '" title="' userLink '">' userLink '</a> ';
myTweet = text;
$(settings.tweetHolder).append('<li class="cycles">' myTweet '</li>');
});
var elements = $(settings.tweetHolder).children();
var timeOutStart = 5000;
function fader(elementId) {
setTimeout(function() {
$(elements[elementId]).fadeOut(settings.fadeSpeed, function() {
$(elements[elementId 1]).fadeIn(settings.fadeSpeed);
});
}, timeOutStart * (elementId));
};
for (var j = 0; j < elements.length; j ) {
fader(j);
};
});
};
})(jQuery);
В моем готовом заявлении :
$.socialFader({ tweetHolder:"#twitter", tweetName:"nettuts", tweetCount:2 });
Ответ №1:
Вот плагин, который я написал, который действительно упрощает агрегацию tweet / json, а затем синтаксический анализ. Это приводит к исчезновению твитов. Просто возьмите необходимый код. Наслаждайтесь.
(функция($) {
$.socialFader = function(options) {
var settings = {
tweetHolder : null,
tweetCount : 99,
fadeSpeed : 500,
};
if (options) {
$.extend(settings, options);
};
var URL = "http://search.twitter.com/search.json?q=jqueryamp;rpp=" settings.tweetCount "amp;callback=?";
function relative_time(time_value) {
var values = time_value.split(" ");
time_value = values[1] " " values[2] ", " values[5] " " values[3];
var parsed_date = Date.parse(time_value);
var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
delta = delta (relative_to.getTimezoneOffset() * 60);
var r = '';
if (delta < 60) {
r = 'a minute ago';
} else if(delta < 120) {
r = 'couple of minutes ago';
} else if(delta < (45*60)) {
r = (parseInt(delta / 60)).toString() ' minutes ago';
} else if(delta < (90*60)) {
r = 'an hour ago';
} else if(delta < (24*60*60)) {
r = '' (parseInt(delta / 3600)).toString() ' hours ago';
} else if(delta < (48*60*60)) {
r = '1 day ago';
} else {
r = (parseInt(delta / 86400)).toString() ' days ago';
}
return r;
};
String.prototype.hashify = function() {
return this.replace(/#([A-Za-z0-9/.]*)/g, function(m) {
return '<a target="_new" href="http://twitter.com/search?q=' m.replace('#','') '">' m "</a>";
});
};
String.prototype.linkify = function(){
return this.replace(/[A-Za-z] ://[A-Za-z0-9-_] .[A-Za-z0-9-_:%amp;?/.=] /, function(m) {
return m.link(m);
});
};
String.prototype.atify = function() {
return this.replace(/@[w] /g, function(m) {
return '<a href="http://www.twitter.com/' m.replace('@','') '">' m "</a>";
});
};
$.getJSON(URL, function(JSON) {
$.each(JSON.results, function(i, tweet) {
var profilePicture = tweet.profile_image_url;
var userLink = tweet.from_user;
var text = tweet.text;
text = text.linkify().atify().hashify();
var createdAt = new Date(tweet.created_at);
var myTweet = '<a href="http://www.twitter.com/' userLink '" title="' userLink '">' userLink '</a> ';
myTweet = text;
$(settings.tweetHolder).append('<li class="cycles">' myTweet '</li>');
});
var elements = $(settings.tweetHolder).children();
var timeOutStart = 5000;
function fader(elementId) {
setTimeout(function() {
$(elements[elementId]).fadeOut(settings.fadeSpeed, function() {
$(elements[elementId 1]).fadeIn(settings.fadeSpeed);
});
}, timeOutStart * (elementId));
};
for (var j = 0; j < elements.length; j ) {
fader(j);
};
});
};
})(jQuery);
Комментарии:
1. Я превратил это в плагин и вызвал его в моей готовой функции $ (‘#container’).socialFader() ; Однако он говорит, что это не функция.. я что-то упускаю?
2. Вам нужно вызвать это: $.socialFader({ ‘#divWhereTweetsGo’ });
3. вероятно, вы пропустили название свойства в примере объекта options в одном комментарии выше.
4. Понял $.socialFader({ tweetHolder: «#twitter» });
Ответ №2:
Вам нужно проанализировать содержимое твита, найти URL-адреса, а затем поместить их между собой.
Ответ №3:
К сожалению, на данный момент в поисковом API нет возможности выделять объекты tweet (т. Е. ссылки, упоминания, хэштеги), как в некоторых методах REST API. Итак, вы могли бы либо самостоятельно проанализировать объекты (я использую регулярные выражения), либо вызвать rest API для получения объектов.
Если вы решите выполнить обратный вызов в REST API и после извлечения идентификатора статуса из результатов API поиска, вы должны вызвать statuses / show следующим образом:
http://api.twitter.com/1/statuses/show/60183527282577408.json?include_entities=true
В результирующем JSON обратите внимание на объект entities.
"entities":{"urls":[{"expanded_url":null,"indices":[68,88],"url":"http://bit.ly/gWZmaJ"}],"user_mentions":[],"hashtags":[{"text":"wordpress","indices":[89,99]}]}
Вы можете использовать приведенное выше, чтобы найти конкретные объекты в твите (которые находятся между позициями строк, обозначенными свойством indexes) и преобразовать их соответствующим образом.
Если вы предпочитаете анализировать объекты самостоятельно, вот регулярные выражения (.NET Framework), которые я использую:
Шаблон сопоставления ссылок
(?:<w .*?>|[^=!:'"/]|^)((?:https?://|www.)[-w] (?:.[-w] )*(?::d )?(?:/(?:(?:[~w %-]|(?:[,.;@:][^s$])) )?)*(?:?[w %amp;=.;:-] )?(?:#[w-.]*)?)(?:p{P}|s|<|$)
Укажите шаблон соответствия
B@([wd_] )
Шаблон сопоставления хэштегов
(?:(?:^#|[s([]#(?!ds))(w (?:[_-. /]w )*) )
Twitter также предоставляет библиотеку с открытым исходным кодом, которая помогает фиксировать объекты, относящиеся к Twitter, такие как ссылки, упоминания и хэштеги. Этот java-файл содержит код, определяющий регулярные выражения, используемые Twitter, а этот yml-файл содержит тестовые строки и ожидаемые результаты многих модульных тестов, использующих регулярные выражения в библиотеке Twitter.
Как вы обрабатываете твит, зависит от вас, однако я обрабатываю копию исходного твита и сначала извлекаю все ссылки, заменяя их в копии пробелами (чтобы не изменять длину строки). Я фиксирую начальное и конечное местоположения соответствия в строке вместе с соответствующим содержимым. Затем я извлекаю упоминания, затем хэштеги — снова заменяя их в копии твита пробелами.
Такой подход гарантирует, что я не нахожу ложных срабатываний для упоминаний и хэштегов ни в каких ссылках в твите.
Ответ №4:
Я немного изменил предыдущую. Ничего не остается после того, как все твиты исчезают один за другим.
Теперь он проверяет, есть ли какие-либо видимые твиты, а затем обновляет твиты.
(function($) {
$.socialFader = function(options) {
var settings = {
tweetHolder : null,
tweetCount : 99,
fadeSpeed : 500,
};
if (options) {
$.extend(settings, options);
};
var URL = "http://search.twitter.com/search.json?q=istanbulamp;rpp=" settings.tweetCount "amp;callback=?";
function relative_time(time_value) {
var values = time_value.split(" ");
time_value = values[1] " " values[2] ", " values[5] " " values[3];
var parsed_date = Date.parse(time_value);
var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
delta = delta (relative_to.getTimezoneOffset() * 60);
var r = '';
if (delta < 60) {
r = 'a minute ago';
} else if(delta < 120) {
r = 'couple of minutes ago';
} else if(delta < (45*60)) {
r = (parseInt(delta / 60)).toString() ' minutes ago';
} else if(delta < (90*60)) {
r = 'an hour ago';
} else if(delta < (24*60*60)) {
r = '' (parseInt(delta / 3600)).toString() ' hours ago';
} else if(delta < (48*60*60)) {
r = '1 day ago';
} else {
r = (parseInt(delta / 86400)).toString() ' days ago';
}
return r;
};
String.prototype.hashify = function() {
return this.replace(/#([A-Za-z0-9/.]*)/g, function(m) {
return '<a target="_new" href="http://twitter.com/search?q=' m.replace('#','') '">' m "</a>";
});
};
String.prototype.linkify = function(){
return this.replace(/[A-Za-z] ://[A-Za-z0-9-_] .[A-Za-z0-9-_:%amp;?/.=] /, function(m) {
return m.link(m);
});
};
String.prototype.atify = function() {
return this.replace(/@[w] /g, function(m) {
return '<a href="http://www.twitter.com/' m.replace('@','') '">' m "</a>";
});
};
$.getJSON(URL, function(JSON) {
$(settings.tweetHolder).find('li.cycles').remove();
$.each(JSON.results, function(i, tweet) {
var profilePicture = tweet.profile_image_url;
var userLink = tweet.from_user;
var text = tweet.text;
text = text.linkify().atify().hashify();
var createdAt = new Date(tweet.created_at);
var myTweet = '<a href="http://www.twitter.com/' userLink '" title="' userLink '">' userLink '</a> ';
myTweet = text;
$(settings.tweetHolder).append('<li class="cycles">' myTweet '</li>');
});
var elements = $(settings.tweetHolder).children();
var timeOutStart = 5000;
function fader(elementId) {
setTimeout(function() {
$(elements[elementId]).fadeOut(settings.fadeSpeed, function() {
$(elements[elementId 1]).fadeIn(settings.fadeSpeed);
});
if (jQuery('#twitter ul li.cycles:visible').length==1) {
jQuery.socialFader({ tweetHolder:"#twitter ul", tweetCount:5 });
}
}, timeOutStart * (elementId));
};
for (var j = 0; j < elements.length; j ) {
fader(j);
};
});
};
})(jQuery);
jQuery(document).ready(function(){
jQuery.socialFader({ tweetHolder:"#twitter ul", tweetCount:5 });
});