express-diana
Para DianaJS
Importante
Esta modificacion de express es creada para ser ejecutada en Diana.js, por lo que se recomienda el uso de Diana.js en lugar del uso directo de express-diana, tambien es obligatorio usar ejs-diana como tecnologia de renderizado para un mejor resultado.
Carasteristicas
Layout y variable yield
express-diana se basa en layouts, por lo que al hacer render en el objeto response la vista sera mostrada adentro de un layout (los layouts se encuentran en la ruta /app/views/layouts, y por defecto el nombre layout sera 'application').
Para poder usar el layout correctamente, incluye en el template el archivo que se quiere renderizar, el nombre del archivo se almacena en la variable yield, un ejemplo escrito en EJS seria el siguiente:
DianaJS<%- include(yield) %>
Existen dos formas para cambiar el valor de yield, la primera es usando el objeto express para asignar una variable: app.set("layout", <nombre_del_layout>), la otra forma es desde el metodo layout del objeto response de express: res.layout(<nombre_del_layout>).
NOTA: todos los layouts deben estar dentro del directorio /app/views/layouts
Aplicaciones Multilenguaje
Para iniciar el modo multilenguaje tan solo se necesita seguir los siguientes pasos:
- Con el metodo
setde express activar la variable translate - Con el metodo
setde express asignar el locale de la applicacion (por defecto 'en') - Con el metodo
setde express asignar el locale por defecto, este sera tomado en cuenta cuando la aplicacion no encuentre el locale definido (por defecto 'en') - Con el metodo
setde express definir los locales permitidos para la aplicacion (por defecto ['en'])
app.set('translate', true);// asumiendo que el usuario habla españolapp.set('locale','es');app.set('default_locale','es')app.set('permit_locales', ['en', 'es']);
ViewHelpers y EJS-Diana
link_to(title, url [,html_options])
link_to("Next", "?page=2")=><a href="?page=2">Next</a>link_to("Next", "?page=2", {class: "btn btn-info"})=><a href="?page=2" class="btn btn-info">Next</a>
audio_tag(sources [,html_options])
audio_tag("song.mp3")=><audio src="song.mp3"></audio>audio_tag("song.mp3", {class: "audio hidden", controls: "controls"})=><audio src="song.mp3" class="audio hidden" controls="controls"></audio>audio_tag(["song.mp3", "song.ogg"])=><audio><source src="song.mp3" /><source src="song.ogg" /></audio>
favicon_link_tag([source, html_options])
favicon_link_tag()=><link href="/assets/img/favicon.ico" type="image/x-icon" rel="shortcut icon" />favicon_link_tag("/assets/img/ico.ico")=><link href="/assets/img/ico.ico" type="image/x-icon" rel="shortcut icon" />favicon_link_tag("apple.png" {rel: "apple-touch-icon", type: "image/png"})=><link href="apple.png" type="image/png" rel="apple-touch-icon" />
image_tag(source [,html_options])`
image_tag("image.png")=><img src="image.png" />image_tag("image.png", {class: "img center"})=><img src="image.png" class="img center" />
javascript_include_tag(source [,html_options])`
javascript_include_tag("jquey.js")=><script src="jquery.js"></script>javascript_include_tag("jquey.js", {async: "async"})=><script src="jquery.js" async="async"></script>
stylesheet_link_tag(source [,html_options])
stylesheet_link_tag("bootstrap.css")=><link rel="stylesheet" type="text/css" href="bootstrap.css">stylesheet_link_tag("print.css", {media: "print"})=><link rel="stylesheet" type="text/css" href="print.css" media="print">
video_tag(sources [,html_options])
video_tag("myVideo.mp4") =><video src="myVideo.mp4"></video>video_tag("myVideo.mp4", {class: "video hidden", controls: "controls"})=><video src="myVideo.mp4" class="video full-screen" controls="controls"></video>audio_tag(["myVideo.mp4", "myVideo.ogg"])=><video><source src="myVideo.mp4" /><source src="myVideo.mp4" /></video>