--- /dev/null
+(function () {
+ var num = Math.floor(Math.random() * 6);
+
+ // Background image
+ if (window.location.hash) {
+ var h = window.location.hash.match(/#(.*)/);
+ if (!isNaN(parseInt(h[1], 10))) num = h[1];
+ }
+
+ $(document).ready(function () {
+ $('#content').attr('class', 'photo-' + num);
+ });
+
+ $(document).on('click', '#next-photo', function () {
+ num = (num + 1) % 6;
+ $('#content').attr('class', 'photo-' + num);
+ window.location.hash = num;
+ return false;
+ });
+})();
border-radius: 4px;
}
}
+
+.site-about #content {
+ background-color: #000;
+ background-position: 50% 50%;
+ background-repeat: no-repeat;
+ background-size: cover;
+ background-attachment: fixed;
+
+ &.photo-0 { background-image: image-url('about/0.jpg'); .photo-0 { display: block; } }
+ &.photo-1 { background-image: image-url('about/1.jpg'); .photo-1 { display: block; } }
+ &.photo-2 { background-image: image-url('about/2.jpg'); .photo-2 { display: block; } }
+ &.photo-3 { background-image: image-url('about/4.jpg'); .photo-3 { display: block; } }
+ &.photo-4 { background-image: image-url('about/4.jpg'); .photo-4 { display: block; } }
+ &.photo-5 { background-image: image-url('about/5.jpg'); .photo-5 { display: block; } }
+
+ .caption {
+ max-width: 200px;
+ font: italic 14px/20px 'Times New Roman', serif;
+ position: fixed;
+ text-align: right;
+ right: 20px;
+ bottom: 60px;
+ text-shadow: #000 0px 1px 5px;
+ color: #fff;
+ display: none;
+ }
+
+ .caption a {
+ color: white;
+ white-space: nowrap;
+ text-decoration: none;
+ }
+
+ a.next {
+ display: block;
+ position: fixed;
+ right: 10px;
+ bottom: 10px;
+ width: 40px;
+ height: 40px;
+ border-radius: 5px;
+ text-indent: -9999px;
+ overflow: hidden;
+ background: image-url('about/sprite.png') -120px 0px no-repeat;
+ background-color: #000;
+ background-color: rgba(0, 0, 0, 0.5);
+ }
+
+ #content-body {
+ display: block;
+ position: relative;
+ margin: auto;
+ color: #333;
+ width: 50%;
+ min-width: 320px;
+ max-width: 640px;
+
+ .section {
+ margin-bottom: 30px;
+ }
+
+ .section:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ .text {
+ background: white;
+ padding: 40px;
+ }
+
+ .attr {
+ position: relative;
+ padding: 170px 20px 20px 20px;
+ background: #333;
+ background: rgba(0, 0, 0, .8);
+ margin-bottom: 0;
+
+ strong {
+ display: block;
+ color: white;
+ font-size: 25px;
+ span {
+ color: #76c551;
+ }
+ }
+
+ .user-image {
+ position: absolute;
+ top: 0px;
+ right: 240px;
+ left: 0px;
+ height: 150px;
+ background-position: 0 50%;
+ background-repeat: no-repeat;
+ background-image: image-url('about/osm.png');
+ background-size: cover;
+ background-color: #76c551;
+ }
+
+ .byosm {
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ z-index: 1;
+ width: 240px;
+ height: 150px;
+ padding: 20px 20px 20px 40px;
+ font: bold 24px/25px Helvetica, Arial, sans-serif;
+ white-space: nowrap;
+ color: #fff;
+ background: #76c551
+ }
+
+ .byosm span {
+ display: inline-block;
+ width: 25px;
+ margin-left: -25px;
+ }
+ }
+
+ h2 {
+ margin-bottom: 10px;
+ }
+
+ .icon {
+ width: 30px;
+ height: 30px;
+ margin-right: 10px;
+ vertical-align: middle;
+ background: 40px 40px image-url('about/sprite.png') no-repeat;
+
+ &.local { background-position: 0px 0px; }
+ &.community { background-position: 0px -40px; }
+ &.open { background-position: 0px -80px; }
+ &.contributors { background-position: 0px -120px; }
+ &.infringement { background-position: 0px -160px; }
+ }
+}
def help
end
+ def about
+ end
+
def preview
render :text => RichText.new(params[:format], params[:text]).to_html
end
<li><%= link_to t('layouts.gps_traces'), traces_path %></li>
<li><%= link_to t('layouts.user_diaries'), diary_path %></li>
<li><%= link_to t('layouts.help'), help_path %></li>
- <li><%= link_to t('layouts.about'), '#' %></li>
+ <li><%= link_to t('layouts.about'), about_path %></li>
</ul>
<% if @user %>
<%= render :partial => "layouts/user_menu" %>
--- /dev/null
+<% content_for :head do %>
+ <%= javascript_include_tag "about" %>
+<% end %>
+
+<div id='content-body'>
+ <div class='attr'>
+ <div class='byosm'>
+ <%= t "about_page.copyright_html" %>
+ </div>
+
+ <div class='user-image'></div>
+
+ <strong>
+ <%= raw t "about_page.used_by", :name => "<span class='user-name'>OpenStreetMap</span>" %>
+ </strong>
+ </div>
+
+ <div class='text'>
+ <div class='section'>
+ <p><strong><%= t "about_page.lede_text" %></strong></p>
+ <h2><div class='icon local'></div><%= t "about_page.local_knowledge_title" %></h2>
+ <p><%= t "about_page.local_knowledge_html" %></p>
+ </div>
+
+ <div class='section'>
+ <h2><div class='icon community'></div><%= t "about_page.community_driven_title" %></h2>
+ <p><%= t "about_page.community_driven_html", :diary_path => diary_path %></p>
+ </div>
+
+ <div class='section' id='open-data'>
+ <h2><div class='icon open'></div><%= t "about_page.open_data_title" %></h2>
+ <p><%= t "about_page.open_data_html", :copyright_path => copyright_path %></p>
+ </div>
+ </div>
+</div>
+
+<% 5.times do |i| %>
+ <div class='caption photo-<%= i %>'>
+ <%= t "about_page.photo_caption_#{i}_html" %>
+ </div>
+<% end %>
+
+<a class='next' id='next-photo' href='#'><%= t "about_page.next" %></a>
url: http://wiki.openstreetmap.org/
title: wiki.openstreetmap.org
description: Browse the wiki for in-depth OSM documentation.
+ about_page:
+ next: Next
+ copyright_html: <span>©</span>OpenStreetMap<br>contributors
+ used_by: "%{name} powers map data on hundreds of web sites, mobile apps, and hardware devices"
+ lede_text: |
+ OSM is built by a community of local mappers that keeps data about
+ roads, cafés, subway stations, and much more up to date every day.
+ local_knowledge_title: Local Knowledge
+ local_knowledge_html: |
+ OpenStreetMap emphasizes local knowledge. Contributors use
+ aerial imagery, GPS devices, and low-tech field maps to verify that OSM
+ is up to date and accurate.
+ community_driven_title: Community Driven
+ community_driven_html: |
+ From the engineers that tune OSM's servers to the Humanitarian OSM Team
+ that maps disaster-affected areas, OSM's community is diverse,
+ passionate, and growing every day. To learn more about the community,
+ see the <a href='%{diary_path}'>user diaries</a>,
+ <a href='http://blogs.openstreetmap.org/'>community blogs</a>, and
+ the <a href='http://www.osmfoundation.org/'>OSM Foundation</a> website.
+ open_data_title: Open Data
+ open_data_html: |
+ OpenStreetMap is <i>open data</i>: you are free to use it for any purpose
+ as long as you credit OpenStreetMap and its contributors. If you alter or
+ build upon the data in certain ways, you may distribute the result only
+ under the same licence. See the <a href='%{copyright_path}'>Copyright and
+ License page</a> for details.
+ photo_caption_0_html: |
+ <a href='https://twitter.com/mikel'>@mikel</a> working on
+ <a href='http://mapkibera.org/'>Map Kibera</a>, a project to map the
+ largest slum in Nairobi, Kenya.
+ <a href='http://www.flickr.com/photos/watato/4564778295'>© watato
+ 2010</a>
+ photo_caption_1_html: |
+ <a href='https://twitter.com/lxbarth'>@lxbarth</a> and
+ <a href='https://twitter.com/limareis'>@limareis</a> survey Brasilia with
+ walking papers.
+ <a href='http://www.flickr.com/photos/mapbox/7104560119'>© mapbox
+ 2012</a>
+ photo_caption_2_html: |
+ @TODO caption (<a href='http://www.flickr.com/photos/oddwick/4775001075'>source</a>)
+ photo_caption_3_html: |
+ @TODO caption (<a href='http://www.flickr.com/photos/28698126@N02/3012439281'>source</a>)
+ photo_caption_4_html: |
+ @TODO caption (<a href='http://www.flickr.com/photos/louis_liu/4875155429/'>source</a>)
+ photo_caption_5_html: |
+ @TODO caption (<a href='http://www.flickr.com/photos/kachkaev/5793019627'>source</a>)
notifier:
diary_comment_notification:
subject: "[OpenStreetMap] %{user} commented on your diary entry"
match '/copyright' => 'site#copyright', :via => :get
match '/welcome' => 'site#welcome', :via => :get, :as => :welcome
match '/help' => 'site#help', :via => :get, :as => :help
+ match '/about' => 'site#about', :via => :get, :as => :about
match '/history' => 'changeset#list', :via => :get
match '/history/feed' => 'changeset#feed', :via => :get, :defaults => { :format => :atom }
match '/export' => 'site#export', :via => :get