MiniApp Updates

This commit is contained in:
Degradin 2025-01-21 13:06:36 +03:00
parent f4fe2d2c06
commit b13335f510
5 changed files with 224 additions and 79 deletions

3
package-lock.json generated
View File

@ -1225,8 +1225,7 @@
"node_modules/fs": { "node_modules/fs": {
"version": "0.0.1-security", "version": "0.0.1-security",
"resolved": "https://registry.npmjs.org/fs/-/fs-0.0.1-security.tgz", "resolved": "https://registry.npmjs.org/fs/-/fs-0.0.1-security.tgz",
"integrity": "sha512-3XY9e1pP0CVEUCdj5BmfIZxRBTSDycnbqhIOGec9QYtmVH2fbLpj86CFWkrNOkt/Fvty4KZG5lTglL9j/gJ87w==", "integrity": "sha512-3XY9e1pP0CVEUCdj5BmfIZxRBTSDycnbqhIOGec9QYtmVH2fbLpj86CFWkrNOkt/Fvty4KZG5lTglL9j/gJ87w=="
"license": "ISC"
}, },
"node_modules/fsevents": { "node_modules/fsevents": {
"version": "2.3.3", "version": "2.3.3",

View File

@ -2,29 +2,28 @@
<html lang="ru"> <html lang="ru">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Меню игрока</title> <title>Меню игрока</title>
<style> <style>
/* Общие стили */ /* Общие стили */
body { body {
font-family: 'Arial', sans-serif; font-family: 'Arial', sans-serif;
margin: 0;
padding: 0; padding: 0;
background-color: #f4f7fc; background-color: #f4f7fc;
color: #333; color: #333;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
max-width: 500px;
} }
/* Контейнер для контента */ /* Контейнер для контента */
.container { .container {
max-width: 600px; max-width: 500px;
width: 100%; width: 100%;
background: white; background: white;
padding: 20px; padding: 20px;
border-radius: 15px; border-radius: 15px;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
font-size: 16px; font-size: 16px;
} }
@ -47,9 +46,6 @@ body {
color: #e26f22; color: #e26f22;
} }
.section p {
margin: 5px 0;
}
.section span { .section span {
font-weight: bold; font-weight: bold;
@ -66,7 +62,7 @@ body {
font-size: 16px; font-size: 16px;
margin-top: 20px; margin-top: 20px;
text-align: center; text-align: center;
width: 100%; width: 350px;
} }
/* Профиль */ /* Профиль */
@ -130,7 +126,7 @@ body {
.progress-bar { .progress-bar {
background-color: #ddd; background-color: #ddd;
border-radius: 10px; border-radius: 10px;
height: 10px; height: 15px;
width: 100%; width: 100%;
margin-bottom: 10px; margin-bottom: 10px;
overflow: hidden; overflow: hidden;
@ -148,14 +144,6 @@ body {
color: white; color: white;
} }
.progress-hp {
background-color: #e26f22;
}
.progress-stamina {
background-color: #e26f22;
}
/* Статистика игрока */ /* Статистика игрока */
.fire-stats { .fire-stats {
display: grid; display: grid;
@ -237,7 +225,6 @@ body {
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<div class="last-update">Последнее обновление: <span id="last-update"></span></div>
<div class="title">📜 Меню игрока</div> <div class="title">📜 Меню игрока</div>
<div class="profile-section"> <div class="profile-section">
@ -281,14 +268,14 @@ body {
<p>Интеллект</p> <p>Интеллект</p>
<span id="intelligence"></span> <span id="intelligence"></span>
</div> </div>
<div class="stat">
<p>Выносливость</p>
<span id="endurance"></span>
</div>
<div class="stat"> <div class="stat">
<p>Стойкость</p> <p>Стойкость</p>
<span id="resilience"></span> <span id="resilience"></span>
</div> </div>
<div class="stat">
<p>Выносливость</p>
<span id="endurance"></span>
</div>
</div> </div>
<div class="section"> <div class="section">
@ -324,7 +311,7 @@ body {
</div> </div>
</div> </div>
<a href="https://t.me/CampFireGameBot" class="button">🏠 Перейти в чат бота</a> <a href="/scoreboard" class="button">🏠 Перейти в чат бота</a>
</div> </div>
<script> <script>
@ -369,7 +356,11 @@ body {
document.getElementById("hp-bar").style.width = `${hpProgress}%`; document.getElementById("hp-bar").style.width = `${hpProgress}%`;
document.getElementById("hp-bar").style.backgroundColor = `red`;
document.getElementById("hp-bar").textContent = `❤`;
document.getElementById("stamina-bar").style.width = `${staminaProgress}%`; document.getElementById("stamina-bar").style.width = `${staminaProgress}%`;
document.getElementById("stamina-bar").style.backgroundColor = `green`;
document.getElementById("stamina-bar").textContent = `🔋`;
// Характеристики FIRE // Характеристики FIRE
@ -400,23 +391,13 @@ body {
// Добавляем прогрессбар заполненности склада // Добавляем прогрессбар заполненности склада
const progress = (ent.currentResources / ent.warehouseCapacity) * 100; const progress = (ent.currentResources / ent.warehouseCapacity) * 100;
const progressBar = document.createElement("div"); const progressBar = document.createElement("div");
progressBar.classList.add("progress-bar");
progressBar.innerHTML = `<div class="progress-bar-inner" style="width: ${progress}%"></div>`; progressBar.innerHTML = `<div class="progress-bar-inner" style="width: ${progress}%"></div>`;
div.appendChild(progressBar); div.appendChild(progressBar);
enterprisesDiv.appendChild(div); enterprisesDiv.appendChild(div);
}); });
} }
// Склад (имеет следующие переменные // Склад
// playerId: DataTypes.BIGINT,
// capacity: DataTypes.INTEGER, // Общая ёмкость склада
// wood: DataTypes.INTEGER,
// coal: DataTypes.INTEGER,
// oil: DataTypes.INTEGER,
// metall: DataTypes.INTEGER,
// gold: DataTypes.INTEGER,
// diamond: DataTypes.INTEGER,)
// выводим красиво, количество каждого ресурса (без прогрессбара) и добавляем в конце прогрессбар заполненности с указанием процента (warehouseCapacity это максимальная вместимость совокупности всех ресурсов)
const warehouseDiv = document.getElementById("warehouse"); const warehouseDiv = document.getElementById("warehouse");
warehouseDiv.innerHTML = ""; warehouseDiv.innerHTML = "";
const resources = ['wood', 'coal', 'oil', 'metall', 'gold', 'diamond']; const resources = ['wood', 'coal', 'oil', 'metall', 'gold', 'diamond'];
@ -432,10 +413,6 @@ body {
progressBar.classList.add("progress-bar"); progressBar.classList.add("progress-bar");
progressBar.innerHTML = `<div class="progress-bar-inner" style="width: ${progress}%"></div>`; progressBar.innerHTML = `<div class="progress-bar-inner" style="width: ${progress}%"></div>`;
warehouseDiv.appendChild(progressBar); warehouseDiv.appendChild(progressBar);
// Время последнего обновления
const lastUpdate = new Date();
document.getElementById("last-update").textContent = lastUpdate.toLocaleString();
}) })
.catch(err => { .catch(err => {
console.error("Ошибка загрузки данных:", err); console.error("Ошибка загрузки данных:", err);

View File

@ -2,7 +2,7 @@
<html lang="ru"> <html lang="ru">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Таблица лидеров</title> <title>Таблица лидеров</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEJgP4v8Jf+K6cM7V3zv7+uCGo5F5O+Xq6bM+bB5HXitBzvvhQ2V5+fu+n9U7" crossorigin="anonymous"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEJgP4v8Jf+K6cM7V3zv7+uCGo5F5O+Xq6bM+bB5HXitBzvvhQ2V5+fu+n9U7" crossorigin="anonymous">
<style> <style>
@ -12,31 +12,38 @@
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;
margin: 0; margin: 0;
padding: 0; padding: 0;
}
.container {
max-width: 1200px;
margin-top: 40px;
}
h1 {
font-size: 2.5rem;
text-align: center;
color: #d46600;
margin-bottom: 30px;
}
.btn-group {
margin-bottom: 30px;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center;
max-width: 100%;
height: 100%;
}
.container {
max-width: 100%;
margin-top: 10px;
padding: 10px;
}
h1 {
font-size: 1.6rem;
text-align: center;
color: #d46600;
margin-bottom: 15px;
}
.btn-group {
margin-bottom: 15px;
display: flex;
justify-content: space-between;
} }
.btn { .btn {
background-color: #444; background-color: #444;
color: #ffffff; color: #ffffff;
border: 1px solid #333; border: 1px solid #333;
font-size: 1.2rem; font-size: 50%;
padding: 15px 25px; padding: 8px 16px;
margin: 0 10px; margin: 0 5px;
border-radius: 8px; border-radius: 8px;
transition: 0.3s ease; transition: 0.3s ease;
width: 50%;
} }
.btn:hover { .btn:hover {
background-color: #00bcd4; background-color: #00bcd4;
@ -45,25 +52,25 @@
.card { .card {
background-color: #1f1f1f; background-color: #1f1f1f;
border-radius: 10px; border-radius: 10px;
margin-bottom: 20px; margin-bottom: 10px;
border: 1px solid #333; border: 1px solid #333;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.6); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
} }
.card-header { .card-header {
background-color: #222; background-color: #222;
color: #d46600; color: #d46600;
font-size: 1.3rem; font-size: 1rem;
padding: 15px; padding: 10px;
text-align: center; text-align: center;
} }
.card-body { .card-body {
padding: 20px; padding: 15px;
background-color: #282828; background-color: #282828;
color: #b0b0b0; color: #b0b0b0;
} }
.card-body p { .card-body p {
margin: 10px 0; margin: 8px 0;
font-size: 1.1rem; font-size: 0.9rem;
} }
.money { .money {
color: #00c853; color: #00c853;
@ -71,14 +78,38 @@
} }
.no-data { .no-data {
text-align: center; text-align: center;
font-size: 1.5rem; font-size: 1.2rem;
color: #888; color: #888;
margin-top: 50px; margin-top: 30px;
} }
.icon { .icon {
font-size: 1.5rem; font-size: 1.2rem;
color: #ffeb3b; color: #ffeb3b;
} }
.circle {
border-radius: 5px;
background-color: orange;
color: black;
padding: 5px;
}
/* Статистика игрока */
.fire-stats {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px;
padding: 10px;
margin-top: 15px;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.fire-stats .stat {
text-align: center;
}
.fire-stats .stat span {
font-weight: bold;
}
</style> </style>
</head> </head>
<body> <body>
@ -88,10 +119,12 @@
<!-- Кнопки для выбора топа --> <!-- Кнопки для выбора топа -->
<div class="btn-group" role="group"> <div class="btn-group" role="group">
<button type="button" class="btn" id="btn-users" onclick="fetchTop('users')">Топ Пользователей</button> <button type="button" class="btn" id="btn-users" onclick="fetchTop('users')">Пользователи</button>
<button type="button" class="btn" id="btn-characters" onclick="fetchTop('characters')">Топ Персонажей</button> <button type="button" class="btn" id="btn-characters" onclick="fetchTop('characters')">CampFireGG.Crime</button>
<button type="button" class="btn" id="btn-enterprises" onclick="fetchTop('enterprises')">Топ Предприятий</button> </div>
<button type="button" class="btn" id="btn-businesses" onclick="fetchTop('businesses')">Топ Бизнесов</button> <div class="btn-group" role="group">
<button type="button" class="btn" id="btn-enterprises" onclick="fetchTop('enterprises')">Предприятия</button>
<button type="button" class="btn" id="btn-businesses" onclick="fetchTop('businesses')">Организации</button>
</div> </div>
<!-- Контейнер для вывода данных --> <!-- Контейнер для вывода данных -->
@ -120,11 +153,11 @@
topContent.innerHTML = data.map(player => ` topContent.innerHTML = data.map(player => `
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
${player.username} - ${player.status === 'bronze' ? '[🔺]' : player.status === 'silver' ? '[🔹]' : '[🔸]'} ${player.username} ${player.status === 'bronze' ? '[🔺]' : player.status === 'silver' ? '[🔹]' : '[🔸]'}
</div> </div>
<div class="card-body"> <div class="card-body">
<p>Баланс: <span class="money">${player.money} ₽</span></p> <p>Баланс: <span class="money">${player.money} ₽</span></p>
<p>Уровень: ${player.level}</p> <p>Уровень: <span class="circle">${player.level}</span></p>
</div> </div>
</div> </div>
`).join(''); `).join('');
@ -136,12 +169,26 @@
${character.username} ${character.username}
</div> </div>
<div class="card-body"> <div class="card-body">
<p>Грязные деньги: ${character.dirtymoney} ₽</p> <p>Грязные деньги: <span class="money">${character.dirtymoney} Ð</span></p>
<p>Уровень: ${character.level}</p> <p>Уровень: <span class="circle">${character.level} </span></p>
<p>Сила: ${character.force}</p> <div class="fire-stats">
<p>Интеллект: ${character.intelligence}</p> <div class="stat">
<p>Устойчивость: ${character.resilience}</p> <p>Сила</p>
<p>Выносливость: ${character.endurance}</p> <span id="force">${character.force}</span>
</div>
<div class="stat">
<p>Интеллект</p>
<span id="intelligence">${character.intelligence}</span>
</div>
<div class="stat">
<p>Стойкость</p>
<span id="resilience">${character.resilience}</span>
</div>
<div class="stat">
<p>Выносливость</p>
<span id="endurance">${character.endurance}</span>
</div>
</div>
</div> </div>
</div> </div>
`).join(''); `).join('');

View File

@ -1,3 +1,2 @@
nodemon --ignore json/ .\server.js nodemon --ignore json/ .\server.js
nodemon --ignore json/ .\pages.js
pause pause

123
server.js
View File

@ -64,6 +64,129 @@ app.get('/player/:id', async (req, res) => {
} }
}); });
app.get('/scoreboard', (req, res) => {
res.sendFile(global.path.join(__dirname, 'public', 'scoreboard.html'));
});
app.get('/users', async (req, res) => {
const { sortBy } = req.query; // Sorting option passed as a query parameter
const sortOptions = {
money: [sequelize.literal('money'), 'DESC'],
level: [sequelize.literal('level'), 'DESC']
};
const topUser = await UserModel.findAll({
attributes: ['username', 'money', 'level', 'status'],
order: [sortOptions[sortBy] || sortOptions['money']], // Default sort by money
limit: 15
});
res.json(topUser.map(player => ({
username: player.username,
money: utils.spaces(player.money),
level: player.level,
status: player.status
})));
});
app.get('/characters', async (req, res) => {
const { sortBy } = req.query; // Use query parameters to specify sorting
const sortOptions = {
dirtymoney: [sequelize.literal('dirtymoney'), 'DESC'],
level: [sequelize.literal('level'), 'DESC'],
force: [sequelize.literal('force'), 'DESC'],
intelligence: [sequelize.literal('intelligence'), 'DESC'],
resilience: [sequelize.literal('resilience'), 'DESC'],
endurance: [sequelize.literal('endurance'), 'DESC']
};
const topCharacter = await CharacterModel.findAll({
attributes: ['username', 'dirtymoney', 'level', 'force', 'intelligence', 'resilience', 'endurance'],
order: [sortOptions[sortBy] || sortOptions['dirtymoney']], // Default sort by dirtymoney
limit: 15
});
res.json(topCharacter.map(character => ({
username: character.username,
dirtymoney: character.dirtymoney,
level: character.level,
force: character.force,
intelligence: character.intelligence,
resilience: character.resilience,
endurance: character.endurance
})));
});
app.get('/enterprises', async (req, res) => {
const enterprises = await EnterpriseModel.findAll({
attributes: ['name', 'resourceType', 'level', 'efficiency', 'warehouseCapacity', 'currentResources', 'playerId']
});
const resourceIcons = {
wood: '🌳',
coal: '⛏️',
oil: '🛢️',
metall: '⚒️',
gold: '💰',
diamond: '💎'
};
const enterprisesData = await Promise.all(enterprises.map(async enterprise => {
const player = await UserModel.findOne({
attributes: ['name'],
where: { telegram_id: enterprise.playerId }
});
return {
name: enterprise.name,
resourceType: enterprise.resourceType,
level: enterprise.level,
efficiency: enterprise.efficiency,
warehouseCapacity: enterprise.warehouseCapacity,
currentResources: enterprise.currentResources,
owner: player ? player.name : 'Unknown',
icon: resourceIcons[enterprise.resourceType] || '❓'
};
}));
res.json(enterprisesData);
});
app.get('/businesses', async (req, res) => {
const { sortBy } = req.query; // Sorting option passed as a query parameter
const sortOptions = {
balance: [sequelize.literal('balance'), 'DESC'],
usersCount: [sequelize.literal('ARRAY_LENGTH(users, 1)'), 'DESC']
};
const businesses = await BusinessModel.findAll({
attributes: ['name', 'balance', 'users', 'owner'],
order: [sortOptions[sortBy] || sortOptions['balance']], // Default sort by balance
limit: 15
});
const businessesData = await Promise.all(businesses.map(async business => {
const owner = await UserModel.findOne({
attributes: ['username'],
where: { telegram_id: business.owner }
});
return {
name: business.name,
balance: business.balance,
usersCount: business.users.length,
owner: owner ? owner.username : 'Unknown'
};
}));
res.json(businessesData);
});
// Запуск сервера // Запуск сервера
const PORT = process.env.PORT || 3001; const PORT = process.env.PORT || 3001;