Ajax branch/tag switch for tree view

app/assets/javascripts/tree.js

@@ -5,13 +5,16 @@
 var Tree = { 
   init: 
     function() { 
-      (new Image).src = "/assets/ajax-loader-facebook.gif";
-
-      $('#tree-slider .tree-item-file-name a, .breadcrumb a').live("click", function() {
-        history.pushState({ path: this.path }, '', this.href)
+      $('#tree-slider .tree-item-file-name a, .breadcrumb li > a').live("click", function() {
         $("#tree-content-holder").hide("slide", { direction: "left" }, 150)
       })
 
+      $('.project-refs-form').live({
+        "ajax:beforeSend": function() { 
+          $("#tree-content-holder").hide("slide", { direction: "left" }, 150); 
+        }
+      })
+
       $("#tree-slider .tree-item").live('click', function(e){
         if(e.target.nodeName != "A") {
           link = $(this).find(".tree-item-file-name a");
@@ -19,7 +22,7 @@ var Tree = {
         }
       });
 
-      $('#tree-slider td.tree-item-file-name a, .breadcrumb a').live({ 
+      $('#tree-slider .tree-item-file-name a, .breadcrumb a, .project-refs-form').live({ 
         "ajax:beforeSend": function() { $('.tree_progress').addClass("loading"); },
         "ajax:complete": function() { $('.tree_progress').removeClass("loading"); } 
       });

app/assets/stylesheets/common.scss

@@ -9,7 +9,7 @@ $active_bg_color:#79C3E0;
 $active_bd_color: #2FA0BB;
 $border_color:#CCC;
 $lite_border_color:#EEE;
-$min_app_width:940px;
+$min_app_width:980px;
 $max_app_width:980px;
 $app_padding:20px;
 $bg_color: #FFF;

app/assets/stylesheets/projects.css.scss

@@ -15,17 +15,6 @@
 .handle:hover {
   cursor:move;
 }
-.project-refs-form {
-  span {
-    background:none !important;
-    position:static !important;
-    width:auto !important;
-    height:auto !important;
-  }
-}
-.project-refs-select {
-  width:200px;
-}
 
 /* Project Dashboard Page */
 .news-feed h2 {
@@ -151,3 +140,54 @@ a.project-update.titled {
   height: 70%;
   overflow: hidden;
 }
+
+
+/** Branch/tag selector **/
+.project-refs-form {
+  margin:0;
+  span {
+    background:none !important;
+    position:static !important;
+    width:auto !important;
+    height:auto !important;
+  }
+}
+.project-refs-select {
+  width:120px;
+}
+
+.project-refs-form .chzn-container { 
+  position:relative;
+  top: -5px;
+  left: -11px;
+
+  .chzn-drop { 
+    margin:7px 0;
+    border: 1px solid #CCC;
+    min-width: 300px;
+
+    .chzn-results { 
+      max-height:300px;
+    }
+
+    .chzn-search input {
+      min-width:200px;
+    }
+  }
+
+  .chzn-single { 
+    background:#ddd;
+    //border:none;
+    //box-shadow:none;
+
+    div { 
+      background:transparent;
+      border-left:none;
+    }
+
+    span { 
+      font-weight: normal;
+    }
+  }
+}
+

app/assets/stylesheets/top_panel.scss

@@ -105,35 +105,6 @@ body header {
 }
 
 
-.top_panel_holder .chzn-container { 
-  position:relative;
-
-  .chzn-drop { 
-    margin:7px 0;
-    border: 1px solid #CCC;
-    min-width: 300px;
-
-    .chzn-results { 
-      max-height:300px;
-    }
-  }
-
-  .chzn-single { 
-    background:transparent;
-    -moz-border-radius: 4px;
-    border-radius: 4px;
-
-    div { 
-      background:transparent;
-      border-left:none;
-    }
-
-    span { 
-      font-weight: normal;
-    }
-  }
-}
-
 .rss-icon { 
   margin:0 15px;
   padding:3px;

app/assets/stylesheets/tree.scss

@@ -8,13 +8,10 @@
 }
 
 .tree_progress { 
-  float:left;
-  width:16px;
-  height:16px;
-  margin:2px 6px;
+  display:none;
+  margin:20px;
   &.loading { 
-    background-position: 0px 0px;
-    background: url("ajax-loader-facebook.gif") no-repeat;
+    display:block;
   }
 }
 

app/controllers/refs_controller.rb

@@ -13,6 +13,8 @@ class RefsController < ApplicationController
   layout "project"
 
   def switch 
+    respond_to do |format| 
+      format.html do 
         new_path = if params[:destination] == "tree"
                      tree_project_ref_path(@project, params[:ref]) 
                    else
@@ -21,6 +23,13 @@ class RefsController < ApplicationController
 
         redirect_to new_path 
       end
+      format.js do 
+        @ref = params[:ref]
+        define_tree_vars
+        render "tree"
+      end
+    end
+  end
 
   #
   # Repository preview

app/views/layouts/_head_panel.html.haml

@@ -11,7 +11,7 @@
           = truncate @project.name, :length => 28
         .git_url_wrapper
           %input.git-url.text{:id => "", :name => "", :readonly => "", :type => "text", :value => @project.url_to_repo, :class => "one_click_select"}
-        - if @project.repo_exists?
+        -#- if @project.repo_exists?
           .left{:style => "margin-left:5px;"}
             = render :partial => "projects/refs", :locals => { :destination => controller.controller_name == "commits" ? "commits" : "tree" }
         = yield :rss_icon

app/views/layouts/_project_side.html.haml

@@ -6,8 +6,8 @@
 
       - if @project.repo_exists?
         = link_to "Repository", project_repository_path(@project), :class => repository_tab_class
-        = link_to "Tree", tree_project_ref_path(@project, @ref || @project.root_ref), :class => tree_tab_class
-        = link_to "Commits", project_commits_path(@project, :ref => (@ref || @project.root_ref)), :class => (controller.controller_name == "commits") ? "current" : nil
+        = link_to "Tree", tree_project_ref_path(@project), :class => tree_tab_class
+        = link_to "Commits", project_commits_path(@project), :class => (controller.controller_name == "commits") ? "current" : nil
         = link_to "Network", graph_project_path(@project), :class => current_page?(:controller => "projects", :action => "graph", :id => @project) ? "current" : nil
         = link_to  project_issues_filter_path(@project), :class => (controller.controller_name == "issues") ? "current" : nil do
           Issues

app/views/layouts/_project_side_right.html.haml

@@ -6,38 +6,41 @@
       = yield :sidebar_top_block
     - else
       - if can? current_user, :write_project, @project
-        %h4 Report
-        %ul
-          %li
-            = link_to new_project_issue_path(@project), :title => "New Issue", :class => "" do 
+        .alert-message.block-message.info
+          You have access to create new issue or merge request.
+          %div
+            = link_to new_project_issue_path(@project), :title => "New Issue", :class => "btn small" do 
               New Issue »
-          %li
-            = link_to new_project_merge_request_path(@project), :title => "New Merge Request", :class => "" do 
+          %div
+            = link_to new_project_merge_request_path(@project), :title => "New Merge Request", :class => "btn small" do 
               New Merge Request »
 
-    %h4
+  - if current_user.projects.count > 0
+    %div.entry
+      %h5
         Recent Projects:
       %ul
         - current_user.projects.order("id DESC").limit(5).each do |project|
           %li
             = link_to project_path(project) do
               = project.name
+      = link_to "More  » ", projects_path
 
-    %h4
-      Recent Issues:
-    %ul
-      - current_user.assigned_issues.order("id DESC").limit(5).each do |issue|
-        %li
-          = link_to project_issue_path(issue.project, issue) do
-            = truncate issue.title
+    -#%h4
+      -#Recent Issues:
+    -#%ul
+      -#- current_user.assigned_issues.order("id DESC").limit(5).each do |issue|
+        -#%li
+          -#= link_to project_issue_path(issue.project, issue) do
+            -#= truncate issue.title
 
 
-    %h4
-      Recent Requests:
-    %ul
-      - current_user.assigned_merge_requests.order("id DESC").limit(5).each do |issue|
-        %li
-          = link_to project_merge_request_path(issue.project, issue) do
-            = truncate issue.title
+    -#%h4
+      -#Recent Requests:
+    -#%ul
+      -#- current_user.assigned_merge_requests.order("id DESC").limit(5).each do |issue|
+        -#%li
+          -#= link_to project_merge_request_path(issue.project, issue) do
+            -#= truncate issue.title
 
 

app/views/layouts/_projects_side.html.haml

@@ -7,29 +7,32 @@
       = link_to new_project_path, :class => "btn small" do 
         New Project
 
-  %h4
+  - if current_user.projects.count > 0
+    %div.entry
+      %h5
         Recent Projects:
       %ul
         - current_user.projects.order("id DESC").limit(5).each do |project|
           %li
             = link_to project_path(project) do
               = project.name
+      = link_to "More  » ", projects_path
 
-  %h4
-    Recent Issues:
-  %ul
-    - current_user.assigned_issues.order("id DESC").limit(5).each do |issue|
-      %li
-        = link_to project_issue_path(issue.project, issue) do
-          = truncate issue.title
+  -#%h5
+    -#Your Issues:
+  -#%ul
+    -#- current_user.assigned_issues.order("id DESC").limit(5).each do |issue|
+      -#%li
+        -#= link_to project_issue_path(issue.project, issue) do
+          -#= truncate issue.title
 
 
-  %h4
-    Recent Requests:
-  %ul
-    - current_user.assigned_merge_requests.order("id DESC").limit(5).each do |issue|
-      %li
-        = link_to project_merge_request_path(issue.project, issue) do
-          = truncate issue.title
+  -#%h5
+    -#Your Merge Requests:
+  -#%ul
+    -#- current_user.assigned_merge_requests.order("id DESC").limit(5).each do |issue|
+      -#%li
+        -#= link_to project_merge_request_path(issue.project, issue) do
+          -#= truncate issue.title
 
 

app/views/refs/_tree.html.haml

 %ul.breadcrumb
+  %li
+    = form_tag switch_project_refs_path(@project), :method => :get, :class => "project-refs-form left", :remote => true do
+      = select_tag "ref", grouped_options_refs, :onchange => "$(this.form).trigger('submit');", :class => "project-refs-select"
+      = hidden_field_tag :destination, "tree"
+      = hidden_field_tag :path, params[:path]
+
   %li
     = link_to tree_project_ref_path(@project, @ref, :path => nil), :remote => true do
       = @project.code
   - tree.breadcrumbs(6) do |link|
     \/
     %li= link
-  %span.tree_progress
 .clear
+%div.tree_progress
+  = image_tag "ajax-loader.gif"
 #tree-content-holder
   - if tree.is_blob?
     = render :partial => "refs/tree_file", :locals => { :name => tree.name, :content => tree.data, :file => tree }
@@ -42,12 +49,20 @@
           - else
             = simple_format(content.data)
 
+- if params[:path]
+  - history_path = tree_file_project_ref_path(@project, @ref, params[:path])
+- else
+  - history_path = tree_project_ref_path(@project, @ref)
 :javascript
   $(function(){
     $('select#branch').selectmenu({style:'popup', width:200});
     $('select#tag').selectmenu({style:'popup', width:200});
+    $('.project-refs-select').chosen();
+
+    history.pushState({ path: this.path }, '', "#{history_path}")
   });
 
+
 - if params[:path] && request.xhr?
   :javascript
     $(window).unbind('popstate');