perf: Optimize JS

This commit is contained in:
Sweetbread 2025-01-31 16:37:45 +03:00
parent 1c7ef9650d
commit 7621f1d69e
5 changed files with 31 additions and 37 deletions

View File

@ -0,0 +1,28 @@
function showPopup() {
const popup = document.getElementById("popup");
const sqlInpt = document.getElementById("sqlInpt");
popup.classList.remove('slideoutHelp');
sqlInpt.classList.remove('slideoutInpt');
popup.style.display = "block";
setTimeout(() => {
popup.classList.add('slideinHelp')
sqlInpt.classList.add('slideinInpt')
}, 1);
}
function hidePopup() {
const popup = document.getElementById("popup");
const sqlInpt = document.getElementById("sqlInpt");
sqlInpt.classList.remove('slideinInpt');
sqlInpt.classList.add('slideoutInpt')
popup.classList.remove('slideinHelp');
popup.classList.add('slideoutHelp');
setTimeout(() => {
popup.style.display = "none"
popup.style.position = "absolute"
}, 1000);
}

View File

@ -1,34 +0,0 @@
(function(window, document, undefined) {
// code that should be taken care of right away
window.onload = init;
function init(){
const popup = document.getElementById("popup");
const help = document.getElementById("help");
const sqlInpt = document.getElementById("sqlInpt");
function showPopup() {
popup.classList.remove('slideoutHelp');
sqlInpt.classList.remove('slideoutInpt');
popup.style.display = "block";
setTimeout(() => popup.classList.add('slideinHelp'), 1);
setTimeout(() => sqlInpt.classList.add('slideinInpt'), 1);
}
function hidePopup() {
sqlInpt.classList.remove('slideinInpt');
popup.classList.remove('slideinHelp');
setTimeout(() => {popup.style.display = "none"}, 1000);
setTimeout(() => {popup.style.position = "absolute"}, 1000);
popup.classList.add('slideoutHelp');
sqlInpt.classList.add('slideoutInpt')
}
help.addEventListener("click", showPopup);
popup.addEventListener("click", hidePopup);
}
})(window, document, undefined);

View File

@ -1,6 +1,6 @@
<head>
<link rel="stylesheet" href="{{ url_for('static', filename='index.css') }}">
<script src="{{ url_for('static', filename='scripts/index.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/animation.js') }}"></script>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/base16/ros-pine-moon.min.css">

View File

@ -11,7 +11,7 @@
{% block content -%}{% endblock -%}
{% include '_sidenav.html' %}
<img id="help" src="{{ url_for('static', filename='imgs/icon.png') }}">
<img id="help" onclick="showPopup()" src="{{ url_for('static', filename='imgs/icon.png') }}">
</body>
</html>

View File

@ -2,7 +2,7 @@
{% block content%}
<div class="container">
<div id="popup" class="sql-guide divv">
<div id="popup" onclick="hidePopup()" class="sql-guide divv">
<p class="simpletext">Это так называемая SQL-инъекция - уязвимость в системах, где отправляются SQL запросы, например регистрационные формы. <br />
<p class="simpletext">Как именно это работает? Все дело в том, что запрос отправляется без проверки на то, что пользователь туда ввёл. С использованием синтаксиса запроса можно указать себе логин 'admin', а часть с проверкой пароля просто-напросто закомментировать.</p>
<pre><code class="python">login = request.form['login']