Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Backbone.js + Django

Backbone.js + Django

Leah Culver

October 06, 2011
Tweet

More Decks by Leah Culver

Other Decks in Programming

Transcript

  1. sendMessage: function(e) { var msg = $('#message').val() var row =

    '<span>' + currentUser + ':</span> ' + msg row = row + '<span class="ts">' + ts + '</span>' $(Leafy.channelID(channel)).append(row) Kahlan.say(Leafy.currentChannel, msg) },
  2. this.socket = new Orbited.TCPSocket say: function(channel, msg) { var data

    = {to: channel, type: 'privmsg', body: msg} this.socket.send(JSON.stringify(data) + "\r\n") },
  3. 1. handle form submit 2. create new message 3. display

    message in list 4. POST message via AJAX
  4. MVC

  5. currentChannel.messages.create({'message': msg}, { success: function(model, response) { message.set(model.attributes, { silent:

    true }); }, error: function(model, error) { currentChannel.messages.remove(message); $('#message').val(msg); } });
  6. if request.method == 'POST': json_data = simplejson.loads(request.raw_post_data) message = Message.objects.create(

    message=json_data.get('message'), ... ) return JSONResponse(request, message.data())
  7. var MainRouter = Backbone.Router.extend({ routes: { 'app/join': 'join', 'app/:name': 'channel'

    }, join: function() { var joinPageView = new JoinPageView(); return joinPageView.loadPage(); }, });
  8. Photos http://www.flickr.com/photos/coldtaxi/426162862/ http://www.flickr.com/photos/aliaholle/5888906660/ http://www.flickr.com/photos/joshmaz/5248178452/ http://www.flickr.com/photos/1stpix_diecast_dioramas/5934583890/ http://www.flickr.com/photos/hamed/429069420/ http://www.flickr.com/photos/ittybittiesforyou/4942706804/ http://www.flickr.com/photos/krhamm/171302278/ http://www.flickr.com/photos/vinothchandar/5148046888/ http://www.flickr.com/photos/jliba/4437937329/

    http://www.flickr.com/photos/seier/2034873075/ http://www.flickr.com/photos/31246066@N04/5115966185/sizes http://thefilmstage.com/news/zoolander-2-in-limbo-at-paramount/ http://www.flickr.com/photos/byebyeempire/323372590/ http://www.flickr.com/photos/shakethesky/4104894504/ http://www.flickr.com/photos/litlnemo/3296421032/ http://www.flickr.com/photos/qusic/3370510628/