Code Sample using backbone.js and three.js
JavaScript Ruby CoffeeScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
app
config
db
doc
lib
log
public
script
spec
test
vendor
.gitignore
.rspec
Gemfile
Gemfile.lock
README.md
README.rdoc
Rakefile
config.ru

README.md

dreamLog

DreamLog is a simple message board for dreams. It is built with backbone.js together with handlebar.js for creating template. All backbone views and models are located in assests/javascripts directory.

Checkout a live demo here.

####assets/javascript/views:

There are seven backbone class:

  • homePage.js.coffee :

  • dreamLog.js.coffee :

  • leftBar.js.coffee :

  • newDreamLog.js.coffee:

  • filter.js.coffee:

  • commentView.js.coffee:

  • replyView.js.coffee:

####assets/javascript/models:

models.js.coffee contains all backbone models and collections

collections:

  • users
  • logs
  • comments
  • replies
  • votes

####Fetching all collections before loading page content:

    $.when(
        App.usersCollection.fetch(),
        App.currentUser.fetch(),
        App.dreams.fetch(),
        App.comments.fetch(),
        App.replies.fetch(),
        App.votes.fetch()
    ).then ->
        # setup page and load page content

####Setting up backbone collection with rails backend

Here is an example on Logs collection:

routes.rb:

resources :log

model.js.coffee:

# Log model 
class Log extends Backbone.Model
    paramRoot: 'log'              # set up root parameter
    url:->
        if @id
            return "log/#{@id}"   # --> GET, DELETE, PUT
        else
            return "log"          # --> POST/CREATE

    initialize:(option)->
    
# Logs collection
class Logs extends Backbone.Collection
    model:Log
    url:'log'

Log_Controller.rb:

def index
end 

def create
end 

def update
end 

def destroy
end