ajax-loader for dashboard

Dmitriy Zaporozhets
1 parent 8426846d
Showing 4 changed files with 27 additions and 2 deletions Show diff stats
app/assets/images/ajax-loader-facebook.gif
app/assets/javascripts/loader.js
app/assets/stylesheets/projects.css.scss
app/views/dashboard/_menu.html.haml
@@ -0,0 +1,11 @@
+var Loader = { 
+  img_src: "/assets/ajax-loader.gif", 
+
+  html: 
+    function(width) { 
+      img = $("<img>");
+      img.attr("width", width);
+      img.attr("src", this.img_src);
+      return img;
+    }
+}
@@ -581,3 +581,9 @@ h4.middle-panel {
     }
   }
 }
+
+.dashboard-loader { 
+  float:right;
+  margin-right:30px;
+  display:none;
+}
@@ -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();
+    });
   });
@@ -0,0 +1,11 @@		@@ -0,0 +1,11 @@
	1	+var Loader = {
	2	+ img_src: "/assets/ajax-loader.gif",
	3	+
	4	+ html:
	5	+ function(width) {
	6	+ img = $("<img>");
	7	+ img.attr("width", width);
	8	+ img.attr("src", this.img_src);
	9	+ return img;
	10	+ }
	11	+}
	@@ -581,3 +581,9 @@ h4.middle-panel {		@@ -581,3 +581,9 @@ h4.middle-panel {
581	}	581	}
582	}	582	}
583	}	583	}
		584	+
		585	+.dashboard-loader {
		586	+ float:right;
		587	+ margin-right:30px;
		588	+ display:none;
		589	+}