From 181fea80ce7e21ece5348fff9dffc1497d1a5596 Mon Sep 17 00:00:00 2001
From: Atiwit Pattanapukdee <65160394@go.buu.ac.th>
Date: Sun, 16 Mar 2025 02:31:50 +0700
Subject: [PATCH] Add Project File
---
public/css/style.css | 173 +++++++++++++++++++++++++++++++++++++++++++
server.js | 61 ++-------------
views/index.ejs | 1 +
3 files changed, 181 insertions(+), 54 deletions(-)
create mode 100644 public/css/style.css
diff --git a/public/css/style.css b/public/css/style.css
new file mode 100644
index 0000000..8143a36
--- /dev/null
+++ b/public/css/style.css
@@ -0,0 +1,173 @@
+/* ตั้งค่าพื้นฐาน */
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: 'Poppins', sans-serif;
+}
+
+body {
+ background-color: #f4f4f4;
+ color: #333;
+ line-height: 1.6;
+}
+
+/* สไตล์ Navbar */
+.navbar {
+ background: #007bff;
+ color: white;
+ padding: 15px 20px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.navbar a {
+ color: white;
+ text-decoration: none;
+ font-size: 18px;
+ margin-right: 15px;
+}
+
+.navbar a:hover {
+ text-decoration: underline;
+}
+
+/* Hero Section */
+.hero {
+ background: url('/images/hero.jpg') no-repeat center center/cover;
+ height: 400px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ color: white;
+}
+
+.hero h1 {
+ font-size: 50px;
+ text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
+}
+
+/* Tour Cards */
+.tour-container {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ padding: 20px;
+}
+
+.tour-card {
+ background: white;
+ border-radius: 10px;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+ width: 300px;
+ margin: 15px;
+ overflow: hidden;
+ transition: transform 0.3s;
+}
+
+.tour-card:hover {
+ transform: scale(1.05);
+}
+
+.tour-card img {
+ width: 100%;
+ height: 180px;
+}
+
+.tour-card .content {
+ padding: 15px;
+}
+
+.tour-card h3 {
+ font-size: 22px;
+ color: #007bff;
+}
+
+.tour-card p {
+ font-size: 16px;
+ margin: 10px 0;
+}
+
+.tour-card .price {
+ font-size: 18px;
+ color: #28a745;
+ font-weight: bold;
+}
+
+.tour-card .btn {
+ display: block;
+ text-align: center;
+ padding: 10px;
+ background: #007bff;
+ color: white;
+ text-decoration: none;
+ border-radius: 5px;
+ margin-top: 10px;
+}
+
+.tour-card .btn:hover {
+ background: #0056b3;
+}
+
+/* ฟอร์มล็อกอิน & สมัครสมาชิก */
+.form-container {
+ width: 100%;
+ max-width: 400px;
+ margin: 50px auto;
+ padding: 20px;
+ background: white;
+ border-radius: 10px;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.form-container h2 {
+ text-align: center;
+ margin-bottom: 20px;
+}
+
+.form-group {
+ margin-bottom: 15px;
+}
+
+.form-group label {
+ display: block;
+ font-weight: bold;
+}
+
+.form-group input {
+ width: 100%;
+ padding: 10px;
+ border: 1px solid #ccc;
+ border-radius: 5px;
+ margin-top: 5px;
+}
+
+.btn-submit {
+ width: 100%;
+ background: #007bff;
+ color: white;
+ padding: 10px;
+ border: none;
+ border-radius: 5px;
+ font-size: 18px;
+ cursor: pointer;
+}
+
+.btn-submit:hover {
+ background: #0056b3;
+}
+
+/* Footer */
+.footer {
+ background: #333;
+ color: white;
+ text-align: center;
+ padding: 20px;
+ margin-top: 30px;
+}
+
+.footer p {
+ margin: 0;
+}
diff --git a/server.js b/server.js
index dccb20c..e8685b8 100644
--- a/server.js
+++ b/server.js
@@ -1,64 +1,17 @@
-require('dotenv').config();
-
const express = require('express');
-const mysql = require('mysql2/promise');
-const path = require('path');
+const bodyParser = require('body-parser');
+const dotenv = require('dotenv');
+const tourRoutes = require('./routes/tourRoutes');
-// สร้างแอป Express
+dotenv.config();
const app = express();
-// ตั้งค่า view engine เป็น EJS
app.set('view engine', 'ejs');
-app.set('views', path.join(__dirname, 'views'));
-
-// สร้างการเชื่อมต่อฐานข้อมูล MySQL
-const pool = mysql.createPool({
- host: process.env.DB_HOST ,
- port: process.env.DB_PORT ,
- user: process.env.DB_USER ,
- password: process.env.DB_PASSWORD ,
- database: process.env.DB_NAME ,
- waitForConnections: true,
- connectionLimit: 10,
- queueLimit: 0
-});
-
-// Check database connection
-async function testConnection() {
- try {
- const connection = await pool.getConnection();
- await connection.ping();
- console.log('Database connection succeeded.');
- connection.release();
- } catch (err) {
- console.error('Database connection failed:', err);
- process.exit(1); // Terminate the app if the database connection fails
- }
-}
-testConnection();
+app.use(express.static('public'));
+app.use(bodyParser.urlencoded({ extended: false }));
-// หน้าหลัก
-app.get('/', async (req, res) => {
- try {
- const [rows] = await pool.query('SELECT * FROM tours');
- res.render('index', { tours: rows });
- } catch (err) {
- res.status(500).send('Server error');
- }
-});
-
-// หน้ารายละเอียดทัวร์
-app.get('/tour/:id', async (req, res) => {
- const { id } = req.params;
- try {
- const [rows] = await pool.query('SELECT * FROM tours WHERE id = ?', [id]);
- res.render('tour', { tour: rows[0] });
- } catch (err) {
- res.status(500).send('Server error');
- }
-});
+app.use('/', tourRoutes);
-// ตั้งค่าพอร์ต
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
diff --git a/views/index.ejs b/views/index.ejs
index 9dbe8b5..8d6645d 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -3,6 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="/css/style.css">
<title>Tour Website</title>
</head>
<body>
--
GitLab