Skip to content

Instantly share code, notes, and snippets.

@lancejpollard
Created February 19, 2011 22:52
Show Gist options
  • Save lancejpollard/835458 to your computer and use it in GitHub Desktop.
Save lancejpollard/835458 to your computer and use it in GitHub Desktop.
head.js, coffeescript, coffeekup
# https://gist.github.com/835458
head.js(
"/javascripts/vendor/plugins/coffeekup.js",
"/javascripts/vendor/plugins/jquery.js",
"/javascripts/vendor/plugins/underscore.js",
"/javascripts/vendor/plugins/backbone.js",
"/javascripts/app/deals.js"
)
html_head = ->
link rel: 'stylesheet', href: '/stylesheets/application.css'
html_body = ->
div id: "document", class: "document", role: "document", ->
nav id: "navigation", role: "banner", ->
div class: "frame", ->
figure id: "logo", ->
a href: "/", ->
img src: "/images/logos/biglobby-logo.png?"
ul id: "menu"
header ->
div class: "frame"
section id: "body", ->
div class: "frame", ->
section id: "content", class: "hfeed", role: "main"
aside id: "sidebar", role: "complementary"
footer id: "footer", role: "contentinfo", ->
div class: "frame"
head.ready ->
$("head").append(coffeekup.render(html_head))
$("body").append(coffeekup.render(html_body))
deals = new Deals()
deals.fetch
success: (collection, response) ->
for model in collection.models
new DealView({model:model}).render()
error: (collection, response) -> console.log(response)
!!! 5
%html#application
%head
= javascript_include_tag 'head'
= javascript_include_tag 'app'
%body
<!DOCTYPE html>
<html id='application'>
<head>
<script src="/javascripts/head.js?1298116248" type="text/javascript"></script>
<script src="/javascripts/app.js?1298155871" type="text/javascript"></script>
</head>
<body></body>
</html>
# model
class Deal extends Backbone.Model
initialize: ->
# collection
class Deals extends Backbone.Collection
model: Deal
url: "/deals"
initialize: ->
# view
class DealView extends Backbone.View
initialize: (args) ->
tagName: "li"
events:
'click .bookmark': 'bookmarkIt'
render: ->
$("#content").append coffeekup.render(this.template, context: this.model.toJSON())
bookmarkIt: ->
this.$('.title').text(this.model.get('title'))
template: ->
article class: "deal #{@type_param} vevent", "data-status": @status, "data-type": @type_underscore, itemscope: "itemscope", itemtype: "http://www.data-vocabulary.org/Event", ->
figure class: "snapshot", ->
time class: "availability", datetime: @start_date
a class: "logo fancy-ajax", ->
span
img class: "photo", src: @vendor_logo_url
a class: "status bookmark", href: @bookmark_url, -> @bookmark_status
section class: "details", itemprop: "seller", itemtype: "http://data-vocabulary.org/Organization", ->
header class: "header", ->
hgroup ->
h3 class: "vendor fn org", itemprop: "name", ->
a href: @vendor_url, class: "fancy-ajax", -> @vendor_name
span class: "hyphen", -> "-"
span class: "distance", -> @location
h2 class: "title", ->
span class: "quotation-mark", '"'
a class: "url summary", href: @vendor_deal_url, -> @title
span class: "quotation-mark", '"'
p class: "highlights", -> @highlights
p class: "description", itemprop: "description", -> @description
footer class: "footer", ->
address class: "location adr", itemprop: "address", itemscope: "itemscope", itemtype: "http://data-vocabulary.org/Address", ->
span class: "locality", itemprop: "locality"
span class: "geo", itemprop: "geo", itemtype: "http://data-vocabulary.org/Geo", ->
span class: "latitude", itemprop: "latitude", ->
span class: "value-title", title: @lat
span class: "longitude", itemprop: "longitude", ->
span class: "value-title", title: @lng
span class: "tel", itemprop: "tel", -> @phone
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment