diff --git a/app/assets/images/ajax-loader-facebook.gif b/app/assets/images/ajax-loader-facebook.gif new file mode 100644 index 00000000000..6350e5f45b6 Binary files /dev/null and b/app/assets/images/ajax-loader-facebook.gif differ diff --git a/app/assets/javascripts/loader.js b/app/assets/javascripts/loader.js new file mode 100644 index 00000000000..6fa0b525814 --- /dev/null +++ b/app/assets/javascripts/loader.js @@ -0,0 +1,11 @@ +var Loader = { + img_src: "/assets/ajax-loader.gif", + + html: + function(width) { + img = $(""); + img.attr("width", width); + img.attr("src", this.img_src); + return img; + } +} diff --git a/app/assets/stylesheets/projects.css.scss b/app/assets/stylesheets/projects.css.scss index dd897ed39bb..f923deb2126 100644 --- a/app/assets/stylesheets/projects.css.scss +++ b/app/assets/stylesheets/projects.css.scss @@ -581,3 +581,9 @@ h4.middle-panel { } } } + +.dashboard-loader { + float:right; + margin-right:30px; + display:none; +} diff --git a/app/views/dashboard/_menu.html.haml b/app/views/dashboard/_menu.html.haml index 2cb45fa7e61..0d04899c37d 100644 --- a/app/views/dashboard/_menu.html.haml +++ b/app/views/dashboard/_menu.html.haml @@ -2,12 +2,20 @@ = link_to "Activities", dashboard_path, :remote => true, :class => "button-small dash-button #{"active" if current_page?(dashboard_path) || current_page?(root_path) }", :id => "activities_slide" = link_to "Issues", dashboard_issues_path, :remote => true, :class => "button-small dash-button #{"active" if current_page?(dashboard_issues_path)}", :id => "issues_slide" = link_to "Merge Requests", dashboard_merge_requests_path, :remote => true, :class => "button-small dash-button #{"active" if current_page?(dashboard_merge_requests_path)}", :id => "merge_requests_slide" - + %img{:src => "/assets/ajax-loader-facebook.gif", :class => "dashboard-loader"} :javascript $(function(){ $(".dash-button").live("click", function() { $(".dash-button").removeClass("active"); $(this).addClass("active"); - }) + }); + + $(".dash-button").live("ajax:before", function() { + $(".dashboard-loader").show(); + }); + + $(".dash-button").live("ajax:complete", function() { + $(".dashboard-loader").hide(); + }); });