🐍 Snake Game - เกมงู

เกมงูคลาสสิกที่สร้างด้วย HTML5, CSS3 และ JavaScript พร้อมกราฟิกที่สวยงามและเอฟเฟกต์พิเศษ

🎮 คุณสมบัติ

✨ ฟีเจอร์หลัก

• งูที่สมจริง - หัวงูมีดวงตาที่หมุนตามทิศทางการเคลื่อนไหว
• ลวดลายงู - ตัวงูมีลวดลายจุดสลับกันเหมือนงูจริง
• เอฟเฟกต์แสง - งูและอาหารมีเอฟเฟกต์เรืองแสงสวยงาม
• ธีมสีธรรมชาติ - โทนสีเขียวป่าที่สบายตา
• การควบคุมที่ลื่นไหล - เคลื่อนไหวอย่างต่อเนื่องไม่กระตุก

🎯 ระบบเกม

• ระบบคะแนน - เก็บคะแนนปัจจุบันและคะแนนสูงสุด
• ระบบอาหาร - อาหารสุ่มตำแหน่งและมีเอฟเฟกต์กระพริบ
• Game Over - ตรวจจับการชนกำแพงและตัวเอง
• ระบบหยุดชั่วคราว - สามารถหยุดและเล่นต่อได้
• บันทึกคะแนน - คะแนนสูงสุดถูกบันทึกใน Local Storage

🎨 การออกแบบ

• Responsive Design - รองรับทุกขนาดหน้าจอ
• Modern UI - ดีไซน์สมัยใหม่พร้อม Glass Effect
• Smooth Animations - แอนิเมชั่นที่นุ่มนวล
• Dynamic Background - พื้นหลังเคลื่อนไหวเบาๆ

🕹️ วิธีเล่น

การควบคุม

• ลูกศร ↑ ↓ ← → หรือ WASD สำหรับเคลื่อนไหว
• Space สำหรับหยุดชั่วคราว
• ปุ่มเริ่มเกม เพื่อเริ่มเล่น
• ปุ่มเริ่มใหม่ เพื่อรีเซ็ตเกม

กติกา

1. กดปุ่ม "เริ่มเกม" เพื่อเริ่มเล่น
2. ควบคุมงูให้กินอาหารสีแดง
3. งูจะยาวขึ้นเมื่อกินอาหาร และได้ 10 คะแนน
4. หลีกเลี่ยงการชนกำแพงและตัวเอง
5. พยายามทำคะแนนให้สูงที่สุด!

🚀 การติดตั้งและเรียกใช้

วิธีที่ 1: เปิดไฟล์โดยตรง

# ดาวน์โหลดโปรเจกต์
git clone [repository-url]
cd snake-game

# เปิดไฟล์ index.html ในเบราว์เซอร์
# หรือดับเบิลคลิกที่ไฟล์ index.html

วิธีที่ 2: ใช้ Local Server

# ใช้ Python
python -m http.server 8000

# ใช้ Node.js
npx serve .

# ใช้ PHP
php -S localhost:8000

# จากนั้นเปิด http://localhost:8000

📁 โครงสร้างโปรเจกต์

snake-game/
├── index.html          # หน้าเว็บหลัก
├── style.css          # สไตล์และเอฟเฟกต์
├── script.js          # ตรรกะเกมทั้งหมด
└── README.md          # เอกสารนี้

🛠️ เทคโนโลยีที่ใช้

• HTML5 Canvas - สำหรับการวาดกราฟิก
• CSS3 - สำหรับสไตล์และแอนิเมชั่น
• JavaScript ES6 - สำหรับตรรกะเกม
• Local Storage - สำหรับบันทึกคะแนนสูงสุด

🎯 ฟีเจอร์เด่น

การออกแบบงู

• หัวงูเป็นวงกลมพร้อมดวงตาที่เปลี่ยนตำแหน่งตามทิศทาง
• ตัวงูมีไล่สีแบบ gradient และลวดลายจุด
• เอฟเฟกต์เรืองแสงรอบตัวงู

การออกแบบอาหาร

• อาหารเป็นวงกลมสีแดงพร้อมเอฟเฟกต์แสง
• มีการกระพริบเพื่อดึงดูดความสนใจ
• สุ่มตำแหน่งใหม่ทุกครั้งที่ถูกกิน

UI/UX

• ธีมสีเขียวธรรมชาติที่สบายตา
• พื้นหลังเคลื่อนไหวเบาๆ
• ปุ่มที่มี hover effect
• หน้าจอ Game Over ที่สวยงาม

📱 Responsive Design

เกมรองรับการเล่นบนอุปกรณ์ต่างๆ:

• Desktop - ควบคุมด้วยคีย์บอร์ด
• Tablet - ปรับขนาดหน้าจออัตโนมัติ
• Mobile - ขนาดเหมาะสมสำหรับหน้าจอเล็ก

🔧 การปรับแต่ง

เปลี่ยนความเร็วเกม

// ในไฟล์ script.js บรรทัดสุดท้าย
setInterval(updateGame, 150); // เปลี่ยนจาก 150 เป็นค่าอื่น

เปลี่ยนขนาดกระดาน

// ในไฟล์ script.js
const GRID_SIZE = 25;        // ขนาดแต่ละช่อง
const CANVAS_SIZE = 500;     // ขนาดกระดานรวม

เปลี่ยนสีธีม

/* ในไฟล์ style.css */
body {
    background: linear-gradient(135deg, #2c5530 0%, #1b4332 50%, #081c15 100%);
}

🏆 คะแนนและความท้าทาย

• เป้าหมายเริ่มต้น: 50 คะแนน
• เป้าหมายกลาง: 200 คะแนน
• เป้าหมายสูง: 500 คะแนน
• ระดับเซียน: 1000+ คะแนน

🤝 การมีส่วนร่วม

หากต้องการปรับปรุงเกมหรือเพิ่มฟีเจอร์ใหม่:

1. Fork โปรเจกต์นี้
2. สร้าง branch ใหม่ (git checkout -b feature/amazing-feature)
3. Commit การเปลี่ยนแปลง (git commit -m 'Add amazing feature')
4. Push ไปยัง branch (git push origin feature/amazing-feature)
5. เปิด Pull Request

📝 License

โปรเจกต์นี้เป็น Open Source ภายใต้ MIT License

👨‍💻 ผู้พัฒนา

สร้างด้วยความรักและความสนุกในการเขียนโค้ด 🐍💚

---

สนุกกับการเล่นเกมงู! 🎮✨