From 0839b90132d005776e41a97fa0de03aaf426c044 Mon Sep 17 00:00:00 2001
From: Zachary Jones <zacharytamas@gmail.com>
Date: Thu, 14 Feb 2013 15:11:32 -0500
Subject: [PATCH] Add icon in asset list to describe the Asset's type: video,
 webpage, or image. Closes #59.

---
 static/coffee/screenly-ose.coffee |  8 ++++++++
 static/js/screenly-ose.js         | 15 +++++++++++++++
 views/index.haml                  |  5 ++++-
 3 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/static/coffee/screenly-ose.coffee b/static/coffee/screenly-ose.coffee
index 7e163c6c..7464d70b 100644
--- a/static/coffee/screenly-ose.coffee
+++ b/static/coffee/screenly-ose.coffee
@@ -91,6 +91,14 @@ class AssetRowView extends Backbone.View
   render: =>
     @$el.html @template @model.toJSON()
     (@$ ".toggle input").prop "checked", @model.get 'is_active'
+
+    switch (@model.get "mimetype")
+      when "video"   then icon_class = "icon-facetime-video"
+      when "image"   then icon_class = "icon-picture"
+      when "webpage" then icon_class = "icon-globe"
+      else                icon_class = ""
+    (@$ "#asset-icon").attr "class", icon_class
+
     (@$ "#delete-asset-button").popover
       html: yes, placement: 'left', title: "Are you sure?", content: get_template 'confirm-delete'
     this
diff --git a/static/js/screenly-ose.js b/static/js/screenly-ose.js
index 484fae67..bfe05463 100644
--- a/static/js/screenly-ose.js
+++ b/static/js/screenly-ose.js
@@ -192,8 +192,23 @@
     };
 
     AssetRowView.prototype.render = function() {
+      var icon_class;
       this.$el.html(this.template(this.model.toJSON()));
       (this.$(".toggle input")).prop("checked", this.model.get('is_active'));
+      switch (this.model.get("mimetype")) {
+        case "video":
+          icon_class = "icon-facetime-video";
+          break;
+        case "image":
+          icon_class = "icon-picture";
+          break;
+        case "webpage":
+          icon_class = "icon-globe";
+          break;
+        default:
+          icon_class = "";
+      }
+      (this.$("#asset-icon")).attr("class", icon_class);
       (this.$("#delete-asset-button")).popover({
         html: true,
         placement: 'left',
diff --git a/views/index.haml b/views/index.haml
index d5ada526..67e6ae96 100644
--- a/views/index.haml
+++ b/views/index.haml
@@ -26,7 +26,10 @@
 
     %script(type="text/template", id="asset-row-template")
       :plain
-        <td><%= name %></td>
+        <td>
+          <i id="asset-icon"></i>
+          <%= name %>
+        </td>
         <td><%= Screenly.date_to.string(start_date) %></td>
         <td><%= Screenly.date_to.string(end_date) %></td>
         <td>