<div><p> ;(function($) {
var suggest_new_html ='</p><div class="fbs-suggestnew-description">Your item not in the list?</div><span class="fbs-suggestnew-shortcut">(Shift+Enter)</span>';


function init() {
  // some variables we expect to be set by acre (server side);
  if (typeof list_image == 'undefined') {
    list_image = null;
  }    
  if (typeof common_type == 'undefined') {
    common_type = '/common/topic';
  }
  
  // init editing if editable
  var editable = $("body").attr("editable")=='true';
  
  if (editable) {
    init_editing();
  }
  
  init_star_rating(editable);
  
  
  // clone list
  $("#link-clone-list").click(function() {
    $("#form-clone-list").submit();    
    return false;
  });
  
  // DAE: I added this, but it should only fire if in gallery mode -Kai
  //normalize height of .gallery-entry-item for proper display
  if ($.fn.equalizeCols) {
    $(".gallery-entry-item").equalizeCols();
  }
  
  // i like it form
  $("#ilikeit-form").ajaxForm({
    success: function(html) {
      $("#ilikeit").html(html);
    }
  });
};


function init_editing() {
  $addtopic = $("#addtopic");
  $addcomment = $("#addcomment");
  $pane1 = $("#addpane1");
  $pane2 = $("#addpane2");
  $addbutton = $("#addbutton");
  $addform = $("#addform");
  $list = $("#list");
  
  //
  // trash list
  //
  $("#link-trash-list").click(function() {
    var ok = confirm("Are you sure you want to delete this list?");
    if (ok) {
      $("#form-trash-list").submit();    
    }
    return false;
  });   
  
  
  //
  // list is sortable (drag and drop)
  //
  $list.sortable({
    update: on_sort,    
    //placeholder: 'ui-sortable-placeholder',
    //forceHelperSize: true,
    //forcePlaceholderSize: true,
    //cursor: 'move'
  });
  
  //
  // init adding topic to the list
  // as an ajax form submit
  //
  $addform.ajaxForm({
    beforeSubmit: function(form_data, $form, options) {
      var id = $addtopic.data("id");
      var name = $addtopic.data("name"); // create new
      
      if (!(id || name)) {
        return false;
      }
      
      if (id) {
        var $existing = $("#list &gt; li &gt; a[href=/topic" + id + "]");        
        if ($existing.length) {
          $pane2.prepend(system_message.error(sprintf("%s already exists in your list", $addtopic.val())));        
          $addtopic.select();
          return false;
        };
        form_data.push({name:'topic_id', value:id});
      }
      else if (name)  {
        form_data.push({name:'topic_name', value:name});
      }
      else {
        // this should not happen because of the id || name assertion above
        return false;
      }
      
      return form_data;                        
    },
    success: function(html) {
      // initialize new item
      var $li = $(html);
      //$li.hide(); // hide initially and then fade it in
      $list.append($li);
      //$li.slideDown();
      init_jeditable($(".edit-area", $li).add($(".edit", $li)).add($(".edit-image", $li)));
      init_editing_item($li);
      $list.sortable("refresh");
      // reset the form
      $addform.trigger("reset");
      $addbutton.disable();
      // put focus in to addtopic input
      $addtopic.focus();
      $addcomment.hide();
      // update list image      
      $li_img = $li.find("img:first");
      if (!list_image &amp;&amp; $li_img.length) {
        var image_id = $li_img.attr("fb__id");
        if (image_id) {
          $.post("/controller/add_image",
                 {
                   list_id: $list.attr("fb__id"),
                   image_id: $li_img.attr("fb__id")
                 },
                 function(html) {
                   list_image = image_id;
                 });
        }        
      }      
      // init rating
      $(".entry-rating", $li)
        .find(".star")
        .rating({callback:star_rating_callback})
        .end()
        .show();
      
      update_count();
      
      touch();
    },
    complete: function(xhr, status) {
      update_common_type(xhr.getResponseHeader("X-Common-Type"));
    }
  })
    .bind("reset", function() {
      // reinit addtopic input state/data
      $addtopic.removeData("id");
      $addtopic.removeData("invalid");
    });
  
  
  //
  // bind freebaseSugest to #addtopic
  // and validation logic
  //
  
  $addtopic.suggest({
    icons: true,
    ac_param: { 
     type: ["/people/person"],
     strict: "any";
    },
    suggest_new: suggest_new_html
  })
  .bind("fb-select", function(e, data) {
    // show the comment section
    var invalid = $addtopic.data("invalid");
    if (invalid == null || invalid) {
      $addtopic.data("invalid", 0);
      $addbutton.enable();
      $addcomment.show();
    }
    $addtopic.data("id", data.id);
  })
  .bind("fb-select-new", function(e, name) {
    var invalid = $addtopic.data("invalid");
    if (invalid == null || invalid) {
      $addtopic.data("invalid", 0);
      $addbutton.enable();
      $addcomment.show();
    }
    $addtopic.data("name", name);    
  })
  .bind("input", function(e) {
    var invalid = $addtopic.data("invalid");
    if (!invalid) {
      $addtopic.data("invalid", 1);
      $addbutton.disable();      
    }    
  });

  //
  // init all jeditable elements (editing comments, etc.)
  //
  init_autogrow();
  init_imageupload();
  init_jeditable($(".edit-area").add($(".edit")).add($(".edit-image")));
  
  //
  // init removing of items
  //
  init_editing_item($(".entry-item"));
  
  //
  // add topic form
  //
  $pane1.click(function() {
    $pane1.hide();
    $pane2.show();
    $addtopic.focus();
    // scroll to bottom
    //$("html,body").animate({scrollTop:$("html,body").height()}, 1000);
    return false;
  });
  $("#donebutton").click(function() {
    $pane2.hide();
    $pane1.show();
    return false;
  });
  if ($pane2.is(":visible")) {
    $addtopic.focus();
    // scroll to bottom   
    //$("window").animate({scrollTop:$("window.height")}, 1000);
  }  
};

function init_autogrow() {
  $.editable.addInputType('autogrow', {
    element : function(settings, original) {
      var textarea = $('</div>