Per formattare il testo e le date dei tweet di Twitter possiamo creare dei filtri in AngularJS.
I filtri sono i seguenti:
angular.module('TwitterFilters', []).filter('tweetify', function($sce) {
return function(text) {
text = text.replace(/((ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?)/gi, '<a href="$1">$1</a>')
.replace(/(^|\s)@(\w+)/g, '$1<a href="https://twitter.com/$2">@$2</a>').replace(/(^|\s)#(\w+)/g, '$1<a href="https://twitter.com/hashtag/$2?src=hash">#$2</a>');
return $sce.trustAsHtml(text);
}
}).filter('relativeTime', function() {
return function(text) {
var values = text.split(' ');
var timeValue = values[1] + ' ' + values[2] + ', ' + values[5] + ' ' + values[3];
var parsedDate = Date.parse(timeValue);
var relativeTo = new Date();
var delta = parseInt((relativeTo.getTime() - parsedDate) / 1000);
delta = delta + (relativeTo.getTimezoneOffset() * 60);
if (delta < 60) {
return 'less than a minute ago';
} else if (delta < 120) {
return 'about a minute ago';
} else if (delta < (60 * 60)) {
return (parseInt(delta / 60)).toString() + ' minutes ago';
} else if (delta < (120 * 60)) {
return 'about an hour ago';
} else if (delta < (24 * 60 * 60)) {
return 'about ' + (parseInt(delta / 3600)).toString() + ' hours ago';
} else if (delta < (48 * 60 * 60)) {
return '1 day ago';
} else {
return (parseInt(delta / 86400)).toString() + ' days ago';
}
}
});
Li includiamo nel modulo principale della nostra app:
angular.module('MyApp', ['TwitterFilters']);
usandoli come segue:
<div class="tweet" ng-repeat="tweet in tweets">
<time>{{tweet.created_at | relativeTime}}</time>
<p ng-bind-html="tweet.text | tweetify"></p>
</div>