Last active

Embed URL

HTTPS clone URL

SSH clone URL

You can clone with HTTPS or SSH.

Download Gist

Simple loading spinner for long requests with turbolinks and bootstrap modal

View loading_spinner.coffee
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
@PageSpinner =
spin: (ms=500)->
@spinner = setTimeout( (=> @add_spinner()), ms)
$(document).on 'page:change', =>
@remove_spinner()
spinner_html: '
<div class="modal hide fade" id="page-spinner">
<div class="modal-head card-title">Please Wait...</div>
<div class="modal-body card-body">
<i class="icon-spinner icon-spin icon-2x"></i>
&emsp;Loading...
</div>
</div>
'
spinner: null
add_spinner: ->
$('body').append(@spinner_html)
$('body div#page-spinner').modal()
remove_spinner: ->
clearTimeout(@spinner)
$('div#page-spinner').modal('hide')
$('div#page-spinner').on 'hidden', ->
$(this).remove()
 
$(document).on 'page:fetch', ->
PageSpinner.spin()
View loading_spinner.coffee
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
this.PageSpinner = {
spin: function(ms) {
var _this = this;
if (ms == null) {
ms = 500;
}
this.spinner = setTimeout((function() {
return _this.add_spinner();
}), ms);
return $(document).on('page:change', function() {
return _this.remove_spinner();
});
},
spinner_html: '\
<div class="modal hide fade" id="page-spinner">\
<div class="modal-head card-title">Please Wait...</div>\
<div class="modal-body card-body">\
<i class="icon-spinner icon-spin icon-2x"></i>\
&emsp;Loading...\
</div>\
</div>\
',
spinner: null,
add_spinner: function() {
$('body').append(this.spinner_html);
return $('body div#page-spinner').modal();
},
remove_spinner: function() {
clearTimeout(this.spinner);
$('div#page-spinner').modal('hide');
return $('div#page-spinner').on('hidden', function() {
return $(this).remove();
});
}
};
 
$(document).on('page:fetch', function() {
return PageSpinner.spin();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.