Last active
September 29, 2026 01:16
-
Star
(316)
You must be signed in to star a gist -
Fork
(419)
You must be signed in to fork a gist
-
-
Save isdaviddong/23cc140c1780828b44f79397f737b95e to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title></title> | |
| <meta charset="utf-8" /> | |
| <script src="Scripts/jquery-1.9.1.min.js"></script> | |
| <link href="Content/bootstrap.min.css" rel="stylesheet" /> | |
| <script src="Scripts/isRockFx.js"></script> | |
| <script> | |
| $(function () { | |
| $('#ButtonCal').click( | |
| function () { | |
| //取得用戶輸入的參數 | |
| var para = { 'height': $('#txbHeight').val(), 'weight': $('#txbWeight').val() }; | |
| //呼叫API | |
| ExecuteAPI('Example', 'BMI', para, | |
| //呼叫WebAPI成功時運行的Call Back Function | |
| function (result) { | |
| alert(result.Data); | |
| } | |
| ); | |
| } | |
| ); | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <div class="row" style="margin:10px"> | |
| <div class="col-md-12"> | |
| <div class="form-group"> | |
| 身高: | |
| <input id="txbHeight" class="form-control" placeholder="請輸入身高" /> | |
| 體重: | |
| <input id="txbWeight" class="form-control" placeholder="請輸入體重" /> | |
| <br /> | |
| <button class="btn btn-primary" id="ButtonCal">計算</button> | |
| </div> | |
| </div> | |
| </div> | |
| </body> | |
| </html> |
<title>Pagham</title>
<script src="app.js"></script>
Pagham
Send
body{margin:0;font-family:sans-serif;background:#e5ddd5}
.header{background:#075e54;color:white;padding:15px;font-size:20px;font-weight:bold}
#chatBox{height:80vh;overflow:auto;padding:10px}
.msg{background:#dcf8c6;padding:10px;margin:5px;border-radius:8px;width:fit-content;max-width:80%;margin-left:auto}
.input-area{display:flex;position:fixed;bottom:0;width:100%;background:white;padding:5px}
input{flex:1;padding:12px;border:none;outline:none}
button{background:#25d366;color:white;border:none;padding:12px 20px;border-radius:5px}
let chatBox = document.getElementById("chatBox");
let input = document.getElementById("msgInput");
function send(){
if(input.value.trim()=="") return;
let div = document.createElement("div");
div.className="msg";
div.innerText = input.value;
chatBox.appendChild(div);
localStorage.setItem("pagham_chat", chatBox.innerHTML);
input.value="";
chatBox.scrollTop = chatBox.scrollHeight;
}
window.onload = function(){
if(localStorage.getItem("pagham_chat")){
chatBox.innerHTML = localStorage.getItem("pagham_chat");
}
}
ไง
<title>Script Hub & Community</title>
<script src="https://cdn.tailwindcss.com"></script>
<!-- Header / Navbar -->
<header class="bg-slate-800 border-b border-slate-700 sticky top-0 z-50">
<div class="max-w-6xl mx-auto px-4 py-3 flex justify-between items-center">
<div class="flex items-center gap-3">
<i class="fa-solid fa-code text-indigo-500 text-2xl"></i>
<h1 class="text-xl font-bold bg-gradient-to-r from-indigo-400 to-cyan-400 bg-clip-text text-transparent">
ScriptHub Community
</h1>
</div>
<!-- Realtime Online Count & Status -->
<div class="flex items-center gap-4">
<div class="bg-slate-900/80 border border-slate-700 px-3 py-1 rounded-full text-sm flex items-center gap-2">
<span class="relative flex h-3 w-3">
<span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75"></span>
<span class="relative inline-flex rounded-full h-3 w-3 bg-emerald-500"></span>
</span>
<span>ออนไลน์อยู่: <strong id="online-count" class="text-emerald-400">1</strong> คน</span>
</div>
<button id="admin-badge" class="hidden bg-red-500/20 text-red-400 border border-red-500/30 text-xs px-2.5 py-1 rounded-md font-semibold">
<i class="fa-solid fa-shield-halved mr-1"></i> Admin
</button>
</div>
</div>
<!-- Navigation Tabs -->
<nav class="bg-slate-800/50 border-t border-slate-700/50">
<div class="max-w-6xl mx-auto px-4 flex gap-2">
<button onclick="switchTab('scripts')" id="tab-scripts" class="tab-btn py-3 px-4 font-medium text-indigo-400 border-b-2 border-indigo-500 flex items-center gap-2">
<i class="fa-solid fa-scroll"></i> 1. แจกสคริปต์
</button>
<button onclick="switchTab('forum')" id="tab-forum" class="tab-btn py-3 px-4 font-medium text-slate-400 hover:text-slate-200 flex items-center gap-2">
<i class="fa-solid fa-comments"></i> 2. พูดคุย / ความคิดเห็น
</button>
<button onclick="switchTab('bugs')" id="tab-bugs" class="tab-btn py-3 px-4 font-medium text-slate-400 hover:text-slate-200 flex items-center gap-2">
<i class="fa-solid fa-bug"></i> 3. รายงานบั๊ก
</button>
<button onclick="switchTab('admin')" id="tab-admin" class="tab-btn hidden py-3 px-4 font-medium text-red-400 hover:text-red-300 flex items-center gap-2 ml-auto">
<i class="fa-solid fa-user-shield"></i> แผงควบคุมเจ้าของเว็บ
</button>
</div>
</nav>
</header>
<!-- Main Content Area -->
<main class="max-w-6xl mx-auto px-4 py-6 flex-grow w-full">
<!-- ================= เมนูที่ 1: แจกสคริปต์ ================= -->
<section id="sec-scripts" class="space-y-6">
<div class="flex justify-between items-center">
<h2 class="text-2xl font-bold">คลังสคริปต์ฟรี</h2>
<button onclick="openScriptModal()" class="admin-only hidden bg-indigo-600 hover:bg-indigo-500 px-4 py-2 rounded-lg text-sm font-semibold transition">
+ เพิ่มสคริปต์ใหม่ (Admin)
</button>
</div>
<!-- List of Scripts -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-4" id="script-list">
<!-- Example Card -->
<div class="bg-slate-800 border border-slate-700 rounded-xl p-5 space-y-3">
<div class="flex justify-between items-start">
<h3 class="text-lg font-bold text-indigo-300">Auto Farm Script V1</h3>
<span class="bg-indigo-950 text-indigo-300 text-xs px-2 py-1 rounded border border-indigo-800">Roblox</span>
</div>
<p class="text-slate-400 text-sm">สคริปต์สำหรับฟาร์มอัตโนมัติ ปลอดภัย 100% อัปเดตล่าสุดวันนี้</p>
<div class="bg-slate-900 p-3 rounded-lg border border-slate-700 font-mono text-xs text-slate-300 overflow-x-auto">
loadstring(game:HttpGet("https://raw.githubusercontent.com/example/script/main.lua"))()
</div>
<button onclick="navigator.clipboard.writeText('loadstring(...)()'); alert('ก๊อปปี้สคริปต์แล้ว!');" class="w-full bg-slate-700 hover:bg-slate-600 py-2 rounded-lg text-sm font-semibold transition">
<i class="fa-regular fa-copy mr-1"></i> ก๊อปปี้สคริปต์
</button>
</div>
</div>
</section>
<!-- ================= เมนูที่ 2: พูดคุย / ความคิดเห็น ================= -->
<section id="sec-forum" class="hidden space-y-6">
<h2 class="text-2xl font-bold">ห้องพูดคุยแลกเปลี่ยน</h2>
<!-- Box พิมพ์ข้อความ -->
<div class="bg-slate-800 border border-slate-700 p-4 rounded-xl space-y-3">
<input type="text" id="chat-username" placeholder="ชื่อของคุณ..." class="w-full bg-slate-900 border border-slate-700 rounded-lg p-2.5 text-sm focus:outline-none focus:border-indigo-500">
<textarea id="chat-msg" rows="3" placeholder="พิมพ์ข้อความพูดคุย..." class="w-full bg-slate-900 border border-slate-700 rounded-lg p-2.5 text-sm focus:outline-none focus:border-indigo-500"></textarea>
<button onclick="sendChatMessage()" class="bg-indigo-600 hover:bg-indigo-500 px-6 py-2 rounded-lg text-sm font-semibold transition">
ส่งข้อความ
</button>
</div>
<!-- List of Comments -->
<div id="chat-messages" class="space-y-3">
<div class="bg-slate-800/60 border border-slate-700/60 p-4 rounded-xl flex justify-between items-start">
<div>
<div class="flex items-center gap-2">
<span class="font-bold text-indigo-400">Player123</span>
<span class="text-xs text-slate-500">10 นาทีที่แล้ว</span>
</div>
<p class="text-slate-300 mt-1 text-sm">สคริปต์ใช้งานได้ดีมากครับ ขอบคุณครับ!</p>
</div>
<button class="admin-only hidden text-red-400 hover:text-red-300 text-xs" title="ลบข้อความ">
<i class="fa-solid fa-trash"></i>
</button>
</div>
</div>
</section>
<!-- ================= เมนูที่ 3: รายงานบั๊ก ================= -->
<section id="sec-bugs" class="hidden space-y-6">
<h2 class="text-2xl font-bold">แจ้งปัญหา / รายงานบั๊ก</h2>
<form onsubmit="submitBug(event)" class="bg-slate-800 border border-slate-700 p-6 rounded-xl space-y-4 max-w-2xl">
<div>
<label class="block text-sm font-medium mb-1">หัวข้อปัญหา</label>
<input type="text" required placeholder="เช่น สคริปต์รันไม่ติด, ลิงก์เสีย" class="w-full bg-slate-900 border border-slate-700 rounded-lg p-2.5 text-sm focus:outline-none focus:border-indigo-500">
</div>
<div>
<label class="block text-sm font-medium mb-1">รายละเอียดปัญหา</label>
<textarea required rows="4" placeholder="อธิบายขั้นตอนที่เกิดปัญหา..." class="w-full bg-slate-900 border border-slate-700 rounded-lg p-2.5 text-sm focus:outline-none focus:border-indigo-500"></textarea>
</div>
<button type="submit" class="bg-red-600 hover:bg-red-500 px-6 py-2.5 rounded-lg text-sm font-semibold transition">
ส่งรายงานบั๊ก
</button>
</form>
</section>
<!-- ================= แผงควบคุมเจ้าของเว็บ (Admin Panel) ================= -->
<section id="sec-admin" class="hidden space-y-6">
<div class="border-b border-red-500/30 pb-3">
<h2 class="text-2xl font-bold text-red-400 flex items-center gap-2">
<i class="fa-solid fa-user-gear"></i> แผงควบคุมเจ้าของเว็บไซต์ (Admin)
</h2>
</div>
<!-- Online Users & Management -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<!-- รายชื่อผู้ใช้งานที่ออนไลน์ -->
<div class="bg-slate-800 border border-slate-700 rounded-xl p-5 space-y-4">
<h3 class="font-bold text-lg flex items-center gap-2">
<i class="fa-solid fa-users text-indigo-400"></i> ผู้ใช้งานในเว็บขณะนี้
</h3>
<div id="user-list" class="space-y-2">
<!-- User Row Example -->
<div class="bg-slate-900 p-3 rounded-lg flex justify-between items-center border border-slate-700">
<div>
<p class="text-sm font-semibold">User_9821 <span class="text-xs text-emerald-400">(กำลังดูหน้า: แจกสคริปต์)</span></p>
<p class="text-xs text-slate-500">IP / ID: 182.xx.xx.xx</p>
</div>
<div class="flex gap-2">
<button onclick="kickUser('User_9821')" class="bg-amber-600/20 text-amber-400 hover:bg-amber-600/40 border border-amber-500/30 px-3 py-1 rounded text-xs">เตะ</button>
<button onclick="banUser('User_9821')" class="bg-red-600/20 text-red-400 hover:bg-red-600/40 border border-red-500/30 px-3 py-1 rounded text-xs">แบน</button>
</div>
</div>
</div>
</div>
<!-- รายการบั๊กที่ถูกรายงานเข้ามา -->
<div class="bg-slate-800 border border-slate-700 rounded-xl p-5 space-y-4">
<h3 class="font-bold text-lg flex items-center gap-2 text-red-400">
<i class="fa-solid fa-list-check"></i> บั๊กที่รอการแก้ไข
</h3>
<div id="bug-reports-list" class="space-y-2">
<p class="text-slate-500 text-sm">ยังไม่มีบั๊กที่ถูกรายงานเข้ามา</p>
</div>
</div>
</div>
</section>
</main>
<script>
// --- 1. สลับหน้า เมนู ---
function switchTab(tabName) {
const tabs = ['scripts', 'forum', 'bugs', 'admin'];
tabs.forEach(t => {
document.getElementById(`sec-${t}`).classList.add('hidden');
document.getElementById(`tab-${t}`).classList.remove('text-indigo-400', 'border-b-2', 'border-indigo-500');
document.getElementById(`tab-${t}`).classList.add('text-slate-400');
});
document.getElementById(`sec-${tabName}`).classList.remove('hidden');
document.getElementById(`tab-${tabName}`).classList.add('text-indigo-400', 'border-b-2', 'border-indigo-500');
document.getElementById(`tab-${tabName}`).classList.remove('text-slate-400');
}
// --- 2. จำลองระบบ Admin (กด Ctrl+Shift+A หรือตั้งค่า Key เพื่อเข้าสู่โหมด Admin) ---
let isAdmin = false;
// สำหรับทดสอบ: พิมพ์เปิดโหมด Admin ด้วยสคริปต์ หรือสร้างระบบ Login Firebase
function enableAdminMode() {
isAdmin = true;
document.querySelectorAll('.admin-only').forEach(el => el.classList.remove('hidden'));
document.getElementById('tab-admin').classList.remove('hidden');
document.getElementById('admin-badge').classList.remove('hidden');
alert("ยินดีต้อนรับเจ้าของเว็บ! คุณได้รับสิทธิ์ควบคุมเว็บไซต์แล้ว");
}
// กดปุ่มลัด Shift + A เพื่อเปิดระบบ Admin (สามารถเปลี่ยนเป็นปุ่ม Login ได้)
window.addEventListener('keydown', (e) => {
if (e.shiftKey && e.key === 'A') {
enableAdminMode();
}
});
// --- 3. ฟังก์ชันเตะ / แบนผู้ใช้ ---
function kickUser(userId) {
if(confirm(`คุณต้องการเตะ ${userId} ออกจากเว็บหรือไม่?`)) {
alert(`ตัดการเชื่อมต่อของ ${userId} เรียบร้อยแล้ว`);
}
}
function banUser(userId) {
if(confirm(`คุณต้องการแบน ${userId} ถาวรหรือไม่?`)) {
alert(`แบน IP/ID ของ ${userId} เรียบร้อยแล้ว`);
}
}
function submitBug(e) {
e.preventDefault();
alert("ส่งรายงานบั๊กถึงเจ้าของเว็บเรียบร้อยแล้ว!");
e.target.reset();
}
</script>
<title>Dash Game</title>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
user-select: none;
-webkit-user-select: none;
}
body {
background-color: #111;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100vh;
overflow: hidden;
font-family: Arial, sans-serif;
}
canvas {
border: 4px solid #fff;
box-shadow: 0 0 20px rgba(0, 255, 204, 0.5);
background: linear-gradient(180deg, #0f0c29, #302b63, #24243e);
touch-action: none;
}
.instructions {
color: #fff;
margin-top: 15px;
font-size: 18px;
text-align: center;
}
</style>
<canvas id="gameCanvas" width="800" height="400"></canvas>
<div class="instructions">المس الشاشة أو اضغط Space للقفز!</div>
absensi-siswa/
│
├── index.html
├── style.css
└── script.js
<title>Ата-аналар жиналысына шақыру</title>
<style>
:root {
--primary-blue: #0f2b48;
--secondary-blue: #1d4ed8;
--gold-accent: #d4af37;
--gold-light: #fef08a;
--bg-gradient: linear-gradient(135deg, #0b1e36 0%, #1e3a8a 100%);
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
body {
background: var(--bg-gradient);
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
padding: 20px;
color: #333;
}
.card {
background: rgba(255, 255, 255, 0.96);
border: 3px solid var(--gold-accent);
border-radius: 20px;
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4), 0 0 15px rgba(212, 175, 55, 0.3);
max-width: 500px;
width: 100%;
overflow: hidden;
text-align: center;
position: relative;
}
.card-header {
background: var(--primary-blue);
color: #fff;
padding: 25px 20px;
border-bottom: 3px solid var(--gold-accent);
position: relative;
}
.card-header h1 {
font-size: 22px;
color: var(--gold-accent);
margin-bottom: 5px;
text-transform: uppercase;
letter-spacing: 1px;
}
.school-icon {
font-size: 40px;
margin-bottom: 10px;
}
.teacher-img-container {
margin: 20px auto 10px auto;
width: 160px;
height: 160px;
border-radius: 50%;
border: 4px solid var(--gold-accent);
overflow: hidden;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
.teacher-img-container img {
width: 100%;
height: 100%;
object-fit: cover;
}
.card-body {
padding: 20px 25px;
}
.welcome-text {
font-size: 16px;
line-height: 1.6;
color: #1e293b;
margin-bottom: 20px;
font-weight: 500;
}
.info-box {
background: #f8fafc;
border: 1.5px solid var(--gold-accent);
border-radius: 12px;
padding: 15px;
margin-bottom: 25px;
display: flex;
flex-direction: column;
gap: 10px;
}
.info-item {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 15px;
color: #0f172a;
}
.info-label {
font-weight: bold;
color: var(--secondary-blue);
}
.info-value {
font-weight: 600;
background: #e0f2fe;
padding: 4px 10px;
border-radius: 6px;
color: #0369a1;
}
.form-group {
margin-bottom: 15px;
text-align: left;
}
.form-group label {
display: block;
margin-bottom: 6px;
font-weight: 600;
color: #334155;
font-size: 14px;
}
.form-group input {
width: 100%;
padding: 12px;
border: 2px solid #cbd5e1;
border-radius: 8px;
font-size: 15px;
transition: border-color 0.3s;
}
.form-group input:focus {
outline: none;
border-color: var(--gold-accent);
}
.buttons-container {
display: flex;
gap: 12px;
margin-top: 20px;
}
.btn {
flex: 1;
padding: 12px 15px;
border: none;
border-radius: 8px;
font-size: 15px;
font-weight: bold;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-accept {
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
color: white;
box-shadow: 0 4px 10px rgba(16, 185, 129, 0.3);
}
.btn-accept:hover {
transform: translateY(-2px);
box-shadow: 0 6px 14px rgba(16, 185, 129, 0.4);
}
.btn-decline {
background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
color: white;
box-shadow: 0 4px 10px rgba(239, 68, 68, 0.3);
}
.btn-decline:hover {
transform: translateY(-2px);
box-shadow: 0 6px 14px rgba(239, 68, 68, 0.4);
}
.footer-note {
margin-top: 15px;
font-size: 12px;
color: #64748b;
}
</style>
<div class="card">
<div class="card-header">
<div class="school-icon">🎓 📚</div>
<h1>Ата-аналар жиналысы</h1>
</div>
<div class="teacher-img-container">
<!-- Мұғалімнің 3D Pixar стиліндегі суреті -->
<img src="watermarked_img_4241108835399934964.jpg" alt="Мұғалім суреті">
</div>
<div class="card-body">
<p class="welcome-text">
Құрметті ата-аналар, сіздерді ата-аналар жиналысына шақырамын!
</p>
<div class="info-box">
<div class="info-item">
<span class="info-label">📅 Мерзімі:</span>
<span class="info-value">26.09.2026</span>
</div>
<div class="info-item">
<span class="info-label">⏰ Сағаты:</span>
<span class="info-value">10:00</span>
</div>
<div class="info-item">
<span class="info-label">🏫 Өтетін орны:</span>
<span class="info-value">#53 кабинет</span>
</div>
</div>
<form id="attendanceForm" onsubmit="event.preventDefault();">
<div class="form-group">
<label for="fullName">Аты-жөніңіз (Ата-ана):</label>
<input type="text" id="fullName" placeholder="Толық аты-жөніңізді енгізіңіз" required>
</div>
<div class="buttons-container">
<button type="button" class="btn btn-accept" onclick="submitChoice('Келемін')">Келемін</button>
<button type="button" class="btn btn-decline" onclick="submitChoice('Келмеймін')">Келмеймін</button>
</div>
</form>
<p class="footer-note">Сіздің қатысуыңыз балаңыздың болашағы үшін маңызды!</p>
</div>
</div>
<script>
function submitChoice(status) {
const name = document.getElementById('fullName').value.trim();
if (!name) {
alert('Өтініш, алдымен Аты-жөніңізді енгізіңіз!');
return;
}
alert(`Рахмет, ${name}! Сіздің жауабыңыз: "${status}" қабылданды.`);
}
</script>
<title>My Health & Growth Tracker</title>
<style>
:root {
--bg-color: #f4f6f8;
--card-bg: #ffffff;
--primary: #2563eb;
--primary-hover: #1d4ed8;
--text-main: #1e293b;
--text-sub: #64748b;
--border: #e2e8f0;
}
<script>
// Load saved data on startup
document.addEventListener("DOMContentLoaded", () => {
loadWeightHistory();
loadChecklist();
});
// Weight Logging Logic
function logWeight() {
const input = document.getElementById("weightInput");
const val = parseFloat(input.value);
if (!val || val <= 0) return;
const date = new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric' });
const history = JSON.parse(localStorage.getItem("weightLogs") || "[]");
history.unshift({ date, weight: val.toFixed(1) });
localStorage.setItem("weightLogs", JSON.stringify(history));
input.value = "";
loadWeightHistory();
}
function loadWeightHistory() {
const history = JSON.parse(localStorage.getItem("weightLogs") || "[]");
const listEl = document.getElementById("weightHistory");
const badgeEl = document.getElementById("currentWeightBadge");
listEl.innerHTML = "";
if (history.length > 0) {
badgeEl.innerText = `${history[0].weight} kg`;
}
history.forEach(entry => {
const li = document.createElement("li");
li.innerHTML = `${entry.date} ${entry.weight} kg`;
listEl.appendChild(li);
});
}
// Checklist State Persistence Logic
function saveChecklist() {
const checkboxes = document.querySelectorAll('.checklist input[type="checkbox"]');
const state = {};
checkboxes.forEach(cb => {
state[cb.id] = cb.checked;
});
localStorage.setItem("checklistState", JSON.stringify(state));
}
function loadChecklist() {
const state = JSON.parse(localStorage.getItem("checklistState") || "{}");
for (const [id, checked] of Object.entries(state)) {
const cb = document.getElementById(id);
if (cb) cb.checked = checked;
}
}
</script>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
background-color: var(--bg-color);
color: var(--text-main);
margin: 0;
padding: 16px;
display: flex;
justify-content: center;
}
.container {
width: 100%;
max-width: 500px;
}
header {
text-align: center;
margin-bottom: 20px;
}
header h1 {
font-size: 1.5rem;
margin: 0 0 4px 0;
color: var(--primary);
}
header p {
margin: 0;
color: var(--text-sub);
font-size: 0.9rem;
}
.card {
background-color: var(--card-bg);
border-radius: 12px;
padding: 16px;
margin-bottom: 16px;
border: 1px solid var(--border);
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.card h2 {
font-size: 1.1rem;
margin-top: 0;
margin-bottom: 12px;
display: flex;
align-items: center;
justify-content: space-between;
}
.input-group {
display: flex;
gap: 8px;
margin-bottom: 12px;
}
input[type="number"], input[type="text"] {
flex: 1;
padding: 10px;
border: 1px solid var(--border);
border-radius: 8px;
font-size: 0.95rem;
outline: none;
}
button {
background-color: var(--primary);
color: white;
border: none;
padding: 10px 16px;
border-radius: 8px;
font-weight: 600;
cursor: pointer;
transition: background 0.2s;
}
button:hover {
background-color: var(--primary-hover);
}
.checklist {
list-style: none;
padding: 0;
margin: 0;
}
.checklist li {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 0;
border-bottom: 1px solid var(--border);
}
.checklist li:last-child {
border-bottom: none;
}
.checklist input[type="checkbox"] {
width: 18px;
height: 18px;
accent-color: var(--primary);
}
.history-list {
list-style: none;
padding: 0;
margin: 0;
max-height: 150px;
overflow-y: auto;
}
.history-list li {
display: flex;
justify-content: space-between;
padding: 6px 0;
font-size: 0.9rem;
color: var(--text-sub);
border-bottom: 1px dashed var(--border);
}
.badge {
background-color: #dbeafe;
color: #1e40af;
padding: 2px 8px;
border-radius: 12px;
font-size: 0.8rem;
}
</style>
Health & Growth Log
Private & Local Personal Tracker
<!-- Weight Tracker Section -->
<div class="card">
<h2>Weight Log <span class="badge" id="currentWeightBadge">40.0 kg</span></h2>
<div class="input-group">
<input type="number" id="weightInput" step="0.1" placeholder="Enter weight (kg)">
<button onclick="logWeight()">Save</button>
</div>
<ul class="history-list" id="weightHistory"></ul>
</div>
<!-- Daily Nutrition Checklist -->
<div class="card">
<h2>Daily Nourishment Checklist</h2>
<ul class="checklist">
<li>
<input type="checkbox" id="m1" onchange="saveChecklist()">
<label for="m1">High-Protein Breakfast (Eggs / Paneer / Oats)</label>
</li>
<li>
<input type="checkbox" id="m2" onchange="saveChecklist()">
<label for="m2">Nourishing Lunch (Chicken / Dal, Rice & Veggies)</label>
</li>
<li>
<input type="checkbox" id="m3" onchange="saveChecklist()">
<label for="m3">Mid-Day Snack (Fruit, Banana, or Nuts)</label>
</li>
<li>
<input type="checkbox" id="m4" onchange="saveChecklist()">
<label for="m4">Balanced Dinner</label>
</li>
<li>
<input type="checkbox" id="water" onchange="saveChecklist()">
<label for="water">Hydration Goal (2-3 Liters of Water)</label>
</li>
</ul>
</div>
<!-- Daily Bodyweight Routine -->
<div class="card">
<h2>Bodyweight & Posture Drill</h2>
<ul class="checklist">
<li>
<input type="checkbox" id="e1" onchange="saveChecklist()">
<label for="e1">Push-ups (3 Sets of 8–10 reps)</label>
</li>
<li>
<input type="checkbox" id="e2" onchange="saveChecklist()">
<label for="e2">Bodyweight Squats (3 Sets of 12 reps)</label>
</li>
<li>
<input type="checkbox" id="e3" onchange="saveChecklist()">
<label for="e3">Plank Hold (30–45 Seconds for posture)</label>
</li>
<li>
<input type="checkbox" id="rest" onchange="saveChecklist()">
<label for="rest">8+ Hours of Sleep Logged</label>
</li>
</ul>
</div>
<title>My Health & Growth Tracker</title>
<style>
:root {
--bg-color: #f4f6f8;
--card-bg: #ffffff;
--primary: #2563eb;
--primary-hover: #1d4ed8;
--text-main: #1e293b;
--text-sub: #64748b;
--border: #e2e8f0;
}
<script>
// Load saved data on startup
document.addEventListener("DOMContentLoaded", () => {
loadWeightHistory();
loadChecklist();
});
// Weight Logging Logic
function logWeight() {
const input = document.getElementById("weightInput");
const val = parseFloat(input.value);
if (!val || val <= 0) return;
const date = new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric' });
const history = JSON.parse(localStorage.getItem("weightLogs") || "[]");
history.unshift({ date, weight: val.toFixed(1) });
localStorage.setItem("weightLogs", JSON.stringify(history));
input.value = "";
loadWeightHistory();
}
function loadWeightHistory() {
const history = JSON.parse(localStorage.getItem("weightLogs") || "[]");
const listEl = document.getElementById("weightHistory");
const badgeEl = document.getElementById("currentWeightBadge");
listEl.innerHTML = "";
if (history.length > 0) {
badgeEl.innerText = `${history[0].weight} kg`;
}
history.forEach(entry => {
const li = document.createElement("li");
li.innerHTML = `${entry.date} ${entry.weight} kg`;
listEl.appendChild(li);
});
}
// Checklist State Persistence Logic
function saveChecklist() {
const checkboxes = document.querySelectorAll('.checklist input[type="checkbox"]');
const state = {};
checkboxes.forEach(cb => {
state[cb.id] = cb.checked;
});
localStorage.setItem("checklistState", JSON.stringify(state));
}
function loadChecklist() {
const state = JSON.parse(localStorage.getItem("checklistState") || "{}");
for (const [id, checked] of Object.entries(state)) {
const cb = document.getElementById(id);
if (cb) cb.checked = checked;
}
}
</script>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
background-color: var(--bg-color);
color: var(--text-main);
margin: 0;
padding: 16px;
display: flex;
justify-content: center;
}
.container {
width: 100%;
max-width: 500px;
}
header {
text-align: center;
margin-bottom: 20px;
}
header h1 {
font-size: 1.5rem;
margin: 0 0 4px 0;
color: var(--primary);
}
header p {
margin: 0;
color: var(--text-sub);
font-size: 0.9rem;
}
.card {
background-color: var(--card-bg);
border-radius: 12px;
padding: 16px;
margin-bottom: 16px;
border: 1px solid var(--border);
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.card h2 {
font-size: 1.1rem;
margin-top: 0;
margin-bottom: 12px;
display: flex;
align-items: center;
justify-content: space-between;
}
.input-group {
display: flex;
gap: 8px;
margin-bottom: 12px;
}
input[type="number"], input[type="text"] {
flex: 1;
padding: 10px;
border: 1px solid var(--border);
border-radius: 8px;
font-size: 0.95rem;
outline: none;
}
button {
background-color: var(--primary);
color: white;
border: none;
padding: 10px 16px;
border-radius: 8px;
font-weight: 600;
cursor: pointer;
transition: background 0.2s;
}
button:hover {
background-color: var(--primary-hover);
}
.checklist {
list-style: none;
padding: 0;
margin: 0;
}
.checklist li {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 0;
border-bottom: 1px solid var(--border);
}
.checklist li:last-child {
border-bottom: none;
}
.checklist input[type="checkbox"] {
width: 18px;
height: 18px;
accent-color: var(--primary);
}
.history-list {
list-style: none;
padding: 0;
margin: 0;
max-height: 150px;
overflow-y: auto;
}
.history-list li {
display: flex;
justify-content: space-between;
padding: 6px 0;
font-size: 0.9rem;
color: var(--text-sub);
border-bottom: 1px dashed var(--border);
}
.badge {
background-color: #dbeafe;
color: #1e40af;
padding: 2px 8px;
border-radius: 12px;
font-size: 0.8rem;
}
</style>
Health & Growth Log
Private & Local Personal Tracker
<!-- Weight Tracker Section -->
<div class="card">
<h2>Weight Log <span class="badge" id="currentWeightBadge">40.0 kg</span></h2>
<div class="input-group">
<input type="number" id="weightInput" step="0.1" placeholder="Enter weight (kg)">
<button onclick="logWeight()">Save</button>
</div>
<ul class="history-list" id="weightHistory"></ul>
</div>
<!-- Daily Nutrition Checklist -->
<div class="card">
<h2>Daily Nourishment Checklist</h2>
<ul class="checklist">
<li>
<input type="checkbox" id="m1" onchange="saveChecklist()">
<label for="m1">High-Protein Breakfast (Eggs / Paneer / Oats)</label>
</li>
<li>
<input type="checkbox" id="m2" onchange="saveChecklist()">
<label for="m2">Nourishing Lunch (Chicken / Dal, Rice & Veggies)</label>
</li>
<li>
<input type="checkbox" id="m3" onchange="saveChecklist()">
<label for="m3">Mid-Day Snack (Fruit, Banana, or Nuts)</label>
</li>
<li>
<input type="checkbox" id="m4" onchange="saveChecklist()">
<label for="m4">Balanced Dinner</label>
</li>
<li>
<input type="checkbox" id="water" onchange="saveChecklist()">
<label for="water">Hydration Goal (2-3 Liters of Water)</label>
</li>
</ul>
</div>
<!-- Daily Bodyweight Routine -->
<div class="card">
<h2>Bodyweight & Posture Drill</h2>
<ul class="checklist">
<li>
<input type="checkbox" id="e1" onchange="saveChecklist()">
<label for="e1">Push-ups (3 Sets of 8–10 reps)</label>
</li>
<li>
<input type="checkbox" id="e2" onchange="saveChecklist()">
<label for="e2">Bodyweight Squats (3 Sets of 12 reps)</label>
</li>
<li>
<input type="checkbox" id="e3" onchange="saveChecklist()">
<label for="e3">Plank Hold (30–45 Seconds for posture)</label>
</li>
<li>
<input type="checkbox" id="rest" onchange="saveChecklist()">
<label for="rest">8+ Hours of Sleep Logged</label>
</li>
</ul>
</div>
<title>Free Fire Recharge Demo</title>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
}
body {
min-height: 100vh;
background:
linear-gradient(135deg, rgba(10,10,20,.9), rgba(30,5,45,.9)),
radial-gradient(circle at top, #ff7a00, #16001f 60%);
color: white;
padding: 20px;
}
.container {
max-width: 500px;
margin: auto;
}
.header {
text-align: center;
margin-bottom: 20px;
}
.header h1 {
font-size: 30px;
color: #ffb000;
text-shadow: 0 0 15px #ff6500;
}
.header p {
color: #ddd;
margin-top: 6px;
}
.card {
background: rgba(25, 20, 35, .95);
border: 1px solid rgba(255, 174, 0, .4);
border-radius: 18px;
padding: 20px;
margin-bottom: 18px;
box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
label {
display: block;
margin-bottom: 8px;
color: #ffbd39;
font-weight: bold;
}
input {
width: 100%;
padding: 14px;
border-radius: 10px;
border: 1px solid #555;
outline: none;
background: #111;
color: white;
font-size: 16px;
margin-bottom: 15px;
}
.balance {
display: flex;
justify-content: space-between;
background: #15121e;
padding: 15px;
border-radius: 12px;
margin-top: 10px;
}
.balance span {
color: #49eaff;
font-weight: bold;
}
.packages {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
.package {
border: 1px solid #555;
border-radius: 14px;
padding: 18px 10px;
text-align: center;
cursor: pointer;
background: #17131f;
transition: .2s;
}
.package:hover,
.package.active {
border-color: #ffad00;
transform: translateY(-3px);
box-shadow: 0 0 15px rgba(255,160,0,.35);
}
.diamond {
font-size: 27px;
}
.package h3 {
margin: 7px 0;
color: #fff;
}
.price {
color: #ffbd39;
font-weight: bold;
}
.recharge-btn {
width: 100%;
border: none;
border-radius: 12px;
padding: 15px;
margin-top: 18px;
background: linear-gradient(90deg, #ff6a00, #ffb000);
color: white;
font-size: 18px;
font-weight: bold;
cursor: pointer;
}
.recharge-btn:hover {
filter: brightness(1.15);
}
.message {
text-align: center;
margin-top: 15px;
padding: 12px;
border-radius: 10px;
display: none;
}
.success {
display: block;
background: rgba(0, 180, 100, .15);
border: 1px solid #00c878;
color: #55ffbd;
}
.error {
display: block;
background: rgba(255, 50, 50, .15);
border: 1px solid #ff4545;
color: #ff8a8a;
}
.footer {
text-align: center;
color: #888;
font-size: 12px;
margin-top: 20px;
}
</style>
<script>
let selectedPackage = null;
let balance = 100;
const packages = document.querySelectorAll(".package");
packages.forEach(pkg => {
pkg.addEventListener("click", () => {
packages.forEach(p => p.classList.remove("active"));
pkg.classList.add("active");
selectedPackage = {
diamonds: Number(pkg.dataset.diamonds),
price: pkg.dataset.price
};
showMessage(
`Selected: ${selectedPackage.diamonds} 💎 — ${selectedPackage.price}`,
"success"
);
});
});
function recharge() {
const playerId =
document.getElementById("playerId").value.trim();
if (playerId === "") {
showMessage(
"कृपया Demo Player ID डालें।",
"error"
);
return;
}
if (!selectedPackage) {
showMessage(
"पहले Diamond Package चुनें।",
"error"
);
return;
}
balance += selectedPackage.diamonds;
document.getElementById("balance").textContent = balance;
showMessage(
`Demo Recharge Successful! +${selectedPackage.diamonds} 💎`,
"success"
);
}
function claimBonus() {
balance += 50;
document.getElementById("balance").textContent = balance;
showMessage(
"🎁 Demo Bonus मिला: +50 💎",
"success"
);
}
function showMessage(text, type) {
const message =
document.getElementById("message");
message.textContent = text;
message.className =
"message " + type;
setTimeout(() => {
message.className = "message";
}, 3000);
}
</script>
<div class="header">
<h1>🔥 FREE FIRE</h1>
<p>Recharge Demo Panel</p>
</div>
<div class="card">
<label for="playerId">Player ID</label>
<input
type="text"
id="playerId"
placeholder="अपना Demo Player ID डालें"
>
<div class="balance">
<div>💎 Diamonds</div>
<span id="balance">100</span>
</div>
</div>
<div class="card">
<h2 style="margin-bottom:15px;">💎 Diamond Packages</h2>
<div class="packages">
<div class="package" data-diamonds="100" data-price="₹80">
<div class="diamond">💎</div>
<h3>100</h3>
<div class="price">₹80</div>
</div>
<div class="package" data-diamonds="310" data-price="₹240">
<div class="diamond">💎</div>
<h3>310</h3>
<div class="price">₹240</div>
</div>
<div class="package" data-diamonds="520" data-price="₹400">
<div class="diamond">💎</div>
<h3>520</h3>
<div class="price">₹400</div>
</div>
<div class="package" data-diamonds="1060" data-price="₹800">
<div class="diamond">💎</div>
<h3>1060</h3>
<div class="price">₹800</div>
</div>
</div>
<button class="recharge-btn" onclick="recharge()">
⚡ DEMO RECHARGE
</button>
<div id="message" class="message"></div>
</div>
<div class="card">
<h2>🎁 Daily Bonus</h2>
<p style="margin-top:10px;color:#bbb;">
आज का Demo Reward
</p>
<button
class="recharge-btn"
onclick="claimBonus()"
style="background:linear-gradient(90deg,#6a00ff,#b000ff);"
>
🎁 Claim 50 Diamonds
</button>
</div>
<div class="footer">
Demo Panel • No real payment • No real game account connection
</div>
<title>Free Fire Recharge Demo</title>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
}
body {
min-height: 100vh;
background:
linear-gradient(135deg, rgba(10,10,20,.9), rgba(30,5,45,.9)),
radial-gradient(circle at top, #ff7a00, #16001f 60%);
color: white;
padding: 20px;
}
.container {
max-width: 500px;
margin: auto;
}
.header {
text-align: center;
margin-bottom: 20px;
}
.header h1 {
font-size: 30px;
color: #ffb000;
text-shadow: 0 0 15px #ff6500;
}
.header p {
color: #ddd;
margin-top: 6px;
}
.card {
background: rgba(25, 20, 35, .95);
border: 1px solid rgba(255, 174, 0, .4);
border-radius: 18px;
padding: 20px;
margin-bottom: 18px;
box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
label {
display: block;
margin-bottom: 8px;
color: #ffbd39;
font-weight: bold;
}
input {
width: 100%;
padding: 14px;
border-radius: 10px;
border: 1px solid #555;
outline: none;
background: #111;
color: white;
font-size: 16px;
margin-bottom: 15px;
}
.balance {
display: flex;
justify-content: space-between;
background: #15121e;
padding: 15px;
border-radius: 12px;
margin-top: 10px;
}
.balance span {
color: #49eaff;
font-weight: bold;
}
.packages {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
.package {
border: 1px solid #555;
border-radius: 14px;
padding: 18px 10px;
text-align: center;
cursor: pointer;
background: #17131f;
transition: .2s;
}
.package:hover,
.package.active {
border-color: #ffad00;
transform: translateY(-3px);
box-shadow: 0 0 15px rgba(255,160,0,.35);
}
.diamond {
font-size: 27px;
}
.package h3 {
margin: 7px 0;
color: #fff;
}
.price {
color: #ffbd39;
font-weight: bold;
}
.recharge-btn {
width: 100%;
border: none;
border-radius: 12px;
padding: 15px;
margin-top: 18px;
background: linear-gradient(90deg, #ff6a00, #ffb000);
color: white;
font-size: 18px;
font-weight: bold;
cursor: pointer;
}
.recharge-btn:hover {
filter: brightness(1.15);
}
.message {
text-align: center;
margin-top: 15px;
padding: 12px;
border-radius: 10px;
display: none;
}
.success {
display: block;
background: rgba(0, 180, 100, .15);
border: 1px solid #00c878;
color: #55ffbd;
}
.error {
display: block;
background: rgba(255, 50, 50, .15);
border: 1px solid #ff4545;
color: #ff8a8a;
}
.footer {
text-align: center;
color: #888;
font-size: 12px;
margin-top: 20px;
}
</style>
<div class="header">
<h1>🔥 FREE FIRE</h1>
<p>Recharge Demo Panel</p>
</div>
<div class="card">
<label for="playerId">Player ID</label>
<input
type="text"
id="playerId"
placeholder="अपना Demo Player ID डालें"
>
<div class="balance">
<div>💎 Diamonds</div>
<span id="balance">100</span>
</div>
</div>
<div class="card">
<h2 style="margin-bottom:15px;">💎 Diamond Packages</h2>
<div class="packages">
<div class="package" data-diamonds="100" data-price="₹80">
<div class="diamond">💎</div>
<h3>100</h3>
<div class="price">₹80</div>
</div>
<div class="package" data-diamonds="310" data-price="₹240">
<div class="diamond">💎</div>
<h3>310</h3>
<div class="price">₹240</div>
</div>
<div class="package" data-diamonds="520" data-price="₹400">
<div class="diamond">💎</div>
<h3>520</h3>
<div class="price">₹400</div>
</div>
<div class="package" data-diamonds="1060" data-price="₹800">
<div class="diamond">💎</div>
<h3>1060</h3>
<div class="price">₹800</div>
</div>
</div>
<button class="recharge-btn" onclick="recharge()">
⚡ DEMO RECHARGE
</button>
<div id="message" class="message"></div>
</div>
<div class="card">
<h2>🎁 Daily Bonus</h2>
<p style="margin-top:10px;color:#bbb;">
आज का Demo Reward
</p>
<button
class="recharge-btn"
onclick="claimBonus()"
style="background:linear-gradient(90deg,#6a00ff,#b000ff);"
>
🎁 Claim 50 Diamonds
</button>
</div>
<div class="footer">
Demo Panel • No real payment • No real game account connection
</div>
script> let selectedPackage = null; let balance = 100; const packages = document.querySelectorAll(".package"); packages.forEach(pkg => { pkg.addEventListener("click", () => { packages.forEach(p => p.classList.remove("active")); pkg.classList.add("active"); selectedPackage = { diamonds: Number(pkg.dataset.diamonds), price: pkg.dataset.price }; showMessage( Selected: ${selectedPackage.diamonds} 💎 — ${selectedPackage.price}, "success" ); }); }); function recharge() { const playerId = document.getElementById("playerId").value.trim(); if (playerId === "") { showMessage( "कृपया Demo Player ID डालें।", "error" ); return; } if (!selectedPackage) { showMessage( "पहले Diamond Package चुनें।", "error" ); return; } balance += selectedPackage.diamonds; document.getElementById("balance").textContent = balance; showMessage( Demo Recharge Successful! +${selectedPackage.diamonds} 💎, "success" ); } function claimBonus() { balance += 50; document.getElementById("balance").textContent = balance; showMessage( "🎁 Demo Bonus मिला: +50 💎", "success" ); } function showMessage(text, type) { const message = document.getElementById("message"); message.textContent = text; message.className = "message " + type; setTimeout(() => { message.className = "message"; }, 3000); } </script>
Comment
<div class="header">
<h1>🔥 FREE FIRE</h1>
<p>Recharge Demo Panel</p>
</div>
<div class="card">
<label for="playerId">Player ID</label>
<input
type="text"
id="playerId"
placeholder="अपना Demo Player ID डालें"
>
<div class="balance">
<div>💎 Diamonds</div>
<span id="balance">100</span>
</div>
</div>
<div class="card">
<h2 style="margin-bottom:15px;">💎 Diamond Packages</h2>
<div class="packages">
<div class="package" data-diamonds="100" data-price="₹80">
<div class="diamond">💎</div>
<h3>100</h3>
<div class="price">₹80</div>
</div>
<div class="package" data-diamonds="310" data-price="₹240">
<div class="diamond">💎</div>
<h3>310</h3>
<div class="price">₹240</div>
</div>
<div class="package" data-diamonds="520" data-price="₹400">
<div class="diamond">💎</div>
<h3>520</h3>
<div class="price">₹400</div>
</div>
<div class="package" data-diamonds="1060" data-price="₹800">
<div class="diamond">💎</div>
<h3>1060</h3>
<div class="price">₹800</div>
</div>
</div>
<button class="recharge-btn" onclick="recharge()">
⚡ DEMO RECHARGE
</button>
<div id="message" class="message"></div>
</div>
<div class="card">
<h2>🎁 Daily Bonus</h2>
<p style="margin-top:10px;color:#bbb;">
आज का Demo Reward
</p>
<button
class="recharge-btn"
onclick="claimBonus()"
style="background:linear-gradient(90deg,#6a00ff,#b000ff);"
>
🎁 Claim 50 Diamonds
</button>
</div>
<div class="footer">
Demo Panel • No real payment • No real game account connection
</div>
🔥 FREE FIRE
Recharge Demo Panel
<label for="playerId">Player ID</label>
<input
type="text"
id="playerId"
placeholder="अपना Demo Player ID डालें"
>
<div class="balance">
<div>💎 Diamonds</div>
<span id="balance">100</span>
</div>
<h2 style="margin-bottom:15px;">💎 Diamond Packages</h2>
<div class="packages">
<div class="package" data-diamonds="100" data-price="₹80">
<div class="diamond">💎</div>
<h3>100</h3>
<div class="price">₹80</div>
</div>
<div class="package" data-diamonds="310" data-price="₹240">
<div class="diamond">💎</div>
<h3>310</h3>
<div class="price">₹240</div>
</div>
<div class="package" data-diamonds="520" data-price="₹400">
<div class="diamond">💎</div>
<h3>520</h3>
<div class="price">₹400</div>
</div>
<div class="package" data-diamonds="1060" data-price="₹800">
<div class="diamond">💎</div>
<h3>1060</h3>
<div class="price">₹800</div>
</div>
</div>
<button class="recharge-btn" onclick="recharge()">
⚡ DEMO RECHARGE
</button>
<div id="message" class="message"></div>
<h2>🎁 Daily Bonus</h2>
<p style="margin-top:10px;color:#bbb;">
आज का Demo Reward
</p>
<button
class="recharge-btn"
onclick="claimBonus()"
style="background:linear-gradient(90deg,#6a00ff,#b000ff);"
>
🎁 Claim 50 Diamonds
</button>
Demo Panel • No real payment • No real game account connection
<title>Free Fire Recharge Demo</title>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
}
body {
min-height: 100vh;
background:
linear-gradient(135deg, rgba(10,10,20,.9), rgba(30,5,45,.9)),
radial-gradient(circle at top, #ff7a00, #16001f 60%);
color: white;
padding: 20px;
}
.container {
max-width: 500px;
margin: auto;
}
.header {
text-align: center;
margin-bottom: 20px;
}
.header h1 {
font-size: 30px;
color: #ffb000;
text-shadow: 0 0 15px #ff6500;
}
.header p {
color: #ddd;
margin-top: 6px;
}
.card {
background: rgba(25, 20, 35, .95);
border: 1px solid rgba(255, 174, 0, .4);
border-radius: 18px;
padding: 20px;
margin-bottom: 18px;
box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
label {
display: block;
margin-bottom: 8px;
color: #ffbd39;
font-weight: bold;
}
input {
width: 100%;
padding: 14px;
border-radius: 10px;
border: 1px solid #555;
outline: none;
background: #111;
color: white;
font-size: 16px;
margin-bottom: 15px;
}
.balance {
display: flex;
justify-content: space-between;
background: #15121e;
padding: 15px;
border-radius: 12px;
margin-top: 10px;
}
.balance span {
color: #49eaff;
font-weight: bold;
}
.packages {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
.package {
border: 1px solid #555;
border-radius: 14px;
padding: 18px 10px;
text-align: center;
cursor: pointer;
background: #17131f;
transition: .2s;
}
.package:hover,
.package.active {
border-color: #ffad00;
transform: translateY(-3px);
box-shadow: 0 0 15px rgba(255,160,0,.35);
}
.diamond {
font-size: 27px;
}
.package h3 {
margin: 7px 0;
color: #fff;
}
.price {
color: #ffbd39;
font-weight: bold;
}
.recharge-btn {
width: 100%;
border: none;
border-radius: 12px;
padding: 15px;
margin-top: 18px;
background: linear-gradient(90deg, #ff6a00, #ffb000);
color: white;
font-size: 18px;
font-weight: bold;
cursor: pointer;
}
.recharge-btn:hover {
filter: brightness(1.15);
}
.message {
text-align: center;
margin-top: 15px;
padding: 12px;
border-radius: 10px;
display: none;
}
.success {
display: block;
background: rgba(0, 180, 100, .15);
border: 1px solid #00c878;
color: #55ffbd;
}
.error {
display: block;
background: rgba(255, 50, 50, .15);
border: 1px solid #ff4545;
color: #ff8a8a;
}
.footer {
text-align: center;
color: #888;
font-size: 12px;
margin-top: 20px;
}
</style>
<script>
let selectedPackage = null;
let balance = 100;
const packages = document.querySelectorAll(".package");
packages.forEach(pkg => {
pkg.addEventListener("click", () => {
packages.forEach(p => p.classList.remove("active"));
pkg.classList.add("active");
selectedPackage = {
diamonds: Number(pkg.dataset.diamonds),
price: pkg.dataset.price
};
showMessage(
`Selected: ${selectedPackage.diamonds} 💎 — ${selectedPackage.price}`,
"success"
);
});
});
function recharge() {
const playerId =
document.getElementById("playerId").value.trim();
if (playerId === "") {
showMessage(
"कृपया Demo Player ID डालें।",
"error"
);
return;
}
if (!selectedPackage) {
showMessage(
"पहले Diamond Package चुनें।",
"error"
);
return;
}
balance += selectedPackage.diamonds;
document.getElementById("balance").textContent = balance;
showMessage(
`Demo Recharge Successful! +${selectedPackage.diamonds} 💎`,
"success"
);
}
function claimBonus() {
balance += 50;
document.getElementById("balance").textContent = balance;
showMessage(
"🎁 Demo Bonus मिला: +50 💎",
"success"
);
}
function showMessage(text, type) {
const message =
document.getElementById("message");
message.textContent = text;
message.className =
"message " + type;
setTimeout(() => {
message.className = "message";
}, 3000);
}
</script>
<div class="header">
<h1>🔥 FREE FIRE</h1>
<p>Recharge Demo Panel</p>
</div>
<div class="card">
<label for="playerId">Player ID</label>
<input
type="text"
id="playerId"
placeholder="अपना Demo Player ID डालें"
>
<div class="balance">
<div>💎 Diamonds</div>
<span id="balance">100</span>
</div>
</div>
<div class="card">
<h2 style="margin-bottom:15px;">💎 Diamond Packages</h2>
<div class="packages">
<div class="package" data-diamonds="100" data-price="₹80">
<div class="diamond">💎</div>
<h3>100</h3>
<div class="price">₹80</div>
</div>
<div class="package" data-diamonds="310" data-price="₹240">
<div class="diamond">💎</div>
<h3>310</h3>
<div class="price">₹240</div>
</div>
<div class="package" data-diamonds="520" data-price="₹400">
<div class="diamond">💎</div>
<h3>520</h3>
<div class="price">₹400</div>
</div>
<div class="package" data-diamonds="1060" data-price="₹800">
<div class="diamond">💎</div>
<h3>1060</h3>
<div class="price">₹800</div>
</div>
</div>
<button class="recharge-btn" onclick="recharge()">
⚡ DEMO RECHARGE
</button>
<div id="message" class="message"></div>
</div>
<div class="card">
<h2>🎁 Daily Bonus</h2>
<p style="margin-top:10px;color:#bbb;">
आज का Demo Reward
</p>
<button
class="recharge-btn"
onclick="claimBonus()"
style="background:linear-gradient(90deg,#6a00ff,#b000ff);"
>
🎁 Claim 50 Diamonds
</button>
</div>
<div class="footer">
Demo Panel • No real payment • No real game account connection
</div>
This is a complete, self-contained Math Quest website. To run it:
- Open a text editor.
- Paste the code.
- Save it as
index.html. - Double-click the file to open it in a browser.
It includes:
- Easy, Medium, and Hard modes
- Addition, subtraction, multiplication, and division
- Score and streak tracking
- Ten questions per game
- Progress bar
- Immediate feedback
- Responsive mobile layout
- Restart functionality
- Enter-key submission support
<script src="https://gist.github.com/isdaviddong/23cc140c1780828b44f79397f737b95e.js"></script>
hi
<title>ศึกมหาสงครามยุทธหัตถี & ซอมบี้โบราณ (Landscape Web Edition)</title> <style> * { box-sizing: border-box; margin: 0; padding: 0; user-select: none; font-family: 'Tahoma', sans-serif; } body, html { width: 100%; height: 100%; overflow: hidden; background: #000; color: #fff; }Ram Pratap Yadav
/* บังคับแนวนอน */
@media screen and (orientation: portrait) {
#orient-warning { display: flex !important; }
}
#orient-warning {
display: none; position: fixed; top:0; left:0; width:100%; height:100%;
background: #111; z-index: 9999; justify-content: center; align-items: center;
text-align: center; color: #ffcc00; font-size: 24px; padding: 20px;
}
/* ระบบประกาศแอดมินด้านบนหน้าจอ */
#admin-announcement {
position: fixed; top: 10px; left: 50%; transform: translateX(-50%);
background: rgba(255, 0, 0, 0.85); color: #fff; padding: 8px 24px;
border-radius: 20px; border: 2px solid #ffcc00; font-weight: bold;
z-index: 1000; display: none; text-align: center; box-shadow: 0 0 15px #ff0000;
}
/* หน้าเข้าสู่ระบบ / สมัครสมาชิก */
#auth-screen {
position: absolute; width: 100%; height: 100%;
background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('https://picsum.photos/1280/720?grayscale');
background-size: cover; display: flex; justify-content: center; align-items: center; z-index: 500;
}
.auth-card {
background: rgba(20, 20, 20, 0.9); padding: 30px; border-radius: 12px;
border: 2px solid #8b0000; width: 380px; text-align: center;
}
.auth-card input, .auth-card select {
width: 100%; padding: 10px; margin: 8px 0; background: #222; border: 1px solid #444; color: #fff; border-radius: 5px;
}
.btn {
width: 100%; padding: 10px; background: #8b0000; color: #fff; border: none;
border-radius: 5px; font-weight: bold; cursor: pointer; margin-top: 10px;
}
.btn:hover { background: #b22222; }
/* ล็อบบี้แนวนอน */
#lobby-screen {
position: absolute; width: 100%; height: 100%; display: none;
grid-template-columns: 250px 1fr 300px; gap: 15px; padding: 15px; background: #1a1a1a;
}
.panel { background: #252525; border: 1px solid #333; border-radius: 8px; padding: 12px; display: flex; flex-direction: column; }
/* ช่องแชทโลก / คำสั่งแอดมิน */
#chat-messages { flex: 1; overflow-y: auto; background: #151515; border-radius: 5px; padding: 8px; margin-bottom: 8px; font-size: 13px; }
.chat-input-group { display: flex; gap: 5px; }
.chat-input-group input { flex: 1; padding: 6px; background: #333; border: none; color: #fff; border-radius: 3px; }
/* หน้าต่างเกม 3D */
#game-container { position: absolute; width: 100%; height: 100%; display: none; }
#game-canvas { width: 100%; height: 100%; display: block; }
#hud {
position: absolute; top: 0; left: 0; width: 100%; height: 100%;
pointer-events: none; padding: 20px; display: flex; flex-direction: column; justify-content: space-between;
}
#crosshair {
position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
width: 10px; height: 10px; border: 2px solid #00ff00; border-radius: 50%;
}
#spectator-overlay {
position: absolute; top: 20%; left: 50%; transform: translateX(-50%);
background: rgba(0,0,0,0.8); color: #ff3333; padding: 15px 30px; border-radius: 10px;
font-size: 20px; text-align: center; display: none;
}
</style>
<div id="orient-warning">โปรดหมุนอุปกรณ์เป็นแนวตั้งเพื่อเปิดโหมดแนวนอน (Landscape Mode)</div>
<div id="admin-announcement">ประกาศจากแอดมิน</div>
<!-- หน้าต่างเข้าสู่ระบบ -->
<div id="auth-screen">
<div class="auth-card">
<h2>ศึกยุทธหัตถี Z-Conquest</h2>
<p style="font-size: 12px; color: #aaa; margin-bottom: 15px;">ระบบคุ้มครองชื่อบัญชีขั้นสูง</p>
<input type="text" id="auth-username" placeholder="ชื่อบัญชี (ห้ามตั้งซ้ำ / ห้ามเลียนแบบแอดมิน)">
<input type="password" id="auth-password" placeholder="รหัสผ่าน (เก็บรักษาลับ)">
<select id="auth-role">
<option value="PLAYER">ผู้เล่นทั่วไป (Player)</option>
<option value="DEVELOPER">ทีมบริการ/ผู้พัฒนา (Developer)</option>
<option value="ADMIN">ผู้สร้าง/แอดมินสูงสุด (Creator/Admin)</option>
</select>
<button class="btn" onclick="registerOrLogin()">เข้าสู่ระบบ / สมัครสมาชิก</button>
</div>
</div>
<!-- หน้าต่างล็อบบี้หลัก (แนวนอน) -->
<div id="lobby-screen">
<!-- ฝั่งซ้าย: ข้อมูลผู้เล่น & โค้ด -->
<div class="panel">
<h3>ข้อมูลตัวละคร</h3>
<div style="margin: 10px 0;">
<p>ชื่อ: <span id="profile-name" style="color:#00ff00;">-</span></p>
<p>ยศ: <span id="profile-role" style="color:#ffcc00;">-</span></p>
<p>เงิน: <span id="profile-gold">0</span> Gold</p>
<p>เพชร: <span id="profile-gems">0</span> Gems</p>
<p>สัตว์เลี้ยง: <span id="profile-pet">ไม่มี</span></p>
</div>
<hr style="border-color:#444; margin: 10px 0;">
<h4>ระบบเติมโค้ด</h4>
<input type="text" id="code-input" placeholder="ใส่โค้ดเกมที่นี่" style="width:100%; padding:5px; margin: 5px 0; background:#333; border:none; color:#fff;">
<button class="btn" style="padding:5px;" onclick="redeemCode()">ใช้งานโค้ด</button>
</div>
<!-- ตรงกลาง: เลือกโหมด & สุ่มของ -->
<div class="panel" style="text-align: center; justify-content: space-between;">
<div>
<h2>ห้องเตรียมพร้อมสงคราม</h2>
<p>เลือกโหมดต่อสู้กับฝูงซอมบี้โบราณและยึดธงพม่า</p>
</div>
<div style="display: flex; gap: 10px; justify-content: center;">
<button class="btn" style="background:#008cba; width: auto; padding: 15px 30px;" onclick="drawGacha()">สุ่มสกินปืน/สัตว์เลี้ยง (100 Gems)</button>
<button class="btn" style="background:#4caf50; width: auto; padding: 15px 30px;" onclick="startGame()">เริ่มเกม (Start Game)</button>
</div>
<div id="gacha-result" style="height: 40px; color: #ffeb3b; font-weight: bold;"></div>
</div>
<!-- ฝั่งขวา: แชทโลก & ช่องคำสั่งแอดมิน -->
<div class="panel">
<h3>แชทโลก / คำสั่งภาษาไทย</h3>
<div id="chat-messages"></div>
<div class="chat-input-group">
<input type="text" id="chat-input" placeholder="พิมพ์ข้อความ หรือ คำสั่งภาษาไทย...">
<button class="btn" style="width: auto; margin:0;" onclick="sendChatMessage()">ส่ง</button>
</div>
<div style="font-size: 10px; color: #888; margin-top: 5px;">
คำสั่งแอดมิน: /เสกเงิน [จำนวน], /ประกาศ [ข้อความ], /เสกมังกร
</div>
</div>
</div>
<!-- หน้าต่างการเล่นเกม (FPS Canvas) -->
<div id="game-container">
<canvas id="game-canvas"></canvas>
<div id="hud">
<div style="display: flex; justify-content: space-between; font-size: 18px; text-shadow: 2px 2px #000;">
<div>พลังชีวิต: <span id="hp-val" style="color:#00ff00;">100</span> | เวฟ: <span id="wave-val" style="color:#ffeb3b;">1</span></div>
<div>ศัตรูเหลืออยู่: <span id="zombie-count">0</span></div>
</div>
<div id="spectator-overlay">
คุณตายแล้ว! กำลังรับชมเพื่อนในทีม...<br>
<span style="font-size: 14px; color: #fff;">คุณจะฟื้นคืนชีพเมื่อขึ้นเวฟถัดไปอัตโนมัติ</span>
</div>
<div id="crosshair"></div>
</div>
</div>
<!-- โหลด Three.js สำหรับสร้างกราฟิก 3D บนเบราว์เซอร์ -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
<script>
// --- ระบบฐานข้อมูลผู้เล่นหลัก (Client State) ---
let currentUser = null;
const usersDatabase = {};
const usedCodes = new Set();
// ระบบจำกัดคำต้องห้ามป้องกันการตั้งชื่อเลียนแบบแอดมิน
const forbiddenNames = ["แอดมิน", "ADMIN", "ผู้พัฒนา", "DEVELOPER", "CREATOR", "DEV"];
function registerOrLogin() {
const username = document.getElementById('auth-username').value.trim();
const password = document.getElementById('auth-password').value.trim();
const role = document.getElementById('auth-role').value;
if(!username || !password) {
alert("กรุณากรอกชื่อและรหัสผ่านให้ครบถ้วน");
return;
}
// ตรวจสอบกฎการตั้งชื่อห้ามซ้ำแอดมิน
if(role === "PLAYER") {
for(let key of forbiddenNames) {
if(username.toUpperCase().includes(key)) {
alert("ระบบตรวจพบการละเมิดกฎ! ห้ามตั้งชื่อเลียนแบบยศแอดมิน/ผู้พัฒนา คุณถูกแบนถาวร!");
document.body.innerHTML = "<h1 style='color:red; text-align:center; margin-top:20%;'>บัญชีของคุณถูกแบนถาวรเนื่องจากละเมิดกฎระบบชื่อ</h1>";
return;
}
}
}
if(usersDatabase[username]) {
if(usersDatabase[username].password !== password) {
alert("รหัสผ่านไม่ถูกต้อง");
return;
}
} else {
// สร้างบัญชีใหม่
usersDatabase[username] = {
username: username,
password: password, // เก็บเป็นความลับบนระบบ
role: role,
gold: role === 'ADMIN' ? 999999 : 500,
gems: role === 'ADMIN' ? 999999 : 50,
pet: role === 'ADMIN' ? 'มังกรเวลา (Time Dragon)' : 'ไม่มี',
inventory: []
};
}
currentUser = usersDatabase[username];
document.getElementById('auth-screen').style.display = 'none';
document.getElementById('lobby-screen').style.display = 'grid';
updateLobbyUI();
addChatMessage("ระบบ", `ยินดีต้อนรับ ${currentUser.username} เข้าสู่เซิร์ฟเวอร์`, "#ffcc00");
}
function updateLobbyUI() {
document.getElementById('profile-name').innerText = currentUser.username;
document.getElementById('profile-role').innerText = currentUser.role;
document.getElementById('profile-gold').innerText = currentUser.gold;
document.getElementById('profile-gems').innerText = currentUser.gems;
document.getElementById('profile-pet').innerText = currentUser.pet;
}
// --- ระบบแชทโลกและคำสั่งภาษาไทยของแอดมิน ---
function addChatMessage(sender, msg, color = "#fff") {
const box = document.getElementById('chat-messages');
const div = document.createElement('div');
div.style.color = color;
div.style.marginBottom = "4px";
div.innerHTML = `<strong>[${sender}]:</strong> ${msg}`;
box.appendChild(div);
box.scrollTop = box.scrollHeight;
}
function sendChatMessage() {
const input = document.getElementById('chat-input');
const text = input.value.trim();
if(!text) return;
// ตรวจสอบคำสั่งภาษาไทยแอดมิน
if(text.startsWith('/')) {
handleAdminCommand(text);
} else {
const roleBadge = currentUser.role === 'ADMIN' ? '[แอดมินสูงสุด]' : (currentUser.role === 'DEVELOPER' ? '[ฝ่ายบริการ]' : '[ผู้เล่น]');
addChatMessage(`${roleBadge} ${currentUser.username}`, text);
}
input.value = '';
}
function handleAdminCommand(cmd) {
if(currentUser.role !== 'ADMIN' && currentUser.role !== 'DEVELOPER') {
addChatMessage("ระบบ", "คุณไม่มีสิทธิ์ใช้งานคำสั่งแอดมิน", "#ff3333");
return;
}
const parts = cmd.split(' ');
const action = parts[0];
if(action === '/เสกเงิน') {
const amount = parseInt(parts[1]) || 1000;
currentUser.gold += amount;
updateLobbyUI();
addChatMessage("ระบบแอดมิน", `เสกเงินจำนวน ${amount} Gold สำเร็จ`, "#00ff00");
} else if(action === '/ประกาศ') {
const message = parts.slice(1).join(' ');
showAnnouncement(`[ประกาศจากแอดมิน]: ${message}`);
} else if(action === '/เสกมังกร' && currentUser.role === 'ADMIN') {
currentUser.pet = 'มังกรเวลา (Time Dragon)';
updateLobbyUI();
addChatMessage("ระบบแอดมิน", "เปิดใช้งานสัตว์เลี้ยงแอดมิน: มังกรเวลา", "#00ff00");
} else {
addChatMessage("ระบบ", "ไม่พบคำสั่งภาษาไทยนี้", "#ff3333");
}
}
function showAnnouncement(msg) {
const banner = document.getElementById('admin-announcement');
banner.innerText = msg;
banner.style.display = 'block';
setTimeout(() => { banner.style.display = 'none'; }, 5000);
}
// --- ระบบสุ่มสกิน/ไอเทม (Gacha) และโค้ดรับของ ---
function drawGacha() {
if(currentUser.gems < 100) {
alert("เพชรไม่พอในการสุ่ม (ต้องการ 100 Gems)");
return;
}
currentUser.gems -= 100;
const rewards = [
{ name: "สกินปืนคาบศิลาลายทอง (Legendary)", type: "Skin" },
{ name: "ช้างศึกเกราะเหล็ก (Epic Pet)", type: "Pet" },
{ name: "ดาบโบราณลงอักขระ (Rare)", type: "Weapon" }
];
const drop = rewards[Math.floor(Math.random() * rewards.length)];
document.getElementById('gacha-result').innerText = `ยินดีด้วย! คุณได้รับ: ${drop.name}`;
updateLobbyUI();
}
function redeemCode() {
const code = document.getElementById('code-input').value.trim();
if(usedCodes.has(currentUser.username + "_" + code)) {
alert("คุณเคยใช้งานโค้ดนี้ไปแล้ว!");
return;
}
if(code === "TAKSIN2026") {
currentUser.gold += 5000;
currentUser.gems += 500;
usedCodes.add(currentUser.username + "_" + code);
updateLobbyUI();
alert("ใช้งานโค้ดสำเร็จ! ได้รับ 5,000 Gold และ 500 Gems");
} else {
alert("โค้ดไม่ถูกต้องหรือหมดอายุ");
}
}
// --- ระบบ Engine เกม 3D FPS (Three.js WebGL) ---
let scene, camera, renderer, zombies = [];
let playerHp = 100, currentWave = 1, isDead = false;
function startGame() {
document.getElementById('lobby-screen').style.display = 'none';
document.getElementById('game-container').style.display = 'block';
// ตั้งค่าฉาก Three.js 3D
scene = new THREE.Scene();
scene.background = new THREE.Color(0x111122); // บรรยากาศกลางคืนโบราณ
scene.fog = new THREE.FogExp2(0x111122, 0.05);
camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.set(0, 1.6, 0); // ความสูงสายตามนุษย์
renderer = new THREE.WebGLRenderer({ canvas: document.getElementById('game-canvas'), antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
// แสงสว่างในฉาก
const light = new THREE.HemisphereLight(0xffffff, 0x444444, 1);
scene.add(light);
// สร้างพื้นดินสนามรบ
const floorGeo = new THREE.PlaneGeometry(100, 100);
const floorMat = new THREE.MeshBasicMaterial({ color: 0x223311 });
const floor = new THREE.Mesh(floorGeo, floorMat);
floor.rotation.x = -Math.PI / 2;
scene.add(floor);
// สร้างโมเดลธงฝ่ายพม่า
createBurmeseFlag(10, 0, -15);
// Spawn ศัตรู
spawnZombies(5);
// ควบคุมปืนและยิง
window.addEventListener('click', shoot);
animate();
}
function createBurmeseFlag(x, y, z) {
const poleGeo = new THREE.CylinderGeometry(0.1, 0.1, 5);
const poleMat = new THREE.MeshBasicMaterial({ color: 0x8b4513 });
const pole = new THREE.Mesh(poleGeo, poleMat);
pole.position.set(x, 2.5, z);
scene.add(pole);
const flagGeo = new THREE.BoxGeometry(2, 1, 0.1);
const flagMat = new THREE.MeshBasicMaterial({ color: 0xff0000 });
const flag = new THREE.Mesh(flagGeo, flagMat);
flag.position.set(x + 1, 4, z);
scene.add(flag);
}
function spawnZombies(count) {
zombies = [];
for(let i = 0; i < count; i++) {
const geo = new THREE.BoxGeometry(1, 2, 1); // โมเดลร่างมนุษย์ทรงสี่เหลี่ยม
const mat = new THREE.MeshBasicMaterial({ color: 0x556b2f });
const zombie = new THREE.Mesh(geo, mat);
zombie.position.set((Math.random() - 0.5) * 30, 1, -10 - Math.random() * 20);
scene.add(zombie);
zombies.push(zombie);
}
document.getElementById('zombie-count').innerText = zombies.length;
}
function shoot() {
if(isDead) return;
// ระบบ Raycast ยิงเป้าหมายกลางหน้าจอ
const raycaster = new THREE.Raycaster();
raycaster.setFromCamera(new THREE.Vector2(0,0), camera);
const intersects = raycaster.intersectObjects(zombies);
if(intersects.length > 0) {
const hitZombie = intersects[0].object;
scene.remove(hitZombie);
zombies = zombies.filter(z => z !== hitZombie);
document.getElementById('zombie-count').innerText = zombies.length;
// ตรวจสอบการจบเวฟ และคืนชีพ
if(zombies.length === 0) {
nextWave();
}
}
}
function nextWave() {
currentWave++;
document.getElementById('wave-val').innerText = currentWave;
// ฟื้นคืนชีพตัวละครอัตโนมัติเมื่อขึ้นเวฟใหม่
if(isDead) {
isDead = false;
playerHp = 100;
document.getElementById('hp-val').innerText = playerHp;
document.getElementById('spectator-overlay').style.display = 'none';
}
spawnZombies(currentWave * 5);
showAnnouncement(`คลื่นซอมบี้เวฟที่ ${currentWave} เริ่มต้นขึ้นแล้ว!`);
}
function animate() {
requestAnimationFrame(animate);
// เคลื่อนที่ซอมบี้เข้ามาหาผู้เล่น
if(!isDead) {
zombies.forEach(z => {
z.lookAt(camera.position.x, 1, camera.position.z);
z.translateZ(0.02); // ความเร็วซอมบี้
// ตรวจสอบระยะโจมตี
if(z.position.distanceTo(camera.position) < 1.5) {
playerHp -= 0.5;
document.getElementById('hp-val').innerText = Math.floor(playerHp);
<script src="https://gist.github.com/isdaviddong/23cc140c1780828b44f79397f737b95e.js"></script>
free firer tonament app
isbd frer fire yonament app
<title>Agro Feed | Agriculture Solutions</title>
Contact Agro Feed
<script src="script.js"></script>
i
SMART AGRICULTURE • BETTER FUTURE
Growing a Greener Tomorrow.
Agro Feed provides quality agriculture materials and practical services to support farmers and help build productive, sustainable farms.
☀️
🌾 🌾 🌾
👨🌾
🌱 Better inputs. Better farming.
ABOUT AGRO FEED
Supporting farmers from field to harvest.
Agro Feed is an agriculture-focused platform dedicated to connecting farmers with useful farming materials, information, and services.
Our goal is simple: make agricultural solutions easier to understand, access, and use while encouraging responsible and sustainable farming practices.
QualityMaterials
PracticalSolutions
FarmerFocused
AGRICULTURE MATERIALS
What we provide
Explore essential categories for modern farming.
🌱
Seeds
Quality seed options for different crops and farming needs.
🌿
Organic Inputs
Organic materials that support healthy soil and sustainable cultivation.
🪴
Growing Media
Useful growing materials for nurseries, gardens, and crop production.
🚜
Farm Supplies
Practical supplies to support everyday agricultural activities.
OUR SERVICES
Solutions for better farming
01
Agriculture Guidance
Practical information to help farmers make informed farming decisions.
02
Material Support
Help identifying suitable agriculture materials and inputs for your requirements.
03
Farm Solutions
Simple, practical approaches for improving farm operations and productivity.
LET'S GROW TOGETHER
Build a stronger future for agriculture.
🌱 Agro Feed
© 2026 Agro Feed. Agriculture solutions for a greener future.
<script src="https://gist.github.com/isdaviddong/23cc140c1780828b44f79397f737b95e.js"></script>
DEADLY
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
content://com.google.android.apps.nbu.files.provider/2/10028