Curso Play
Introducción
Básico
Intermedio

Internacionalización

Con nuestra aplicación queremos llegar al máximo número de personas posibles, por lo tanto es importante que esté en su propio idioma. Vamos a internacionalizar nuestra aplicación.

Los ficheros de mensajes se definen dentro de la carpeta conf

conf/messages

hello=Hello!
back=Back

Las traducciones de los ficheros can con la extensión de su código ISO.

conf/messages.es

hello=Hola!
back=Atrás

Si desde un controlador queremos averiguar el idioma del usuario

String lang = Lang.get();

Si queremos cambiar el idioma

Lang.change("ja");

Para mostrar los mensajes en las plantillas se utiliza

<h1>&{'hello'}</h1>

Ejercicio

Solución

Crea un nuevo controlador que se va a encargar de cambiar el idioma.

apps/controllers/Language.java

1
2
3
4
5
6
7
8
9
10
11
12
13
package controllers;



import play.i18n.Lang;
import play.mvc.Controller;



public class Language extends Controller {



<span class="kd">public</span> <span class="kd">static</span> <span class="kt">void</span> <span class="nf">change</span><span class="o">(</span><span class="n">String</span> <span class="n">locale</span><span class="o">,</span> <span class="n">String</span> <span class="n">from</span><span class="o">){</span>
    <span class="n">Lang</span><span class="o">.</span><span class="na">change</span><span class="o">(</span><span class="n">locale</span><span class="o">);</span>
    <span class="n">redirect</span><span class="o">(</span><span class="n">from</span><span class="o">);</span>
<span class="o">}</span>




}

El parámetro from sirve para redirigir a la página de origen

Añade en la plantilla en menú con los enlaces a la acción

app/views/main.html

1
2
3
4
5
6
7
 <li class=“dropdown”>
   <a href=“#” class=“dropdown-toggle”>&{‘idioma’}</a>
   <ul class=“dropdown-menu”>
     <li><a href=“@{Language.change(‘en’, request.url)}”>&{‘ingles’}</a></li>
     <li><a href=“@{Language.change(‘es’, request.url)}”>&{‘espanol’}</a></li>
   </ul>
</li>

Modifica el fichero de configuración para especificar los idiomas aceptados

conf/application.conf

application.langs=en,es

Crea los ficheros de idiomas

conf/messages.es

inicio=Inicio
estadisticas=Estadísticas
idioma=Idioma
ingles=Inglés
espanol=Español
salir=Salir
tutorial=Tutorial
codigoFuente=Código Fuente

conf/messages.en

inicio=Home
estadisticas=Stats
idioma=Language
ingles=English
espanol=Spanish
salir=Exit
tutorial=Tutorial
codigoFuente=Sources

Modifica la plantilla para añadir los mensajes. Fíjate en la utilización de &{} para añadir los mensajes.

apps/views/main.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<!DOCTYPE html>



<html>
    <head>
        <title>#{get ‘title’ /}</title>
        <meta charset=“utf-8”>



    <span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"shortcut icon"</span> <span class="na">type=</span><span class="s">"image/png"</span> <span class="na">href=</span><span class="s">"@{'/public/images/favicon.png'}"</span><span class="nt">&gt;</span>
    <span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"@{'/public/javascripts/jquery-1.5.2.min.js'}"</span> <span class="na">type=</span><span class="s">"text/javascript"</span> <span class="na">charset=</span><span class="s">"${_response_encoding}"</span><span class="nt">&gt;&lt;/script&gt;</span>
    <span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css"</span><span class="nt">&gt;</span>
    <span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"http://twitter.github.com/bootstrap/1.3.0/bootstrap-dropdown.js"</span><span class="nt">&gt;&lt;/script&gt;</span>

    <span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">media=</span><span class="s">"screen"</span> <span class="na">href=</span><span class="s">"@{'/public/stylesheets/main.css'}"</span><span class="nt">&gt;</span>
    #{get 'moreStyles' /}
    #{get 'moreScripts' /}
<span class="nt">&lt;/head&gt;</span>
<span class="nt">&lt;body&gt;</span>


  <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"topbar"</span> <span class="na">data-dropdown=</span><span class="s">"dropdown"</span><span class="nt">&gt;</span>
  <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"fill"</span><span class="nt">&gt;</span>
    <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">&gt;</span>
      <span class="nt">&lt;a</span> <span class="na">class=</span><span class="s">"brand"</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">&gt;</span>twitter-play<span class="nt">&lt;/a&gt;</span>
      <span class="nt">&lt;ul</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">&gt;</span>
        <span class="nt">&lt;li&gt;&lt;a</span> <span class="na">href=</span><span class="s">"@{Timeline.index}"</span><span class="nt">&gt;</span><span class="err">&amp;</span>{'inicio'}<span class="nt">&lt;/a&gt;&lt;/li&gt;</span>
        #{secure.check 'isAdmin'}
            <span class="nt">&lt;li&gt;&lt;a</span> <span class="na">href=</span><span class="s">"@{Timeline.stats}"</span><span class="nt">&gt;</span><span class="err">&amp;</span>{'estadisticas'}<span class="nt">&lt;/a&gt;&lt;/li&gt;</span>
        #{/secure.check}
        <span class="nt">&lt;li</span> <span class="na">class=</span><span class="s">"dropdown"</span><span class="nt">&gt;</span>
          <span class="nt">&lt;a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-toggle"</span><span class="nt">&gt;</span><span class="err">&amp;</span>{'idioma'}<span class="nt">&lt;/a&gt;</span>
          <span class="nt">&lt;ul</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span><span class="nt">&gt;</span>
            <span class="nt">&lt;li&gt;&lt;a</span> <span class="na">href=</span><span class="s">"@{Language.change('en', request.url)}"</span><span class="nt">&gt;</span><span class="err">&amp;</span>{'ingles'}<span class="nt">&lt;/a&gt;&lt;/li&gt;</span>
            <span class="nt">&lt;li&gt;&lt;a</span> <span class="na">href=</span><span class="s">"@{Language.change('es', request.url)}"</span><span class="nt">&gt;</span><span class="err">&amp;</span>{'espanol'}<span class="nt">&lt;/a&gt;&lt;/li&gt;</span>
          <span class="nt">&lt;/ul&gt;</span>
       <span class="nt">&lt;/li&gt;</span>
      <span class="nt">&lt;/ul&gt;</span>

      <span class="nt">&lt;form</span> <span class="na">action=</span><span class="s">"@{Secure.logout}"</span> <span class="na">class=</span><span class="s">"pull-right"</span><span class="nt">&gt;</span>
        <span class="nt">&lt;button</span> <span class="na">class=</span><span class="s">"btn"</span> <span class="na">type=</span><span class="s">"submit"</span><span class="nt">&gt;</span>${controllers.Security.userConnected().username} - <span class="err">&amp;</span>{'salir'}<span class="nt">&lt;/button&gt;</span>
      <span class="nt">&lt;/form&gt;</span>
    <span class="nt">&lt;/div&gt;</span>
  <span class="nt">&lt;/div&gt;</span>
<span class="nt">&lt;/div&gt;</span>

<span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">&gt;</span>
    <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">&gt;</span>
        <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"page-header"</span><span class="nt">&gt;</span>
            <span class="nt">&lt;h1&gt;</span>#{get 'title' /}<span class="nt">&lt;/h1&gt;</span>
        <span class="nt">&lt;/div&gt;</span>
        <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"row"</span><span class="nt">&gt;</span>
            <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"span10"</span><span class="nt">&gt;</span>#{doLayout /}<span class="nt">&lt;/div&gt;</span>
            <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"span4"</span><span class="nt">&gt;</span>#{get 'secondaryContent' /}<span class="nt">&lt;/div&gt;</span>
        <span class="nt">&lt;/div&gt;</span>
    <span class="nt">&lt;/div&gt;</span>

    <span class="nt">&lt;footer&gt;</span>
        <span class="nt">&lt;p&gt;</span>
            <span class="nt">&lt;a</span> <span class="na">href=</span><span class="s">"http://axelhzf.github.com/play-curso/"</span><span class="nt">&gt;</span><span class="err">&amp;</span>{'tutorial'}<span class="nt">&lt;/a&gt;</span> - <span class="nt">&lt;a</span>
                <span class="na">href=</span><span class="s">"https://github.com/axelhzf/play-curso"</span><span class="nt">&gt;</span><span class="err">&amp;</span>{'codigoFuente'}<span class="nt">&lt;/a&gt;</span>
        <span class="nt">&lt;/p&gt;</span>
    <span class="nt">&lt;/footer&gt;</span>

<span class="nt">&lt;/div&gt;</span>
<span class="c">&lt;!-- /container --&gt;</span>




</body>
</html>

Puedes descargarte el código desde https://github.com/axelhzf/play-curso/commit/777fcd1bf78d216fc8c0033eb269ecdbb49d9a4f