Lara Entertainment

Perfect amount of fun in a perfect amount of time

Comment

Inspiration

A little annoyance about airplane flights is leaving a plane with an incomplete movie. With LARA Entertainment, we help solve that problem by giving entertainment suggestions based on the length of your flight.

LARA Entertainment

Simply put, LARA Entertainment compiles a list of movies, music, or podcasts based on the length of the plane ride. This ensures you have seamless entertainment on the plane, eliminating the need to search for something to watch or listen to and ensuring you won't miss the end of the movie.

How It Works

The project began by taking data from American Airlines and using Heroku to host American Airlines’s API to find the duration of time a plane takes from airport to airport.

async function main(departure, arrival){
    let date = [
        Math.floor(Math.random() * 2) + 2020,
        Math.floor(Math.random() * 9) + 1,
        Math.floor(Math.random() * 17) + 10,
    ]
    let res = await axios.get(`https://hackaton-b63c81a22259.herokuapp.com/flights?date=${date[0]}-0${date[1]}-${date[2]}&origin=${departure}&destination=${arrival}`)

    let ranIndex = Math.floor(Math.random() * res.data.length)
    let hours = res.data[ranIndex].duration.hours
    let minutes = res.data[ranIndex].duration.minutes


    return[hours, minutes, (hours * 60) + minutes]
}

This information is a function that was called later in multiple files to find movies, music, and podcasts. To find movies that matched the duration of the ride, we web-scraped the IMDB website. This was done with the help of the Axios and Cheerio framework. 

const axios = require('axios')
const cheerio = require('cheerio')
const getTime = require('./getTime.js')



async function getMovies(departure, arrival){
    let flightTime = (await getTime.main(departure, arrival))[2]

    let movies = []

    let res = await axios.get(`https://www.imdb.com/list/ls075401331/?sort=list_order,asc&st_dt=&mode=detail&page=${Math.floor(Math.random() * 62) + 1}`, 
    {
        headers : {'User-Agent' : 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36'}
    })

    const $ = cheerio.load(res.data);

    const links = $('.lister-item-content').each((index, value) => {
        let title = $(value).find('.lister-item-header a').text().trim();
        let runTime = ($(value).find('.text-muted.text-small span.runtime').text()).split(' ')[0]

        if(Number(runTime) <= flightTime){
            movies.push([title, runTime])
        }
    })

    return movies
}

To make the program work, we made an express server on localhost 3000.

app.listen(3000, () => {
    console.log(`Server is running on http://localhost:${3000}`);
});

Additionally, we made our own API--"/movieData". Every time our API was called, the movie function extracted and stored the data concerning the length of the flight in the API. Finally, when the user used the "/movie" route, the movie page sent a get request to our API and responded with the list of movies.

To form the front end, we used HTML(EJS), CSS, and JavaScript to create a home page with space for arrival/departure inputs. This home page then redirects you to the landing page which provides the user with different entertainment options. To create an interactive website interface, we made use of the CSS flexbox and grid functions. 


.frontPageContainer{
    display: flex;
}
.frontPageButton{
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    background-color:skyblue;
    object-fit: cover;
    color: white;
    cursor: pointer;
    flex: 1;
    transition:flex-grow 0.5s;
    border: 0px;
    height:100vh;
    width:100vw;
}
.frontPageButton:hover{
    flex-grow: 2;
}
grid-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); /* Adjust the minmax values as needed */
    gap: 10px; /* Adjust the gap between items as needed */
    list-style: none;
    padding: 0;
  }
  .grid-list li {
    background-color: #e0e0e0; /* Optional background color for each list item */
    padding: 10px;
    text-align: center;
    transition: transform .1s ease-in
  }
  .grid-list li:hover{
    transform: scale(1.2);
  }
  .grid-list li:not(:hover){
    opacity: 0.5;
  }

What We Learned

We learned how to navigate through Git, developed proficiency in full-stack development, and the implementation of APIs. Together, we faced a lot of challenges such as properly organizing code which was solved with the use of communication and git. Moreover, we learned how to effectively split backend and frontend tasks, and then collaborate to integrate the two parts. Although parts of the projects are incomplete, we could not be prouder of what we accomplished together.

Share this project:

Updates