diff --git a/static/script.js b/static/script.js index d5f94f7..8ddec47 100644 --- a/static/script.js +++ b/static/script.js @@ -1,47 +1,42 @@ -/* LANGUAGE DROPDOWN */ - -function dropdown_show(obj) -{ - var x = y = 0; - - while(obj) - { - x += obj.offsetLeft; - y += obj.offsetTop; - obj = obj.offsetParent; +function dropdown_show(el) { + let x = 0; + let y = 0; + while (el) { + x += el.offsetLeft; + y += el.offsetTop; + el = el.offsetParent; } - - ddown = document.getElementById("lang-dropdown"); + const ddown = document.getElementById("lang-dropdown"); ddown.style.display = "block"; - ddown.style.left = (x - 72) + "px"; - - if (ddown.offsetLeft + ddown.offsetWidth +10 > document.body.offsetWidth) - { - ddown.style.left = document.body.offsetWidth - ddown.offsetWidth - 82 + "px"; + ddown.style.left = (x - 72) + "px"; + if (ddown.offsetLeft + ddown.offsetWidth + 10 > document.body.offsetWidth) { + ddown.style.left = (document.body.offsetWidth - ddown.offsetWidth - 82) + "px"; } - ddown.style.top = (y + 48) + "px"; - op = 0; - appear(1); + fade_to(ddown, 1); } -function dropdown_hide() -{ - ddown = document.getElementById("lang-dropdown"); - ddown.style.display="none"; -} - -function appear(x) -{ - if(op < x) - { - op += 0.2; - ddown.style.opacity = op; - ddown.style.filter = 'alpha(opacity=' + op * 100 + ')'; +function dropdown_hide(e) { + for (let t = e && e.target; t; t = t.parentElement) { + if (t.id === "lang-dropdown" || t.id === "lang-butt") return; } + const ddown = document.getElementById("lang-dropdown"); + fade_to(ddown, 0, function() { + ddown.style.display = "none"; + }); } -function checkkey(e) { - var keycode = window.event ? e.keyCode : e.which; - if (keycode == 27) { dropdown_hide(); } +function fade_to(el, target, done) { + const from = parseFloat(el.style.opacity) || 0; + const delta = target - from; + let start; + function step(ts) { + if (!start) start = ts; + const t = Math.min((ts - start) / 200, 1); + el.style.opacity = from + delta * t; + if (t < 1) requestAnimationFrame(step); + else if (done) done(); + } + requestAnimationFrame(step); } + diff --git a/templates/download.html b/templates/download.html index 6a55fb0..3fdb5f6 100644 --- a/templates/download.html +++ b/templates/download.html @@ -1,5 +1,5 @@ - + {% include 'tmpl/_header.htm' %} diff --git a/templates/index.html b/templates/index.html index 4e11f4d..2eaa4c1 100644 --- a/templates/index.html +++ b/templates/index.html @@ -1,5 +1,5 @@ - + {% include 'tmpl/_header.htm' %} @@ -20,4 +20,4 @@ {% include 'tmpl/_footer.htm' %} - \ No newline at end of file +