An isotope powered social stream.An infinite social stream based on RSS feeds with a MySQL backend.Currently supports the following social networks (however it should work reasonably well with any RSS feed):
- Google Plus
- Github
- Stackoverflow
Best jQuery Other API Plugins & Tutorials with Demo
TwitStream : jQuery, AJAX, and the Twitter Search API
I was perusing the Web looking for some quick and dirty Javascript I could use with the Twitter Search API to display a list of recent tweets containing a particular keyword. I came across the monitter.com widget, which was almost exactly what I had in mind, except that it includes some really great, rich features that were well beyond what I needed. I adapted and simplified the monitter script to:
- Fix an issue with unescaped characters, e.g. hashes, in the search query.
- Fix an issue with ampersands in links in the
linkify()function. - Replace some deprecated HTML tags, e.g.
<b>, and fix other XHTML validation issues, e.g. using self-closingimgtag. - Fetch search results only once, rather than every few seconds (since Twitter sets a rate limit of 100 requests per-hour per-user, I found this to be necessary).
- Specify the number of tweets to return using an additional
class. - Remove the fade-in effect.
- Hyperlink each user’s profile image to their timeline.
Just like monitter, TwitStream utilizes the jQuery framework. Because jQuery is awesome.
geo autocomplete : jQuery plugin to autocomplete location using Google Maps v3 API
geo-autocomplete converts any input field on a web page into an autocomplete field that suggests locations in real-time as you type, including a little thumbnail to help you quickly choose the right location. It’s like Google Instant for your Maps.
The Google Maps V3 API now incudes an autocomplete feature that will adapt any text input field to autocomplete locations &/or Places. It doesn’t show thumbnails yet but the addition of Places will be great for some use cases.
Flickrshow : Simple Javascript slideshow for Flickr
Flickrshow is a very simple Javascript slideshow for Flickr. It doesn’t require any web-development expertise, any particular Javascript frameworks, (although it works with all of them), or any hosted web space. It works in all modern web browsers, and Internet Explorer 6.Flickrshow can display the latest images uploaded to Flickr in less than 40 characters.
Although Flickrshow does not require jQuery, if JQuery is detected Flickrshow will add a convenient wrapper function allowing you to use Flickrshow as you would any other JQuery plugin.
How to grab Dribbble feed with jQuery and CSS3
As a web developer, third party API integration is something you will have to face. Especially with the current trend, we have facebook, twitter, flickr etc. Today, we are going to look at dribbble’s API. Dribbble is a place to show off your design, it’s based on invitation basis, therefore, most designs are of high quality.Dribbble API documentation is pretty neat and straight forward, it’s still in Beta stage at the moment, but it’s pretty stable and easy to use.
However, we will not retrieve it directly from Javascript, we call it using PHP to solve AJAX cross domain issue. I wrote a simple PHP proxy to retrieve the JSON data from dribbble. It’s not the best PHP script (it’s very rough!), but it will do the job just fine. You can enhance the PHP from here such as adding cache control to reduce number of call to dribbble, and perhaps, make it a little bit more secure.
Google Maps Slider with jQuery
I’m sure it’s partly me getting better at JavaScript, but I found the API quite well done and easy to work with. For one thing, it’s fully evented. That means you can attach event listeners to different thing, like the map itself or things inside the map. A simple example would be if a marker is clicked, you can change the zoom level of the map, change information shown elsewhere on the page, or really anything else you might want to do with JavaScript.
I created a list of locations in an unordered list. Each list item had HTML5 data attributes containing the latitude and longitude of it. It also contained a title and long and short descriptions.When one of these list items is hovered over, I apply a “hover” class to deal with styling, “pan” the map to the new coordinates, and fill out the right area with more information.
Google Places API – practice
Do you use google maps? I am sure that yes. Have you ever tried ‘Search nearby’ function here? I like this feature and today I will show you how you can develop similar script. We will use ordinary google maps plus extra library – Places (in order to use Google Places API). Our script will be able to search for address, objects, and also you can refine your search with extra params like: keyword, type and radius.
Redactor : Fantastic WYSIWYG-editor on jQuery
You must have noticed – a stylish editor. He looks equally well in any interface on any website. Are we wanting more, if the editor is already falling in love with his chosen interface?Inside you will find a clear, logical code. A good API. Customization available. All the tools to customize the editor for their needs. Be careful, your imagination can go a long way.
Drag a file from your computer out the window and insert a file, it immediately appears as a link directly to the text.Just drag the window and your image will already be in the editor.Clicking on any image editor, you can easily configure whether text wrap around the picture on the right or left.
jQuery Picasa Plugin
jQuery Picasa Plugin Stream Picasa Albums without touching the Server.Here is the HTTP API for Picasa. There’s a lot to it, but all we need to do is list albums and list photos. And we want to do this using Google’s experimental Data API feature of course, the Partial Response. The Partial Response allows us to limit the information the feed returns to us, which means significant performance improvement. For example, if all we want are the image urls, we don’t need thumbs, titles, descriptions, and the author. We can cut out 80% of the feed’s size. That’s awesome. Still waiting for Google Docs to have that.
The goal is to stream photos without ever having to touch your server. Aka, no PHP or Ruby proxy. Reason being, what if your pages are entirely static (Github Pages!), and you want it to work the same as if they were dynamic? The code should be all Javascript.
