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

Add welcome page based on http://osmlab.github.io/welcome-osm/

Browse source
This commit is contained in:
John Firebaugh 2013-07-15 17:38:42 -07:00
parent dae2c209d9
commit e3aaa6dd4b
7 changed files with 269 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
app/assets/images/welcome-sprite.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 53 KiB

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

@ -57,6 +57,22 @@ abbr, acronym {
clear: both;
}
/* Basic grid */
.col0 { float:left; width:04.1666%; }
.col1 { float:left; width:08.3333%; }
.col2 { float:left; width:16.6666%; }
.col3 { float:left; width:25.0000%; }
.col4 { float:left; width:33.3333%; }
.col5 { float:left; width:41.6666%; }
.col6 { float:left; width:50.0000%; }
.col7 { float:left; width:58.3333%; }
.col8 { float:left; width:66.6666%; }
.col9 { float:left; width:75.0000%; }
.col10 { float:left; width:83.3333%; }
.col11 { float:left; width:91.6666%; }
.col12 { width:100%; }
/* Default rules for the body of every page */
* {
@ -1012,6 +1028,18 @@ ul.results-list li { border-bottom: 1px solid #ccc; }
border-left: 1px solid #ccc;
}
.site-copyright,
.site-welcome {
.content-heading {
text-align: center;
}
#content {
max-width: 700px;
margin: auto;
}
}
.wrapper {
margin-left: 184px;
border-left: 1px solid #ccc;
@ -2191,3 +2219,63 @@ a.button {
border: 0;
background: #fff;
}
/* Rules for the "Welcome" page */
.site-welcome {
.center {
text-align: center;
}
.drop {
margin-top: 80px;
}
.sprite {
background-image: image-url("welcome-sprite.png");
background-size: 500px 250px;
display: inline-block;
}
.sprite.small {
width: 50px;
height: 50px;
}
.sprite.x {
background-position: -50px 0;
}
.sprite.large {
width: 350px;
height: 200px;
}
.sprite.one-map {
background-position: 0 -50px;
}
.sprite.term {
margin-right: 10px;
vertical-align: middle;
}
.sprite.node {
background-position: -100px 0;
}
.sprite.way {
background-position: -150px 0;
}
.sprite.changeset {
background-position: -200px 0;
}
.sprite.editor {
background-position: -250px 0;
}
.sprite.question {
background-position: -300px 0;
}
}

3
app/controllers/site_controller.rb
View file

@ -80,6 +80,9 @@ class SiteController < ApplicationController
@locale = params[:copyright_locale] || I18n.locale
end
def welcome
end
def preview
render :text => RichText.new(params[:format], params[:text]).to_html
end

95
app/views/site/welcome.html.erb Normal file
View file

@ -0,0 +1,95 @@
<% content_for :heading do %>
<h2><%= t "welcome_page.title" %></h2>
<h3><%= t "welcome_page.subtitle" %></h3>
<% end %>
<div class='pad2'>
<p><%= t "welcome_page.introduction_html" %></p>
</div>
<div class='pad2 drop'>
<h3><%= t "welcome_page.section_1.title" %></h3>
<div class='center'>
<span class='sprite large one-map'></span>
</div>
<p><%= t "welcome_page.section_1.paragraph_1_html" %></p>
<p><%= t "welcome_page.section_1.paragraph_2_html" %></p>
</div>
<div class='pad2 drop clearfix'>
<h3><%= t "welcome_page.section_2.title" %></h3>
<div class='col6 pad1'>
<div class='center pad1'>
<span class='sprite small check'></span>
</div>
<p><%= t "welcome_page.section_2.on_html" %></p>
</div>
<div class='col6 pad1'>
<div class='center pad1'>
<span class='sprite small x'></span>
</div>
<p><%= t "welcome_page.section_2.off_html" %></p>
</div>
</div>
<% if @user %>
<div class='pad2 drop'>
<h3><%= t "welcome_page.section_3.title" %></h3>
<p><%= t "welcome_page.section_3.paragraph_2_html" %></p>
</div>
<% else %>
<div class='pad2 drop'>
<h3><%= t "welcome_page.section_3.title_no_user" %></h3>
<p><%= t "welcome_page.section_3.paragraph_1_html" %></p>
<p><%= t "welcome_page.section_3.paragraph_2_html" %></p>
</div>
<% end %>
<div class='pad2 drop'>
<h3><%= t "welcome_page.section_4.title" %></h3>
<p><%= t "welcome_page.section_4.paragraph_1_html" %></p>
<div class='col12 clearfix'>
<p>
<span class='sprite small term editor'></span>
<%= t "welcome_page.section_4.editor_html" %>
</p>
<p>
<span class='sprite small term node'></span>
<%= t "welcome_page.section_4.node_html" %>
</p>
<p>
<span class='sprite small term way'></span>
<%= t "welcome_page.section_4.way_html" %>
</p>
<p>
<span class='sprite small term changeset'></span>
<%= t "welcome_page.section_4.changeset_html" %>
</p>
</div>
</div>
<div class='pad2 drop'>
<h3><%= t "welcome_page.section_5.title" %></h3>
<div class='center pad1'>
<span class='sprite small term question'></span>
</div>
<p><%= t "welcome_page.section_5.paragraph_1_html" %></p>
</div>
<div class='pad2 drop'>
<h3><%= t "welcome_page.section_6.title" %></h3>
<% if @user %>
<p><%= t "welcome_page.section_6.paragraph_1_html" %></p>
<% else %>
<p><%= t "welcome_page.section_6.paragraph_1_no_user_html" %></p>
<% end %>
<p><%= t "welcome_page.section_6.paragraph_2_html" %></p>
</div>
<div class='pad2 drop'>
<div class='fillE pad1'>
<h3><%= t "welcome_page.section_7.title" %></h3>
<p><%= t "welcome_page.section_7.paragraph_1_html" %></p>
<p><%= t "welcome_page.section_7.paragraph_2_html" %></p>
</div>
</div>

78
config/locales/en.yml
View file

@ -1148,6 +1148,84 @@ en:
to our <a href="http://www.osmfoundation.org/wiki/License/Takedown_procedure">takedown
procedure</a> or file directly at our
<a href="http://dmca.openstreetmap.org/">on-line filing page</a>.
welcome_page:
title: Welcome to OpenStreetMap
subtitle: a free map that you can edit
introduction_html: |
Unlike other maps, OpenStreetMap is completely <abbr title="OpenStreetMap has over
1 million users, who add data based on local knowledge, GPS tracks, and more">created
by people like you</abbr>, and free for anyone to fix, update, download and use.
Here's a quick guide to get you started!
section_1:
title: 'One Map: Many Websites'
paragraph_1_html: |
If you're here to correct an error you found on a site like Foursquare or Craigslist,
you're in the right place - OpenStreetMap is the central map database used by hundreds
of websites.
paragraph_2_html: |
You just need to edit OpenStreetMap, and the changes will be visible everywhere else.
Copying the map data from place to place can take from a few minutes to a few hours,
so don't worry if it isn't instant.
section_2:
title: What's on the Map
on_html: |
OpenStreetMap is a place for any data that's both <em>real and current</em> - it includes
millions of buildings, roads, and other details about places.
off_html: |
What it <em>doesn't</em> include is opinionated data, like ratings, or data that isn't
current, like historical buildings or hypothetical structures.
section_3:
title: You're Signed Up
title_no_user: Get a Free Account
paragraph_1_html: |
To edit OpenStreetMap, you'll need <a target="_blank" href="https://www.openstreetmap.org/user/new">a
free user account - sign up here</a>.
paragraph_2_html: |
With your user account, you can edit the map,
<abbr title="Your profile shows off how much you have edited!">create a profile</abbr> page, and
<abbr title="Users on OpenStreetMap talk over mailing lists, chat, and private messages you can
send on the website">communicate with other people</abbr> working on improving the map.
section_4:
title: Basic Terms For Mapping
paragraph_1_html: |
OpenStreetMap has some of its own lingo. Here are a few key words that'll come in handy.
editor_html: |
<strong>An Editor</strong> is a program or website you can use to edit the map.
node_html: |
<strong>A Node</strong> is a point on the map, like a single restauraunt or a tree.
way_html: |
<strong>A Way</strong> is a line, like a road, stream, or shape.
changeset_html: |
<strong>A Changeset</strong> is <abbr title='changesets can have comments, like "adding a
road here", that let other users know what you were intending to change and why'>group of
changes</abbr> to the map saved by a user.
section_5:
title: Any questions?
paragraph_1_html: |
Need help mapping, or not clear on how to use OpenStreetMap? Feel free to ask on
<a href='http://help.openstreetmap.org/'>the help website</a>!
section_6:
title: Start Editing
paragraph_1_html: |
You can zoom in anywhere in the world and click the <em>Edit</em> button to start editing.
paragraph_1_no_user_html: |
Once you have an account, you can zoom in anywhere in the world and click the <em>Edit</em> button
to start editing.
paragraph_2_html: |
Since OpenStreetMap is an open project, there are lots of different ways to edit the map - whether with
<a href='http://www.openstreetmap.org/edit?editor=id'>a web based editor like iD</a>, or
<a href='https://itunes.apple.com/us/app/pushpin-osm/id565850639?mt=8'>on your iPhone with Pushpin</a>,
or <a href='https://play.google.com/store/apps/details?id=net.osmand.plus'>with your Android phone
with OsmAnd+</a>.
section_7:
title: No Time To Edit? Add a Note!
paragraph_1_html: |
If you just want something small fixed and don't have the time to sign up and learn how to edit, it's
easy to add a note!
paragraph_2_html: |
Just go to <a href='http://www.openstreetmap.org/'>the map</a> and click <em>'Add a note'</em> in
the <em>bottom-right corner</em>. This will add a marker to the map, which you can move by dragging
the green plus sign. Click save to add a note, and experienced mappers will find and address your issue.
notifier:
diary_comment_notification:
subject: "[OpenStreetMap] %{user} commented on your diary entry"

1
config/routes.rb
View file

@ -125,6 +125,7 @@ OpenStreetMap::Application.routes.draw do
match '/edit' => 'site#edit', :via => :get
match '/copyright/:copyright_locale' => 'site#copyright', :via => :get
match '/copyright' => 'site#copyright', :via => :get
match '/welcome' => 'site#welcome', :via => :get
match '/history' => 'changeset#list', :via => :get
match '/history/feed' => 'changeset#feed', :via => :get, :format => :atom
match '/export' => 'site#index', :export => true, :via => :get

4
test/functional/site_controller_test.rb
View file

@ -34,6 +34,10 @@ class SiteControllerTest < ActionController::TestCase
{ :path => "/copyright/locale", :method => :get },
{ :controller => "site", :action => "copyright", :copyright_locale => "locale" }
)
assert_routing(
{ :path => "/welcome", :method => :get },
{ :controller => "site", :action => "welcome" }
)
assert_routing(
{ :path => "/export", :method => :get },
{ :controller => "site", :action => "index", :export => true }