cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve browse design

Browse source
This commit is contained in:
John Firebaugh 2013-11-11 17:57:38 -08:00
parent bd19e75214
commit c4090bb150
19 changed files with 278 additions and 357 deletions
Download patch file Download diff file Expand all files Collapse all files

133
app/assets/stylesheets/common.css.scss
View file

@ -624,15 +624,15 @@ nav.secondary {
float: left;
width: $sidebarWidth;
background: #fff;
font-size: 13px;
h2, h3, h4 {
h2 {
padding: $lineheight $lineheight $lineheight/2;
}
h4 {
font-weight: normal;
color: #666;
font-size: 12px;
h3, h4 {
margin-top: $lineheight;
margin-bottom: $lineheight/2;
}
.icon.close {
@ -937,7 +937,7 @@ header .search_form {
}
}
/* Rules for search results which appear in the popout sidebar */
/* Rules for search sidebar */
.search_results_entry {
ul li {
@ -959,6 +959,7 @@ header .search_form {
}
/* Rules for entity history */
#sidebar_content {
.browse_details {
position: relative;
@ -970,7 +971,7 @@ header .search_form {
display: none;
}
/* Rules for the changeset list shown by the history tab */
/* Rules for the history sidebar */
#sidebar .changesets {
li {
@ -980,26 +981,25 @@ header .search_form {
&.selected { background: #FFFFE6; }
/* color is derived from changeset bbox fillColor in history.js */
}
h4 {
padding: 0;
}
}
.comment a {
font-weight: 500;
margin-top: 0;
a {
color: #000;
}
}
}
/* Rules for the data browser */
/* Rules for the browse sidebar */
#sidebar_content {
.browse-section {
padding: 10px 20px;
padding: $lineheight;
h4 {
padding: 0;
h4:first-child {
margin-top: 0;
}
}
.paginate {
@ -1008,7 +1008,6 @@ header .search_form {
border: 1px solid #eee;
border-radius: 3px;
}
}
.paginate ul {
padding-left: 20px;
@ -1037,11 +1036,9 @@ header .search_form {
.browse-tag-list {
background-color: #F6F6F6;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
border: 1px solid #ddd;
border-radius: 3px;
font-size: 12px;
margin-left: -$lineheight;
margin-right: -$lineheight;
li {
border-bottom: 1px solid #ddd;
@ -1056,7 +1053,7 @@ header .search_form {
display: inline-block;
width: 50%;
float: left;
padding: 6px 10px 6px $lineheight;
padding: 6px 10px;
}
.browse-tag-k {
@ -1069,11 +1066,25 @@ header .search_form {
background-color: #fff;
}
}
.warning {
margin: $lineheight/2 0;
padding: $lineheight/2;
font-size: 90%;
}
/* Rules for export information which appears in the popout sidebar */
.note-comments li {
margin: $lineheight/2 0;
}
}
.export_bounds, .export_button {
/* Rules for export sidebar */
.export_form {
padding: $lineheight;
.export_area_inputs,
.export_button {
text-align: center;
}
@ -1089,18 +1100,12 @@ header .search_form {
margin: $lineheight/4;
}
#export_osm {
span.small-title {
font-weight: 500;
display: block;
font-size: 14px;
padding-bottom: 5px;
.export_button {
margin-top: $lineheight;
}
dl {
padding-left: 30px;
font-size: 13px;
color: #666;
padding-left: $lineheight/2;
dd {
margin-left: 0;
margin-bottom: 10px;
@ -2122,66 +2127,6 @@ a.button {
}
}
/* Rules for the notes interface */
.leaflet-popup-content .note {
padding-top: $lineheight/2;
}
.leaflet-popup-content .note {
h2 {
margin-bottom: $lineheight/2;
}
div {
margin-top: $lineheight/2;
}
.permalink {
position: absolute;
top: $lineheight/4;
left: $lineheight/4;
min-width: 15px;
min-height: 15px;
}
.permalink span {
display: none;
padding-left: $lineheight;
}
.permalink:hover span {
display: block;
}
.warning {
display: block;
background-color: #ffe0cc;
padding: 4px 6px;
margin-bottom: $lineheight/2;
}
.comment_body {
margin-top: 2px;
margin-bottom: 2px;
p {
margin-top: 0px;
margin-bottom: 0px;
}
}
.comment {
width: 100%;
height: 100px;
}
.buttons {
margin-top: $lineheight/4;
text-align: right;
}
}
/* Rules for the iD editor */
.id-embed {

12
app/views/browse/_common_details.html.erb
View file

@ -1,30 +1,32 @@
<div class='browse-section common'>
<h4>
<% if common_details.changeset.tags['comment'].present? %>
<%= linkify(h(common_details.changeset.tags['comment'])) %>
<% else %>
(no comment)
<% end %>
<h4>
</h4>
<div class="details">
<% if common_details.visible? %>
<%= t 'browse.common_details.edited' %>
<% else %>
<%= t 'browse.common_details.deleted' %>
<% end %>
<abbr><%= distance_of_time_in_words_to_now(common_details.timestamp) %> ago</abbr>
<% if common_details.changeset.user.data_public? %>
<%= t 'browse.common_details.by' %>
<%= link_to h(common_details.changeset.user.display_name), :controller => "user", :action => "view", :display_name => common_details.changeset.user.display_name %>
<% end %>
</h4>
</div>
<h4>
<div class="details">
<%= t 'browse.common_details.version' %>
#<%= h(common_details.version) %>
&middot;
<%= t 'browse.common_details.in_changeset' %>
#<%= link_to common_details.changeset_id, :action => :changeset, :id => common_details.changeset_id %>
</h4>
</div>
<%= render :partial => "tag_details", :object => common_details.tags %>

12
app/views/browse/_node_details.html.erb
View file

@ -1,13 +1,14 @@
<div class='browse_details' id="<%= node_details.version %>">
<% if node_details.redacted? %>
<div class='browse-section'>
<%= t 'browse.redacted.message_html', :type => t('browse.redacted.type.node'), :redaction_link => link_to(t('browse.redacted.redaction', :id => node_details.redaction.id), node_details.redaction), :version => node_details.version %>
</div>
<% if node_details.redacted? %>
<%= t 'browse.redacted.message_html',
:type => t('browse.redacted.type.node'),
:version => node_details.version,
:redaction_link => link_to(t('browse.redacted.redaction',
:id => node_details.redaction.id), node_details.redaction) %>
<% else %>
<%= render :partial => "common_details", :object => node_details %>
<% unless node_details.ways.empty? and node_details.containing_relation_members.empty? %>
<div class='browse-section'>
<h4><%= t 'browse.node_details.part_of' %></h4>
<ul>
<% node_details.ways.each do |way| %>
@ -15,7 +16,6 @@
<% end %>
<%= render :partial => "containing_relation", :collection => node_details.containing_relation_members %>
</ul>
</div>
<% end %>
<% end %>
</div>

14
app/views/browse/_relation_details.html.erb
View file

@ -1,23 +1,21 @@
<div class='browse_details' id="<%= relation_details.version %>">
<% if relation_details.redacted? %>
<div class='browse-section'>
<%= t 'browse.redacted.message_html', :type => t('browse.redacted.type.relation'), :redaction_link => link_to(t('browse.redacted.redaction', :id => relation_details.redaction.id), relation_details.redaction), :version => relation_details.version %><
</div>
<% if relation_details.redacted? %>
<%= t 'browse.redacted.message_html',
:type => t('browse.redacted.type.relation'),
:version => relation_details.version,
:redaction_link => link_to(t('browse.redacted.redaction',
:id => relation_details.redaction.id), relation_details.redaction) %><
<% else %>
<%= render :partial => "common_details", :object => relation_details %>
<% unless relation_details.relation_members.empty? %>
<div class='browse-section'>
<h4><%= t'browse.relation_details.members' %></h4>
<ul><%= render :partial => "relation_member", :collection => relation_details.relation_members %></ul>
</div>
<% end %>
<% unless relation_details.containing_relation_members.empty? %>
<div class='browse-section'>
<h4><%= t'browse.relation_details.part_of' %></h4>
<ul><%= render :partial => "containing_relation", :collection => relation_details.containing_relation_members %></ul>
</div>
<% end %>
<% end %>
</div>

2
app/views/browse/_tag_details.html.erb
View file

@ -1,8 +1,6 @@
<% unless tag_details.empty? %>
<div class='browse-section'>
<h4><%= t 'browse.tag_details.tags' %></h4>
<ul class='browse-tag-list'>
<%= render :partial => "tag", :collection => tag_details.sort %>
</ul>
</div>
<% end %>

14
app/views/browse/_way_details.html.erb
View file

@ -1,13 +1,14 @@
<div class='browse_details' id="<%= way_details.version %>">
<% if way_details.redacted? %>
<div class='browse-section'>
<%= t 'browse.redacted.message_html', :type => t('browse.redacted.type.way'), :redaction_link => link_to(t('browse.redacted.redaction', :id => way_details.redaction.id), way_details.redaction), :version => way_details.version %>
</div>
<% if way_details.redacted? %>
<%= t 'browse.redacted.message_html',
:type => t('browse.redacted.type.way'),
:version => way_details.version,
:redaction_link => link_to(t('browse.redacted.redaction',
:id => way_details.redaction.id), way_details.redaction) %>
<% else %>
<%= render :partial => "common_details", :object => way_details %>
<% unless way_details.way_nodes.empty? %>
<div class='browse-section'>
<h4><%= t'browse.way_details.nodes' %></h4>
<ul>
<% way_details.way_nodes.each do |wn| %>
@ -20,16 +21,13 @@
</li>
<% end %>
</ul>
</div>
<% end %>
<% unless way_details.containing_relation_members.empty? %>
<div class='browse-section'>
<h4><%= t'browse.way_details.part_of' %></h4>
<ul>
<%= render :partial => "containing_relation", :collection => way_details.containing_relation_members %>
</ul>
</div>
<% end %>
<% end %>
</div>

22
app/views/browse/changeset.html.erb
View file

@ -6,14 +6,12 @@
</h2>
<div class="browse-section">
<p><%= @changeset.tags['comment'].to_s.presence || t('browse.changeset_details.no_comment') %></p>
<h4><%= changeset_details(@changeset) %></h4>
</div>
<h4><%= @changeset.tags['comment'].to_s.presence || t('browse.changeset_details.no_comment') %></h4>
<div class="details"><%= changeset_details(@changeset) %></div>
<%= render :partial => "tag_details", :object => @changeset.tags.except('comment') %>
<% unless @nodes.empty? %>
<div class='browse-section paginate'>
<h4>
<%= type_and_paginated_count('node', @node_pages) %>
<%= render :partial => 'paging_nav', :locals => { :pages => @node_pages, :page_param => "node_page"} %>
@ -23,11 +21,9 @@
<li><%= link_to h(printable_name(node, true)), { :action => "node", :id => node.node_id.to_s }, :class => link_class('node', node), :title => link_title(node) %></li>
<% end %>
</ul>
</div>
<% end %>
<% unless @ways.empty? %>
<div class='browse-section paginate'>
<h4>
<%= type_and_paginated_count('way', @way_pages) %>
<%= render :partial => 'paging_nav', :locals => { :pages => @way_pages, :page_param => "way_page" } %>
@ -37,11 +33,9 @@
<li><%= link_to h(printable_name(way, true)), { :action => "way", :id => way.way_id.to_s }, :class => link_class('way', way), :title => link_title(way) %></li>
<% end %>
</ul>
</div>
<% end %>
<% unless @relations.empty? %>
<div class='browse-section paginate'>
<h4>
<%= type_and_paginated_count('relation', @relation_pages) %>
<%= render :partial => 'paging_nav', :locals => { :pages => @relation_pages, :page_param => "relation_page" } %>
@ -51,11 +45,11 @@
<li><%= link_to h(printable_name(relation, true)), { :action => "relation", :id => relation.relation_id.to_s }, :class => link_class('relation', relation), :title => link_title(relation) %></li>
<% end %>
</ul>
</div>
<% end %>
<div class='browse-section secondary-actions'>
<h4><%= link_to(t('browse.changeset.changesetxml'), :controller => "changeset", :action => "read") %>
&middot;
<%= link_to(t('browse.changeset.osmchangexml'), :controller => "changeset", :action => "download") %></h4>
</div>
<div class='secondary-actions'>
<%= link_to(t('browse.changeset.changesetxml'), :controller => "changeset", :action => "read") %>
&middot;
<%= link_to(t('browse.changeset.osmchangexml'), :controller => "changeset", :action => "download") %>
</div>

2
app/views/browse/new_note.html.erb
View file

@ -6,7 +6,7 @@
</h2>
<div class="note browse-section">
<h4><%= t('javascripts.notes.new.intro') %></h4>
<p class="warning"><%= t('javascripts.notes.new.intro') %></p>
<form action="#">
<input type="hidden" name="lon">
<input type="hidden" name="lat">

5
app/views/browse/node.html.erb
View file

@ -10,9 +10,8 @@ set_title(t('browse.node.node') + ' | ' + @name)
<%= render :partial => "node_details", :object => @node %>
<div class='browse-section secondary-actions clearfix'>
<h4><%= link_to(t('browse.node.download_xml'), :controller => "node", :action => "read") %>
<div class='secondary-actions'>
<%= link_to(t('browse.node.download_xml'), :controller => "node", :action => "read") %>
&middot;
<%= link_to(t('browse.node.view_history'), :action => "node_history") %>
</h4>
</div>

6
app/views/browse/node_history.html.erb
View file

@ -12,8 +12,8 @@ set_title(t('browse.node_history.node_history') + ' | ' + @name)
<%= render :partial => "node_details", :object => node %>
<% end %>
<div class='browse-section secondary-actions clearfix'>
<span><%= link_to(t('browse.node_history.download_xml'), :controller => "old_node", :action => "history") %>
<div class='secondary-actions'>
<%= link_to(t('browse.node_history.download_xml'), :controller => "old_node", :action => "history") %>
&middot;
<%= link_to(t('browse.node_history.view_details'), :action => "node") %></span>
<%= link_to(t('browse.node_history.view_details'), :action => "node") %>
</div>

23
app/views/browse/note.html.erb
View file

@ -4,36 +4,23 @@
<a class="geolink" href="<%= root_path %>"><span class="icon close"></span></a>
<%= t "browse.note.#{@note.status}_title", :note_name => @note.id %>
</h2>
<div class="browse-section">
<h4>
<h4><%= h(@note.comments.first.body.to_html) %></h4>
<div class="details">
<%= note_event('open', @note.created_at, @note.author) %>
<% if @note.status == "closed" %>
<br/>
<%= note_event(@note.status, @note.closed_at, @note.comments.last.author) %>
<% end %>
</h4>
</div>
<% if @note.comments.find { |comment| comment.author.nil? } -%>
<div class='browse-section common'>
<p class='warning'><%= t "javascripts.notes.show.anonymous_warning" %></p>
</div>
<% end -%>
<div class='browse-section common'>
<div class='browse-field' id="c<%= @note.comments.first.id %>">
<h4><%= t "browse.note.description" %></h4>
<%= h(@note.comments.first.body.to_html) %>
</div>
<div class='browse-field'>
<h4><%= t "browse.node_details.coordinates" %></h4>
<p class='geo'><%= link_to ("<span class='latitude'>#{number_with_delimiter(@note.lat)}</span>, <span class='longitude'>#{number_with_delimiter(@note.lon)}</span>".html_safe), {:controller => 'site', :action => 'index', :lat => h(@note.lat), :lon => h(@note.lon), :zoom => "18"} %></p>
</div>
</div>
<% if @note.comments.length > 1 %>
<div class='browse-section clearfix note-comments'>
<div class='note-comments'>
<ul>
<% @note.comments[1..-1].each do |comment| %>
<li id="c<%= comment.id %>">
@ -44,7 +31,7 @@
</ul>
</div>
<% end %>
<div class="browse-section">
<% if @note.status == "open" %>
<form action="#">
<textarea class="comment" name="text" cols="40" rows="5"></textarea>

7
app/views/browse/relation.html.erb
View file

@ -10,7 +10,8 @@ set_title(t('browse.relation.relation') + ' | ' + @name)
<%= render :partial => "relation_details", :object => @relation %>
<div class='secondary-actions clearfix'>
<span><%= link_to(t('browse.relation.download_xml'), :controller => "relation", :action => "read") %>
<%= link_to(t('browse.relation.view_history'), :action => "relation_history") %></span>
<div class='secondary-actions'>
<%= link_to(t('browse.relation.download_xml'), :controller => "relation", :action => "read") %>
&middot;
<%= link_to(t('browse.relation.view_history'), :action => "relation_history") %>
</div>

7
app/views/browse/relation_history.html.erb
View file

@ -12,7 +12,8 @@ set_title(t('browse.relation_history.relation_history') + ' | ' + @name)
<%= render :partial => "relation_details", :object => relation %>
<% end %>
<div class='secondary-actions clearfix'>
<span><%= link_to(t('browse.relation_history.download_xml'), :controller => "old_relation", :action => "history") %>
<%= link_to(t('browse.relation_history.view_details'), :action => "relation") %></span>
<div class='secondary-actions'>
<%= link_to(t('browse.relation_history.download_xml'), :controller => "old_relation", :action => "history") %>
&middot;
<%= link_to(t('browse.relation_history.view_details'), :action => "relation") %>
</div>

6
app/views/browse/way.html.erb
View file

@ -2,6 +2,7 @@
@name = printable_name @way
set_title(t('browse.way.way') + ' | ' + @name)
%>
<h2>
<a class="geolink" href="<%= root_path %>"><span class="icon close"></span></a>
<%= t'browse.way.way_title', :way_name => @name %>
@ -9,9 +10,8 @@ set_title(t('browse.way.way') + ' | ' + @name)
<%= render :partial => "way_details", :object => @way %>
<div class='browse-section secondary-actions clearfix'>
<h4><%= link_to(t('browse.way.download_xml'), :controller => "way", :action => "read") %>
<div class='secondary-actions'>
<%= link_to(t('browse.way.download_xml'), :controller => "way", :action => "read") %>
&middot;
<%= link_to(t('browse.way.view_history'), :action => "way_history") %>
</h4>
</div>

6
app/views/browse/way_history.html.erb
View file

@ -12,8 +12,8 @@ set_title(t('browse.way_history.way_history') + ' | ' + @name)
<%= render :partial => "way_details", :object => way %>
<% end %>
<div class='secondary-actions clearfix'>
<span><%= link_to(t('browse.way_history.download_xml'), :controller => "old_way", :action => "history") %>
<div class='secondary-actions'>
<%= link_to(t('browse.way_history.download_xml'), :controller => "old_way", :action => "history") %>
&middot;
<%= link_to(t('browse.way_history.view_details'), :action => "way") %></span>
<%= link_to(t('browse.way_history.view_details'), :action => "way") %>
</div>

6
app/views/changeset/_changeset.html.erb
View file

@ -13,7 +13,7 @@
%>
<%= content_tag "li", :id => "changeset_#{changeset.id}", :data => {:changeset => changeset_data} do %>
<p class="comment">
<h4>
<a class="changeset_id" href="<%= changeset_path(changeset.id) %>">
<% if changeset.tags['comment'].to_s != '' %>
<%= linkify(h(changeset.tags['comment'])) %>
@ -21,6 +21,6 @@
<%= t 'changeset.changeset.no_comment' %>
<% end %>
</a>
</p>
<h4><%= changeset_details(changeset) %></h4>
</h4>
<div class="details"><%= changeset_details(changeset) %></div>
<% end %>

4
app/views/changeset/list.html.erb
View file

@ -7,7 +7,7 @@
<%= image_tag "searching.gif", :class => "loader", :style => "display: none;" %>
</div>
<% elsif params[:max_id] %>
<h4 class="inner22"><%= t('changeset.list.no_more') %></h4>
<div class="inner22"><%= t('changeset.list.no_more') %></div>
<% else %>
<h4 class="inner22"><%= t('changeset.list.empty') %></h4>
<div class="inner22"><%= t('changeset.list.empty') %></div>
<% end %>

20
app/views/site/export.html.erb
View file

@ -1,13 +1,13 @@
<% set_title(t('export.title')) %>
<h2>
<a class="geolink" href="<%= root_path %>"><span class="icon close"></span></a>
<%= t 'export.start_rjs.export' %>
</h2>
<%= form_tag :controller => "export", :action => "finish" do %>
<%= form_tag({:controller => "export", :action => "finish"}, :class => "export_form") do %>
<%= hidden_field_tag 'format', 'osm' %>
<div class="export_bounds inner22">
<div class='export_area_inputs'>
<%= text_field_tag('maxlat', nil, :size => 10, :class => "export_bound") %>
<br/>
@ -15,16 +15,16 @@
<%= text_field_tag('maxlon', nil, :size => 10, :class => "export_bound") %>
<br/>
<%= text_field_tag('minlat', nil, :size => 10, :class => "export_bound") %>
</div>
<a id="drag_box" class='export_hint' href="#"><%= t'export.start.manually_select' %></a>
<br/>
<a id='drag_box' href="#"><%= t'export.start.manually_select' %></a>
</div>
<div id="export_osm">
<h4><span class="small-title"><%= t'export.start.licence' %></span><%= raw t'export.start.export_details' %></h4>
<h4><%= t'export.start.licence' %></h4>
<p><%= raw t 'export.start.export_details' %></p>
<div id="export_osm_too_large">
<div class="export_details">
<h4><span class="small-title red"><%= t'export.start.too_large.heading' %></span><%= t'export.start.too_large.body' %></h4>
<h4><%= t'export.start.too_large.heading' %></h4>
<p><%= t'export.start.too_large.body' %></p>
<dl class="inner12">
<dt><a href="http://planet.openstreetmap.org/"><%= t'export.start.too_large.planet.title' %></a></dt>
<dd><%= t'export.start.too_large.planet.description' %></dd>
@ -39,10 +39,8 @@
<dd><%= t'export.start.too_large.other.description' %></dd>
</dl>
</div>
</div>
</div>
<div class="export_button inner12">
<div class="export_button">
<%= submit_tag t('export.start.export_button'), :id => "export_commit" %>
</div>
<% end %>

10
config/locales/en.yml
View file

@ -166,7 +166,7 @@ en:
note: "Edit note"
node_details:
coordinates: "Coordinates:"
part_of: "Part of:"
part_of: "Part of"
node_history:
node_history: "Node History"
node_history_title: "Node History: %{node_name}"
@ -200,8 +200,8 @@ en:
way: "way"
relation: "relation"
relation_details:
members: "Members:"
part_of: "Part of:"
members: "Members"
part_of: "Part of"
relation_history:
relation_history: "Relation History"
relation_history_title: "Relation History: %{relation_name}"
@ -264,8 +264,8 @@ en:
tag: "The wiki description page for the %{key}=%{value} tag"
wikipedia_link: "The %{page} article on Wikipedia"
way_details:
nodes: "Nodes:"
part_of: "Part of:"
nodes: "Nodes"
part_of: "Part of"
also_part_of:
one: "part of way %{related_ways}"
other: "part of ways %{related_ways}"