Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-24 23:48:13 -05:00
Code Issues Activity

abstract mobile interactions js

Browse source 
DRY up repeated code and simplify logic.
This commit is contained in:
Sam Saccone 2014-02-19 14:55:30 -05:00
parent 5f28ea1bae
commit 7ff076c054
1 changed files with 22 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
ghost/admin/mobile-interactions.js
View file

@ -7,54 +7,56 @@
FastClick.attach(document.body); FastClick.attach(document.body);
// ### general wrapper to handle conditional screen size actions
function responsiveAction(event, mediaCondition, cb) {
if (!window.matchMedia(mediaCondition).matches) {
return;
}
event.preventDefault();
event.stopPropagation();
cb();
}
// ### Show content preview when swiping left on content list // ### Show content preview when swiping left on content list
$('.manage').on('click', '.content-list ol li', function (event) { $('.manage').on('click', '.content-list ol li', function (event) {
if (window.matchMedia('(max-width: 800px)').matches) { responsiveAction(event, '(max-width: 800px)', function () {
event.preventDefault();
event.stopPropagation();
$('.content-list').animate({right: '100%', left: '-100%', 'margin-right': '15px'}, 300); $('.content-list').animate({right: '100%', left: '-100%', 'margin-right': '15px'}, 300);
$('.content-preview').animate({right: '0', left: '0', 'margin-left': '0'}, 300); $('.content-preview').animate({right: '0', left: '0', 'margin-left': '0'}, 300);
} });
}); });
// ### Hide content preview // ### Hide content preview
$('.manage').on('click', '.content-preview .button-back', function (event) { $('.manage').on('click', '.content-preview .button-back', function (event) {
if (window.matchMedia('(max-width: 800px)').matches) { responsiveAction(event, '(max-width: 800px)', function () {
event.preventDefault();
event.stopPropagation();
$('.content-list').animate({right: '0', left: '0', 'margin-right': '0'}, 300); $('.content-list').animate({right: '0', left: '0', 'margin-right': '0'}, 300);
$('.content-preview').animate({right: '-100%', left: '100%', 'margin-left': '15px'}, 300); $('.content-preview').animate({right: '-100%', left: '100%', 'margin-left': '15px'}, 300);
} });
}); });
// ### Show settings options page when swiping left on settings menu link // ### Show settings options page when swiping left on settings menu link
$('.settings').on('click', '.settings-menu li', function (event) { $('.settings').on('click', '.settings-menu li', function (event) {
if (window.matchMedia('(max-width: 800px)').matches) { responsiveAction(event, '(max-width: 800px)', function () {
event.preventDefault();
event.stopPropagation();
$('.settings-sidebar').animate({right: '100%', left: '-102%', 'margin-right': '15px'}, 300); $('.settings-sidebar').animate({right: '100%', left: '-102%', 'margin-right': '15px'}, 300);
$('.settings-content').animate({right: '0', left: '0', 'margin-left': '0'}, 300); $('.settings-content').animate({right: '0', left: '0', 'margin-left': '0'}, 300);
$('.settings-content .button-back, .settings-content .button-save').css('display', 'inline-block'); $('.settings-content .button-back, .settings-content .button-save').css('display', 'inline-block');
} });
}); });
// ### Hide settings options page // ### Hide settings options page
$('.settings').on('click', '.settings-content .button-back', function (event) { $('.settings').on('click', '.settings-content .button-back', function (event) {
if (window.matchMedia('(max-width: 800px)').matches) { responsiveAction(event, '(max-width: 800px)', function () {
event.preventDefault();
event.stopPropagation();
$('.settings-sidebar').animate({right: '0', left: '0', 'margin-right': '0'}, 300); $('.settings-sidebar').animate({right: '0', left: '0', 'margin-right': '0'}, 300);
$('.settings-content').animate({right: '-100%', left: '100%', 'margin-left': '15'}, 300); $('.settings-content').animate({right: '-100%', left: '100%', 'margin-left': '15'}, 300);
$('.settings-content .button-back, .settings-content .button-save').css('display', 'none'); $('.settings-content .button-back, .settings-content .button-save').css('display', 'none');
} });
}); });
// ### Toggle the sidebar menu // ### Toggle the sidebar menu
$('[data-off-canvas]').on('click', function (event) { $('[data-off-canvas]').on('click', function (event) {
if (window.matchMedia('(max-width: 650px)').matches) { responsiveAction(event, '(max-width: 650px)', function () {
event.preventDefault();
$('body').toggleClass('off-canvas'); $('body').toggleClass('off-canvas');
} });
}); });
}()); }());