From ae5faf0fd32160dd46a7e94e230d241de8ec4e38 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Sun, 29 Jan 2012 21:30:03 +0200 Subject: [PATCH] Ajax branch/tag switch for tree view --- app/assets/javascripts/tree.js | 13 ++-- app/assets/stylesheets/common.scss | 2 +- app/assets/stylesheets/projects.css.scss | 62 +++++++++++++++---- app/assets/stylesheets/top_panel.scss | 29 --------- app/assets/stylesheets/tree.scss | 9 +-- app/controllers/refs_controller.rb | 21 +++++-- app/views/layouts/_head_panel.html.haml | 2 +- app/views/layouts/_project_side.html.haml | 4 +- .../layouts/_project_side_right.html.haml | 57 +++++++++-------- app/views/layouts/_projects_side.html.haml | 45 +++++++------- app/views/refs/_tree.html.haml | 17 ++++- 11 files changed, 151 insertions(+), 110 deletions(-) diff --git a/app/assets/javascripts/tree.js b/app/assets/javascripts/tree.js index 3b47f81c..1c62751a 100644 --- a/app/assets/javascripts/tree.js +++ b/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"); } }); diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index aa39063c..c834150b 100644 --- a/app/assets/stylesheets/common.scss +++ b/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; diff --git a/app/assets/stylesheets/projects.css.scss b/app/assets/stylesheets/projects.css.scss index 86528596..ddc21bb9 100644 --- a/app/assets/stylesheets/projects.css.scss +++ b/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; + } + } +} + diff --git a/app/assets/stylesheets/top_panel.scss b/app/assets/stylesheets/top_panel.scss index 28657876..bcbbb104 100644 --- a/app/assets/stylesheets/top_panel.scss +++ b/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; diff --git a/app/assets/stylesheets/tree.scss b/app/assets/stylesheets/tree.scss index 47024a6f..322b3d7f 100644 --- a/app/assets/stylesheets/tree.scss +++ b/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; } } diff --git a/app/controllers/refs_controller.rb b/app/controllers/refs_controller.rb index d564bb66..0e062fc6 100644 --- a/app/controllers/refs_controller.rb +++ b/app/controllers/refs_controller.rb @@ -13,13 +13,22 @@ class RefsController < ApplicationController layout "project" def switch - new_path = if params[:destination] == "tree" - tree_project_ref_path(@project, params[:ref]) - else - project_commits_path(@project, :ref => params[:ref]) - end + respond_to do |format| + format.html do + new_path = if params[:destination] == "tree" + tree_project_ref_path(@project, params[:ref]) + else + project_commits_path(@project, :ref => params[:ref]) + end - redirect_to new_path + redirect_to new_path + end + format.js do + @ref = params[:ref] + define_tree_vars + render "tree" + end + end end # diff --git a/app/views/layouts/_head_panel.html.haml b/app/views/layouts/_head_panel.html.haml index 5b661239..429926dd 100644 --- a/app/views/layouts/_head_panel.html.haml +++ b/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 diff --git a/app/views/layouts/_project_side.html.haml b/app/views/layouts/_project_side.html.haml index b51d2b31..f29c38cc 100644 --- a/app/views/layouts/_project_side.html.haml +++ b/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 diff --git a/app/views/layouts/_project_side_right.html.haml b/app/views/layouts/_project_side_right.html.haml index 79e1b668..841f5498 100644 --- a/app/views/layouts/_project_side_right.html.haml +++ b/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 - Recent Projects: - %ul - - current_user.projects.order("id DESC").limit(5).each do |project| - %li - = link_to project_path(project) do - = project.name + - 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 diff --git a/app/views/layouts/_projects_side.html.haml b/app/views/layouts/_projects_side.html.haml index 691b8a6c..a55d0004 100644 --- a/app/views/layouts/_projects_side.html.haml +++ b/app/views/layouts/_projects_side.html.haml @@ -7,29 +7,32 @@ = link_to new_project_path, :class => "btn small" do New Project - %h4 - Recent Projects: - %ul - - current_user.projects.order("id DESC").limit(5).each do |project| - %li - = link_to project_path(project) do - = project.name + - 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 diff --git a/app/views/refs/_tree.html.haml b/app/views/refs/_tree.html.haml index 37537de7..9a17bb80 100644 --- a/app/views/refs/_tree.html.haml +++ b/app/views/refs/_tree.html.haml @@ -1,12 +1,19 @@ %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');