diff --git a/app/assets/images/welcome-sprite.png b/app/assets/images/welcome-sprite.png new file mode 100644 index 000000000..a97b8e7fc Binary files /dev/null and b/app/assets/images/welcome-sprite.png differ diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index a73c8e86d..a50bb74dc 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -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; + } +} diff --git a/app/controllers/site_controller.rb b/app/controllers/site_controller.rb index b2212645c..35f1fb849 100644 --- a/app/controllers/site_controller.rb +++ b/app/controllers/site_controller.rb @@ -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 diff --git a/app/views/site/welcome.html.erb b/app/views/site/welcome.html.erb new file mode 100644 index 000000000..f3a0b086d --- /dev/null +++ b/app/views/site/welcome.html.erb @@ -0,0 +1,95 @@ +<% content_for :heading do %> +

<%= t "welcome_page.title" %>

+

<%= t "welcome_page.subtitle" %>

+<% end %> + +
+

<%= t "welcome_page.introduction_html" %>

+
+ +
+

<%= t "welcome_page.section_1.title" %>

+
+ +
+

<%= t "welcome_page.section_1.paragraph_1_html" %>

+

<%= t "welcome_page.section_1.paragraph_2_html" %>

+
+ +
+

<%= t "welcome_page.section_2.title" %>

+
+
+ +
+

<%= t "welcome_page.section_2.on_html" %>

+
+
+
+ +
+

<%= t "welcome_page.section_2.off_html" %>

+
+
+ +<% if @user %> +
+

<%= t "welcome_page.section_3.title" %>

+

<%= t "welcome_page.section_3.paragraph_2_html" %>

+
+<% else %> +
+

<%= t "welcome_page.section_3.title_no_user" %>

+

<%= t "welcome_page.section_3.paragraph_1_html" %>

+

<%= t "welcome_page.section_3.paragraph_2_html" %>

+
+<% end %> + +
+

<%= t "welcome_page.section_4.title" %>

+

<%= t "welcome_page.section_4.paragraph_1_html" %>

+
+

+ + <%= t "welcome_page.section_4.editor_html" %> +

+

+ + <%= t "welcome_page.section_4.node_html" %> +

+

+ + <%= t "welcome_page.section_4.way_html" %> +

+

+ + <%= t "welcome_page.section_4.changeset_html" %> +

+
+
+ +
+

<%= t "welcome_page.section_5.title" %>

+
+ +
+

<%= t "welcome_page.section_5.paragraph_1_html" %>

+
+ +
+

<%= t "welcome_page.section_6.title" %>

+ <% if @user %> +

<%= t "welcome_page.section_6.paragraph_1_html" %>

+ <% else %> +

<%= t "welcome_page.section_6.paragraph_1_no_user_html" %>

+ <% end %> +

<%= t "welcome_page.section_6.paragraph_2_html" %>

+
+ +
+
+

<%= t "welcome_page.section_7.title" %>

+

<%= t "welcome_page.section_7.paragraph_1_html" %>

+

<%= t "welcome_page.section_7.paragraph_2_html" %>

+
+
diff --git a/config/locales/en.yml b/config/locales/en.yml index adc98d585..f3397411a 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -1148,6 +1148,84 @@ en: to our takedown procedure or file directly at our on-line filing page. + welcome_page: + title: Welcome to OpenStreetMap + subtitle: a free map that you can edit + introduction_html: | + Unlike other maps, OpenStreetMap is completely created + by people like you, 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 real and current - it includes + millions of buildings, roads, and other details about places. + off_html: | + What it doesn't 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 + free user account - sign up here. + paragraph_2_html: | + With your user account, you can edit the map, + create a profile page, and + communicate with other people 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: | + An Editor is a program or website you can use to edit the map. + node_html: | + A Node is a point on the map, like a single restauraunt or a tree. + way_html: | + A Way is a line, like a road, stream, or shape. + changeset_html: | + A Changeset is group of + changes 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 + the help website! + section_6: + title: Start Editing + paragraph_1_html: | + You can zoom in anywhere in the world and click the Edit 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 Edit 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 web based editor like iD, or + on your iPhone with Pushpin, + or with your Android phone + with OsmAnd+. + 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 the map and click 'Add a note' in + the bottom-right corner. 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" diff --git a/config/routes.rb b/config/routes.rb index bc473a4b0..cf0bfd324 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -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 diff --git a/test/functional/site_controller_test.rb b/test/functional/site_controller_test.rb index 770f3e2b5..4f41858e8 100644 --- a/test/functional/site_controller_test.rb +++ b/test/functional/site_controller_test.rb @@ -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 }