강연욱 / myYoutube

Go to a project
Toggle navigation Toggle navigation pinning
Flare-k
c50f69df 1 parent cc2f4806

Add mixin and Modify Join&Login

Inline Side-by-side
Showing 16 changed files with 193 additions and 38 deletions
1 -export const join = (req, res) => res.render("join", { pageTitle: "Join" }); 1 +import routes from "../routes";
2 -export const login = (req, res) => res.render("login", { pageTitle: "Login" }); 2 +
3 -export const logout = (req, res) => res.render("logout", { pageTitle: "Logout" }); 3 +// 회원가입 -> 완료 -> 홈화면으로 Redirect
4 +export const getJoin = (req, res) => {
5 + res.render("join", { pageTitle: "Join" });
6 +};
7 +export const postJoin = (req, res) => {
8 + const {
9 + body: { name, email, password, password2 },
10 + } = req;
11 + if (password !== password2) {
12 + res.status(400);
13 + res.render("join", { pageTitle: "Join" });
14 + } else {
15 + // To Do: Register User
16 + // To Do: Log user in
17 + res.redirect(routes.home);
18 + }
19 +};
20 +
21 +export const getLogin = (req, res) =>
22 + res.render("login", { pageTitle: "Login" });
23 +export const postLogin = (req, res) => {
24 + res.redirect(routes.home);
25 +};
26 +export const logout = (req, res) =>
27 + res.render("logout", { pageTitle: "Logout" });
4 export const users = (req, res) => res.render("users", { pageTitle: "Users" }); 28 export const users = (req, res) => res.render("users", { pageTitle: "Users" });
5 -export const userDetail = (req, res) => res.render("userDetail", { pageTitle: "User Detail" });
6 -export const editProfile = (req, res) => res.render("editProfile", { pageTitle: "Edit Profile" });
7 -export const changePassword = (req, res) => res.render("changePassword", { pageTitle: "Change Password" });
...\ No newline at end of file ...\ No newline at end of file
29 +export const userDetail = (req, res) =>
30 + res.render("userDetail", { pageTitle: "User Detail" });
31 +export const editProfile = (req, res) =>
32 + res.render("editProfile", { pageTitle: "Edit Profile" });
33 +export const changePassword = (req, res) =>
34 + res.render("changePassword", { pageTitle: "Change Password" });
...\ No newline at end of file ...\ No newline at end of file
......
1 -export const home = (req, res) => res.render("home", { pageTitle: "Home" }); 1 +import { videos } from "../db";
2 +export const home = (req, res) => {
3 + res.render("home", { pageTitle: "Home", videos });
4 +};
2 5
3 export const search = (req, res) => { 6 export const search = (req, res) => {
4 const { 7 const {
5 - query: { term: searchingBy } 8 + query: { term: searchingBy },
6 } = req; // == const searchingBy = req.query.term; 9 } = req; // == const searchingBy = req.query.term;
7 - res.render("search", { pageTitle: "Search", searchingBy }); 10 + res.render("search", { pageTitle: "Search", searchingBy, videos });
8 -} 11 +};
9 12
10 -
11 -export const videos = (req, res) => res.send("videos", { pageTitle: "Videos" });
12 export const upload = (req, res) => res.render("upload", { pageTitle: "Upload" }); 13 export const upload = (req, res) => res.render("upload", { pageTitle: "Upload" });
13 export const videoDetail = (req, res) => res.render("videoDetail", { pageTitle: "Video Detail" }); 14 export const videoDetail = (req, res) => res.render("videoDetail", { pageTitle: "Video Detail" });
14 export const editVideo = (req, res) => res.render("editVideo", { pageTitle: "Edit Video" }); 15 export const editVideo = (req, res) => res.render("editVideo", { pageTitle: "Edit Video" });
......
1 +export const videos = [{
2 + id: 324393,
3 + title: "Video awesome",
4 + description: "This is something I love",
5 + views: 24,
6 + videoFile: "https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4",
7 + creator: {
8 + id: 121212,
9 + name: "Nicolas",
10 + email: "nico@las.com",
11 + },
12 + },
13 + {
14 + id: 1212121,
15 + title: "Video super",
16 + description: "This is something I love",
17 + views: 24,
18 + videoFile: "https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4",
19 + creator: {
20 + id: 121212,
21 + name: "Nicolas",
22 + email: "nico@las.com",
23 + },
24 + },
25 + {
26 + id: 55555,
27 + title: "Video nice",
28 + description: "This is something I love",
29 + views: 24,
30 + videoFile: "https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4",
31 + creator: {
32 + id: 121212,
33 + name: "Nicolas",
34 + email: "nico@las.com",
35 + },
36 + },
37 + {
38 + id: 11111,
39 + title: "Video perfect",
40 + description: "This is something I love",
41 + views: 24,
42 + videoFile: "https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4",
43 + creator: {
44 + id: 121212,
45 + name: "Nicolas",
46 + email: "nico@las.com",
47 + },
48 + },
49 +];
...\ No newline at end of file ...\ No newline at end of file
...@@ -3,5 +3,9 @@ import routes from "./routes"; ...@@ -3,5 +3,9 @@ import routes from "./routes";
3 export const localsMiddleware = (req, res, next) => { 3 export const localsMiddleware = (req, res, next) => {
4 res.locals.siteName = 'my Youtube'; 4 res.locals.siteName = 'my Youtube';
5 res.locals.routes = routes; 5 res.locals.routes = routes;
6 + res.locals.user = {
7 + isAuthenticated: true,
8 + id: 1,
9 + };
6 next(); 10 next();
7 }; 11 };
...\ No newline at end of file ...\ No newline at end of file
......
1 import express from "express"; 1 import express from "express";
2 import routes from "../routes"; 2 import routes from "../routes";
3 import { home, search } from "../controllers/videoController"; 3 import { home, search } from "../controllers/videoController";
4 -import { join, login, logout } from "../controllers/userController"; 4 +import {
5 + logout,
6 + getJoin,
7 + postJoin,
8 + getLogin,
9 + postLogin,
10 +} from "../controllers/userController";
5 11
6 const globalRouter = express.Router(); 12 const globalRouter = express.Router();
7 13
8 globalRouter.get(routes.home, home); 14 globalRouter.get(routes.home, home);
9 -globalRouter.get(routes.join, join); 15 +
10 -globalRouter.get(routes.login, login); 16 +globalRouter.get(routes.join, getJoin);
17 +globalRouter.post(routes.join, postJoin);
18 +
19 +globalRouter.get(routes.login, getLogin);
20 +globalRouter.post(routes.login, postLogin);
21 +
11 globalRouter.get(routes.logout, logout); 22 globalRouter.get(routes.logout, logout);
12 globalRouter.get(routes.search, search); 23 globalRouter.get(routes.search, search);
13 export default globalRouter; 24 export default globalRouter;
...\ No newline at end of file ...\ No newline at end of file
......
1 import express from "express"; 1 import express from "express";
2 import routes from "../routes"; 2 import routes from "../routes";
3 -import { users, userDetail, editProfile, changePassword } from "../controllers/userController"; 3 +import {
4 - 4 + userDetail,
5 + editProfile,
6 + changePassword,
7 +} from "../controllers/userController";
5 const userRouter = express.Router(); 8 const userRouter = express.Router();
6 9
7 -userRouter.get(routes.users, users);
8 userRouter.get(routes.editProfile, editProfile); 10 userRouter.get(routes.editProfile, editProfile);
9 -userRouter.get(routes.userDetail, userDetail);
10 userRouter.get(routes.changePassword, changePassword); 11 userRouter.get(routes.changePassword, changePassword);
12 +userRouter.get(routes.userDetail(), userDetail);
11 13
12 export default userRouter; 14 export default userRouter;
13 15
14 16
15 17
16 -
17 /* 18 /*
18 userRouter.get("/", (req, res) => res.send("user index")); 19 userRouter.get("/", (req, res) => res.send("user index"));
19 userRouter.get("/edit", (req, res) => res.send("user edit")); 20 userRouter.get("/edit", (req, res) => res.send("user edit"));
......
1 import express from "express"; 1 import express from "express";
2 import routes from "../routes"; 2 import routes from "../routes";
3 -import { videos, upload, videoDetail, editVideo, deleteVideo } from "../controllers/videoController"; 3 +import {
4 - 4 + upload,
5 + videoDetail,
6 + editVideo,
7 + deleteVideo,
8 +} from "../controllers/videoController";
5 //export const videoRouter = express.Router(); 이렇게하면 이 변수만 export하게 된다. 9 //export const videoRouter = express.Router(); 이렇게하면 이 변수만 export하게 된다.
6 const videoRouter = express.Router(); 10 const videoRouter = express.Router();
7 11
8 -videoRouter.get(routes.videos, videos);
9 videoRouter.get(routes.upload, upload); 12 videoRouter.get(routes.upload, upload);
10 -videoRouter.get(routes.videoDetail, videoDetail); 13 +
11 videoRouter.get(routes.editVideo, editVideo); 14 videoRouter.get(routes.editVideo, editVideo);
15 +
16 +videoRouter.get(routes.videoDetail(), videoDetail);
17 +
12 videoRouter.get(routes.deleteVideo, deleteVideo); 18 videoRouter.get(routes.deleteVideo, deleteVideo);
13 19
14 export default videoRouter; 20 export default videoRouter;
...\ No newline at end of file ...\ No newline at end of file
......
1 -//Global 1 +// Global
2 const HOME = "/"; 2 const HOME = "/";
3 const JOIN = "/join"; 3 const JOIN = "/join";
4 const LOGIN = "/login"; 4 const LOGIN = "/login";
...@@ -25,14 +25,26 @@ const routes = { ...@@ -25,14 +25,26 @@ const routes = {
25 logout: LOGOUT, 25 logout: LOGOUT,
26 search: SEARCH, 26 search: SEARCH,
27 users: USERS, 27 users: USERS,
28 - userDetail: USER_DETAIL, 28 + userDetail: (id) => {
29 + if (id) {
30 + return `/users/${id}`;
31 + } else {
32 + return USER_DETAIL;
33 + }
34 + },
29 editProfile: EDIT_PROFILE, 35 editProfile: EDIT_PROFILE,
30 changePassword: CHANGE_PASSWORD, 36 changePassword: CHANGE_PASSWORD,
31 videos: VIDEOS, 37 videos: VIDEOS,
32 upload: UPLOAD, 38 upload: UPLOAD,
33 - videoDetail: VIDEO_DETAIL, 39 + videoDetail: (id) => {
40 + if (id) {
41 + return `/videos/${id}`;
42 + } else {
43 + return VIDEO_DETAIL;
44 + }
45 + },
34 editVideo: EDIT_VIDEO, 46 editVideo: EDIT_VIDEO,
35 - deleteVideo: DELETE_VIDEO 47 + deleteVideo: DELETE_VIDEO,
36 }; 48 };
37 49
38 export default routes; 50 export default routes;
...\ No newline at end of file ...\ No newline at end of file
......
1 extends layouts/main 1 extends layouts/main
2 2
3 block content 3 block content
4 - p Hello This is change Password
...\ No newline at end of file ...\ No newline at end of file
4 + .form-container
5 + form(action=`/users${routes.changePassword}`, method="post")
6 + input(type="password", name="oldPasswod", placeholder="Current Password")
7 + input(type="password", name="newPassword", placeholder="New Password")
8 + input(type="password", name="newPassword1", placeholder="Verify New Password")
9 + input(type="submit", value="Change Password")
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -8,4 +8,4 @@ block content ...@@ -8,4 +8,4 @@ block content
8 input(type="text", placeholder="Name", name="name") 8 input(type="text", placeholder="Name", name="name")
9 input(type="email", placeholder="Email", name="email") 9 input(type="email", placeholder="Email", name="email")
10 input(type="submit", value="Update Profile") 10 input(type="submit", value="Update Profile")
11 - a.form-container__link(href=routes.changePassword) Change Password
...\ No newline at end of file ...\ No newline at end of file
11 + a.form-container__link(href=`/users${routes.changePassword}`) Change Password
...\ No newline at end of file ...\ No newline at end of file
......
1 extends layouts/main 1 extends layouts/main
2 2
3 block content 3 block content
4 - p Hello This is edit Video
...\ No newline at end of file ...\ No newline at end of file
4 +.form-container
5 + form(action=`/videos${routes.editVideo}`, method="post")
6 + input(type="text", placeholder="Title", name="title")
7 + textarea(name="description", placeholder="Description")
8 + input(type="submit", value="Update Video")
9 + a.form-container__link.form-container__link--delete(href=`/videos${routes.deleteVideo}`) Delete Video
...\ No newline at end of file ...\ No newline at end of file
......
1 extends layouts/main 1 extends layouts/main
2 +include mixins/videoBlock
2 3
3 block content 4 block content
4 .videos 5 .videos
5 - h1 Video
...\ No newline at end of file ...\ No newline at end of file
6 + each item in videos
7 + +videoBlock({
8 + title : item.title,
9 + views: item.views,
10 + videoFile:item.videoFile
11 + })
...\ No newline at end of file ...\ No newline at end of file
......
1 +mixin videoBlock(video = {})
2 + .videoBlock
3 + video.videoBlock__thumbnail(src=video.videoFile, controls=true)
4 + h4.videoBlock__title=video.title
5 + h6.videoBlock__views=video.views
6 +
...\ No newline at end of file ...\ No newline at end of file
...@@ -7,7 +7,15 @@ header.header ...@@ -7,7 +7,15 @@ header.header
7 input(type="text", placeholder="Search by term...", name="term") 7 input(type="text", placeholder="Search by term...", name="term")
8 .header__column 8 .header__column
9 ul 9 ul
10 - li 10 + if !user.isAuthenticated
11 - a(href=routes.join) Join 11 + li
12 - li 12 + a(href=routes.join) Join
13 - a(href=routes.login) Log In 13 + li
14 + a(href=routes.login) Log In
15 + else
16 + li
17 + a(href=routes.upload) Upload
18 + li
19 + a(href=routes.userDetail(user.id)) Profile
20 + li
21 + a(href=routes.logout) Log out
......
1 extends layouts/main 1 extends layouts/main
2 +include mixins/videoBlock
2 3
3 block content 4 block content
4 .search__header 5 .search__header
5 - h3 Searching for: #{searchingBy}
...\ No newline at end of file ...\ No newline at end of file
6 + h3 Searching for: #{searchingBy}
7 + .search__videos
8 + each item in videos
9 + +videoBlock({
10 + title : item.title,
11 + views: item.views,
12 + videoFile:item.videoFile
13 + })
...\ No newline at end of file ...\ No newline at end of file
......
1 extends layouts/main 1 extends layouts/main
2 2
3 block content 3 block content
4 - p Hello This is Upload
...\ No newline at end of file ...\ No newline at end of file
4 + .form-container
5 + form(action=`/videos${routes.upload}`, method="post")
6 + label(for="file") Video File
7 + input(type="file", id="file", name="file")
8 + input(type="text", placeholder="Title", name="title")
9 + textarea(name="description", placeholder="Description")
10 + input(type="submit", value="Upload Video")
...\ No newline at end of file ...\ No newline at end of file
......