Skip to content

Instantly share code, notes, and snippets.

@jamiehodge
Created April 12, 2012 20:51
Show Gist options
  • Save jamiehodge/2370908 to your computer and use it in GitHub Desktop.
Save jamiehodge/2370908 to your computer and use it in GitHub Desktop.
HTML5-based collection media type
ul
- for keyword in keywords
li
a rel='item' href=url("/#{keyword.id}", false) = keyword.name
nav
ul
- if keywords.next_page
li
a rel='next' href=url("/?page=#{keywords.next_page}", false) Next Page
- if keywords.prev_page
li
a rel='prev' href=url("/?page=#{keywords.prev_page}", false) Previous Page
aside
form.search action=url('/', false) method='get'
fieldset
legend Search Keywords
p
label for='search' Search
input type='search' name='search' placeholder='search' required=true results=5 autosave=url('/')
p
input type='submit' value='Search'
form.create action=url('/', false) method='post'
fieldset
legend Create Keyword
p
label for='name' Name
input type='text' name='name' placeholder='name' required=true
p
input type='submit' value='Create'
article
header
h1
a rel='self' href=url("/#{keyword.id}", false) = keyword.name
p
time datetime=keyword.updated_at.xmlschema = keyword.updated_at.strftime "%Y/%m/%d, %H:%M %Z"
nav
ul
li
a rel='collection' href=url("/", false) Index
dl
dt name
dd = keyword.name
aside
form.update action=url("/#{keyword.id}", false) method='post'
fieldset
legend Edit Keyword
input type='hidden' name='_method' value='patch'
p
label for='name' Name
input type='text' name='name' value=keyword.name placeholder='name' required=true
p
input type='submit' value='Update'
form.delete action=url("/#{keyword.id}", false) method='post'
fieldset
legend Delete Keyword
input type='hidden' name='_method' value='delete'
p
input type='submit' value='Delete'
@lmarburger
Copy link

I think it looks great. I'll be attempting to add an XHTML or HTML5 (haven't done the research yet into why one is chosen over the other) media type to an API once the Collection+JSON is done. I'll revisit this gist at that time with a specific, practical goal in mind. Thanks for sharing, @jamiehodge!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment