No description, website, or topics provided.
CSS JavaScript HTML ApacheConf
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.

                             What is Tagster?

Tagster is something we (PRDXN) put together to showcase an example of an API mashup. In this case it’s the mashup of Instagram and Google Maps.

Over the course of this project, Instagram changed their API rules (ugh!) and so we had to somewhat change what Tagster was.

Today, Tagster enables you to “watch” a community of 9 Instagram users, see what hashtags are most popular amongst these 9 Instagram users, and see where in the world these 9 Instagram users are posting their photos from (Geotagged view).

We hope that the open-source community can take what we’ve created here and adapt it to their various needs. Who knows what Tagster might end up being ;-). That’s the beauty of making a contribution to the open-source community.

If you need our help with Tagster or something else, let us know via

                       What technologies have been used?

Technologies used:

  1. HTML5.
  2. JQUERY.
  3. SASS.
  4. AJAX.
  5. Instagram API.
  6. Google Map API.
  7. BEM Naming Convention.
  8. JavaScript.

                            Functions used in map.js file

  1. MAP - Main module for google map.
  2. tagMethod - Callback function from AJAX for location, link and image.
  3. setMarkers - Adds markers to the map.
  4. setLocationData - function for storing location data.

                            Functions used in tagster.js file

  1. TAGSTER - Main module for tagster.
  2. NAV - Nav module for nav functionality.
  3. ACCORD - Accordian module of hashtags and user profile in ipad and small devices.
  4. GEONONGEOTAB - This module is for GEO Nongeo tab functionality.
  5. BACKTOHOME - This module is for Back to home page functionality.
  6. dynamic_profile_pic - Fetching profile picture dynamically for home page.
  7. storeCallback - Storing all user ID's of instagram user.
  8. nonGeoClick, geoClick - Fade functionality for geo and non-geo page.
  9. nav - hamburger functionality for home page.
  10. error_page - error page for error of User Requests Exceeded 500 per hour.
  11. accordion - Accordion functionality for ipad potrait and small screen size devices.
  12. toggle_button, close_toggle_button - Tab toggle functionality for geo and non-geo page.
  13. testMethod - Fetching HashTags, Locations, Links, Images from Instagram API by using AJAX.

                            Functions used in script.js file

  1. ready - Document ready function.
  2. load - window load function.
  3. orientationchange - window orientation change when accordion functionality is used.

                  How to work with SASS (Follow below Instruction)

  1. Install sass by following below steps - 1.1 Install Ruby by command --> sudo apt-get install ruby-full 1.2 Install sass by command --> sudo su -c "gem install sass" 1.3 Install compass to watch changes by --> sudo gem install compass
  2. Make changes in scss.
  3. Watch style.scss file which convert style.scss file to style.css by this command i.e, sass --watch style.scss:style.css --style expanded

                    Fork our Repo (Follow below instructions)

A fork is a copy of a repository. Forking a repository allows you to freely experiment with changes without affecting the original project.

  1. Just to learn about forking OR contributing to a repository. Here is the link Fork.
  2. Clone the forked repository to your local system.
  3. Add a Git remote for the original repository.
  4. Create a feature branch in which to place your changes.
  5. Make your changes to the new branch.
  6. Commit the changes to the branch.
  7. Push the branch to GitHub.
  8. Open a pull request from the new branch to the original repo.
  9. Clean up after your pull request is merged.


Contributions welcome! Please read the contributing guidelines before getting started.