delete snippets in ajax + new way of render theme assets in the back-office (backbone view) + change the way to fire growl messages

app/assets/javascripts/locomotive/application.js.coffee

@@ -10,4 +10,6 @@ window.Locomotive =
   Models: {}
   Collections: {}
   Routers: {}
-  Views: {}
+  Views: {}
+
+window.Locomotive.Views.Memberships = {}

app/assets/javascripts/locomotive/models/snippet.js.coffee

@@ -4,4 +4,8 @@ class Locomotive.Models.Snippet extends Backbone.Model
 
   urlRoot: "#{Locomotive.mount_on}/snippets"
 
-class Locomotive.Models.SnippetsCollection extends Backbone.Collection
+class Locomotive.Models.SnippetsCollection extends Backbone.Collection
+
+  model: Locomotive.Models.Snippet
+
+  url: "#{Locomotive.mount_on}/snippets"

app/assets/javascripts/locomotive/views/my_account/edit_view.js.coffee

@@ -14,8 +14,6 @@ class Locomotive.Views.MyAccount.EditView extends Locomotive.Views.Shared.FormVi
 
     Backbone.ModelBinding.bind @
 
-    window.foo = @model
-
   render: ->
     super()
 

app/assets/javascripts/locomotive/views/pages/edit_view.js.coffee

@@ -11,8 +11,6 @@ class Locomotive.Views.Pages.EditView extends Locomotive.Views.Pages.FormView
       success: (model, response, xhr) =>
         model._normalize()
 
-        $.growl('success', xhr.getResponseHeader('X-Message'))
-
         if model.get('template_changed') == true
           @reset_editable_elements()
         else
@@ -23,7 +21,5 @@ class Locomotive.Views.Pages.EditView extends Locomotive.Views.Pages.FormView
 
         @show_errors errors
 
-        $.growl('error', xhr.getResponseHeader('X-Message'))
-
 
 

app/assets/javascripts/locomotive/views/shared/form_view.js.coffee

@@ -29,19 +29,11 @@ class Locomotive.Views.Shared.FormView extends Backbone.View
 
     @model.save {},
       success: (model, response, xhr) =>
-        window.response = xhr
-
-        $.growl('success', xhr.getResponseHeader('X-Message')) if xhr.getResponseHeader('X-Message')?
-
         model.attributes = previous_attributes
 
         options.on_success(response, xhr) if options.on_success
 
       error: (model, xhr) =>
-        $.growl('error', xhr.getResponseHeader('X-Message'))
-
-        console.log(xhr)
-
         errors = JSON.parse(xhr.responseText)
 
         @show_errors errors

app/assets/javascripts/locomotive/views/snippets/item_view.js.coffee

@@ -0,0 +1,19 @@
+Locomotive.Views.Snippets ||= {}
+
+class Locomotive.Views.Snippets.ItemView extends Backbone.View
+
+  tagName: 'li'
+
+  events:
+    'click a.remove': 'remove_snippet'
+
+  render: ->
+    $(@el).html(ich.snippet_item(@model.toJSON()))
+
+    return @
+
+  remove_snippet: (event) ->
+    event.stopPropagation() & event.preventDefault()
+
+    if confirm $(event.target).attr('data-confirm')
+      @model.destroy()

app/assets/javascripts/locomotive/views/snippets/list_view.js.coffee

@@ -0,0 +1,47 @@
+Locomotive.Views.Snippets ||= {}
+
+class Locomotive.Views.Snippets.ListView extends Backbone.View
+
+  tagName: 'div'
+
+  className: 'box'
+
+  _item_views = []
+
+  initialize: ->
+    _.bindAll(@, 'remove_item')
+    @collection = new Locomotive.Models.SnippetsCollection(@options.collection)
+    @collection.bind('remove', @remove_item)
+
+  render: ->
+    $(@el).html(ich.snippets_list())
+
+    @render_items()
+
+    return @
+
+  render_items: ->
+    if @collection.length == 0
+      @$('.no-items').show()
+    else
+      @collection.each (snippet) =>
+        @insert_item(snippet)
+
+  insert_item: (snippet) ->
+    view = new Locomotive.Views.Snippets.ItemView model: snippet, parent_view: @
+
+    (@_item_views ||= []).push(view)
+
+    @$('ul').append(view.render().el)
+
+  remove_item: (snippet) ->
+    @$('.no-items').show() if @collection.length == 0
+    view = _.find @_item_views, (tmp) -> tmp.model == snippet
+    view.remove() if view?
+
+  remove: ->
+    _.each @_item_views, (view) => view.remove()
+    super
+
+
+

app/assets/javascripts/locomotive/views/theme_assets/index_view.js.coffee

@@ -4,30 +4,45 @@ class Locomotive.Views.ThemeAssets.IndexView extends Backbone.View
 
   el: '#content'
 
-  events:
-    'click .box a.remove': 'remove_asset'
+  # events:
+  #   'click .box a.remove': 'remove_asset'
+
+  # initialize: ->
 
   render: ->
+    @render_snippets()
+
     return @
 
-  remove_asset: (event) ->
-    event.stopPropagation() & event.preventDefault()
+  render_snippets: ->
+    @snippets_view = new Locomotive.Views.Snippets.ListView collection: @options.snippets
 
-    link = $(event.target)
+    @$('#snippets-anchor').replaceWith(@snippets_view.render().el)
 
-    $.rails.ajax
-      url:        link.attr('href')
-      type:       'post'
-      dataType:   'json'
-      data:
-        _method:  'delete'
-      success:    @on_successful_delete
-      error:      @on_failed_delete
+  remove: ->
+    @snippets_view.remove()
+    super
 
-  on_successful_delete: (data, status, xhr) ->
-    console.log('youpi')
-    $.growl('success', xhr.getResponseHeader('X-Message'))
-
-  on_failed_delete: (data, status, xhr) ->
-    $.growl('error', xhr.getResponseHeader('X-Message'))
+  # remove_asset: (event) ->
+  #   event.stopPropagation() & event.preventDefault()
+  #
+  #   link = $(event.target)
+  #
+  #   if confirm(link.attr('data-confirm'))
+  #     $.rails.ajax
+  #       url:        link.attr('href')
+  #       type:       'post'
+  #       dataType:   'json'
+  #       data:
+  #         _method:  'delete'
+  #       success:    (data, status, xhr) => @on_successful_delete(link, xhr)
+  #       error:      @on_failed_delete
+  #
+  #
+  # on_successful_delete: (link, xhr) ->
+  #   link.parents('')
+  #   $.growl('success', xhr.getResponseHeader('X-Message'))
+  #
+  # on_failed_delete: (data, status, xhr) ->
+  #   $.growl('error', xhr.getResponseHeader('X-Message'))
 

app/controllers/locomotive/snippets_controller.rb

@@ -3,7 +3,7 @@ module Locomotive
 
     sections 'settings', 'theme_assets'
 
-    respond_to :json, :only => [:create, :update]
+    respond_to :json, :only => [:create, :update, :destroy]
 
     def new
       @snippet = current_site.snippets.new

app/controllers/locomotive/theme_assets_controller.rb

@@ -3,7 +3,7 @@ module Locomotive
 
     sections 'settings', 'theme_assets'
 
-    respond_to :json, :only => [:index, :create, :update]
+    respond_to :json, :only => [:index, :create, :update, :destroy]
 
     def index
       respond_to do |format|

app/presenters/locomotive/snippet_presenter.rb

@@ -3,8 +3,12 @@ module Locomotive
 
     delegate :name, :slug, :template, :to => :source
 
+    def updated_at
+      I18n.l(self.source.updated_at, :format => :short)
+    end
+
     def included_methods
-      super + %w(name slug template)
+      super + %w(name slug template updated_at)
     end
 
   end

app/views/locomotive/snippets/_snippet.html.haml

@@ -1,7 +1,8 @@
-%li
-  %strong= link_to snippet.name, edit_snippet_path(snippet)
+%script{ :type => 'text/html', :id => 'snippet_item' }
+
+  %strong= link_to "{{name}}", edit_snippet_path('{{id}}')
   .more
     %span!= t('.updated_at')
-    = l snippet.updated_at, :format => :short
+    {{updated_at}}
 
-    = link_to 'x', snippet_path(snippet), :class => 'remove', :confirm => t('locomotive.messages.confirm'), :method => :delete
+    = link_to 'x', '#', :class => 'remove', :confirm => t('locomotive.messages.confirm')

app/views/locomotive/theme_assets/_list.html.haml

@@ -0,0 +1,7 @@
+%script{ :type => 'text/html', :id => "#{name}_list" }
+
+  %h3!= title
+  .inner
+    %p.no-items{ :style => 'display: none' }!= empty_message
+
+    %ul{ :class => name.dasherize }

app/views/locomotive/theme_assets/index.html.haml

@@ -1,5 +1,9 @@
 - title t('.title')
 
+- content_for :backbone_view_data do
+  :plain
+    { snippets: #{@snippets.to_json} }
+
 - content_for :submenu do
   = render_cell 'locomotive/settings_menu', :show
 
@@ -10,14 +14,20 @@
 %p!= t('.help')
 
 - if can?(:manage, Locomotive::Snippet)
-  .box
-    %h3!= t('.snippets')
-    .inner
-      - if @snippets.empty?
-        %p.no-items!= t('locomotive.snippets.index.no_items', :url => new_snippet_url)
-      - else
-        %ul.snippets
-          = render @snippets
+  #snippets-anchor
+
+  - content_for :head do
+    = render '/locomotive/snippets/snippet'
+    = render 'list', :name => 'snippets', :title => t('.snippets'), :empty_message => t('locomotive.snippets.index.no_items', :url => new_snippet_url)
+
+  / .box
+  /   %h3!= t('.snippets')
+  /   .inner
+  /     - if @snippets.empty?
+  /       %p.no-items!= t('locomotive.snippets.index.no_items', :url => new_snippet_url)
+  /     - else
+  /       %ul.snippets
+  /         = render @snippets
 
 - if can?(:manage, Locomotive::ThemeAsset)
   .box

lib/locomotive/responder.rb

@@ -23,6 +23,10 @@ module Locomotive
         with_flash_message do |message|
           display resource, :status => :ok, :location => api_location
         end
+      elsif delete?
+        with_flash_message do |message|
+          display resource, :status => :ok, :location => api_location
+        end
       elsif has_empty_resource_definition?
         display empty_resource, :status => :ok
       else

vendor/assets/javascripts/backbone.sync.js

@@ -88,6 +88,14 @@
       params.processData = false;
     }
 
+    params.complete = function(xhr, textStatus) {
+      var noticeType = xhr.getResponseHeader('X-Message-Type');
+      if (noticeType != null) {
+        var growlType = noticeType == 'notice' ? 'notice' : 'alert'; // for now, only 2 kind of growl messages
+        $.growl(noticeType, xhr.getResponseHeader('X-Message'));
+      }
+    }
+
     // Make the request.
     return $.ajax(params);
   }