Thursday, March 6, 2014

Bootstrap YouTube Popup Player Plugin

If you liked my previous jQuery YouTube Popup Player Plugin, I've created a Bootstrap version which is very similar in use but uses Bootstrap's Modal Popup to embed the YouTube Player. This plugin will need the complete Bootstrap library or just the Modal component to run this plugin.

Use the link below to view a demo or read the documentation on how to include this on your page. You can download the latest version of this plugin’s library from Github.

 Demo and Documentation: http://lab.abhinayrathore.com/bootstrap-youtube/

 Github: https://github.com/abhinayrathore/Bootstrap-Youtube-Popup-Player-Plugin

jQuery Cheatsheet

The last and always up-to-date version of jQuery API Cheatsheet you’ll ever need. I use web-scraping to get the latest version of jQuery and then load the API information into a nicely printable cheat-sheet.

http://lab.abhinayrathore.com/jquery-cheatsheet/

Tuesday, May 8, 2012

jQuery and jQueryUI links for Google and Microsoft CDN's

The Google Libraries API and Microsoft Ajax Content Delivery Network (CDN) hosts the popular jQuery library and enables you to easily add them to your Web applications. For example, you can start using jQuery which is hosted on this CDN simply by adding a <script> tag to your page that points to a CDN link. These CDN's are very efficient and reliable as they have more replications to reduce latency. Browsers limit the number of concurrent connections (file downloads) to a single domain so using CDN's triggers parallel downloads leading to faster page loading. Here are some reasons to USE and NOT USE the CDN networks.

The versions of jQuery keeps getting updated every now and then and it's difficult to keep track of the latest releases. For that reason I've created a page that automatically pulls in the latest versions and links for the jQuery, jQueryUI and jQueryUI Theme libraries for both Google and Microsoft CDN's. Keep it bookmarked to stay up-to-date on jQuery releases.

http://lab.abhinayrathore.com/jquery_cdn/

Sunday, February 26, 2012

Weather Geocoder with Google Maps and Google Weather API

Google Weather GeocoderI got tired of searching locations on weather reporting websites to get instant updates, so I thought of building an instant weather reporting application which would give me information for any location I click on the map. Google Maps API provides an inbuilt reverse-geocoding service which can geocode an IP Address to a place on the map. To get weather information, I’ve used the so called secret Weather API from Google which they use on the iGoogle page widget. Google has not officially published this API but we would love if they do so. The good thing about Google’s weather API is that it is easy to use and includes the weather icons, but there is no way as of now to get the data in other formats apart from XML:
http://www.google.com/ig/api?weather=Chicago.

Demo on my Labs page: http://lab.abhinayrathore.com/geocode_weather/

You can play around with the app on my labs page and view the source on the page to get the JavaScript code to build this tool on your own website. To convert the XML data from Google Weather API to JSONP, I’ve written a small PHP script you can download from the link below.

Click here to get the PHP Script for converting Google Weather API’s XML data to JSON/JSONP format.

You can style the Weather Information window according to your needs or you can use the one I’ve created: http://lab.abhinayrathore.com/geocode_weather/weather.css. You can freely modify the JavaScript code to suit your needs. If you find any bugs or see improvement opportunities, please do drop a comment below and I’ll look into it asap :)

Sunday, October 30, 2011

IMDb Search Suggestions with jQuery Autocomplete

In conjunction of my previous posts on IMDb Scraper API and jQuery Autocomplete with multiple search suggestions, on popular demand, I’ve created yet another search suggestion tool to fetch suggestions from IMDb.com. I’ve implemented a simple PHP Proxy script to get search suggestions from IMDb and format it according to jQuery Autocomplete Widget’s JSON data format.

For downloading and a guide to setup the suggestions tool on your website please visit the demo page on my labs section. You will need the suggest.php and imdbImage.php Proxy files for pulling content from IMDb.

Demo: http://lab.abhinayrathore.com/imdb_suggest/

IMDb’s suggestion API provides Title Name, Title Id, Cast, Type and Poster URL to display in the dropdown. You can customize the JavaScript code for your needs. IMDb has a leechers policy in place for media images so I’ve also included a PHP Proxy script to show IMDb Posters on search dropdown.

Saturday, October 1, 2011

jQuery Autocomplete with Multiple Search Engines

Search suggestions are one of the most important features people like to include on their sites as it minimizes the chances of typo errors and facilitate easy search my providing relevant suggestions in real time. I use a similar search suggestion tool on my personal dashboard page which works exactly like the Google suggest page. I thought of expanding it to include suggestions from multiple search engines so if I want to search some product on Amazon or some knowledge article on Wikipedia, it would get suggestions from all the engines at once. Here you can find an easy way to incorporate multiple search suggestions on your pages using jQuery and a small PHP script which combines the search suggestions.

Demo and Download: http://lab.abhinayrathore.com/autocomplete/

Search suggestion engines it can support out of the box are: Google, Bing, Yahoo, Wikipedia, Amazon and Ebay.

For adding more suggestion engines, you can read the Configuration Options section on the page above. You can download the PHP script to combine multiple search suggestions from the link above.

Tuesday, June 14, 2011

IP Address Geocoding API for Google Maps

IP Address Geocoding is getting more and more popular with people who are building their own analytics tools or want to track their users. There are a lot of free geocoding web services available which can return the geocoded data in text, XML or JSON format, the most popular ones being http://freegeoip.net, http://ipinfodb.com, http://www.hostip.info, http://www.maxmind.com and many others. Geocoded data from these website can be easily accesses by using any server side scripts, but I wanted to build a JavaScript based solution which only works using asynchronous AJAX calls. For this API I used a free web service provided by http://freegeoip.net/ which returns data in XML(http://freegeoip.net/xml/) or JSON(http://freegeoip.net/json/) format and recently added JSONP callbacks so we can implement a pure JavaScript based API.

This API uses Google Map Api to display map and geotag the IP Address. You will have to sign up for Google Map API if you haven't already done for your domain.

For demo and more information on how to use this API, please visit my lab page at:
http://lab.abhinayrathore.com/ipmapper/

Please drop a comment below if you like this API or have any modifications or improvements.