¿Cómo puedo integrar con éxito una variable de FrontMate de Middleman en un fragmento de JavaScript en la página de diseño escrita en haml? - javascript, haml, preprocesador, intermediario, yaml-front-matter

Ayer decidí ir a por Intermediario y HAML y son impresionantes! Como no quiero crear múltiples diseños por solo un valor, intenté usar un variable de frontmatter para cambiar un valor en una fragmento de JavaScript en la parte inferior de la página de diseño.

El fragmento de código de JavaScript está envuelto en el :javascript filtroaquí está la referencia), que activa un complemento jQuery. El plugin necesita algunas variables. La variable que quiero cambiar en otras páginas es top. De acuerdo con la página de guía de materias primas de Middleman (aquí está la referencia), solo hay que añadir <% current_page.data.top %> Donde quieres esa variable en la página de diseño. Esta cadena, escrita en erb se traduce a Haml en = current_page.data.top pero cuando ejecuto la página en un navegador, la consola de desarrolladores dice SyntaxError: expected expression, got "=".

¿Cómo puedo integrar con éxito una variable de frontmatter Middleman en un fragmento de código javascript en la página de diseño escrita en haml?

La parte inferior de la página de diseño (donde está el fragmento) se ve así:

/ content of the layout the page

:javascript
$("#sidenav").simplerSidebar({
opener: "#toggle-sidenav",
top: = current_page.data.top
animation: {
easing: "easeOutQuint"
},
sidebar: {
align: "right",
width: 320,
closingLinks: "a",
css: {
zIndex: 3000
}
}
});

La página que quiero cambiar se ve así:

---
top: 30
---

/ rest of the page

Respuestas

Me las arreglé para responder a mi pregunta por mi cuenta. Leí una vez más y con más cuidado el Referencia de Haml y en el Filtrar sección leí eso "Los filtros pueden tener código Ruby interpolado con # {}"..

Básicamente, mientras codifica bajo un filtro (sin importar qué filtro sea), en lugar de usar las cadenas proporcionadas por Middleman y Haml, debe usar esta. #{current_page.data}.

En mi caso el código del fragmento debería ser:

:javascript
$("#sidenav").simplerSidebar({
opener: "#toggle-sidenav",
top: #{current_page.data.top},
animation: {
easing: "easeOutQuint"
},
sidebar: {
align: "right",
width: 320,
closingLinks: "a",
css: {
zIndex: 3000
}
}
});