15.2 Task I2: translating the store front 14.1 Playtime
Define the default and available languages.
edit config/initializers/i18n.rb
#encoding: utf-8
I18n.default_locale = :en
LANGUAGES = [
['English', 'en'],
["Español".html_safe, 'es']
]
edit app/views/layouts/application.html.erb
<%= form_tag store_path, :class => 'locale' do %>
<%= select_tag 'set_locale',
options_for_select(LANGUAGES, I18n.locale.to_s),
:onchange => 'this.form.submit()' %>
<%= submit_tag 'submit' %>
<%= javascript_tag "$$('.locale input').each(Element.hide)" %>
<% end %>
Scope selected routes based on locale. Important: move to bottom!
edit config/routes.rb
Depot::Application.routes.draw do |map|
get 'admin' => 'admin#index'
controller :sessions do
get 'login' => :new
post 'login' => :create
delete 'logout' => :destroy
end
scope '(:locale)' do
resources :users
resources :orders
resources :line_items
resources :carts
resources :products do
get :who_bought, :on => :member
end
root :to => 'store#index', :as => 'store'
end
end
Default locale parameter, and set locale based on locale parameter.
edit app/controllers/application_controller.rb
class ApplicationController < ActionController::Base
before_filter :set_i18n_locale_from_params
# ...
protected
def set_i18n_locale_from_params
if params[:locale]
if I18n.available_locales.include?(params[:locale].to_sym)
I18n.locale = params[:locale]
else
flash.now[:notice] =
"#{params[:locale]} translation not available"
logger.error flash.now[:notice]
end
end
end
def default_url_options
{ :locale => I18n.locale }
end
end
Verify that the routes work.
get /en
Pragmatic Bookshelf
Professional programmers develop a knack of unerringly zeroing in on the root cause of a bug. They can do that because they've written a lot of buggy code and then gained experience fixing it. This book captures all this experience -- use it, and you'll find you write fewer bugs, and the ones you do write will become easier to hunt down.
Ruby is the fastest growing and most exciting dynamic language out there. If you need to get working programs delivered fast, you should add Ruby to your toolbox.
Web Design for Developers will show you how to make your web-based application look professionally designed. We'll help you learn how to pick the right colors and fonts, avoid costly interface and accessibility mistakes -- your application will really come alive. We'll also walk you through some common Photoshop and CSS techniques and work through a web site redesign, taking a new design from concept all the way to implementation.
get /es
Pragmatic Bookshelf
es translation not available
Professional programmers develop a knack of unerringly zeroing in on the root cause of a bug. They can do that because they've written a lot of buggy code and then gained experience fixing it. This book captures all this experience -- use it, and you'll find you write fewer bugs, and the ones you do write will become easier to hunt down.
Ruby is the fastest growing and most exciting dynamic language out there. If you need to get working programs delivered fast, you should add Ruby to your toolbox.
Web Design for Developers will show you how to make your web-based application look professionally designed. We'll help you learn how to pick the right colors and fonts, avoid costly interface and accessibility mistakes -- your application will really come alive. We'll also walk you through some common Photoshop and CSS techniques and work through a web site redesign, taking a new design from concept all the way to implementation.
Replace translatable text with calls out to translation functions.
edit app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Pragprog Books Online Store</title>
<%= stylesheet_link_tag "scaffold" %>
<%= stylesheet_link_tag "depot", :media => "all" %>
<%= javascript_include_tag :defaults %>
<%= csrf_meta_tag %>
</head>
<body id="store">
<div id="banner">
<%= form_tag store_path, :class => 'locale' do %>
<%= select_tag 'set_locale',
options_for_select(LANGUAGES, I18n.locale.to_s),
:onchange => 'this.form.submit()' %>
<%= submit_tag 'submit' %>
<%= javascript_tag "$$('.locale input').each(Element.hide)" %>
<% end %>
<%= image_tag("logo.png") %>
<%= @page_title || t('.title') %>
</div>
<div id="columns">
<div id="side">
<% if @cart %>
<%= hidden_div_if(@cart.line_items.empty?, :id => "cart") do %>
<%= render @cart %>
<% end %>
<% end %>
<a href="http://www...."><%= t('.home') %></a><br />
<a href="http://www..../faq"><%= t('.questions') %></a><br />
<a href="http://www..../news"><%= t('.news') %></a><br />
<a href="http://www..../contact"><%= t('.contact') %></a><br />
<% if session[:user_id] %>
<br />
<%= link_to 'Orders', orders_path %><br />
<%= link_to 'Products', products_path %><br />
<%= link_to 'Users', users_path %><br />
<br />
<%= button_to 'Logout', logout_path, :method => :delete %>
<% end %>
</div>
<div id="main">
<%= yield %>
</div>
</div>
</body>
</html>
Replace translatable text with calls out to translation functions.
cp -r /home/rubys/svn/rails4/Book/util/data/i18n/*.yml config/locales
Define some translations for the layout.
edit config/locales/en.yml
en:
layouts:
application:
title: "Pragmatic Bookshelf"
home: "Home"
questions: "Questions"
news: "News"
contact: "Contact"
edit config/locales/es.yml
es:
layouts:
application:
title: "Publicaciones de Pragmatic"
home: "Inicio"
questions: "Preguntas"
news: "Noticias"
contact: "Contacto"
Format the currency.
edit config/locales/es.yml
es:
number:
currency:
format:
unit: "$US"
precision: 2
separator: ","
delimiter: "."
format: "%n %u"
Server needs to be restarted when introducting a new language
See results
get /es
Publicaciones de Pragmatic
Professional programmers develop a knack of unerringly zeroing in on the root cause of a bug. They can do that because they've written a lot of buggy code and then gained experience fixing it. This book captures all this experience -- use it, and you'll find you write fewer bugs, and the ones you do write will become easier to hunt down.
Ruby is the fastest growing and most exciting dynamic language out there. If you need to get working programs delivered fast, you should add Ruby to your toolbox.
Web Design for Developers will show you how to make your web-based application look professionally designed. We'll help you learn how to pick the right colors and fonts, avoid costly interface and accessibility mistakes -- your application will really come alive. We'll also walk you through some common Photoshop and CSS techniques and work through a web site redesign, taking a new design from concept all the way to implementation.
Replace translatable text with calls out to translation functions.
edit app/views/store/index.html.erb
<% if notice %>
<p id="notice"><%= notice %></p>
<% end %>
<h1><%= t('.title_html') %></h1>
<% @products.each do |product| %>
<div class="entry">
<%= image_tag(product.image_url) %>
<h3><%= product.title %></h3>
<%=raw product.description %>
<div class="price_line">
<span class="price"><%= number_to_currency(product.price) %></span>
<%= button_to t('.add'), line_items_path(:product_id => product),
:remote => true %>
</div>
</div>
<% end %>
Define some translations for the main page.
edit config/locales/en.yml
en:
store:
index:
title_html: "Your Pragmatic Catalog"
add: "Add to Cart"
edit config/locales/es.yml
es:
store:
index:
title_html: "Su Catálogo de Pragmatic"
add: "Añadir al Carrito"
See results
get /es
Publicaciones de Pragmatic
Professional programmers develop a knack of unerringly zeroing in on the root cause of a bug. They can do that because they've written a lot of buggy code and then gained experience fixing it. This book captures all this experience -- use it, and you'll find you write fewer bugs, and the ones you do write will become easier to hunt down.
Ruby is the fastest growing and most exciting dynamic language out there. If you need to get working programs delivered fast, you should add Ruby to your toolbox.
Web Design for Developers will show you how to make your web-based application look professionally designed. We'll help you learn how to pick the right colors and fonts, avoid costly interface and accessibility mistakes -- your application will really come alive. We'll also walk you through some common Photoshop and CSS techniques and work through a web site redesign, taking a new design from concept all the way to implementation.