web-dev-open · parthpishte · Feb 4, 2024
diff --git a/.env b/.env
@@ -1 +1,2 @@
-PORT=3000
+PORT=3000
+MONGODB_URI=mongodb://0.0.0.0/cinema
diff --git a/.github/stale.yml b/.github/stale.yml
diff --git a/app.js b/app.js
@@ -1,25 +1,15 @@
-// ℹ️ Gets access to environment variables/settings
-// https://www.npmjs.com/package/dotenv
 require('dotenv/config');
 
-// ℹ️ Connects to the database
 require('./db');
 
-// Handles http requests (express is node js framework)
-// https://www.npmjs.com/package/express
 const express = require('express');
-
-// Handles the handlebars
-// https://www.npmjs.com/package/hbs
 const hbs = require('hbs');
 
 const app = express();
-
-// ℹ️ This function is getting exported from the config folder. It runs most middlewares
 require('./config')(app);
 
 // default value for title local
-const projectName = 'lab-express-cinema';
+const projectName = 'cinema';
 const capitalized = string => string[0].toUpperCase() + string.slice(1).toLowerCase();
 
 app.locals.title = `${capitalized(projectName)}- Generated with Ironlauncher`;

diff --git a/config/index.js b/config/index.js
@@ -1,23 +1,9 @@
-// We reuse this import in order to have access to the `body` property in requests
 const express = require("express");
-
-// ℹ️ Responsible for the messages you see in the terminal as requests are coming in
-// https://www.npmjs.com/package/morgan
 const logger = require("morgan");
-
-// ℹ️ Needed when we deal with cookies (we will when dealing with authentication)
-// https://www.npmjs.com/package/cookie-parser
 const cookieParser = require("cookie-parser");
-
-// ℹ️ Serves a custom favicon on each request
-// https://www.npmjs.com/package/serve-favicon
 const favicon = require("serve-favicon");
-
-// ℹ️ global package used to `normalize` paths amongst different operating systems
-// https://www.npmjs.com/package/path
 const path = require("path");
 
-// Middleware configuration
 module.exports = (app) => {
   // In development environment the app logs
   app.use(logger("dev"));
@@ -33,7 +19,6 @@ module.exports = (app) => {
   app.set("view engine", "hbs");
   // Handles access to the public folder
   app.use(express.static(path.join(__dirname, "..", "public")));
-
   // Handles access to the favicon
   app.use(favicon(path.join(__dirname, "..", "public", "images", "favicon.ico")));
 };
diff --git a/db/index.js b/db/index.js
@@ -1,14 +1,14 @@
-// ℹ️ package responsible to make the connection with mongodb
-// https://www.npmjs.com/package/mongoose
-const mongoose = require("mongoose");
+require('dotenv/config');
 
-// ℹ️ Sets the MongoDB URI for our app to have access to it.
-// If no env has been set, we dynamically set it to whatever the folder name was upon the creation of the app
+const mongoose = require("mongoose");
 
-const MONGO_URI = process.env.MONGODB_URI || "mongodb://localhost/lab-express-cinema";
+const MONGO_URI = process.env.MONGODB_URI || "mongodb://0.0.0.0/cinema" || "mongodb://localhost/cinema";
 
 mongoose
-  .connect(MONGO_URI)
+  .connect(MONGO_URI, {
+    useNewUrlParser: true,
+    useUnifiedTopology: true
+  })
   .then((x) => {
     console.log(`Connected to Mongo! Database name: "${x.connections[0].name}"`);
   })

diff --git a/models/Movie.model.js b/models/Movie.model.js
@@ -0,0 +1,38 @@
+const mongoose = require('mongoose')
+
+const movieSchema = new mongoose.Schema({
+    title:  {
+                type: String,
+                required: true,
+                unique: true,
+            },
+    director: String,
+    stars: [String],
+    image: String,
+    description: String,
+    showtimes: [String]
+},{
+    timestamps: true
+})
+
+const Movie = new mongoose.model('Movie', movieSchema)
+
+module.exports = Movie
+
+
+
+
+
+
+
+
+//   {
+//     title: "A Wrinkle in Time",
+//     director: "Ava DuVernay",
+//     stars: ["Storm Reid", "Oprah Winfrey", "Reese Witherspoon"],
+//     image:
+//       "https://images-na.ssl-images-amazon.com/images/M/MV5BMjMxNjQ5MTI3MV5BMl5BanBnXkFtZTgwMjQ2MTAyNDM@._V1_UX182_CR0,0,182,268_AL_.jpg",
+//     description:
+//       "Following the discovery of a new form of space travel as well as Meg's father's disappearance, she, her brother, and her friend must join three magical beings - Mrs. Whatsit, Mrs. Who, and Mrs. Which - to travel across the universe to rescue him from a terrible evil.",
+//     showtimes: ["13:00", "15:30", "18:00", "20:10", "22:40"]
+//   },
diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
@@ -1,8 +1,31 @@
 body {
   padding: 50px;
   font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
+  height: 100vh;
+  margin: 0;
+  padding: 0;
 }
 
 a {
   color: #00B7FF;
 }
+
+#mainPic{
+  background: url('/images/cinema.jpg') no-repeat 0% 20%/100%;
+  height: 100%;
+  width: auto;
+  color: #fff;
+}
+
+h1{
+  font-size: 8em;
+}
+
+.controlsDiv>div{
+  padding-top: 8em;
+}
+
+.card{
+  margin-top: 3em;
+  margin-bottom: 3em;
+}
diff --git a/routes/index.js b/routes/index.js
@@ -1,7 +1,25 @@
 const express = require('express');
 const router = express.Router();
 
+const Movie = require('../models/Movie.model')
+
 /* GET home page */
 router.get('/', (req, res, next) => res.render('index'));
 
+router.get('/movies', (req, res, next) => {
+    Movie
+        .find()
+        .then( movies => res.render('movies', {movies}))
+        .catch(err => console.log(err))
+});
+
+router.get('/movies/:movieId', (req, res, next) => {
+    const {movieId} = req.params 
+    Movie
+        .findById(movieId)
+        // .then( movie => res.send(movie))
+        .then( movie => res.render('movie-details', movie))
+        .catch(err => console.log(err))
+});
+
 module.exports = router;
diff --git a/seeds/movies.seed.js b/seeds/movies.seed.js
@@ -1,3 +1,7 @@
+require('./../db/index')
+
+const Movie = require('../models/Movie.model')
+
 const movies = [
     {
       title: "A Wrinkle in Time",
@@ -79,11 +83,30 @@ const movies = [
         "Ballerina Dominika Egorova is recruited to 'Sparrow School,' a Russian intelligence service where she is forced to use her body as a weapon. Her first mission, targeting a C.I.A. agent, threatens to unravel the security of both nations.",
       showtimes: ["13:00", "15:30", "18:00", "20:10", "22:40"]
     }
-  ];
-
+];
 
-// Add here the script that will be run to actually seed the database (feel free to refer to the previous lesson)
+// Movie
+//     .deleteMany()
+//     .then( () => Movie.create({
+//         title: "A Wrinkle in Time",
+//         director: "Ava DuVernay",
+//         stars: ["Storm Reid", "Oprah Winfrey", "Reese Witherspoon"],
+//         image:
+//           "https://images-na.ssl-images-amazon.com/images/M/MV5BMjMxNjQ5MTI3MV5BMl5BanBnXkFtZTgwMjQ2MTAyNDM@._V1_UX182_CR0,0,182,268_AL_.jpg",
+//         description:
+//           "Following the discovery of a new form of space travel as well as Meg's father's disappearance, she, her brother, and her friend must join three magical beings - Mrs. Whatsit, Mrs. Who, and Mrs. Which - to travel across the universe to rescue him from a terrible evil.",
+//         showtimes: ["13:00", "15:30", "18:00", "20:10", "22:40"]
+//       }))    
+//     .then( movies => console.log(`${movies.length + ' movies' || 1} movies were created`))
+//     .catch( err => console.log(`Inserting the movies in the DB returned an error: ${err}`))
 
-
+// Movie
+//     .create(movies)
+//     .then( movies => console.log(`${movies.length} movies were created`))
+//     .catch( err => console.log(`Inserting the movies in the DB returned an error: ${err}`))
 
-// ... your code here
+Movie.deleteMany()
+	.then(() => Movie.create(movies))
+	.then( movies => console.log(`${movies.length} movies were created`))
+	.catch((error) => console.log(`Inserting the movies in the DB returned an error: ${err}`));
+
diff --git a/views/index.hbs b/views/index.hbs
@@ -1,2 +1,8 @@
-<h1>{{title}}</h1>
-<p>Welcome to {{title}}</p>
+<main id='mainPic' class='container-fluid'>
+	<div class='row justify-content-end align-items-center controlsDiv'>
+		<div class='col-5'>
+			<h1 id='index-title'>Cinema Ironhack</h1>
+			<a href='/movies' class="btn btn-light">Check the movies!</a>
+		</div>
+	</div>
+</main>
diff --git a/views/layout.hbs b/views/layout.hbs
@@ -5,12 +5,16 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <title>{{title}}</title>
+  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" 
+    integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
   <link rel="stylesheet" href="/stylesheets/style.css" />
 </head>
 <body>
 
   {{{body}}}
 
+  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" 
+    integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
   <script src="/js/script.js"></script>
 </body>
 </html>
diff --git a/views/movie-details.hbs b/views/movie-details.hbs
@@ -0,0 +1,36 @@
+<div class="row justify-space-between">
+    <div class="col-md-4">
+        <img src="{{image}}" alt="movie cover image">
+    </div>
+    <div class="col-md-6">
+        <a href="/movies" class="btn btn-primary">Back to the movies list</a>
+        <h4>{{title}}</h4>
+        <h6>Director: {{director}}</h6>
+        <p>Stars:</p>
+        <ul>
+            {{#each stars}}
+                <li>
+                   {{this}} 
+                </li>                
+            {{/each}}
+        </ul>
+        <p>{{description}}</p>
+        <p>
+        {{#each showtimes}}
+            <span>{{this}} |</span>            
+        {{/each}}
+        </p>
+    </div>
+</div>
+
+
+{{!-- 
+//         title: "A Wrinkle in Time",
+//         director: "Ava DuVernay",
+//         stars: ["Storm Reid", "Oprah Winfrey", "Reese Witherspoon"],
+//         image:
+//           "https://images-na.ssl-images-amazon.com/images/M/MV5BMjMxNjQ5MTI3MV5BMl5BanBnXkFtZTgwMjQ2MTAyNDM@._V1_UX182_CR0,0,182,268_AL_.jpg",
+//         description:
+//           "Following the discovery of a new form of space travel as well as Meg's father's disappearance, she, her brother, and her friend must join three magical beings - Mrs. Whatsit, Mrs. Who, and Mrs. Which - to travel across the universe to rescue him from a terrible evil.",
+//         showtimes: ["13:00", "15:30", "18:00", "20:10", "22:40"]
+ --}}
diff --git a/views/movies.hbs b/views/movies.hbs
@@ -0,0 +1,30 @@
+<h2>Welcome to our cinema!</h2>
+<h4>Pick a movie and click on it to see the available showtimes.</h4>
+
+<div class="row">
+{{#each movies}}
+    <div class="col-sm-6 col-md-4 col-xl-3">
+        <div class="card">
+            <img src="{{this.image}}" class="card-img-top" alt="...">
+            <div class="card-body">
+                <h5 class="card-title">{{title}}</h5>
+                {{!-- <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p> --}}
+                <a href="/movies/{{id}}" class="btn btn-primary">See more</a>
+            </div>
+        </div>
+    </div>
+{{/each}}
+</div>
+<a href="/" class="btn btn-dark">Back to start</a>
+
+
+{{!-- 
+//         title: "A Wrinkle in Time",
+//         director: "Ava DuVernay",
+//         stars: ["Storm Reid", "Oprah Winfrey", "Reese Witherspoon"],
+//         image:
+//           "https://images-na.ssl-images-amazon.com/images/M/MV5BMjMxNjQ5MTI3MV5BMl5BanBnXkFtZTgwMjQ2MTAyNDM@._V1_UX182_CR0,0,182,268_AL_.jpg",
+//         description:
+//           "Following the discovery of a new form of space travel as well as Meg's father's disappearance, she, her brother, and her friend must join three magical beings - Mrs. Whatsit, Mrs. Who, and Mrs. Which - to travel across the universe to rescue him from a terrible evil.",
+//         showtimes: ["13:00", "15:30", "18:00", "20:10", "22:40"]
+ --}}