perf: Optimize JS
This commit is contained in:
parent
1c7ef9650d
commit
7621f1d69e
28
static/scripts/animation.js
Normal file
28
static/scripts/animation.js
Normal 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);
|
||||
}
|
@ -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);
|
||||
|
@ -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">
|
||||
|
@ -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>
|
||||
|
@ -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']
|
||||
|
Loading…
x
Reference in New Issue
Block a user