BroadbandTV - Yelp Video Augmenter

A Chrome extension that adds related videos from Facebook and YouTube into Yelp pages.

Comment

YouTube and Facebook videos direct into Yelp pages.

How this chrome extension works

YouTube:

We extract business' geolocation getting a Yelp page's metadata inserted into HTML and with this information we fetch (up to 50) YouTube videos geotagged nearby (250 meters). Very simple and useful.

Facebook (BONUS)

Or in Facebook case, we search for a page using the Facebook's Graph API. If we find a page, we fetch all videos from it.

Caveats:
  • YouTube isn't used so much to rate or share experiences in a place! It's result is not precise.
  • To see Facebook videos, you need to authenticate through the extension's options button.
  • The Facebook application created to this project isn't approved yet (it's sandboxed). Just authorized users can log into it. If you want to try it out, let me know via estevao.lucas@gmail.com.

All new elements added into the page via extension are following the Yelp's style guide and icons.

You can use arrow keys to navigate between videos. Use esc key to close the video.

To see the extension running, just install it through the extension page

Requirements to build

NPM is needed to install all dependencies.

$ npm install to install everything.

How to run

Open the Extension page via Window -> Extension, check the Develop Mode checkbox. Click on Load unpacked extension... button and search for /chrome folder on in this project root. Just it. Now access any bussines page on Yelp and violá. If was found some video near the business address, will appear a box below the map and images thubnail block.

Inside the /src/inject.js file we have the all the JS (with ES6 via Babel) code to run the plugin.

Run $ gulp watch or $ gulp build to compile the file.

PS: Everytime you update anything on this project you need to update/reload the package extension too. To do that, you just need to click on Realod button in Vyelp item on Extension page".

TODO

  • Add support to Instagram videos. We're waiting our instagram's application be approved. We did a proxy to Instagram API with auto-authentication, to get Videos in places that has the same name then Yelp business name. You can see here the repository created by Maxwell Pinto (a participant of Vanhackathon) using .Net and the endpoints created here. With the Instagram application in sandbox it wasn't possible to add support now.

Built With

Share this project:

Updates