Glimmer DSL for XML (& HTML) 1.4.0 has been released! It includes a new HTML To Glimmer Converter that can automatically convert any legacy HTML code into Glimmer DSL Ruby code. Glimmer DSL for Web (Ruby in the Browser Web Frontend Framework) has been upgraded to include both Glimmer DSL for XML 1.4.0 and Glimmer DSL for CSS 1.4.0 (which also recently included a CSS To Glimmer Converter).
Change Log (1.4.0)
- html_to_glimmer converter command for automatically converting HTML to Glimmer DSL Ruby code
- Support p keyword directly within Glimmer DSL for XML (without having to use the custom tag keyword like tag(:_name => "p"))
- Provide Kernel#pi (puts inspect) alias in case someone needs to use Ruby p inside the xml or html block of Glimmer DSL for XML
Below is the documentation for the new HTML To Glimmer Converter.
Happy Glimmering!
The Ruby gem includes a HTML to Glimmer converter (html_to_glimmer) to automatically convert legacy HTML code into Glimmer DSL syntax.
Prerequisite: the nokogiri Ruby gem. If not already installed, run gem install nokogiri before using html_to_glimmer.
Script:
bin/html_to_glimmer
Usage:
html_to_glimmer path_to_html_file
Example:
Suppose we have an HTML file called input.html:
<html style='max-height: 100%'>
<body style="max-height: 100%; font: 'Times New Roman', Arial;">
<h1 id="top-header" class="header" data-owner='John "Bonham" Doe'>Welcome</h1>
<p>It is good to have <strong>you</strong> in our <strong><em>platform</em></strong>!</p>
<form action="/owner" method="post">
<input type="text" value="you" />
</form>
</body>
</html>We can run this command:
html_to_glimmer input.html
Printout:
Converting from HTML syntax to Glimmer DSL Ruby syntax for input file: input.html
Converted output file: input.html.glimmer.rb
Output file (input.html.glimmer.rb) is a runnable Ruby file containing Glimmer DSL for XML & HTML syntax:
require 'glimmer-dsl-xml'
include Glimmer
html_document = xml {
html(style: 'max-height: 100%') {
body(style: "max-height: 100%; font: 'Times New Roman', Arial;") {
h1(id: 'top-header', class: 'header', 'data-owner': 'John "Bonham" Doe') {
"Welcome"
}
p {
span {
"It is good to have "
}
strong {
"you"
}
span {
" in our "
}
strong {
em {
"platform"
}
}
span {
"!"
}
}
form(action: '/owner', method: 'post') {
input(type: 'text', value: 'you')
}
}
}
}
puts html_document.to_sNote that text nodes are converted into span nodes as that is the recommended way of including them in Glimmer DSL for XML at the moment.
1 comment:
Thanks for the catch Ged. I just fixed it by removing the link (I originally copied the (relative) link from the GitHub project into the Gist, which is why it wasn't working there. It is not really needed in the Gist though).
Post a Comment