Posterous theme by Cory Watilo

How to get Twitter trend cities list by using javascript and a simple JSON query

Trends as a useful way for people to find out what topics are being talked about around the world. Trending Topics is in high demand and many people use Twitter APIs to obtain the trends for locations. But how to obtain the locations for the trends? The Twitter trend locations is generated by Twitter system from the receiving enough Tweets from geographical area. The Locations that appear in the list are not manually selected, but rather displayed dynamically based on tweet volume. With the following javascript snippet you will have the current cities list from the live twitter trend locations.

What does this code?

In the source code we use the jquery library to make a call to the url

http://api.twitter.com/1/trends/available.json

This API Returns the locations that Twitter has trending topic information for. The response is an array of "locations" that encode some human-readable information such as a canonical name and country the location belongs in. The invocation of this api require no authentication. We use the result of json call to build a table with 2 columns: city name, country. City name have a link to localstreamer website city page.

Localstreamer is the website that aggregates information about what’s going on in a specific city right now. You can build a webpage for every city of the earth simple calling an url.

The standard url to use the localstreamer website has the following format:

http://www.localstreamer.com/in/<escaped_city_name>,<country 2-digit iso code>

for example the WebPage url for the Madrid in Spain, it will be:

http://www.localstreamer.com/in/madrid,es

In the code, we build the link in a very easy way, we use javascript function 'encodeURIComponent' to escape the city name and we apply the lowercase to the city name string, the lower case is applied to the 2-digit country code too.

  • <escaped_city_name> = encodeURIComponent(item.name.toLowerCase())
  • <country 2-digit iso code> = item.countryCode.toLowerCase()

This is another real example of Localstreamer's url format:

http://www.localstreamer.com/in/san%20francisco,us

To see the script in action, [CLICK HERE]

How to create a simple "Follow Me" button for Twitter,Facebook,Google plus

Stop your search here! In this article you will find the final solution how to implement a social "follow me" button to connect all your social network profiles to your blog or website. Let's start out with a brief thought : Why Should I add these buttons? Adding the "Follow Me" in your blog near the post (begin or end) will increase the number of your followers and indirectly increase the pageviews. These are the 3 must have buttons:

"FollowMe" on Twitter Button

A widget lets users easily follow a Twitter account from any web page.

or insert this simple code into your html webpage:



<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>


Replace putyourtwitternamehere string with your twitter username.

Live Example:

 

"FollowMe" on Facebook Button

The link will be brought you to a screen allowing you to choose which type of site you are adding the follow me on Facebook web button link to.

Live Example:

Social Friend Adder

 

"FollowMe" on Googleplus Button

First of all you need your Googleplus profile url. From your personal profile url extract your ID

it is formed by the numbers behind the http://plus.google.com/ part of the url at your profile page.

go to the official go to Google’s profile button generator page and paste your profile ID

http://www.google.com/webmasters/profilebutton/

Live Example:

Another solution is to generate a badge like Facebook badge, but it is not official google solution.

Just follow this webaddress http://widgetsplus.com compile the form with your profile ID to make your own widget for Google+

Live Example:

 


Want see them in action?

We have used some of these widgets and codes to build a little project! Social Friend Adder

Search by location:Twitter users to follow, Facebook profiles to ask friendship and people to join in your Google+ circles. Make you a more friendly person!

[DEMO]


 

Why should I make friends online? We have the answer to this question.

Over the past 10 years we have witnessed a social and cultural revolution. A phenomenon so powerful and compelling in wich we all have took part . I'm talking about something very close to all of us, that is The NET (Internet). Let's face it, not a day goes to end in wich everyone not do at least a couple of network access, and now we use smartphones,we can log in when are away from home too. In the era of interconnection total, everything travels faster and so our lives too, the habits change and evolve into something unexpected, or sometimes innimmaginabile until a few years ago. The time we spend online is increasing more and more and steals time from other parts of our lives. Making friends online is what everybody is doing today.

Media_httpwwwjustsayp_nagrh

You can meet many people from around the world just from sitting in front of your computer, all  the connected people have a facebook profile and a twitter one too.There are many differences Between Facebook and Twitter, usually everyone follows a (real) friend on facebook or those people with which we are in contact also in everyday life when we are not connected to the Internet. Twitter it's different, perhaps because of its 140 chars limitation, on Twitter social network people follow other people by the same interests, associations, Newspapers, anyone who has something to say can quickly reach thousands of people to express their opinions even to perfect strangers.There has a lot of websites online that allow you to add new people in your social networks that allow people to ask to find the friendship on Facebook and people to follow on Twitter. Both of the two social networks have already also search tools that facilitate this operation. Localstreamer.com in recent weeks has seen fit to build an innovative service it is a mashup that uses the API (Application Programming Interface) of the two popular social network to do just that, finds people to follow online and to ask for his friendship, it has name "Social Friend Adder".

Media_httpdldropboxco_jotzj

The "Social Friend Adder" website has its uniqueness compared to other sites, the uniqueness is that it allows you to search for new friends based on a location, so you can find people who live in any location on earth or in some way they have to do with that place, for example have mentioned in their posts.

The interface is simple and intuitive to use, once you typed in the address http://www.localstreamer.com/friendadder.html you are presented with a search form on which you can make choices to configure how the search should be made.

  • Choose to search on Facebook or Twitter
  • Connect to the selected social network (by clicking on the button at top right of the page)
  • If you choose Twitter, you can also filter out people according to language. If you choose Facebook, you can filter the results between males and females users.
  • After setting the filter you want, write the location name in the text box and press the Enter key or the icon next to its search field.

If you followed the above steps after a few seconds the system will present the results on the screen, if you have chosen Twitter you can add all the people clicking on the "Follow" button, if you chose Facebook you must click on the button with the symbol of plus (+) to ask the friendship. The interesting thing is that in the case, for Facebook results, you can watch on the Facebook the user profile of the person clicking on its name, or decide to send a message before ask for his friendship. The system searches for all and only people who have set levels of privacy in their profile as public.

If your goal is to establish contacts for purposes of expanding your business, making online friends will help you do that. Communication is a very important part of life. Making online friends is such a rewarding experience that will entertain and educate you.

Start now : http://www.localstreamer.com/friendadder.html

Get static map images for your next html5 geolocation application

The "where?" question is very small one but the answer to that question is assuming increasing importance in our lives. The Key to get an answer is another word "Geolocation" that is about finding out where someone or something is located on the earth. Every good developer should be ready to respond efficiently and effectively to market demands. All the most important companies are adding locations functions to improve the services they offer their users.

In this article you will learn how to build an interesting map mashup by using one of our api (Application Programming Interface) that we have developed for our online service http://www.localstreamer.com . Localstreamer is a geolocation system that allows you to explore events and news about a place, from reading public facebook statuses and tweets updates. We provide a set of APIs to developers and 3rd parties by interacting with the service offered by the Mashape Marketplace http://www.mashape.com . Mashape system provides code and methods for communicating over HTTP with our REST server, so you can select PHP, Object-C, Java (Adnroid too), Python, Ruby as programming languages, you can easily download a ready client code to begin your development.

The demo will use html5, javascript technology and is based on the following idea: Suppose you have simple text containing some location names, this text can be taken from any source , eg an extract from a database, this demo automatically takes plain text and enrich it with static links to different geographic maps , it turns your plain text into hypertext by using our wrapper for static maps to get the url of the map offered by one of the various web map providers. A static map is a simple image of a map, it does not provide complex features, such as dragging and smooth panning and zooming.

First of all, let introduce to you our wrapper for static maps

This API is a wrapper implementation to obtain valid static image map url from different map providers (Bing maps,Facebook Places,Foursquare,Google static map,Nokia Ovi,Openstreetmap). The map providers create maps based on url Parameters sent through standard http request and returns the map in the form of an image. This service let you embed static maps of different types in your web pages. Facilitates interfacing to some map providers, by taking off from the developer work the burden of studying how to send the parameters for each provider.

Media_httpdldropboxco_gawpz

Suppose your application contains such text from database: "The cities near San Francisco are equipped of natural wonders. In areas close to the city and further south to the Monterey Peninsula, the beaches are rugged and rocky. In the southwest of San Francisco is located San Jose, the capital of Silicon Valley the global center for the high-tech industry." As you can see there are different place names: San Francisco,Monterey Peninsula,San Jose,Silicon Valley. In our example we want associate a static map to these places, the map will appear as a popup when the user moves the mouse over the location name.

Want see the result immediately? View the Demo or continue reading this tutorial.

1) To invoke our API we need a token for the domain where the code is hosted. Mashape allows the issuing of JSONP Token associated with one or more domains that replaces your API Key, so that nobody can impersonate your user. You can create the jsonToken for your domain here: http://www.mashape.com/account/jsonp/index

2) We define an Array of Arrays containing [placename,latitude,longitude]

3) We call mashape API to get a valid token to invoke our Api Wrapper for static maps. The Demo executes  this operation for every placename that is found in the text. The result of the call to the API is an object containing the url of the image from map provider, the text is replaced with html <img> tag code, the demo uses some simple css  to create the popup.

You can see the DEMO in action here.

View the HTML source code of that web page for complete source code or go to

git://gist.github.com/995689.git

* To make work this DEMO, the code must  to be hosted on a server otherwise because of security concerns Ajax will not work on your local computer. You can use a static map in many other contexts and with other programming languages not only javascript! You can use all those supported by the platform Mashape. This demo was used to demonstrate a practical example of use.

To get started with our APIs, request an invitation by sending an email to

inviteme@localstreamer.com - put in the subject "invite me!"

(we will activate activate your account within 24 hours) 

New location APIs will be available in the coming weeks, bookmark this page: 

http://www.localstreamer.com/pages/developers/api.html

stay tuned ;-)

 

Project Status Report, new ideas are coming!

In recent weeks, came many suggestions on how to review the graphical interface of the system. Checks  have pointed out that the functions "chat" and "comments" are not widely used and this probably depends on a graphical user interface is not intuitive.

In the coming weeks then will review the graphic interface, the development of new APIs and the introduction of social features such as the ability to search for potential followers on twitter and Facebook friends who are in the same city.

If you want more information or want give suggestion, contact us

info@localstreamer.com

and remember to visit the website:

http://www.localstreamer.com