RomkaZVO/Trashbox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

поправлен предосмотр

Browse Source
This commit is contained in:
RomkaZVO
2025-11-21 13:02:44 +08:00
parent 0fdfb09fa0
commit 32bd29efd5
3 changed files with 170 additions and 136 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
README.md
View File

@@ -12,10 +12,7 @@ cd /home/romkazvo/www/cgi-bin
```
### Компиляция CGI
```bash
gcc -o index.cgi index.c
gcc -o style.cgi style.c
gcc -o status.cgi status.c
chmod +x *.cgi
sudo sh build.sh
```
### Конфигурация Nginx
Файл конфигурации `/etc/nginx/sites-available/trashbox`:<br>

136
style.css
View File

@@ -351,6 +351,7 @@ li:hover {
height: 100%;
background-color: rgba(0,0,0,0.8);
backdrop-filter: blur(5px);
overflow: auto;
}
.preview-content {
@@ -358,9 +359,6 @@ li:hover {
margin: 2% auto;
padding: 0;
border-radius: 8px;
width: 90%;
height: 90%;
max-width: 1200px;
box-shadow: 0 10px 30px rgba(0,0,0,0.3);
display: flex;
flex-direction: column;
@@ -368,39 +366,6 @@ li:hover {
transition: all 0.3s ease;
}
/* Размеры для разных типов контента */
.preview-content.image-type {
max-width: 90%;
max-height: 90%;
width: auto;
height: auto;
}
.preview-content.text-type {
max-width: 800px;
max-height: 80%;
}
.preview-content.audio-type {
max-width: 500px;
max-height: 300px;
}
.preview-content.video-type {
max-width: 90%;
max-height: 90%;
}
.preview-content.pdf-type {
max-width: 90%;
max-height: 90%;
}
.preview-content.default-type {
max-width: 90%;
max-height: 90%;
}
.preview-header {
display: flex;
justify-content: space-between;
@@ -453,39 +418,54 @@ li:hover {
background: var(--bg-primary);
}
/* Стили для контейнера изображения */
.preview-image-container {
display: flex;
align-items: center;
justify-content: center;
flex-grow: 1;
padding: 10px;
background: var(--bg-primary);
overflow: hidden;
width: 100%;
height: 100%;
}
.preview-image {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
border-radius: 8px;
box-shadow: 0 4px 20px rgba(0,0,0,0.2);
display: block;
}
/* Улучшаем скроллинг для очень больших изображений */
.preview-modal::-webkit-scrollbar {
width: 8px;
}
.preview-modal::-webkit-scrollbar-track {
background: rgba(255,255,255,0.1);
}
.preview-modal::-webkit-scrollbar-thumb {
background: rgba(255,255,255,0.3);
border-radius: 4px;
}
.preview-modal::-webkit-scrollbar-thumb:hover {
background: rgba(255,255,255,0.5);
}
/* Адаптивность */
@media (max-width: 768px) {
.preview-content {
width: 95%;
height: 95%;
margin: 2.5% auto;
}
.preview-content.image-type {
max-width: 95%;
max-height: 95%;
}
.preview-content.text-type {
max-width: 95%;
max-height: 80%;
}
.preview-content.audio-type {
max-width: 95%;
max-height: 300px;
}
.preview-content.video-type {
max-width: 95%;
max-height: 95%;
}
.preview-content.pdf-type {
max-width: 95%;
max-height: 95%;
}
.preview-header {
padding: 0.75rem;
}
@@ -493,6 +473,10 @@ li:hover {
.preview-title {
font-size: 0.9rem;
}
.preview-image-container {
padding: 5px;
}
}
@media (max-width: 480px) {
@@ -560,27 +544,15 @@ li:hover {
font-size: 0.8rem;
}
.preview-content {
width: 98%;
height: 98%;
margin: 1% auto;
border-radius: 4px;
}
.preview-content.image-type,
.preview-content.video-type,
.preview-content.pdf-type {
max-width: 98%;
max-height: 98%;
.preview-image-container {
padding: 2px;
}
.preview-content.text-type {
max-width: 98%;
max-height: 80%;
}
.preview-content.audio-type {
max-width: 98%;
max-height: 250px;
.preview-image {
border-radius: 4px;
box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}
}
@@ -609,8 +581,4 @@ li:hover {
.file-link {
width: 100%;
}
.preview-content.audio-type {
max-height: 200px;
}
}

117
template.html
View File

@@ -20,7 +20,7 @@
<meta name="twitter:description" content="Моя личная помоечка" />
<meta name="twitter:image" content="https://home.mashup.su/og.png" />
<meta name="description" content="Моя личная помоечка" />
<meta name="keywords" content="файлы, обмен, скачать, загрузить" />
<meta name="keywords" content="RomkaZVO, mashup, mashup su, файлы, обмен, скачать, загрузить" />
<script>
function getCookie(name) {
@@ -58,7 +58,7 @@
<div class="footer-content">
<span>Навайбкодил с любовью ❤️</span>
<a href="https://romkazvo.ru" target="_blank" class="footer-link">RomkaZVO</a><br>
Сделано при помощи BusyBox httpd и nginx для SSL<br>
Сделано при помощи BusyBox httpd и Nginx для SSL<br>
Боже, храни Китай партия за DeepSeek
</div>
@@ -80,7 +80,6 @@
<button class="scroll-top" onclick="scrollToTop()">↑</button>
<!-- Модальное окно предпросмотра -->
<div id="previewModal" class="preview-modal">
<div class="preview-content" id="previewContent">
<div class="preview-header">
@@ -123,18 +122,15 @@
document.cookie = `theme=${newTheme}; expires=${date.toUTCString()}; path=/`;
}
// Функции для предпросмотра файлов
function openPreview(fileUrl) {
const modal = document.getElementById('previewModal');
const frame = document.getElementById('previewFrame');
const content = document.getElementById('previewContent');
const title = document.getElementById('previewTitle');
// Получаем имя файла из URL
const fileName = fileUrl.split('/').pop();
title.textContent = `Предпросмотр: ${fileName}`;
// Определяем тип файла для адаптивного масштабирования
const fileExt = fileName.split('.').pop().toLowerCase();
const imageTypes = ['jpg', 'jpeg', 'png', 'gif', 'webp', 'bmp', 'svg', 'ico'];
const textTypes = ['txt', 'md', 'html', 'htm', 'css', 'js', 'json', 'xml', 'csv'];
@@ -142,81 +138,154 @@
const videoTypes = ['mp4', 'webm', 'ogv', 'mov', 'avi', 'mkv'];
const isPDF = fileExt === 'pdf';
// Устанавливаем размеры в зависимости от типа файла
frame.style.display = 'block';
frame.src = '';
let imgContainer = document.getElementById('previewImageContainer');
if (!imgContainer) {
imgContainer = document.createElement('div');
imgContainer.id = 'previewImageContainer';
imgContainer.className = 'preview-image-container';
content.appendChild(imgContainer);
}
imgContainer.style.display = 'none';
imgContainer.innerHTML = '';
if (imageTypes.includes(fileExt)) {
// Для изображений - автоматический размер
content.style.width = 'auto';
content.style.height = 'auto';
content.style.maxWidth = '90vw';
content.style.maxHeight = '90vh';
} else if (textTypes.includes(fileExt)) {
// Для текстовых файлов - компактное окно
frame.style.display = 'none';
imgContainer.style.display = 'flex';
const img = document.createElement('img');
img.src = fileUrl;
img.alt = fileName;
img.className = 'preview-image';
img.onload = function() {
adjustModalForImage(this);
};
img.onerror = function() {
console.error('Failed to load image:', fileUrl);
frame.style.display = 'block';
imgContainer.style.display = 'none';
frame.src = fileUrl;
};
imgContainer.appendChild(img);
content.style.width = '90vw';
content.style.height = '90vh';
content.style.maxWidth = 'none';
content.style.maxHeight = 'none';
} else {
frame.style.display = 'block';
imgContainer.style.display = 'none';
if (textTypes.includes(fileExt)) {
content.style.width = '80vw';
content.style.height = '70vh';
content.style.maxWidth = '800px';
content.style.maxHeight = '600px';
} else if (audioTypes.includes(fileExt)) {
// Для аудио - маленькое окно
content.style.width = '500px';
content.style.height = '300px';
content.style.maxWidth = '90vw';
content.style.maxHeight = '400px';
} else if (videoTypes.includes(fileExt)) {
// Для видео - большое окно
content.style.width = '90vw';
content.style.height = '80vh';
content.style.maxWidth = '1200px';
content.style.maxHeight = '800px';
} else if (isPDF) {
// Для PDF - большое окно
content.style.width = '90vw';
content.style.height = '90vh';
content.style.maxWidth = '1200px';
content.style.maxHeight = '900px';
frame.classList.add('pdf');
} else {
// По умолчанию - средний размер
content.style.width = '80vw';
content.style.height = '80vh';
content.style.maxWidth = '1000px';
content.style.maxHeight = '800px';
}
// Просто открываем файл напрямую в iframe
frame.src = fileUrl;
}
// Показываем модальное окно
modal.style.display = 'block';
document.body.style.overflow = 'hidden';
}
function adjustModalForImage(img) {
const content = document.getElementById('previewContent');
const maxWidth = window.innerWidth * 0.95;
const maxHeight = window.innerHeight * 0.95;
const imgWidth = img.naturalWidth;
const imgHeight = img.naturalHeight;
console.log(`Image size: ${imgWidth}x${imgHeight}, Screen limits: ${maxWidth}x${maxHeight}`);
let scale = 1;
if (imgWidth > maxWidth) {
scale = Math.min(scale, maxWidth / imgWidth);
}
if (imgHeight > maxHeight) {
scale = Math.min(scale, maxHeight / imgHeight);
}
const displayWidth = imgWidth * scale;
const displayHeight = imgHeight * scale;
console.log(`Display size: ${displayWidth}x${displayHeight}, Scale: ${scale}`);
content.style.width = (displayWidth + 20) + 'px';
content.style.height = (displayHeight + 80) + 'px';
content.style.margin = 'auto';
content.style.position = 'absolute';
content.style.left = '50%';
content.style.top = '50%';
content.style.transform = 'translate(-50%, -50%)';
}
function closePreview() {
const modal = document.getElementById('previewModal');
const frame = document.getElementById('previewFrame');
const content = document.getElementById('previewContent');
// Скрываем модальное окно и сбрасываем iframe
modal.style.display = 'none';
frame.src = '';
frame.classList.remove('pdf');
// Сбрасываем стили
content.style.width = '';
content.style.height = '';
content.style.maxWidth = '';
content.style.maxHeight = '';
content.style.margin = '';
content.style.position = '';
content.style.left = '';
content.style.top = '';
content.style.transform = '';
const imgContainer = document.getElementById('previewImageContainer');
if (imgContainer) {
imgContainer.style.display = 'none';
imgContainer.innerHTML = '';
}
document.body.style.overflow = 'auto';
}
// Закрытие модального окна по клику вне контента
document.getElementById('previewModal').addEventListener('click', function(e) {
if (e.target === this) {
closePreview();
}
});
// Закрытие по ESC
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape') {
closePreview();