From c9eebc907797ae7a3260975343f0697ed2ff3e73 Mon Sep 17 00:00:00 2001 From: axelv70 Date: Sat, 18 May 2024 23:02:27 +0700 Subject: [PATCH] tim1_frontendweb --- components/ComingSoonList.tsx | 70 ++++++++++++++++ components/MovieCard.tsx | 19 +++++ components/MovieList.tsx | 23 +++++ components/MovieSelection.tsx | 42 ++++++++++ components/NavBar.tsx | 28 +++++++ components/NowPlayingList.tsx | 154 ++++++++++++++++++++++++++++++++++ components/SocSignBar.tsx | 16 ++++ components/styling.module.css | 17 ++++ data/movies.ts | 17 ++++ global.d.ts | 5 ++ package-lock.json | 85 ++++++++++++++++++- package.json | 2 + pages/IndexPage.module.css | 24 ++++++ pages/cinemas.tsx | 80 ++++++++++++++++++ pages/index.tsx | 13 ++- pages/login.tsx | 25 ++++++ pages/membershipOut.tsx | 23 +++++ pages/movies/[id].tsx | 38 +++++++++ pages/moviespage.tsx | 22 +++++ pages/promotion/[id].tsx | 55 ++++++++++++ pages/promotions.tsx | 60 +++++++++++++ pages/register.tsx | 134 +++++++++++++++++++++++++++++ pages/special.tsx | 71 ++++++++++++++++ pages/special/[id].tsx | 38 +++++++++ public/CGVLogo.png | Bin 0 -> 42393 bytes public/auditoriums1.jpg | Bin 0 -> 225351 bytes public/auditoriums2.jpg | Bin 0 -> 254024 bytes public/auditoriums3.jpg | Bin 0 -> 162499 bytes public/auditoriums4.jpg | Bin 0 -> 179207 bytes public/auditoriums5.jpg | Bin 0 -> 194537 bytes public/auditoriums6.jpg | Bin 0 -> 188002 bytes public/auditoriums7.jpg | Bin 0 -> 224893 bytes public/auditoriums8.jpg | Bin 0 -> 176280 bytes public/auditoriums9.png | Bin 0 -> 443545 bytes public/descAud1.jpg | Bin 0 -> 1417975 bytes public/descAud2.jpg | Bin 0 -> 1414898 bytes public/descAud3.jpg | Bin 0 -> 978533 bytes public/descAud4.jpg | Bin 0 -> 901078 bytes public/descAud5.jpg | Bin 0 -> 659986 bytes public/descAud6.jpg | Bin 0 -> 363017 bytes public/descAud7.jpg | Bin 0 -> 1359363 bytes public/descAud8.jpg | Bin 0 -> 796171 bytes public/descAud9.jpg | Bin 0 -> 1119692 bytes public/descPromotion1.png | Bin 0 -> 1038544 bytes public/descPromotion2.jpg | Bin 0 -> 1044895 bytes public/descPromotion3.jpg | Bin 0 -> 1442100 bytes public/descPromotion4.jpg | Bin 0 -> 454947 bytes public/descPromotion5.jpg | Bin 0 -> 1151442 bytes public/descSpo1.jpg | Bin 0 -> 1083211 bytes public/descSpo2.jpg | Bin 0 -> 1447564 bytes public/descSpo3.jpg | Bin 0 -> 1090774 bytes public/membershipImage.png | Bin 0 -> 1314606 bytes public/nowMovie1.jpg | Bin 0 -> 35402 bytes public/nowMovie10.jpg | Bin 0 -> 26135 bytes public/nowMovie11.jpg | Bin 0 -> 22635 bytes public/nowMovie12.jpg | Bin 0 -> 30207 bytes public/nowMovie13.jpg | Bin 0 -> 22260 bytes public/nowMovie14.jpg | Bin 0 -> 21730 bytes public/nowMovie15.jpg | Bin 0 -> 31795 bytes public/nowMovie16.jpg | Bin 0 -> 32359 bytes public/nowMovie17.jpg | Bin 0 -> 28627 bytes public/nowMovie18.jpg | Bin 0 -> 32597 bytes public/nowMovie19.jpg | Bin 0 -> 24010 bytes public/nowMovie2.jpg | Bin 0 -> 33357 bytes public/nowMovie20.jpg | Bin 0 -> 33905 bytes public/nowMovie3.jpg | Bin 0 -> 26798 bytes public/nowMovie4.jpg | Bin 0 -> 31727 bytes public/nowMovie5.jpg | Bin 0 -> 21154 bytes public/nowMovie6.jpg | Bin 0 -> 31888 bytes public/nowMovie7.jpg | Bin 0 -> 33625 bytes public/nowMovie8.jpg | Bin 0 -> 28316 bytes public/nowMovie9.jpg | Bin 0 -> 35310 bytes public/promotion1.jpg | Bin 0 -> 59504 bytes public/promotion2.jpg | Bin 0 -> 41193 bytes public/promotion3.jpg | Bin 0 -> 47754 bytes public/promotion4.jpg | Bin 0 -> 43432 bytes public/promotion5.jpg | Bin 0 -> 61808 bytes public/soonMovie1.jpg | Bin 0 -> 28450 bytes public/soonMovie2.jpg | Bin 0 -> 26798 bytes public/soonMovie3.jpg | Bin 0 -> 23148 bytes public/soonMovie4.jpg | Bin 0 -> 21199 bytes public/soonMovie5.jpg | Bin 0 -> 33542 bytes public/soonMovie6.jpg | Bin 0 -> 34239 bytes public/soonMovie7.jpg | Bin 0 -> 47232 bytes public/soonMovie8.jpg | Bin 0 -> 24766 bytes public/sports1.jpg | Bin 0 -> 172788 bytes public/sports2.jpg | Bin 0 -> 204458 bytes public/sports3.jpg | Bin 0 -> 223148 bytes styles/globals.css | 43 ++++++++++ tsconfig.json | 4 +- types/Movie.ts | 6 ++ 91 files changed, 1106 insertions(+), 8 deletions(-) create mode 100644 components/ComingSoonList.tsx create mode 100644 components/MovieCard.tsx create mode 100644 components/MovieList.tsx create mode 100644 components/MovieSelection.tsx create mode 100644 components/NavBar.tsx create mode 100644 components/NowPlayingList.tsx create mode 100644 components/SocSignBar.tsx create mode 100644 components/styling.module.css create mode 100644 data/movies.ts create mode 100644 global.d.ts create mode 100644 pages/IndexPage.module.css create mode 100644 pages/cinemas.tsx create mode 100644 pages/login.tsx create mode 100644 pages/membershipOut.tsx create mode 100644 pages/movies/[id].tsx create mode 100644 pages/moviespage.tsx create mode 100644 pages/promotion/[id].tsx create mode 100644 pages/promotions.tsx create mode 100644 pages/register.tsx create mode 100644 pages/special.tsx create mode 100644 pages/special/[id].tsx create mode 100644 public/CGVLogo.png create mode 100644 public/auditoriums1.jpg create mode 100644 public/auditoriums2.jpg create mode 100644 public/auditoriums3.jpg create mode 100644 public/auditoriums4.jpg create mode 100644 public/auditoriums5.jpg create mode 100644 public/auditoriums6.jpg create mode 100644 public/auditoriums7.jpg create mode 100644 public/auditoriums8.jpg create mode 100644 public/auditoriums9.png create mode 100644 public/descAud1.jpg create mode 100644 public/descAud2.jpg create mode 100644 public/descAud3.jpg create mode 100644 public/descAud4.jpg create mode 100644 public/descAud5.jpg create mode 100644 public/descAud6.jpg create mode 100644 public/descAud7.jpg create mode 100644 public/descAud8.jpg create mode 100644 public/descAud9.jpg create mode 100644 public/descPromotion1.png create mode 100644 public/descPromotion2.jpg create mode 100644 public/descPromotion3.jpg create mode 100644 public/descPromotion4.jpg create mode 100644 public/descPromotion5.jpg create mode 100644 public/descSpo1.jpg create mode 100644 public/descSpo2.jpg create mode 100644 public/descSpo3.jpg create mode 100644 public/membershipImage.png create mode 100644 public/nowMovie1.jpg create mode 100644 public/nowMovie10.jpg create mode 100644 public/nowMovie11.jpg create mode 100644 public/nowMovie12.jpg create mode 100644 public/nowMovie13.jpg create mode 100644 public/nowMovie14.jpg create mode 100644 public/nowMovie15.jpg create mode 100644 public/nowMovie16.jpg create mode 100644 public/nowMovie17.jpg create mode 100644 public/nowMovie18.jpg create mode 100644 public/nowMovie19.jpg create mode 100644 public/nowMovie2.jpg create mode 100644 public/nowMovie20.jpg create mode 100644 public/nowMovie3.jpg create mode 100644 public/nowMovie4.jpg create mode 100644 public/nowMovie5.jpg create mode 100644 public/nowMovie6.jpg create mode 100644 public/nowMovie7.jpg create mode 100644 public/nowMovie8.jpg create mode 100644 public/nowMovie9.jpg create mode 100644 public/promotion1.jpg create mode 100644 public/promotion2.jpg create mode 100644 public/promotion3.jpg create mode 100644 public/promotion4.jpg create mode 100644 public/promotion5.jpg create mode 100644 public/soonMovie1.jpg create mode 100644 public/soonMovie2.jpg create mode 100644 public/soonMovie3.jpg create mode 100644 public/soonMovie4.jpg create mode 100644 public/soonMovie5.jpg create mode 100644 public/soonMovie6.jpg create mode 100644 public/soonMovie7.jpg create mode 100644 public/soonMovie8.jpg create mode 100644 public/sports1.jpg create mode 100644 public/sports2.jpg create mode 100644 public/sports3.jpg create mode 100644 types/Movie.ts diff --git a/components/ComingSoonList.tsx b/components/ComingSoonList.tsx new file mode 100644 index 0000000..5a68501 --- /dev/null +++ b/components/ComingSoonList.tsx @@ -0,0 +1,70 @@ +import React from 'react'; +import MovieList from './MovieList'; +import { Movie } from '../types/Movie'; +import styles from './styling.module.css'; + +const comingSoonMovies1: Movie[] = [ + { + id: '1', + title: 'Movie 1', + description: 'Movie 1 description', + posterUrl: '/soonMovie1.jpg' + }, + { + id: '2', + title: 'Movie 2', + description: 'Movie 2 description', + posterUrl: '/soonMovie2.jpg' + }, + { + id: '3', + title: 'Movie 3', + description: 'Movie 3 description', + posterUrl: '/soonMovie3.jpg' + }, + { + id: '4', + title: 'Movie 4', + description: 'Movie 4 description', + posterUrl: '/soonMovie4.jpg' + }, +]; + +const comingSoonMovies2: Movie[] = [ + { + id: '1', + title: 'Movie 1', + description: 'Movie 1 description', + posterUrl: '/soonMovie5.jpg' + }, + { + id: '2', + title: 'Movie 2', + description: 'Movie 2 description', + posterUrl: '/soonMovie6.jpg' + }, + { + id: '3', + title: 'Movie 3', + description: 'Movie 3 description', + posterUrl: '/soonMovie7.jpg' + }, + { + id: '4', + title: 'Movie 4', + description: 'Movie 4 description', + posterUrl: '/soonMovie8.jpg' + }, +]; + +const ComingSoonList: React.FC = () => { + return ( +
+

Coming Soon

+ + +
+ ); +}; + +export default ComingSoonList; diff --git a/components/MovieCard.tsx b/components/MovieCard.tsx new file mode 100644 index 0000000..6fc3789 --- /dev/null +++ b/components/MovieCard.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import Link from 'next/link'; + +interface MovieCardProps { + id: string; + posterUrl: string; +} + +const MovieCard: React.FC = ({ id, posterUrl }) => { + return ( + +
+ +
+ + ); +}; + +export default MovieCard; diff --git a/components/MovieList.tsx b/components/MovieList.tsx new file mode 100644 index 0000000..c34487a --- /dev/null +++ b/components/MovieList.tsx @@ -0,0 +1,23 @@ +import React from 'react'; +import MovieCard from './MovieCard'; +import { Movie } from '../types/Movie'; + +interface MovieListProps { + movies: Movie[]; +} + +const MovieList: React.FC = ({ movies }) => { + return ( +
+ {movies.map(movie => ( + + ))} +
+ ); +}; + +export default MovieList; diff --git a/components/MovieSelection.tsx b/components/MovieSelection.tsx new file mode 100644 index 0000000..b464601 --- /dev/null +++ b/components/MovieSelection.tsx @@ -0,0 +1,42 @@ +import React from 'react'; +import MovieList from './MovieList'; +import { Movie } from '../types/Movie'; +import styles from './styling.module.css'; + +const nowPlayingMovies: Movie[] = [ + { + id: '1', + title: 'Movie 1', + description: 'Movie 1 description', + posterUrl: '/nowMovie1.jpg' + }, + { + id: '2', + title: 'Movie 2', + description: 'Movie 2 description', + posterUrl: '/nowMovie2.jpg' + }, + { + id: '3', + title: 'Movie 3', + description: 'Movie 3 description', + posterUrl: '/nowMovie3.jpg' + }, + { + id: '4', + title: 'Movie 4', + description: 'Movie 4 description', + posterUrl: '/nowMovie4.jpg' + }, +]; + +const MovieSelectionList: React.FC = () => { + return ( +
+

Movie Selection

+ +
+ ); +}; + +export default MovieSelectionList; diff --git a/components/NavBar.tsx b/components/NavBar.tsx new file mode 100644 index 0000000..691f5cb --- /dev/null +++ b/components/NavBar.tsx @@ -0,0 +1,28 @@ +import React from 'react'; +import Link from 'next/link'; +import Image from 'next/image'; + +const NavBar: React.FC = () => { + return ( + + ); +}; + +export default NavBar; diff --git a/components/NowPlayingList.tsx b/components/NowPlayingList.tsx new file mode 100644 index 0000000..a1d8288 --- /dev/null +++ b/components/NowPlayingList.tsx @@ -0,0 +1,154 @@ +import React from 'react'; +import MovieList from './MovieList'; +import { Movie } from '../types/Movie'; +import styles from './styling.module.css'; + +const nowPlayingMovies1: Movie[] = [ + { + id: '1', + title: 'Movie 1', + description: 'Movie 1 description', + posterUrl: '/nowMovie1.jpg' + }, + { + id: '2', + title: 'Movie 2', + description: 'Movie 2 description', + posterUrl: '/nowMovie2.jpg' + }, + { + id: '3', + title: 'Movie 3', + description: 'Movie 3 description', + posterUrl: '/nowMovie3.jpg' + }, + { + id: '4', + title: 'Movie 4', + description: 'Movie 4 description', + posterUrl: '/nowMovie4.jpg' + }, +]; + +const nowPlayingMovies2: Movie[] = [ + { + id: '5', + title: 'Movie 5', + description: 'Movie 5 description', + posterUrl: '/nowMovie5.jpg' + }, + { + id: '6', + title: 'Movie 6', + description: 'Movie 6 description', + posterUrl: '/nowMovie6.jpg' + }, + { + id: '7', + title: 'Movie 7', + description: 'Movie 7 description', + posterUrl: '/nowMovie7.jpg' + }, + { + id: '8', + title: 'Movie 8', + description: 'Movie 8 description', + posterUrl: '/nowMovie8.jpg' + }, +]; + +const nowPlayingMovies3: Movie[] = [ + { + id: '9', + title: 'Movie 9', + description: 'Movie 9 description', + posterUrl: '/nowMovie9.jpg' + }, + { + id: '10', + title: 'Movie 10', + description: 'Movie 10 description', + posterUrl: '/nowMovie10.jpg' + }, + { + id: '11', + title: 'Movie 11', + description: 'Movie 11 description', + posterUrl: '/nowMovie11.jpg' + }, + { + id: '12', + title: 'Movie 12', + description: 'Movie 12 description', + posterUrl: '/nowMovie12.jpg' + }, +]; + +const nowPlayingMovies4: Movie[] = [ + { + id: '13', + title: 'Movie 13', + description: 'Movie 13 description', + posterUrl: '/nowMovie13.jpg' + }, + { + id: '14', + title: 'Movie 14', + description: 'Movie 14 description', + posterUrl: '/nowMovie14.jpg' + }, + { + id: '15', + title: 'Movie 15', + description: 'Movie 15 description', + posterUrl: '/nowMovie15.jpg' + }, + { + id: '16', + title: 'Movie 16', + description: 'Movie 16 description', + posterUrl: '/nowMovie16.jpg' + }, +]; + +const nowPlayingMovies5: Movie[] = [ + { + id: '17', + title: 'Movie 17', + description: 'Movie 17 description', + posterUrl: '/nowMovie17.jpg' + }, + { + id: '18', + title: 'Movie 18', + description: 'Movie 18 description', + posterUrl: '/nowMovie18.jpg' + }, + { + id: '19', + title: 'Movie 19', + description: 'Movie 19 description', + posterUrl: '/nowMovie19.jpg' + }, + { + id: '20', + title: 'Movie 20', + description: 'Movie 20 description', + posterUrl: '/nowMovie20.jpg' + }, +]; + +const NowPlayingList: React.FC = () => { + return ( +
+

Now Playing

+ + + + + +
+ ); +}; + +export default NowPlayingList; diff --git a/components/SocSignBar.tsx b/components/SocSignBar.tsx new file mode 100644 index 0000000..5bfe7f2 --- /dev/null +++ b/components/SocSignBar.tsx @@ -0,0 +1,16 @@ +import React from 'react'; +import Link from 'next/link'; + +const SocSignBar: React.FC = () => { + return ( + + ); +}; + +export default SocSignBar; diff --git a/components/styling.module.css b/components/styling.module.css new file mode 100644 index 0000000..aa0d1ee --- /dev/null +++ b/components/styling.module.css @@ -0,0 +1,17 @@ +.centerSection { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + min-height: 10vh; + background-color: #FDF6DC; + padding: 20px; + text-align: center; +} + +.centerText { + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; +} \ No newline at end of file diff --git a/data/movies.ts b/data/movies.ts new file mode 100644 index 0000000..d87fce8 --- /dev/null +++ b/data/movies.ts @@ -0,0 +1,17 @@ +const movies = [ + { + id: '1', + title: 'Movie 1', + description: 'Movie 1 desc', + posterUrl: '/images/inception.jpg' + }, + { + id: '2', + title: 'Movie 2', + description: 'Movie 2 desc', + posterUrl: '/images/dark-knight.jpg' + }, + // Add more movies as needed +]; + +export default movies; diff --git a/global.d.ts b/global.d.ts new file mode 100644 index 0000000..d6788b1 --- /dev/null +++ b/global.d.ts @@ -0,0 +1,5 @@ +declare module '*.module.css' { + const classes: { [key: string]: string }; + export default classes; + } + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 9344003..4ab00ef 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,6 +15,7 @@ "@hookform/error-message": "2.0.1", "@hookform/resolvers": "3.0.1", "antd": "5.4.0", + "axios": "^1.6.8", "dayjs": "1.11.7", "http-proxy": "1.18.1", "jotai": "2.0.3", @@ -29,6 +30,7 @@ "zod": "3.21.4" }, "devDependencies": { + "@types/css-modules": "^1.0.5", "@types/http-proxy": "^1.17.10", "@types/node": "^18.15.11", "@types/nprogress": "^0.2.0", @@ -671,6 +673,12 @@ "tslib": "^2.4.0" } }, + "node_modules/@types/css-modules": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/@types/css-modules/-/css-modules-1.0.5.tgz", + "integrity": "sha512-oeKafs/df9lwOvtfiXVliZsocFVOexK9PZtLQWuPeuVCFR7jwiqlg60lu80JTe5NFNtH3tnV6Fs/ySR8BUPHAw==", + "dev": true + }, "node_modules/@types/http-proxy": { "version": "1.17.10", "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.10.tgz", @@ -1191,6 +1199,11 @@ "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.2.5.tgz", "integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==" }, + "node_modules/asynckit": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz", + "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==" + }, "node_modules/autoprefixer": { "version": "10.4.14", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.14.tgz", @@ -1245,6 +1258,16 @@ "node": ">=4" } }, + "node_modules/axios": { + "version": "1.6.8", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.8.tgz", + "integrity": "sha512-v/ZHtJDU39mDpyBoFVkETcd/uNdxrWRrg3bKpOKzXFA6Bvqopts6ALSMU3y6ijYxbw2B+wPrIv46egTzJXCLGQ==", + "dependencies": { + "follow-redirects": "^1.15.6", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + } + }, "node_modules/axobject-query": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-3.1.1.tgz", @@ -1489,6 +1512,17 @@ "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", "dev": true }, + "node_modules/combined-stream": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", + "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==", + "dependencies": { + "delayed-stream": "~1.0.0" + }, + "engines": { + "node": ">= 0.8" + } + }, "node_modules/commander": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz", @@ -1701,6 +1735,14 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/delayed-stream": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", + "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==", + "engines": { + "node": ">=0.4.0" + } + }, "node_modules/didyoumean": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz", @@ -2535,9 +2577,9 @@ "dev": true }, "node_modules/follow-redirects": { - "version": "1.15.2", - "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz", - "integrity": "sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==", + "version": "1.15.6", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz", + "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==", "funding": [ { "type": "individual", @@ -2562,6 +2604,19 @@ "is-callable": "^1.1.3" } }, + "node_modules/form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/fraction.js": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz", @@ -3613,6 +3668,25 @@ "node": ">=8.6" } }, + "node_modules/mime-db": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz", + "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==", + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/mime-types": { + "version": "2.1.35", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz", + "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==", + "dependencies": { + "mime-db": "1.52.0" + }, + "engines": { + "node": ">= 0.6" + } + }, "node_modules/mimic-fn": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz", @@ -4307,6 +4381,11 @@ "react-is": "^16.13.1" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "node_modules/punycode": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz", diff --git a/package.json b/package.json index 3d75a9a..8fe2171 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "pre-commit-check": "tsc && next lint" }, "devDependencies": { + "@types/css-modules": "^1.0.5", "@types/http-proxy": "^1.17.10", "@types/node": "^18.15.11", "@types/nprogress": "^0.2.0", @@ -45,6 +46,7 @@ "@hookform/error-message": "2.0.1", "@hookform/resolvers": "3.0.1", "antd": "5.4.0", + "axios": "^1.6.8", "dayjs": "1.11.7", "http-proxy": "1.18.1", "jotai": "2.0.3", diff --git a/pages/IndexPage.module.css b/pages/IndexPage.module.css new file mode 100644 index 0000000..ba490fd --- /dev/null +++ b/pages/IndexPage.module.css @@ -0,0 +1,24 @@ +.centerSection { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + min-height: 10vh; + background-color: #FDF6DC; + padding: 20px; + text-align: center; +} + +.centerText { + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; +} + +.centerImage { + display: flex; + justify-content: center; + align-items: center; + margin: 20px 0; +} \ No newline at end of file diff --git a/pages/cinemas.tsx b/pages/cinemas.tsx new file mode 100644 index 0000000..95f4ec0 --- /dev/null +++ b/pages/cinemas.tsx @@ -0,0 +1,80 @@ +import React, { useState } from 'react'; +import NavBar from '../components/NavBar'; +import SocSignBar from '../components/SocSignBar'; +import styles from './IndexPage.module.css'; + +const cinemaData = { + Jakarta: ['Grand Indonesia', 'Pacific Place', 'Central Park', 'Slipi Jaya', 'Green Pramuka Mall', 'Bella Terra Lifestyle Center', 'Transmart Cempaka Putih', 'Aeon Mall JGC', 'FX Sudirman', 'Sunter Mall', 'Buaran Plaza', 'Poins Mall'], + Bandung: ['Paris Van Java', 'Miko Mall', 'BEC Mall', '23 Paskal Shopping Center', 'Metro Indah Mall', 'Kings Shopping Center'], + 'Tangerang Selatan': ['Teras Kota', 'Transmart Graha Bintaro', 'Paradise Walk Serpong'], + Bekasi: ['Bekasi Cyber Park', 'Bekasi Trade Center', 'Lagoon Avenue Bekasi'], + Balikpapan: ['Plaza Balikpapan'], + Yogyakarta: ['Jwalk Mall', 'Pakuwon Mall Jogja', 'Transmart Maguwo'], + Tangerang: ['Bandara City Mall', 'Ecoplaza Citraraya Cikupa', 'Grand Batavia', 'Mal Ciputra Tangerang'], + Cirebon: ['Grage City Mall', 'Transmart Cirebon'], + Surabaya: ['Marvell City', 'BG Junction', 'Maspion Square'], + Karawang: ['Festive Walk', 'Technomart', 'Cikampek Mall'], + Mojokerto: ['Sunrise Mall'], + Medan: ['Focal Point'], + Purwokerto: ['Rita Supermall'], + Palembang: ['Social Market', 'Transmart Palembang', 'PTC Mall'], + Depok: ['Depok Mall', 'DTC Depok'], + Tegal: ['Transmart Tegal'], + Pekanbaru: ['Transmart Pekanbaru', 'Holiday Pekanbaru', 'Studio Pekanbaru'], + Mataram: ['Transmart Mataram'], + Solo: ['Transmart Solo'], + Lampung: ['Transmart Lampung'], + Gresik: ['Icon Mall Gresik'], + Bogor: ['Vivo Sentul'], + Blitar: ['Blitar Square'], + Samarinda: ['Plaza Mulia'], + Batam: ['Park Avenue Batam', 'Grand Batam Mall'], + Purwakarta: ['Sadang Terminal Square'], + Madiun: ['Plaza Lawu Madiun'], + Kediri: ['Kediri Mall'], + Cikarang: ['Living Plaza Jababeka'], + Probolinggo: ['Wijaya Kusuma'], + Makassar: ['Panakkukang Square'], + Malang: ['Malang City Point'], + Jember: ['Roxy Square Jember'], + Padang: ['Raya Padang'], + 'Tangerang City': ['Foodmosphere'], + Serang: ['Ecoplaza Citra Maja Raya'], + Manado: ['Grand Kawanua Manado'], +}; + +const CinemasPage: React.FC = () => { + const [openCity, setOpenCity] = useState(null); + + const handleCityClick = (city: string) => { + setOpenCity(openCity === city ? null : city); + }; + + return ( +
+
+ +

CULTUREPLEX

+ +
+
    + {Object.keys(cinemaData).map(city => ( +
  • + + {openCity === city && ( +
      + {cinemaData[city].map(mall => ( +
    • {mall}
      • + ))} +
    + )} +
    • + ))} +
+
+ ); +}; + +export default CinemasPage; diff --git a/pages/index.tsx b/pages/index.tsx index 6c0943a..435cc66 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,15 +1,22 @@ -import { WithDefaultLayout } from '../components/DefautLayout'; import { Title } from '../components/Title'; import { Page } from '../types/Page'; +import NavBar from '../components/NavBar'; +import SocSignBar from '../components/SocSignBar'; +import MovieSelectionList from '../components/MovieSelection'; +import styles from './IndexPage.module.css'; const IndexPage: Page = () => { return (
Home - Hello World! +
+ +

CULTUREPLEX

+ +
+
); } -IndexPage.layout = WithDefaultLayout; export default IndexPage; diff --git a/pages/login.tsx b/pages/login.tsx new file mode 100644 index 0000000..ab43ade --- /dev/null +++ b/pages/login.tsx @@ -0,0 +1,25 @@ +import { useState } from 'react'; + +const Login: React.FC = () => { + const [email, setEmail] = useState(''); + const [password, setPassword] = useState(''); + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + }; + + return ( +
+
+

Login

+
+ setEmail(e.target.value)} className="input-field mb-4" required /> + setPassword(e.target.value)} className="input-field mb-4" required /> + +
+
+
+ ); +}; + +export default Login; \ No newline at end of file diff --git a/pages/membershipOut.tsx b/pages/membershipOut.tsx new file mode 100644 index 0000000..8e54400 --- /dev/null +++ b/pages/membershipOut.tsx @@ -0,0 +1,23 @@ +import React from 'react'; +import Image from 'next/image'; +import NavBar from '../components/NavBar'; +import SocSignBar from '../components/SocSignBar'; +import styles from './IndexPage.module.css'; + +const MembershipPage: React.FC = () => { + return ( +
+
+ +

CULTUREPLEX

+ +
+

Membership

+
+ Membership Image +
+
+ ); +}; + +export default MembershipPage; \ No newline at end of file diff --git a/pages/movies/[id].tsx b/pages/movies/[id].tsx new file mode 100644 index 0000000..f8a6a95 --- /dev/null +++ b/pages/movies/[id].tsx @@ -0,0 +1,38 @@ +import { GetStaticPaths, GetStaticProps } from 'next'; +import { Movie } from '../../types/Movie'; +import moviesData from '../../data/movies'; + +interface MovieDetailProps { + movie: Movie | undefined; +} + +const MovieDetail: React.FC = ({ movie }) => { + if (!movie) { + return

Movie not found.

; + } + + return ( +
+

{movie.title}

+ {`${movie.title} +

{movie.description}

+
+ ); +}; + +export const getStaticPaths: GetStaticPaths = async () => { + const paths = moviesData.map((movie) => ({ + params: { id: movie.id } + })); + + return { paths, fallback: false }; +}; + +export const getStaticProps: GetStaticProps = async (context) => { + const { id } = context.params!; + const movie = moviesData.find((movie) => movie.id === id); + + return { props: { movie } }; +}; + +export default MovieDetail; diff --git a/pages/moviespage.tsx b/pages/moviespage.tsx new file mode 100644 index 0000000..dd326ca --- /dev/null +++ b/pages/moviespage.tsx @@ -0,0 +1,22 @@ +import React from 'react'; +import NowPlayingList from '../components/NowPlayingList'; +import ComingSoonList from '../components/ComingSoonList'; +import NavBar from '../components/NavBar'; +import SocSignBar from '../components/SocSignBar'; +import styles from './IndexPage.module.css'; + +const MoviesPage: React.FC = () => { + return ( +
+
+ +

CULTUREPLEX

+ +
+ + +
+ ); +}; + +export default MoviesPage; diff --git a/pages/promotion/[id].tsx b/pages/promotion/[id].tsx new file mode 100644 index 0000000..c761ea6 --- /dev/null +++ b/pages/promotion/[id].tsx @@ -0,0 +1,55 @@ +import React from 'react'; +import { useRouter } from 'next/router'; +import Image from 'next/image'; +import NavBar from '../../components/NavBar'; +import SocSignBar from '../../components/SocSignBar'; + +const promotions = [ + { + id: 1, + name: 'Promotion 1', + imageUrl: '/descPromotion1.png', + }, + { + id: 2, + name: 'Promotion 2', + imageUrl: '/descPromotion2.jpg', + }, + { + id: 3, + name: 'Promotion 3', + imageUrl: '/descPromotion3.jpg', + }, + { + id: 4, + name: 'Promotion 4', + imageUrl: '/descPromotion4.jpg', + }, + { + id: 5, + name: 'Promotion 5', + imageUrl: '/descPromotion5.jpg', + }, +]; + +const PromotionDetailPage: React.FC = () => { + const router = useRouter(); + const { id } = router.query; + const promotion = promotions.find(promo => promo.id === parseInt(id as string)); + + if (!promotion) { + return

Promotion not found

; + } + + return ( +
+ +

CULTUREPLEX

+ +

{promotion.name}

+ {promotion.name} +
+ ); +}; + +export default PromotionDetailPage; diff --git a/pages/promotions.tsx b/pages/promotions.tsx new file mode 100644 index 0000000..998e04a --- /dev/null +++ b/pages/promotions.tsx @@ -0,0 +1,60 @@ +import React from 'react'; +import Link from 'next/link'; +import Image from 'next/image'; +import NavBar from '../components/NavBar'; +import SocSignBar from '../components/SocSignBar'; +import styles from './IndexPage.module.css'; + +const promotions = [ + { + id: 1, + name: 'BUY 1 GET 1 FREE dengan tukar point MyTelkomsel kamu!', + imageUrl: '/promotion1.jpg', + }, + { + id: 2, + name: 'Give Best Moment with CGV Gift Card!', + imageUrl: '/promotion2.jpg', + }, + { + id: 3, + name: 'PICK YOUR PRESENT! Get Marhen J Bag + Special Class Ticket + Popcorn', + imageUrl: '/promotion3.jpg', + }, + { + id: 4, + name: 'Nonton Hemat Pake QRIS Jago Cashback 40%!', + imageUrl: '/promotion4.jpg', + }, + { + id: 5, + name: 'Nonton Makin Seru Dengan Buy 3 Get 1 Ticket dari Kartu Kredit OCBC!', + imageUrl: '/promotion5.jpg', + }, +]; + +const PromotionsPage: React.FC = () => { + return ( +
+
+ +

CULTUREPLEX

+ +
+

Promotions

+
+ {promotions.map(promotion => ( +
+ {promotion.name} +

{promotion.name}

+ + Read More + +
+ ))} +
+
+ ); +}; + +export default PromotionsPage; diff --git a/pages/register.tsx b/pages/register.tsx new file mode 100644 index 0000000..01fc9ef --- /dev/null +++ b/pages/register.tsx @@ -0,0 +1,134 @@ +import { useRouter } from 'next/router'; +import { Input, Button, Form, DatePicker, Select, notification } from 'antd'; +import { Page } from '@/types/Page'; +import styles from './IndexPage.module.css'; +import NavBar from '../components/NavBar'; +import SocSignBar from '../components/SocSignBar'; + +const { Option } = Select; +const { TextArea } = Input; + +interface FormData { + email: string; + birthdate: Date | null; + gender: string; + address: string; + username: string; + password: string; +} + +const RegistrationPage: Page = () => { + + const [form] = Form.useForm(); + const router = useRouter(); + + const handleSubmit = async (values: FormData) => { + try { + const response = await fetch('/api/be/api/v1/Auth/Register', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify(values) + }); + if (response.ok) { + notification.success({ + message: 'Registration Successful', + description: 'You will be redirected to the Login page.' + }); + router.push('/login'); + } else { + throw new Error('Failed to register'); + } + } catch (error) { + notification.error({ + message: 'Registration Failed', + description: 'An error occurred during registration.' + }); + } + }; + + + const validateAge = (_, value: Date | null) => { + if (!value) { + return Promise.reject(new Error('Please select your birthdate!')); + } + + const today = new Date(); + const birthdate = new Date(value); + const ageDiffMs = today.getTime() - birthdate.getTime(); + const ageDate = new Date(ageDiffMs); + const age = Math.abs(ageDate.getUTCFullYear() - 1970); + + if (age >= 14) { + return Promise.resolve(); + } + return Promise.reject(new Error('You must be at least 14 years old!')); + }; + + + return ( +
+
+
+
+ +

CULTUREPLEX

+ +
+

Register

+
+ + + + + + + + + + + + + +