mirrors/wagtail
mirrors/wagtail
0
0
Fork 0
mirror of https://github.com/wagtail/wagtail.git synced 2024-11-29 09:33:54 +01:00
Code Issues Releases Wiki Activity

Move logo animation code to core.js, as per https://github.com/wagtail/wagtail/pull/3740#pullrequestreview-55668086

Browse Source
This commit is contained in:
Matt Westcott 2017-08-11 11:04:18 +01:00
parent 2e81c30ca5
commit 7a1455551b
2 changed files with 49 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
wagtail/wagtailadmin/static_src/wagtailadmin/js/core.js
View File

@ -110,6 +110,55 @@ $(function() {
fitNav();
});
// Logo interactivity
function initLogo() {
var sensitivity = 8; // the amount of times the user must stroke the wagtail to trigger the animation
var $logoContainer = $('.wagtail-logo-container__desktop');
var mouseX = 0;
var lastMouseX = 0;
var dir = '';
var lastDir = '';
var dirChangeCount = 0;
function enableWag() {
$logoContainer.removeClass('logo-serious').addClass('logo-playful');
}
function disableWag() {
$logoContainer.removeClass('logo-playful').addClass('logo-serious');
}
$logoContainer.mousemove(function(event) {
mouseX = event.pageX;
if (mouseX > lastMouseX) {
dir = 'r';
} else if (mouseX < lastMouseX) {
dir = 'l';
}
if (dir != lastDir && lastDir != '') {
dirChangeCount += 1;
}
if (dirChangeCount > sensitivity) {
enableWag();
}
lastMouseX = mouseX;
lastDir = dir;
});
$logoContainer.mouseleave(function() {
dirChangeCount = 0;
disableWag();
});
disableWag();
}
initLogo();
// Enable nice focus effects on all fields. This enables help text on hover.
$(document).on('focus mouseover', 'input,textarea,select', function() {
$(this).closest('.field').addClass('focused');

52
wagtail/wagtailadmin/templates/wagtailadmin/base.html
View File

@ -48,55 +48,3 @@
</div>
</div>
{% endblock %}
{# Animation easter-egg: #}
{% block extra_js %}
<script>
$(function() {
var sensitivity = 8; // the amount of times the user must stroke the wagtail to trigger the animation
var $logoContainer = $('.wagtail-logo-container__desktop');
var mouseX = 0;
var lastMouseX = 0;
var dir = '';
var lastDir = '';
var dirChangeCount = 0;
function enableWag() {
$logoContainer.removeClass('logo-serious').addClass('logo-playful');
}
function disableWag() {
$logoContainer.removeClass('logo-playful').addClass('logo-serious');
}
$logoContainer.mousemove(function(event) {
mouseX = event.pageX;
if (mouseX > lastMouseX) {
dir = 'r';
} else if (mouseX < lastMouseX) {
dir = 'l';
}
if (dir != lastDir && lastDir != '') {
dirChangeCount += 1;
}
if (dirChangeCount > sensitivity) {
enableWag();
}
lastMouseX = mouseX;
lastDir = dir;
})
$logoContainer.mouseleave(function() {
dirChangeCount = 0;
disableWag();
})
disableWag();
})
</script>
{% endblock %}