Merge pull request #2823 from floriank/fix/19297-revision-view-cleanup

[19297] Revision view cleanup
10 years ago · 711e327d2d
parent dea02be5b8 357a486c96
commit 711e327d2d
10 changed files with 194 additions and 58 deletions
--- a/app/assets/stylesheets/layout/_toolbar.md
+++ b/app/assets/stylesheets/layout/_toolbar.md
@ -0,0 +1,69 @@
+# Toolbar
+
+A toolbar that can and should be used for actions on the current view. Initially designed for the Work package list, this can be reused throughout the application.
+
+## Standard Button Bar
+
+```
+@full-width
+
+<h2>Title of the page</h2>
+<div class="toolbar-container">
+  <div id="toolbar">
+    <ul id="toolbar-items">
+      <li class="toolbar-item">
+        <a href="#" class="button -highlight">An important button</a>
+      </li>
+      <li class="toolbar-item">
+        <button class="button">Normal button</button>
+      </li>
+      <li class="toolbar-item">
+        <button class="button">
+          <i class="icon icon-star1"></i> Favourite button
+        </button>
+      </li>
+    </ul>
+  </div>
+</div>
+```
+
+## Toolbar with form elements
+
+```
+@full-width
+
+<h2>Dragonball Z characters</h2>
+<div class="toolbar-container">
+  <div id="toolbar">
+    <ul id="toolbar-items">
+      <li class="toolbar-item">
+        <select name="attribue">
+          <option value="" selected></option>
+          <option value="super">Super</option>
+        </select>
+      </li>
+      <li class="toolbar-item">
+        <input type="text" name="race" placeholder="Race">
+      </li>
+      <li class="toolbar-item">
+        <input type="number" id="level" placeholder="Level">
+      </li>
+      <li class="toolbar-item">
+        <select>
+          <option value="" selected></option>
+          <option value="vegeta">Vegeta</option>
+          <option value="kakarotto">Kakarotto</option>
+          <option value="gohan">Gohan</option>
+          <option value="piccolo">Piccolo</option>
+          <option value="oob">Boo</option>
+        </select>
+      </li>
+      <li class="toolbar-item">
+        <a href="#" class="button -highlight">
+          <i class="icon-add icon4"></i>
+        </a>
+      </li>
+    </ul>
+  </div>
+</div>
+```
--- a/app/assets/stylesheets/layout/_toolbar.sass
+++ b/app/assets/stylesheets/layout/_toolbar.sass
@ -55,14 +55,31 @@
    &.toolbar-item
      margin: 0 5px //$drop-nav-spacing // spacing between nav items

-  button
+  button, .button, input[type=text], input[type=number], select
    margin: 0.625rem 0 0
+    height: 40px
+    line-height: 22px
+  select
+    //extend forms select
+    @extend .form--select
+    //hack vertical text alignment for select (for all browsers)
+    padding-top: 5px
+    padding-bottom: 11px
+    //firefox hack, outline fix for select, remove to see why
+    &:-moz-focusring
+      color: transparent
+      text-shadow: 0 0 0 #000
+  button, .button
+    padding: 8px 1em 8px 1em
+    .icon
+      //icon-font align inside button
+      vertical-align: middle
+      &:before
+        padding-left: 0

  a.last, .last
    margin-right: 0

-
-
 .title-container
  h2
    border: 0
--- a/app/assets/stylesheets/scm.css.sass
+++ b/app/assets/stylesheets/scm.css.sass
@ -32,6 +32,7 @@
@import fonts/openproject_icon_font

 div.changeset-changes ul
+  list-style-type: none
  margin: 0
  padding: 0
  > ul
@ -39,9 +40,9 @@ div.changeset-changes ul
    padding: 0

 li.change
-  list-style-type:none
+  list-style-type: none
  background-image: image-url('bullet_black.png')
-  background-position: 1px 1px
+  background-position: left center
  background-repeat: no-repeat
  padding-top: 1px
  padding-bottom: 1px
@ -73,12 +74,13 @@ li.change
      content: " - "

 #changes-legend
+  list-style-type: none
  float: right
  font-size: 0.8em
  margin: 0
  li
    float: left
-    background-position: 5px 0
+    margin-right: 1em

 table.filecontent
  border: 1px solid #ccc
@ -95,7 +97,7 @@ table.filecontent
      padding: 0.2em
  tr.spacing
    th
-      text-align:center
+      text-align: center
    td
      height: 0.4em
      background: #EAF2F5
--- a/app/views/layouts/_toolbar.html.erb
+++ b/app/views/layouts/_toolbar.html.erb
@ -0,0 +1,38 @@
+<%#-- copyright
+OpenProject is a project management system.
+Copyright (C) 2012-2015 the OpenProject Foundation (OPF)
+
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License version 3.
+
+OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
+Copyright (C) 2006-2013 Jean-Philippe Lang
+Copyright (C) 2010-2013 the ChiliProject Team
+
+This program is free software; you can redistribute it and/or
+modify it under the terms of the GNU General Public License
+as published by the Free Software Foundation; either version 2
+of the License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program; if not, write to the Free Software
+Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+
+See doc/COPYRIGHT.rdoc for more details.
+
++#%>
+
+<% if content_for?(:toolbar) %>
+  <div class="toolbar-container">
+    <div id="toolbar">
+      <ul id="toolbar-items">
+        <%= content_for :toolbar %>
+      </ul>
+    </div>
+  </div>
+<% end %>
--- a/app/views/repositories/_navigation.html.erb
+++ b/app/views/repositories/_navigation.html.erb
@ -31,32 +31,36 @@ See doc/COPYRIGHT.rdoc for more details.
  <%= javascript_include_tag 'repository_navigation' %>
 <% end %>

-<% content_for :action_menu_specific do %>
-  <li>
-    <%= link_to l(:label_statistics), stats_project_repository_path(@project),
-                                      :class => 'icon icon-stats' %> |
+<% content_for :toolbar do %>
+  <li class="toolbar-item">
+    <%= link_to stats_project_repository_path(@project), class: 'button' do %>
+      <i class="icon icon-stats1"></i> <%= l(:label_statistics) %>
+    <% end %>
  </li>
  <%# rev => nil prevents overwriting the rev parameter queried for in the form with the parameter from the request %>
-  <li>
  <%= form_tag({:action => controller.action_name, :project_id => @project, :path => to_path_param(@path), :rev => nil}, {:method => :get, :id => 'revision_selector'}) do -%>
    <!-- Branches Dropdown -->
    <% if !@repository.branches.nil? && @repository.branches.length > 0 -%>
-      <span class="legacy-actions--inline-label">
-        <span class="form-label -transparent"><%= l(:label_branch) %>:</span>
-        <%= select_tag :branch, options_for_select([''] + @repository.branches, @rev), :id => 'branch' %> |
-      </span>
+      <li class="toolbar-item">
+        <%= label_tag :branch, l(:label_branch), class: 'hidden-for-sighted' %>
+        <%= select_tag :branch, options_for_select([''] + @repository.branches, @rev), id: 'branch' %>
+      </li>
    <% end -%>

    <% if !@repository.tags.nil? && @repository.tags.length > 0 -%>
-      <span class="legacy-actions--inline-label">
-        <span class="form-label -transparent"><%= l(:label_tag) %>:</span>
-        <%= select_tag :tag, options_for_select([''] + @repository.tags, @rev), :id => 'tag' %> |
-      </span>
+      <li class="toolbar-item">
+        <%= label_tag :tag, l(:label_tag), class: 'hidden-for-sighted' %>
+        <%= select_tag :tag, options_for_select([''] + @repository.tags, @rev), id: 'tag' %>
+      </li>
    <% end -%>
-      <span class="legacy-actions--inline-label">
-        <span class="form-label -transparent"><%= l(:label_revision) %>:</span>
-        <%= text_field_tag 'rev', @rev, :size => 8, class: 'input -small' %>
-      </span>
+    <li class="toolbar-item">
+      <%= label_tag :rev, l(:label_revision), class: 'hidden-for-sighted' %>
+      <%= text_field_tag :rev, @rev, placeholder: l(:label_revision) %>
+    </li>
+    <% if User.current.impaired? %>
+      <li class="toolbar-item">
+        <%=  button_tag 'OK', type: :submit, class: 'button -highlight' %>
+      </li>
+    <% end %>
  <% end -%>
-  </li>
 <% end %>
--- a/app/views/repositories/revision.html.erb
+++ b/app/views/repositories/revision.html.erb
@ -27,28 +27,29 @@ See doc/COPYRIGHT.rdoc for more details.

 ++#%>

-<% content_for :action_menu_specific do %>
-  &#171;
-  <% unless @changeset.previous.nil? -%>
-    <%= link_to_revision(@changeset.previous, @project, :text => l(:label_previous)) %>
-  <% else -%>
-    <%= l(:label_previous) %>
-  <% end -%>
-  |
-  <% unless @changeset.next.nil? -%>
-    <%= link_to_revision(@changeset.next, @project, :text => l(:label_next)) %>
-  <% else -%>
-    <%= l(:label_next) %>
-  <% end -%>
-  &#187;&nbsp;
-
-  <%= form_tag({:controller => '/repositories', :action => 'revision', :project_id => @project}, :method => :get) do %>
-    <%= text_field_tag 'rev', @rev, :size => 8 %>
-    <%= submit_tag 'OK', :name => nil, class: 'button -highlight' %>
-  <% end %>
+<% content_for :toolbar do %>
+  <li class="toolbar-item">
+    <% if @changeset.previous.nil? %>
+      <button class="button" disabled="disabled"><%= l(:label_previous) %></button>
+    <% else %>
+      <%= link_to_revision(@changeset.previous, @project, text: l(:label_previous), class: 'button') %>
+    <% end %>
+  </li>
+  <li class="toolbar-item">
+    <% if @changeset.next.nil? %>
+      <button class="button" disabled="disabled"><%= l(:label_next) %></button>
+    <% else %>
+      <%= link_to_revision(@changeset.next, @project, text: l(:label_next), class: 'button') %>
+    <% end %>
+  </li>
+  <li class="toolbar-item">
+    <%= form_tag({:controller => '/repositories', :action => 'revision', :project_id => @project}, :method => :get) do %>
+      <%= text_field_tag :rev, @rev, placeholder: l(:label_revision) %>
+    <% end %>
+  </li>
 <% end %>
 <h2><%= l(:label_revision) %> <%= format_revision(@changeset) %></h2>
-<%= render :partial => 'layouts/action_menu_specific' %>
+<%= render :partial => 'layouts/toolbar' %>
 <p><% if @changeset.scmid %>ID: <%= h(@changeset.scmid) %><br />
  <% end %>
  <span class="author"><%= authoring(@changeset.committed_on, @changeset.author) %></span></p>
--- a/app/views/repositories/revisions.html.erb
+++ b/app/views/repositories/revisions.html.erb
@ -26,14 +26,19 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
 See doc/COPYRIGHT.rdoc for more details.

 ++#%>
-<% content_for :action_menu_specific do %>
-  <%= form_tag({:action => 'revision', :id => @project}) do %>
-    <%= l(:label_revision) %>: <%= text_field_tag 'rev', @rev, :size => 8 %>
-    <%= submit_tag 'OK', class: 'button -highlight' %>
+<% content_for :toolbar do %>
+  <%= form_tag({ action: 'revision', id: @project }, { method: :get }) do %>
+    <li class="toolbar-item">
+      <%= label_tag :rev, l(:label_revision), class: 'hidden-for-sighted' %>
+      <%= text_field_tag :rev, @rev, size: 8, placeholder: l(:label_revision) %>
+    </li>
+    <li class="toolbar-item">
+      <%= submit_tag 'OK', class: 'button -highlight' %>
+    </li>
  <% end %>
 <% end %>
 <h2><%= l(:label_revision_plural) %></h2>
-<%= render :partial => 'layouts/action_menu_specific' %>
+<%= render :partial => 'layouts/toolbar' %>
 <%= render :partial => 'revisions', :locals => {:project => @project, :path => '', :revisions => @changesets, :entry => nil }%>
 <%= pagination_links_full @changesets %>
 <% content_for :header_tags do %>
--- a/app/views/repositories/show.html.erb
+++ b/app/views/repositories/show.html.erb
@ -33,7 +33,7 @@ See doc/COPYRIGHT.rdoc for more details.

 <h2><%= render :partial => 'breadcrumbs', :locals => { :path => @path, :kind => 'dir', :revision => @rev } %></h2>

-<%= render :partial => 'layouts/action_menu_specific' %>
+<%= render :partial => 'layouts/toolbar' %>

 <% if !@entries.nil? && authorize_for('repositories', 'browse') %>
 <%= render :partial => 'dir_list' %>
--- a/lib/open_project/object_linking.rb
+++ b/lib/open_project/object_linking.rb
@ -77,9 +77,9 @@ module OpenProject
    def link_to_revision(revision, project, options = {})
      text = options.delete(:text) || format_revision(revision)
      rev = revision.respond_to?(:identifier) ? revision.identifier : revision
-
-      link_to(h(text), { controller: '/repositories', action: 'revision', project_id: project, rev: rev },
-              title: l(:label_revision_id, format_revision(revision)))
+      url_opts = { controller: '/repositories', action: 'revision', project_id: project, rev: rev }
+      html_options = { title: l(:label_revision_id, format_revision(revision)) }.merge(options)
+      link_to(h(text), url_opts, html_options)
    end

    # Generates a link to a message
--- a/test/functional/repositories_controller_test.rb
+++ b/test/functional/repositories_controller_test.rb
@ -61,14 +61,14 @@ class RepositoriesControllerTest < ActionController::TestCase
    get :revision, project_id: 1, rev: 1
    assert_response :success
    assert_template 'revision'
-    assert_no_tag tag: 'ul', attributes: { class: /action_menu_specific/ },
-                  child: { tag: 'a', attributes: { href: @controller.url_for(only_path: true,
+    assert_no_tag tag: 'ul', attributes: { id: 'toolbar-items' },
+                  descendant: { tag: 'a', attributes: { href: @controller.url_for(only_path: true,
                                                                             controller: 'repositories',
                                                                             action: 'revision',
                                                                             project_id: 'ecookbook',
                                                                             rev: '0') } }
-    assert_tag tag: 'ul', attributes: { class: /action_menu_specific/ },
-               child: { tag: 'a', attributes: { href: @controller.url_for(only_path: true,
+    assert_tag tag: 'ul', attributes: { id: 'toolbar-items' },
+               descendant: { tag: 'a', attributes: { href: @controller.url_for(only_path: true,
                                                                          controller: 'repositories',
                                                                          action: 'revision',
                                                                          project_id: 'ecookbook',