Commit d162cdea

mo khan <mo@mokhan.ca>
2014-06-19 02:44:47
upload new photo using collection create.
1 parent 4937ef0
Changed files (5)
app
assets
javascripts
backbone
views
vendor
app/assets/javascripts/backbone/routers/photos_router.js.coffee
@@ -1,27 +1,28 @@
 class Cake.Routers.PhotosRouter extends Backbone.Router
   routes:
     "cakes/:cake_id/photos/new"      : "newPhoto"
-    "photos/index"    : "index"
-    "photos/:id/edit" : "edit"
-    "photos/:id"      : "show"
-    "photos/.*"        : "index"
+    "cakes/:cake_id/photos/index"    : "index"
+    "cakes/:cake_id/photos/:id/edit" : "edit"
+    "cakes/:cake_id/photos/:id"      : "show"
+    "cakes/:cake_id/photos/.*"        : "index"
 
   newPhoto: (cake_id) ->
     @photos = new Cake.Collections.PhotosCollection(cake_id: cake_id)
     @view = new Cake.Views.Photos.NewView(collection: @photos)
     $("#backbone-content").html(@view.render().el)
 
-  index: ->
+  index: (cake_id) ->
+    @photos = new Cake.Collections.PhotosCollection(cake_id: cake_id)
     @view = new Cake.Views.Photos.IndexView(photos: @photos)
     $("#backbone-content").html(@view.render().el)
 
-  show: (id) ->
+  show: (cake_id, id) ->
     photo = @photos.get(id)
 
     @view = new Cake.Views.Photos.ShowView(model: photo)
     $("#backbone-content").html(@view.render().el)
 
-  edit: (id) ->
+  edit: (cake_id, id) ->
     photo = @photos.get(id)
 
     @view = new Cake.Views.Photos.EditView(model: photo)
app/assets/javascripts/backbone/templates/cakes/show.jst.ejs
@@ -1,15 +1,12 @@
-<a href="#/">Back</a>
-<a href="#/cakes/<%= id %>/photos" class="btn">Add Photo</a>
 
 <div class="row">
   <div class="span6">
     <% if(_.any(photos)) { %>
-    <img class="thumbnail" src="<%= photos[0].large_url %>" alt="<%= name %>" />
+    <img class="thumbnail" src="<%= photos[Math.floor(Math.random()*photos.length)].large_url %>" alt="<%= name %>" />
     <% } %>
   </div>
   <div class="span6">
     <h1><a href="#/<%= id %>"><%= name %></a></h1>
-    <p>By <a href="<%= Routes.profile_path(user.id) %>"><%= user.name %></a></p>
     <span> <i class="icon-tags"></i> </span>
     <% _.each(tags, function(tag){ %>
       <a href="<%= Routes.creation_tag_path(tag.name) %>">
@@ -18,6 +15,7 @@
     <% }); %>
     <hr />
     <p><%= story %></p>
+    <a href="#/cakes/<%= id %>/photos/new" class="btn">Add Photo</a>
   </div>
 </div>
 
app/assets/javascripts/backbone/views/photos/new_view.js.coffee
@@ -21,27 +21,19 @@ class Cake.Views.Photos.NewView extends Backbone.View
     @model.unset("errors")
 
     fileObject = @$(':input[type="file"]')[0].files[0]
-    photo = new Cake.Models.Photo(cake_id: 100)
-    photo.url = => @collection.url
-    photo.set('image', fileObject)
-    photo.on('progress', console.log)
-    photo.save()
-
-    #@model.set('image', fileObject)
-    #@model.save()
-    #@model.on('progress', console.log)
-    #@collection.create(@model.toJSON(),
-      #success: (photo) =>
-        #@model = photo
-        #window.location.hash = "/#{@model.id}"
-
-      #error: (photo, jqXHR) =>
-        #@model.set({errors: $.parseJSON(jqXHR.responseText)})
-    #)
+    @model.set('image', fileObject)
+    @model.on('progress', console.log)
+    @collection.create(@model.toJSON(),
+      success: (photo) =>
+        @model = photo
+        debugger
+        window.location.hash = "/#{@model.cake_id}"
+
+      error: (photo, jqXHR) =>
+        @model.set({errors: $.parseJSON(jqXHR.responseText)})
+    )
 
   render: ->
-    $(@el).html(@template(@model.toJSON() ))
-
+    $(@el).html(@template(@model.toJSON()))
     this.$("form").backboneLink(@model)
-
     return this
app/views/api/v1/photos/_photo.json.jbuilder
@@ -1,5 +1,5 @@
 json.id photo.id
-json.id photo.creation_id
+json.cake_id photo.creation_id
 json.content_type photo.content_type
 json.original_filename photo.original_filename
 json.latitude photo.latitude
vendor/assets/javascripts/backbone-model-file-upload.js
@@ -4,12 +4,11 @@
 //     https://github.com/homeslicesolutions/backbone-model-file-upload
 
 !function(_, Backbone){
-
   // Clone the original Backbone.Model.prototype
   var backboneModelClone = _.clone( Backbone.Model.prototype );
 
   // Extending out
-  _.extend(Backbone.Model.prototype, {  
+  _.extend(Backbone.Model.prototype, {
 
     // ! Default file attribute - can be overwritten
     fileAttribute: 'file',
@@ -81,7 +80,6 @@
 
       // Continue to call the existing "save" method
       return backboneModelClone.save.call(this, attrs, options);
-      
     },
 
     // _ FlattenObject gist by "penguinboy".  Thank You!
@@ -103,15 +101,15 @@
       return output;
 
     },
-    
+
     // _ Get the Progress of the uploading file
     _progressHandler: function( event ) {
+      console.log(event);
       if (event.lengthComputable) {
         var percentComplete = event.loaded / event.total;
+        console.log("triggering... " + percentComplete);
         this.trigger( 'progress', percentComplete );
       }
     }
-
   });
-
 }(_, Backbone);