Video-Search-Library
This is a take home project which involves building a super simple yet effective video search engine using only Google's Programmable Search Engine (PSE) Element Library (JavaScript API). The key here is to rely solely on Google's PSE Element JS library and not to use any other APIs or libraries, including Google's custom search engine JSON API or YouTube Data API.
Here's the breakdown of the mission:
- Create a New Search Engine: Kick-off this mission by creating a new search engine on the Google PSE platform. Configure the new search engine with the capability to "search the entire web" which generates a unique CX ID (also known as the "Search engine ID") which will be pivotal for the task.
- Build a Video Search Engine: With the new CX ID in hand and skills in HTML, CSS, and JavaScript, it's time to construct a simple video search engine that aligns with the provided design. Make sure to fully utilize the PSE Element Library (JS API) to achieve this task. Avoid making configurations directly from the PSE panel to filter or limit results; everything should happen through coding!
- Filter and Sort: The search engine needs to be fine-tuned to only display video results from music categories and sort these results based on popularity (in descending order by view count). Ensure it displays a maximum of 10 results per page.
- Implement Video Preview: Craft an experience where, upon clicking a video result, a preview overlay appears. This overlay should feature two buttons: 'Visit' and 'Close'. The 'Visit' button should open the video link in a new tab and close the overlay, while the 'Close' button should simply close the preview overlay.
- Create Navigation: Include a navigation area following the list of video results for users to traverse through the search result pages using 'Prev' and 'Next' options.