Commit d8dd92a0

mo khan <mo@mokhan.ca>
2014-07-02 04:34:10
attach delete button to a modal to delete the cake.
1 parent 2536776
Changed files (4)
app/assets/javascripts/backbone/templates/cakes/delete_modal.jst.ejs
@@ -0,0 +1,24 @@
+<div class="modal-header">
+  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+  <h2>Are you ABSOLUTELY sure?</h2>
+</div>
+<div class="modal-body">
+  <% if (hasError()) { %>
+  <div class="alert">
+    <button type="button" class="close" data-dismiss="alert">&times</button>
+    <strong>Error!</strong> <%= errorMessage %>
+  </div>
+  <% } %>
+  <p>
+    This action <b>CANNOT</b> be undone.
+    This will permanently delete <b><%= name %></b> photos, and comments.
+  </p>
+  <p>
+    Please type in the name of the repository to confirm.
+    <input id="confirmation-textbox" type="text" class="input-xxlarge" autofocus="" required="" aria-label="Type in the name of the cake to confirm that you want to delete this repository.">
+  </p>
+</div>
+<div class="modal-footer">
+  <a href="#" class="btn" data-dismiss="modal">Cancel</a>
+  <button id="remove-button" type="submit" class="btn btn-danger" disabled="disabled">I understand the consequences, delete this cake</button>
+</div>
app/assets/javascripts/backbone/templates/cakes/show.jst.ejs
@@ -10,8 +10,8 @@
     <a href="<%= Routes.creation_favorites_path(id) %>" class="btn">
       <i class="icon-heart"></i> <strong>Fan Club</strong>
     </a>
-    <a href="remove-cake" class="btn btn-danger pull-right">
-      <i class="icon-white icon-remove"></i> <strong>Remove</strong>
+    <a id="remove-cake-button" class="btn btn-danger pull-right">
+      <i class="icon-white icon-remove"></i> <strong>Delete this cake</strong>
     </a>
     </p>
   </div>
app/assets/javascripts/backbone/views/cakes/delete_cake_modal_view.js.coffee
@@ -0,0 +1,40 @@
+CakeSide.Views.Cakes ||= {}
+
+class CakeSide.Views.Cakes.DeleteCakeModalView extends Marionette.ItemView
+  template: JST["backbone/templates/cakes/delete_modal"]
+  ui:
+    remove_button: "#remove-button"
+    confirmation_textbox: '#confirmation-textbox'
+
+  templateHelpers:
+    hasError: ->
+      typeof(@errorMessage) != "undefined"
+
+  events:
+    "click #remove-button": "remove"
+    'keyup #confirmation-textbox': 'refreshStatus'
+
+  modelEvents:
+    'change:errorMessage':'render'
+
+  remove: (e) ->
+    e.preventDefault()
+    e.stopPropagation()
+    @model.destroy(success: @successfullyDeleted, error: @errorDeletingCake)
+
+  successfullyDeleted: ->
+    @closeDialog()
+    window.location.hash = "cakes"
+
+  errorDeletingCake: (model, response, options) ->
+    model.set('errorMessage', 'Could not delete cake.')
+    console.log(response.statusText)
+
+  refreshStatus: ->
+    if @ui.confirmation_textbox.val() == @model.get('name')
+      @ui.remove_button.removeAttr('disabled')
+    else
+      @ui.remove_button.attr('disabled', 'disabled')
+
+  closeDialog: (photo) ->
+    $('#modal').modal('hide')
app/assets/javascripts/backbone/views/cakes/show_view.js.coffee
@@ -8,6 +8,7 @@ class CakeSide.Views.Cakes.ShowView extends Marionette.CompositeView
 
   events:
     "click .add-photo": "launchAddPhoto"
+    "click #remove-cake-button": "removeCake"
 
   templateHelpers:
     hasImage: ->
@@ -21,6 +22,12 @@ class CakeSide.Views.Cakes.ShowView extends Marionette.CompositeView
     @collection = @model.photos()
 
   launchAddPhoto: ->
-    view = new CakeSide.Views.Photos.NewModalView(cake: @model)
+    @displayModal(new CakeSide.Views.Photos.NewModalView(cake: @model))
+
+  removeCake: ->
+    @displayModal(new CakeSide.Views.Cakes.DeleteCakeModalView(model: @model))
+
+  displayModal: (view) ->
     $("#modal").html(view.render().el)
     $("#modal").modal()
+