From 45e3c7f08882bfa80afa69186d6e9a814068f3e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bjo=CC=88rn=20Dahlgren?= <bjorn@dahlgren.at>
Date: Thu, 29 May 2014 21:45:32 +0200
Subject: [PATCH] Show loader for mod update

---
 public/js/app/views/mods/list_item.js | 13 ++++++++++++-
 public/js/tpl/mods/list_item.html     |  2 +-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/public/js/app/views/mods/list_item.js b/public/js/app/views/mods/list_item.js
index 3498ce3..52ded81 100644
--- a/public/js/app/views/mods/list_item.js
+++ b/public/js/app/views/mods/list_item.js
@@ -6,6 +6,7 @@ define(function (require) {
       _                   = require('underscore'),
       Backbone            = require('backbone'),
       Marionette          = require('marionette'),
+      Ladda               = require('ladda'),
       tpl                 = require('text!tpl/mods/list_item.html'),
 
       template = _.template(tpl);
@@ -21,13 +22,23 @@ define(function (require) {
     update: function (event) {
       var self = this;
       event.preventDefault();
+
+      this.laddaBtn = Ladda.create(this.$el.find(".ladda-button").get(0));
+      this.laddaBtn.start();
+      this.$el.find('.ladda-button').addClass('disabled');
+
       $.ajax({
         url: "/api/mods/" + this.model.get('name'),
         type: 'PUT',
         success: function (resp) {
+          self.laddaBtn.stop();
+          self.$el.find('.ladda-button').removeClass('disabled');
           self.trigger("mods:update", mods);
         },
-        error: $.noop
+        error: function (resp) {
+          self.laddaBtn.stop();
+          self.$el.find('.ladda-button').removeClass('disabled');
+        },
       });
     },
   });
diff --git a/public/js/tpl/mods/list_item.html b/public/js/tpl/mods/list_item.html
index 318e2fd..d2998ba 100644
--- a/public/js/tpl/mods/list_item.html
+++ b/public/js/tpl/mods/list_item.html
@@ -1,7 +1,7 @@
 <td>
   <a href='#mods/<%-name%>'><%-name%></a>
   <% if (outdated) { %>
-    <a class="btn btn-primary btn-xs update pull-right">
+    <a class="btn btn-primary btn-xs update pull-right ladda-button" data-style="expand-left">
       <span class="glyphicon glyphicon-save"></span>
       Update
     </a>