ipram/labs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

22 - python & all web labs

Browse Source
This commit is contained in:
ip-ram
2026-05-02 20:27:02 +05:00
parent ef77f101fa
commit 19af922baf
5781 changed files with 770492 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
labWeb/lab9/index.html Normal file
View File

@@ -0,0 +1,103 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Калькулятор Дробей</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/lucide@latest"></script>
<link rel="stylesheet" href="../vendor/tailwind.css">
<link rel="stylesheet" href="style.css">
</head>
<body class="bg-gradient-to-br from-blue-50 to-indigo-100 min-h-screen font-sans text-gray-800">
<div class="container mx-auto px-4 py-8 max-w-4xl">
<header class="flex items-center justify-center gap-3 mb-10">
<div class="bg-indigo-600 p-3 rounded-xl shadow-lg">
<i data-lucide="calculator" class="w-10 h-10 text-white"></i>
</div>
<h1 class="text-4xl font-bold text-indigo-900 tracking-tight">Калькулятор Дробей</h1>
</header>
<div class="bg-white rounded-2xl shadow-xl p-8 border border-gray-100">
<div class="flex flex-col md:flex-row items-center justify-center gap-8 mb-10">
<div class="fraction-input-group">
<div class="fraction">
<input type="number" id="num1" class="fraction-input" placeholder="0">
<div class="fraction-line"></div>
<input type="number" id="den1" class="fraction-input" placeholder="1">
</div>
</div>
<div class="text-2xl text-gray-400 font-bold">и</div>
<div class="fraction-input-group">
<div class="fraction">
<input type="number" id="num2" class="fraction-input" placeholder="0">
<div class="fraction-line"></div>
<input type="number" id="den2" class="fraction-input" placeholder="1">
</div>
</div>
</div>
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-10 max-w-2xl mx-auto">
<button class="operation-btn" onclick="performOperation('add')" aria-label="Сложить">
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxwYXRoIGQ9Ik0zMiAyMHYyNE0yMCAzMmgyNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L3N2Zz4="
onmouseover="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzEwQjk4MSIvPjxwYXRoIGQ9Ik0zMiAyMHYyNE0yMCAzMmgyNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L3N2Zz4='"
onmouseout="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxwYXRoIGQ9Ik0zMiAyMHYyNE0yMCAzMmgyNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L3N2Zz4='"
class="btn-image" alt="Сложить">
</button>
<button class="operation-btn" onclick="performOperation('subtract')" aria-label="Вычесть">
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxwYXRoIGQ9Ik0yMCAzMmgyNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L3N2Zz4="
onmouseover="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzEwQjk4MSIvPjxwYXRoIGQ9Ik0yMCAzMmgyNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L3N2Zz4='"
onmouseout="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxwYXRoIGQ9Ik0yMCAzMmgyNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L3N2Zz4='"
class="btn-image" alt="Вычесть">
</button>
<button class="operation-btn" onclick="performOperation('multiply')" aria-label="Умножить">
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxwYXRoIGQ9Ik0yNCAyNGwxNiAxNk00MCAyNGwtMTYgMTYiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PC9zdmc+"
onmouseover="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzEwQjk4MSIvPjxwYXRoIGQ9Ik0yNCAyNGwxNiAxNk00MCAyNGwtMTYgMTYiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PC9zdmc+'"
onmouseout="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxwYXRoIGQ9Ik0yNCAyNGwxNiAxNk00MCAyNGwtMTYgMTYiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PC9zdmc+'"
class="btn-image" alt="Умножить">
</button>
<button class="operation-btn" onclick="performOperation('divide')" aria-label="Разделить">
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxjaXJjbGUgY3g9IjMyIiBjeT0iMjAiIHI9IjMiIGZpbGw9IndoaXRlIi8+PHBhdGggZD0iTTIwIDMyaDI0IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjxjaXJjbGUgY3g9IjMyIiBjeT0iNDQiIHI9IjMiIGZpbGw9IndoaXRlIi8+PC9zdmc+"
onmouseover="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzEwQjk4MSIvPjxjaXJjbGUgY3g9IjMyIiBjeT0iMjAiIHI9IjMiIGZpbGw9IndoaXRlIi8+PHBhdGggZD0iTTIwIDMyaDI0IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjxjaXJjbGUgY3g9IjMyIiBjeT0iNDQiIHI9IjMiIGZpbGw9IndoaXRlIi8+PC9zdmc+'"
onmouseout="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIzMCIgZmlsbD0iIzRGNDZFNSIvPjxjaXJjbGUgY3g9IjMyIiBjeT0iMjAiIHI9IjMiIGZpbGw9IndoaXRlIi8+PHBhdGggZD0iTTIwIDMyaDI0IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjxjaXJjbGUgY3g9IjMyIiBjeT0iNDQiIHI9IjMiIGZpbGw9IndoaXRlIi8+PC9zdmc+'"
class="btn-image" alt="Разделить">
</button>
</div>
<div class="result-container bg-gray-50 rounded-xl p-6 text-center border-2 border-dashed border-gray-300">
<h2 class="text-lg font-semibold text-gray-600 mb-4">Результат:</h2>
<div id="result-display" class="hidden">
<div class="fraction-result">
<span id="result-num" class="fraction-top text-3xl font-bold text-indigo-700">0</span>
<div class="fraction-line-result"></div>
<span id="result-den" class="fraction-bottom text-3xl font-bold text-indigo-700">1</span>
</div>
</div>
<p id="result-text" class="text-xl text-gray-700 font-medium hidden"></p>
<p id="error-message" class="text-red-500 font-semibold hidden"></p>
<p id="placeholder-text" class="text-gray-400 italic">Нажмите кнопку операции для вычисления</p>
</div>
</div>
<div class="mt-6 text-center text-sm text-gray-500">
<p>Введите числители и знаменатели двух дробей и выберите операцию</p>
</div>
</div>
<script src="script.js"></script>
<script>
lucide.createIcons();
</script>
<script src="https://deepsite.hf.co/deepsite-badge.js"></script>
</body>
</html>

180
labWeb/lab9/script.js Normal file
View File

@@ -0,0 +1,180 @@
function calculateGCD(a, b) {
a = Math.abs(a);
b = Math.abs(b);
while (b !== 0) {
let temp = b;
b = a % b;
a = temp;
}
return a;
}
function reduceFraction(numerator, denominator) {
if (denominator === 0) {
return { error: "Знаменатель не может быть нулем!" };
}
if (numerator === 0) {
return { numerator: 0, denominator: 1 };
}
const gcd = calculateGCD(numerator, denominator);
let newNum = numerator / gcd;
let newDen = denominator / gcd;
if (newDen < 0) {
newNum = -newNum;
newDen = -newDen;
}
return { numerator: newNum, denominator: newDen };
}
function addFractions(num1, den1, num2, den2) {
const resultNum = num1 * den2 + num2 * den1;
const resultDen = den1 * den2;
return reduceFraction(resultNum, resultDen);
}
function subtractFractions(num1, den1, num2, den2) {
const resultNum = num1 * den2 - num2 * den1;
const resultDen = den1 * den2;
return reduceFraction(resultNum, resultDen);
}
function multiplyFractions(num1, den1, num2, den2) {
const resultNum = num1 * num2;
const resultDen = den1 * den2;
return reduceFraction(resultNum, resultDen);
}
function divideFractions(num1, den1, num2, den2) {
if (num2 === 0) {
return { error: "Нельзя делить на ноль!" };
}
const resultNum = num1 * den2;
const resultDen = den1 * num2;
return reduceFraction(resultNum, resultDen);
}
function displayResult(result) {
const resultDisplay = document.getElementById('result-display');
const resultNum = document.getElementById('result-num');
const resultDen = document.getElementById('result-den');
const resultText = document.getElementById('result-text');
const errorMessage = document.getElementById('error-message');
const placeholder = document.getElementById('placeholder-text');
resultDisplay.classList.add('hidden');
resultText.classList.add('hidden');
errorMessage.classList.add('hidden');
placeholder.classList.add('hidden');
if (result.error) {
errorMessage.textContent = result.error;
errorMessage.classList.remove('hidden');
return;
}
resultNum.textContent = result.numerator;
resultDen.textContent = result.denominator;
resultDisplay.classList.remove('hidden');
resultText.textContent = `Ответ: ${result.numerator}/${result.denominator}`;
resultText.classList.remove('hidden');
}
function getInputValues() {
const num1 = parseInt(document.getElementById('num1').value) || 0;
const den1 = parseInt(document.getElementById('den1').value) || 1;
const num2 = parseInt(document.getElementById('num2').value) || 0;
const den2 = parseInt(document.getElementById('den2').value) || 1;
if (den1 === 0 || den2 === 0) {
return { error: "Знаменатель дроби не может быть равен нулю!" };
}
return { num1, den1, num2, den2 };
}
function performOperation(operation) {
const inputs = getInputValues();
if (inputs.error) {
displayResult({ error: inputs.error });
return;
}
let result;
switch(operation) {
case 'add':
result = addFractions(inputs.num1, inputs.den1, inputs.num2, inputs.den2);
break;
case 'subtract':
result = subtractFractions(inputs.num1, inputs.den1, inputs.num2, inputs.den2);
break;
case 'multiply':
result = multiplyFractions(inputs.num1, inputs.den1, inputs.num2, inputs.den2);
break;
case 'divide':
result = divideFractions(inputs.num1, inputs.den1, inputs.num2, inputs.den2);
break;
default:
result = { error: "Неизвестная операция" };
}
displayResult(result);
}
document.addEventListener('DOMContentLoaded', function() {
const inputs = document.querySelectorAll('.fraction-input');
inputs.forEach(input => {
input.addEventListener('keypress', function(e) {
if (e.key === 'Enter') {
performOperation('add');
}
});
});
});

146
labWeb/lab9/style.css Normal file
View File

@@ -0,0 +1,146 @@
.fraction-input-group {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.fraction {
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.fraction-input {
width: 80px;
height: 50px;
text-align: center;
font-size: 1.5rem;
font-weight: 600;
border: 2px solid #e5e7eb;
border-radius: 8px;
outline: none;
transition: all 0.2s;
color: #1f2937;
}
.fraction-input:focus {
border-color: #4f46e5;
box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}
.fraction-line {
width: 100%;
height: 3px;
background: linear-gradient(90deg, transparent, #4f46e5, transparent);
border-radius: 2px;
margin: 2px 0;
}
.operation-btn {
background: none;
border: none;
padding: 0;
cursor: pointer;
transition: transform 0.2s;
display: flex;
justify-content: center;
align-items: center;
}
.operation-btn:hover {
transform: scale(1.05);
}
.operation-btn:active {
transform: scale(0.95);
}
.btn-image {
width: 64px;
height: 64px;
display: block;
border-radius: 50%;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
transition: box-shadow 0.2s;
}
.operation-btn:hover .btn-image {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
.result-container {
min-height: 120px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.fraction-result {
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 6px;
}
.fraction-top, .fraction-bottom {
display: block;
padding: 0 20px;
min-width: 60px;
text-align: center;
}
.fraction-line-result {
width: 100%;
min-width: 80px;
height: 3px;
background: linear-gradient(90deg, #4f46e5, #7c3aed, #4f46e5);
border-radius: 2px;
}
#error-message {
margin-top: 10px;
padding: 8px 16px;
background: #fee2e2;
border-radius: 6px;
border-left: 4px solid #ef4444;
}
@media (max-width: 768px) {
.fraction-input {
width: 60px;
height: 40px;
font-size: 1.25rem;
}
.btn-image {
width: 48px;
height: 48px;
}
h1 {
font-size: 1.75rem;
}
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}
#result-display:not(.hidden),
#result-text:not(.hidden) {
animation: fadeIn 0.3s ease-out;
}
.hidden {
display: none !important;
}