1 files changed, 22 insertions, 6 deletions

diff --git a/public/javascripts/related_assets.js b/public/javascripts/related_assets.js
index 2955cbf..3340fa7 100644
--- a/public/javascripts/related_assets.js
+++ b/public/javascripts/related_assets.js
@@ -5,6 +5,8 @@ related_assets = {
     var createUrl = container.data("create-url");
     var list = $("#related_asset_list");
 
+    related_assets.update_headline_badge(list);
+
     initSearchPicker({
       inputSelector: "#related_asset_search_term",
       resultsSelector: "#related_asset_search_results",
@@ -13,12 +15,9 @@ related_assets = {
       renderResults: function(data, results) {
         var found = false;
         data.forEach(function(asset) {
-          var item = $(
-            "<a href='#' class='related_asset_result'>" +
-              "<img src='" + asset.thumb_url + "' alt=''>" +
-              "<span>" + asset.name + "</span>" +
-            "</a>"
-          );
+          var item = $("<a>", { href: "#", "class": "related_asset_result" });
+          item.append($("<img>", { src: asset.thumb_url, alt: "" }));
+          item.append($("<span>").text(asset.name || ""));
           item.bind("click", function() {
             related_assets.attach(asset.id, createUrl, list);
             return false;
@@ -45,6 +44,7 @@ related_assets = {
           url: ui.item.data("url"),
           data: "position=" + newPosition
         });
+        related_assets.update_headline_badge(list);
       }
     });
 
@@ -55,11 +55,23 @@ related_assets = {
         url: item.data("url"),
         success: function() {
           item.remove();
+          related_assets.update_headline_badge(list);
         }
       });
     });
   },
 
+  update_headline_badge: function(list) {
+    list.find(".related_asset_headline_badge").remove();
+    var first = list.children("li").first();
+    if (first.length) {
+      $("<span>", {
+        "class": "related_asset_headline_badge",
+        "title": "Shown automatically as this page's headline image"
+      }).text("Headline").insertBefore(first.find(".related_asset_remove"));
+    }
+  },
+
   attach: function(assetId, createUrl, list) {
     $.ajax({
       type: "POST",
@@ -69,9 +81,13 @@ related_assets = {
       success: function(related) {
         var item = $($("#related_asset_template").html().trim());
         item.attr("data-url", related.url);
+        item.attr("data-large-url", related.large_url);
+        item.attr("data-original-url", related.original_url);
+        item.attr("data-name", related.name);
         item.find("img").attr("src", related.thumb_url);
         list.append(item);
         list.sortable("refresh");
+        related_assets.update_headline_badge(list);
         $("#related_asset_search_term").val("");
         $("#related_asset_search_results").slideUp().empty();
       }