Skip to content
Create a gist now

Instantly share code, notes, and snippets.

backbone based mobile page model
#=require haml
#=require backbone
class PageView extends Backbone.View
tag: "div"
class: "page"
classes: ->
viewdata: -> {}
inner_html: ->
render: ->
console.log "rendering #{}"
for c in @classes()
footer = @$('footer').hide()
if @model != null
# Iterate through all bindings
for selector, field of @modelBindings
do (selector, field) =>
console.log "binding #{selector} to #{field}"
# When the model changes update the form
# elements
@model.bind "change:#{field}", (model, val)=>
console.log "model[#{field}] => #{selector}"
# When the form changes update the model
[event, selector...] = selector.split(" ")
selector = selector.join(" ")
@$(selector).bind event, (ev)=>
console.log "form[#{selector}] => #{field}"
@model.set_field field, @$(
# Set the initial value of the form
# elements
console.log "#{field}:#{@model.get(field)} -> #{selector}"
modelBindings: []
beforeEntry: ->
afterEntry: ->
show: ->
doShow = (oldPage)=>
$(@el).show 0
opts =
mode: "show"
direction: "right"
easing: "easeInOutCubic"
$(@el).effect "slide", opts, 500, =>
# Hide everything else and
# then show the current page
oldpage = $("")
if oldpage.size() > 0
opts =
mode: "hide"
direction: "left"
easing: "easeInOutCubic"
oldpage.effect "slide", opts, 500, =>
# This moves the footer out of the
# 'page' and into the body so the
# compass sticky-footer plugin can
# work with it
transplantFooter: ->
footer = @$('footer').detach()
$("body > footer").remove()
$("<div class='footer_hack_footer'/>").appendTo($(@el))
switchToPage: (page) ->
@switch: (page) ->
window.PageView = PageView
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.