Starting work on Add Assets modal

static/coffee/screenly-ose.coffee

@@ -49,6 +49,18 @@ jQuery ->
   # Views
   ################################
 
+  class AddAssetModalView extends Backbone.View
+    initialize: (options) ->
+      @template = _.template($('#add-asset-modal-template').html())
+
+    render: ->
+      $(@el).html(@template())
+      @
+
+  screenly.views.AddAssetModalView = AddAssetModalView
+
+  class EditAssetModalView extends Backbone.View
+
   class AssetsView extends Backbone.View
     initialize: (options) ->
 
@@ -90,6 +102,7 @@ jQuery ->
       @
 
     deactivateAsset: (event) ->
+      event.preventDefault()
       screenly.ActiveAssets.remove(@model)
       screenly.InactiveAssets.add(@model)
 
@@ -132,5 +145,11 @@ jQuery ->
   $("#active-assets-container").append activeAssetsView.render().el
   $("#inactive-assets-container").append inactiveAssetsView.render().el
 
+  $("#add-asset-button").click ->
+    console.log "Clicked add asset button"
+    modal = new AddAssetModalView()
+    $("body").append modal.render().el
+    $(modal.el).children(":first").modal()
+
 
 

static/js/screenly-ose.js

@@ -1,2 +1,2 @@
 // Generated by CoffeeScript 1.4.0
-(function(){var e,t,n,r={}.hasOwnProperty,i=function(e,t){function i(){this.constructor=e}for(var n in t)r.call(t,n)&&(e[n]=t[n]);i.prototype=t.prototype;e.prototype=new i;e.__super__=t.prototype;return e},s=[].indexOf||function(e){for(var t=0,n=this.length;t<n;t++)if(t in this&&this[t]===e)return t;return-1};this.screenly=(e=window.screenly)!=null?e:{};this.screenly.collections=(t=window.screenly.collections)!=null?t:{};this.screenly.views=(n=window.screenly.views)!=null?n:{};jQuery(function(){var e,t,n,r,o,u,a,f,l;n=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);return t}(Backbone.Model);r=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.url="/api/assets";t.prototype.model=n;t.prototype.initialize=function(e){return this.on("reset",function(){screenly.ActiveAssets.reset();screenly.InactiveAssets.reset();return this.each(function(e){return e.get("is_active")?screenly.ActiveAssets.add(e):screenly.InactiveAssets.add(e)})})};return t}(Backbone.Collection);(screenly.Assets=new r).fetch();t=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.model=n;return t}(Backbone.Collection);a=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.model=n;return t}(Backbone.Collection);screenly.collections.Assets=r;screenly.collections.ActiveAssets=t;screenly.collections.InactiveAssets=a;screenly.ActiveAssets=new t;screenly.InactiveAssets=new a;o=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.initialize=function(e){var t,n;(t=!1,s.call(e,t)>=0)&&console.log("You need to specify the template name for this AssetsView.");(n=!1,s.call(e,n)>=0)&&console.log("You must specify the child view class for this AssetsView.");this.template=_.template($("#"+e.template_name).html());this.collection.bind("reset",this.render,this);this.collection.bind("remove",this.render,this);return this.collection.bind("add",this.render,this)};t.prototype.render=function(){var e=this;$(this.el).html(this.template());this.$("tbody").empty();this.collection.each(function(t){return e.$("tbody").append((new e.options.childViewClass({model:t})).render().el)});return this};return t}(Backbone.View);e=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.initialize=function(e){return this.template=_.template($("#active-asset-row-template").html())};t.prototype.events={"click #deactivate":"deactivateAsset"};t.prototype.tagName="tr";t.prototype.render=function(){$(this.el).html(this.template(this.model.toJSON()));return this};t.prototype.deactivateAsset=function(e){screenly.ActiveAssets.remove(this.model);return screenly.InactiveAssets.add(this.model)};return t}(Backbone.View);u=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.initialize=function(e){return this.template=_.template($("#inactive-asset-row-template").html())};t.prototype.events={"click #activate":"activateAsset"};t.prototype.tagName="tr";t.prototype.render=function(){$(this.el).html(this.template(this.model.toJSON()));return this};t.prototype.activateAsset=function(e){e.preventDefault();screenly.InactiveAssets.remove(this.model);return screenly.ActiveAssets.add(this.model)};return t}(Backbone.View);screenly.views.AssetsView=o;screenly.views.ActiveAssetRowView=e;f=new o({collection:screenly.ActiveAssets,template_name:"active-assets-template",childViewClass:e});l=new o({collection:screenly.InactiveAssets,template_name:"inactive-assets-template",childViewClass:u});$("#active-assets-container").append(f.render().el);return $("#inactive-assets-container").append(l.render().el)})}).call(this);
+(function(){var e,t,n,r={}.hasOwnProperty,i=function(e,t){function i(){this.constructor=e}for(var n in t)r.call(t,n)&&(e[n]=t[n]);i.prototype=t.prototype;e.prototype=new i;e.__super__=t.prototype;return e},s=[].indexOf||function(e){for(var t=0,n=this.length;t<n;t++)if(t in this&&this[t]===e)return t;return-1};this.screenly=(e=window.screenly)!=null?e:{};this.screenly.collections=(t=window.screenly.collections)!=null?t:{};this.screenly.views=(n=window.screenly.views)!=null?n:{};jQuery(function(){var e,t,n,r,o,u,a,f,l,c,h;r=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);return t}(Backbone.Model);o=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.url="/api/assets";t.prototype.model=r;t.prototype.initialize=function(e){return this.on("reset",function(){screenly.ActiveAssets.reset();screenly.InactiveAssets.reset();return this.each(function(e){return e.get("is_active")?screenly.ActiveAssets.add(e):screenly.InactiveAssets.add(e)})})};return t}(Backbone.Collection);(screenly.Assets=new o).fetch();t=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.model=r;return t}(Backbone.Collection);l=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.model=r;return t}(Backbone.Collection);screenly.collections.Assets=o;screenly.collections.ActiveAssets=t;screenly.collections.InactiveAssets=l;screenly.ActiveAssets=new t;screenly.InactiveAssets=new l;n=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.initialize=function(e){return this.template=_.template($("#add-asset-modal-template").html())};t.prototype.render=function(){$(this.el).html(this.template());return this};return t}(Backbone.View);screenly.views.AddAssetModalView=n;a=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);return t}(Backbone.View);u=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.initialize=function(e){var t,n;(t=!1,s.call(e,t)>=0)&&console.log("You need to specify the template name for this AssetsView.");(n=!1,s.call(e,n)>=0)&&console.log("You must specify the child view class for this AssetsView.");this.template=_.template($("#"+e.template_name).html());this.collection.bind("reset",this.render,this);this.collection.bind("remove",this.render,this);return this.collection.bind("add",this.render,this)};t.prototype.render=function(){var e=this;$(this.el).html(this.template());this.$("tbody").empty();this.collection.each(function(t){return e.$("tbody").append((new e.options.childViewClass({model:t})).render().el)});return this};return t}(Backbone.View);e=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.initialize=function(e){return this.template=_.template($("#active-asset-row-template").html())};t.prototype.events={"click #deactivate":"deactivateAsset"};t.prototype.tagName="tr";t.prototype.render=function(){$(this.el).html(this.template(this.model.toJSON()));return this};t.prototype.deactivateAsset=function(e){e.preventDefault();screenly.ActiveAssets.remove(this.model);return screenly.InactiveAssets.add(this.model)};return t}(Backbone.View);f=function(e){function t(){return t.__super__.constructor.apply(this,arguments)}i(t,e);t.prototype.initialize=function(e){return this.template=_.template($("#inactive-asset-row-template").html())};t.prototype.events={"click #activate":"activateAsset"};t.prototype.tagName="tr";t.prototype.render=function(){$(this.el).html(this.template(this.model.toJSON()));return this};t.prototype.activateAsset=function(e){e.preventDefault();screenly.InactiveAssets.remove(this.model);return screenly.ActiveAssets.add(this.model)};return t}(Backbone.View);screenly.views.AssetsView=u;screenly.views.ActiveAssetRowView=e;c=new u({collection:screenly.ActiveAssets,template_name:"active-assets-template",childViewClass:e});h=new u({collection:screenly.InactiveAssets,template_name:"inactive-assets-template",childViewClass:f});$("#active-assets-container").append(c.render().el);$("#inactive-assets-container").append(h.render().el);return $("#add-asset-button").click(function(){var e;console.log("Clicked add asset button");e=new n;$("body").append(e.render().el);return $(e.el).children(":first").modal()})})}).call(this);

views/index.haml

@@ -59,6 +59,18 @@
         <td>
           <a href="#" id="activate">Activate</a>
         </td>
+
+    %script(type="text/template", id="add-asset-modal-template")
+      .modal.hide.fade(tabindex="-1", role="dialog", ariaLabelledby="myModalLabel", ariaHidden="true")
+        .modal-header
+          %button.close(type="button", dataDismiss="modal", ariaHidden="true") x
+          %h3#myModalLabel Add Asset
+        .modal-body
+          %p Hey guys.
+        .modal-footer
+          %a.btn(href="#", dataDismiss="modal") Close
+          %a.btn.btn-primary(href="#") Add Asset
+
                 
 
   %body