Twitter Like Parsing URLs with JavaScript.

This tutorial explains about how to Parsing URLs within the posted text like Twitter with Javascript. My last post I had included this Script. I was developing project I found this nice javascript prototype property script in mozilla labs site.

If you want to suggest any other alternate scripts, feel free post a comment.

JavaScript 
Method String.prototype property invoked parseURL. When called on a String the regular expression finds any case of a URL and will enclose the URL with a HTML anchor tag. 
<head> 
String.prototype.parseURL = function()
{
return this.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+/, function(url) {
return url.link(url);
});
};
</head> 

index.php
Here we applying the parseURL() method to text variable called posted update contains a URL. But in database the update does not contain any anchor HTML tag.

<body> 

<form action="" method="post">
<span class="what">What are you doing?</span>
<textarea  =""  cols="55" id="update" maxlength="145" name="update" rows="3"></textarea>
<input type="submit" value=" Update "  class="update_button" />
</form>


<?php

include("dbconfig.php");
$sql="select * from updates order by ms_id desc"
$result = mysql_query($sql); 
while($row=mysql_fetch_array($result)) 

$message=stripslashes($row["message"]); 
?>
<tr>
<td>
//---------------------------------------------------------------

<script type="text/javascript">
var test = "<?php echo $message; ?>";// Variable text = Updates from the database
document.write(test.parseURL())
</script>


//---------------------------------------------------------------
</td>
<td>
<a href="#" id="<?php echo $row["ms_id"]; ?>" class="delbutton"><img src="trash.png" alt="delete"/></a> </td></tr>
<?php
}
?>

</body>

JavaScript parser for Tweet Entities
/*
* twitter-entities.js
* This function converts a tweet with "entity" metadata
* from plain text to linkified HTML.
*
* See the documentation here: http://dev.twitter.com/pages/tweet_entities
* Basically, add ?include_entities=true to your timeline call
*
* Copyright 2010, Wade Simmons
* Licensed under the MIT license
* http://wades.im/mons
*
* Requires jQuery
*/
function escapeHTML(text) {
return $('<div/>').text(text).html()
}
function linkify_entities(tweet) {
if (!(tweet.entities)) {
return escapeHTML(tweet.text)
}
// This is very naive, should find a better way to parse this
var index_map = {}
$.each(tweet.entities.urls, function(i,entry) {
index_map[entry.indices[0]] = [entry.indices[1], function(text) {return "<a href='"+escapeHTML(entry.url)+"'>"+escapeHTML(text)+"</a>"}]
})
$.each(tweet.entities.hashtags, function(i,entry) {
index_map[entry.indices[0]] = [entry.indices[1], function(text) {return "<a href='http://twitter.com/search?q="+escape("#"+entry.text)+"'>"+escapeHTML(text)+"</a>"}]
})
$.each(tweet.entities.user_mentions, function(i,entry) {
index_map[entry.indices[0]] = [entry.indices[1], function(text) {return "<a title='"+escapeHTML(entry.name)+"' href='http://twitter.com/"+escapeHTML(entry.screen_name)+"'>"+escapeHTML(text)+"</a>"}]
})
var result = ""
var last_i = 0
var i = 0
// iterate through the string looking for matches in the index_map
for (i=0; i < tweet.text.length; ++i) {
var ind = index_map[i]
if (ind) {
var end = ind[0]
var func = ind[1]
if (i > last_i) {
result += escapeHTML(tweet.text.substring(last_i, i))
}
result += func(tweet.text.substring(i, end))
i = end - 1
last_i = end
}
}
if (i > last_i) {
result += escapeHTML(tweet.text.substring(last_i, i))
}
return result
}
Labels:

Post a Comment

[facebook][blogger]

Author Name

Contact Form

Name

Email *

Message *

Powered by Blogger.