[enh] Cleanup flash alert display.

This commit is contained in:
opi 2015-10-11 07:33:49 +02:00
parent 52eb6201fe
commit dc4f9649d6
5 changed files with 48 additions and 24 deletions

View file

@ -498,3 +498,15 @@ input[type='radio'].nice-radio {
} }
} }
} }
/** Alert messages **/
.alert {}
.alert-log {
p {display: none;}
.btn-show-log {
.btn();
.btn-default();
.btn-sm();
}
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -23,7 +23,7 @@
</span> </span>
</header> </header>
<div id="flash" role="alert" style="display: none"></div> <div id="flash" role="alert"></div>
<div id="slider-container"> <div id="slider-container">

View file

@ -71,26 +71,37 @@ var app = Sammy('#main', function (sam) {
if (!store.get('flash')) { if (!store.get('flash')) {
store.set('flash', true); store.set('flash', true);
} }
if (level == 'fail') { alertClass = 'alert-danger'; }
else { alertClass = 'alert-'+ level; } var flashContainer = $('#flash'),
if ($('#flash .alert').last().hasClass(alertClass)) { lastFlashAlert = $('.alert:last-child', flashContainer),
alertClass = (level !== 'fail') ? alertClass = 'alert-'+ level : 'alert-danger';
// If last alert has the same class, append content into it
if (lastFlashAlert.hasClass(alertClass)) {
lastFlashAlert.append('<p>'+ message +'</p>');
}
// Else, create a new alert box
else {
var alertCloseButton = '<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>';
if (level == 'log') { if (level == 'log') {
$('#flash .alert').last().append('<p style="display: none">'+ message +'</p>'); // Log messages could be very long
} else { // Hidden by default with a "view log" button
$('#flash .alert').last().append('<p>'+ message +'</p>'); flashContainer
} .append('<pre class="alert alert-dismissable '+ alertClass +'">'+alertCloseButton+
} else { '<button type="button" class="btn-show-log">'+ y18n.t('log') +'</button>'+
if (level == 'log') { '<p>'+ message +'</p></pre>')
$('#flash').append('<pre style="display:none" class="alert alert-dismissable '+ alertClass +'"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button><button type="button" class="btn btn-default btn-small" data-show="log">'+ y18n.t('log') +'</button><p style="display: none">'+ message +'</p></pre>').show(); .find('.btn-show-log').on('click', function() {
} else {
$('#flash').append('<div style="display:none" class="alert alert-dismissable '+ alertClass +'"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button><p>'+ message +'</p></div>').show();
}
$('#flash .alert').last().fadeIn();
}
document.body.scrollTop = document.documentElement.scrollTop = 0;
$('#flash [data-show="log"]').on('click', function() {
$(this).hide().nextAll('p').fadeIn(); $(this).hide().nextAll('p').fadeIn();
}); });
} else {
flashContainer
.append('<div class="alert alert-dismissable '+ alertClass +'">'+alertCloseButton+
'<p>'+ message +'</p></div>');
}
}
// Scroll to the top
document.body.scrollTop = document.documentElement.scrollTop = 0;
}, },
checkInstall: function(callback) { checkInstall: function(callback) {
@ -444,7 +455,7 @@ var app = Sammy('#main', function (sam) {
// Clear flash display // Clear flash display
if (!store.get('flash')) { if (!store.get('flash')) {
$('#flash').fadeOut(function() { $('#flash').html(''); }); $('#flash').fadeOut(function() { $('#flash').html('').show(); });
} }
}); });