Nemcio/Grav-Admin-Plugin
1
0
Fork 0
mirror of https://github.com/getgrav/grav-plugin-admin.git synced 2025-11-18 03:00:56 +01:00
Code Issues Packages Projects Releases Activity

Logic to use custom popup when clicking on any link with unsaved changes

Browse Source 
Preventing unload popup from appearing when hitting save/copy
This commit is contained in:
Djamil Legato
2014-09-18 11:29:10 -07:00
parent f362efa697
commit 2cb044ca5c
1 changed files with 70 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
themes/grav/templates/pages.html.twig
View File

@@ -78,16 +78,6 @@
<label for="expert">Expert</label> <label for="expert">Expert</label>
<a></a> <a></a>
</div> </div>
<script>
$("#admin-mode-toggle input[name=mode-switch]").on('change', function(e){
var value = $(this).val();
// little timeout to show off the animation
setTimeout(function(){
window.location.href = '{{ uri.route(true) }}' + ((value == 'expert') ? '/expert:1' : '');
}, 200)
});
</script>
</form> </form>
{% endif %} {% endif %}
@@ -149,15 +139,77 @@
}; };
$(function(){ $(function(){
var currentValues = getState(); var currentValues = getState(),
clickedLink;
$('#admin-main button').on('click', function(){
$(window).off('beforeunload');
});
$("#admin-mode-toggle input[name=mode-switch]").on('change', function(e){
var value = $(this).val();
if (currentValues == getState()) {
setTimeout(function(){
window.location.href = '{{ uri.route(true) }}' + ((value == 'expert') ? '/expert:1' : '');
}, 200)
return true;
}
e.preventDefault();
var confirm = $.remodal.lookup[$('[data-remodal-id=changes]').data('remodal')],
buttons = $('[data-remodal-id=changes] a.button'),
action;
buttons.on('click', function(e){
e.preventDefault();
action = $(this).data('leave-action');
buttons.off('click');
confirm.close();
if (action == 'continue') {
$(window).off('beforeunload');
window.location.href = '{{ uri.route(true) }}' + ((value == 'expert') ? '/expert:1' : '');
} else {
$('input[name=mode-switch][checked]').prop('checked', true);
}
});
confirm.open();
});
$('a[href]:not([href^=#])').on('click', function(e){
if (currentValues != getState()){
e.preventDefault();
clickedLink = $(this).attr('href');
var confirm = $.remodal.lookup[$('[data-remodal-id=changes]').data('remodal')],
buttons = $('[data-remodal-id=changes] a.button'),
action;
buttons.on('click', function(e){
e.preventDefault();
action = $(this).data('leave-action');
buttons.off('click');
confirm.close();
if (action == 'continue') {
$(window).off('beforeunload');
window.location.href = clickedLink;
}
});
confirm.open();
}
});
$(window).on('beforeunload', function(){ $(window).on('beforeunload', function(){
if (currentValues != getState()){ if (currentValues != getState()){
setTimeout(function() {
setTimeout(function() {
$('input[name=mode-switch][checked]').prop('checked', true);
}, 10);
},1);
return "You have made changes on this page that you have not yet confirmed. If you navigate away from this page you will lose your unsaved changes"; return "You have made changes on this page that you have not yet confirmed. If you navigate away from this page you will lose your unsaved changes";
} }
}); });
@@ -176,8 +228,8 @@
</p> </p>
<br> <br>
<div class="button-bar"> <div class="button-bar">
<a class="button secondary" href="#"><i class="fa fa-fw fa-close"></i> Cancel</a> <a class="button secondary" data-leave-action="cancel" href="#"><i class="fa fa-fw fa-close"></i> Cancel</a>
<a class="button" href="#"><i class="fa fa-fw fa-check"></i>Continue</a> <a class="button" data-leave-action="continue" href="#"><i class="fa fa-fw fa-check"></i>Continue</a>
</div> </div>
</form> </form>
</div> </div>