function makeToDoList(listID) {
   var speed = 500;
   var todoListID = "todoList_";
   var completeListID = "completeList_";
   var showEditorText = "Add Task";
   var hideEditorText = "Hide Editor";
   function completeClicked() {
      var item = $(this).parents("li");
      var reciver = "";
      var id = item.attr('id');
      var clone = item.clone(true);
      item.html("<img src=/files/ToDoLib/ajax-loader.gif>");
      action = "";
      if ($(this).get(0).checked == true) {
         reciver = "#" + listID + " ul.todoCompleteList";
         id = id.replace(todoListID, '');
         var iid = id;
         id = completeListID + id;
         action = "completeItem";
         }
      else {
         reciver = "#" + listID + " ul.todoList";
         id = id.replace(completeListID, '');
         iid = id;
         id = todoListID + id;
         action = "uncompleteItem";
         }
      if ($(reciver).hasClass("todoCompleteList")) {
         clone.find("img.todoEditItem").remove();
         clone.find("input.todoComplete").get(0).checked = true;
         }
      else {
         clone.find("span.todoControl").prepend("<img title='Edit' src='/files/ToDoLib/edit.png' class='todoEditItem'/>");
         clone.find("img.todoEditItem").click(editItem);
         clone.find("input.todoComplete").get(0).checked = false;
         }
      $.get("/ToDoAjax", {
         action : action, list : listID, itemID : iid}
      , function() {
         clone.attr('id', id); clone.prependTo(reciver).hide().show(speed); item.hide(speed); setTimeout(function() {
            item.remove(); }
         , speed); $("#" + listID + " span.todoControl").hide(); $("#" + listID + " li").hover(function() {
            $(this).find("span.todoControl").show(); }
         , function() {
            $(this).find("span.todoControl").hide(); }
         ); }
      );
      };
   function removeItem () {
      var parentLi = $(this).parents("li");
      parentLi.fadeTo(0, 0.33);
      var id = parentLi.attr("id");
      id = id.replace(completeListID, '');
      id = id.replace(todoListID, '');
      var r = confirm("You really want to delete this item?");
      action = "removeItem";
      if (r == true) {
         parentLi.fadeTo(0, 1);
         parentLi.html("<img src=/files/ToDoLib/ajax-loader.gif>");
         $.get("/ToDoAjax", {
            action : action, list : listID, itemID : id}
         , function() {
            parentLi.hide(speed); setTimeout(function() {
               parentLi.remove(); }
            , speed); }
         );
         }
      else {
         parentLi.fadeTo(0, 1);
         }
      }
   function setItemText(item, value) {
      item.html("<div class='todoControl'><span class='todoControl'><img title='Edit' src='/files/ToDoLib/edit.png' class='todoEditItem'/><img title='Remove' src='/files/ToDoLib/Delete.png' class='todoRemoveIcon'/></span></div><img src='/files/ToDoLib/arrow.png' alt='move' class='todoHandle'/><span><input type='checkbox' class='todoComplete'/>&nbsp;&nbsp;</span>" + "<span class='todoItem'>" + value + "</span>");
      item.find("input.todoComplete").click(completeClicked);
      item.find("img.todoRemoveIcon").click(removeItem);
      item.find("img.todoEditItem").click(editItem);
      if (item.parents("ul").hasClass("todoCompleteList")) {
         item.find("input.todoComplete").get(0).checked = true;
         item.find("img.todoEditItem").remove();
         }
      item.find("span.todoControl").hide();
      item.find("li").hover(function() {
         $(this).find("span.todoControl").show(); }
      , function() {
         $(this).find("span.todoControl").hide(); }
      );
      }
   function saveEdit(item) {
      var itemValue = htmlEncode(item.children("textarea.editArea").get(0).value, false);
      item.html("<img src=/files/ToDoLib/ajax-loader.gif>");
      action = "saveItem";
      id = item.attr("id");
      id = id.replace(completeListID, '');
      id = id.replace(todoListID, '');
      $.get("/ToDoAjax" , {
         action : action, list : listID, itemID : id, itemText : itemValue}
      , function() {
         setItemText(item, itemValue); }
      );
      }
   function editItem() {
      var item = $(this).parents("li");
      var itemValue = item.children("span.todoItem").html();
      item.html("<textarea class='editArea' rows='2'>" + itemValue + "</textarea><br/><button class='ok'>Save</button><button class='cancel'>Cancel</button>");
      item.children("button.cancel").click(function () {
         setItemText(item, itemValue); }
      );
      item.children("button.ok").click(function () {
         saveEdit(item); }
      );
      }
   $("#" + listID + " div.todoNewElement").hide();
   $("#" + listID + " ul.todoCompleteList").hide();
   $("#" + listID).find("ul.todoList").sortable( {
      handle : '.todoHandle', axis : 'y', update : function () {
         var order = $("#" + listID).find('ul.todoList').sortable('serialize'); $.get("/ToDoAjax?" + order, {
            action : 'reorder', list : listID}
         ); }
      }
   );
   $("#" + listID).find("ul.todoCompleteList").sortable( {
      handle : '.todoHandle', axis : 'y', update : function () {
         var order = $("#" + listID).find('ul.completeList').sortable('serialize'); $.get("/ToDoAjax?" + order, {
            action : 'reorder', list : listID}
         ); }
      }
   );
   $("#" + listID).find("input.todoComplete").click(completeClicked);
   $("#" + listID).find("button.todoAddElement").click(function () {
      var text = $("#" + listID).find("textarea.todoElementText").get(0).value; $("#" + listID).find("textarea.todoElementText").get(0).value = ""; text=htmlEncode(text); if (text == "") {
         return; }
      iid = (new Date).getTime(); id = todoListID + iid; first = "<img src='/files/ToDoLib/arrow.png' alt='move' class='todoHandle'/>" + "<span><input type='checkbox' class='todoComplete'/>&nbsp;&nbsp;</span>"; second = "<div class='todoControl'><span class='todoControl'><img title='Edit' src='/files/ToDoLib/edit.png' class='todoEditItem'/><img title='Remove' src='/files/ToDoLib/Delete.png' class='todoRemoveIcon'/></span></div>"; action = "newItem"; $("#" + listID).find('ul.todoList').append("<li id='" + id + "'></li>"); $("#" + listID + " #" + id).html("<img src=/files/ToDoLib/ajax-loader.gif>"); $.get("/ToDoAjax" , {
         action : action, list : listID, itemID : iid, itemText : text}
      , function() {
         $("#" + listID + " #" + id).html(second + first + "<span class='todoItem'>" + text + "</span>"); $("#" + listID + " #" + id + " input.todoComplete").click(completeClicked); $("#" + listID + " #" + id + " img.todoRemoveIcon").click(removeItem); $("#" + listID + " span.todoControl").find("img.todoEditItem").click(editItem); $("#" + listID + " span.todoControl").hide(); $("#" + listID + " li").hover(function() {
            $(this).find("span.todoControl").show(); }
         , function() {
            $(this).find("span.todoControl").hide(); }
         ); }
      ); }
   );
   $("#" + listID).find("a.todoShowEditor").click( function () {
      if ($("#" + listID).find("div.todoNewElement").is(":hidden")) {
         $("#" + listID).find("div.todoNewElement").slideDown(speed); $(this).html(hideEditorText); }
      else {
         $("#" + listID).find("div.todoNewElement").slideUp(speed); $(this).html(showEditorText); }
      }
   );
   $("#" + listID).find("a.todoShowEditor").hover( function () {
      $("#" + listID).find("a.todoShowEditor").addClass("selected"); }
   , function () {
      $("#" + listID).find("a.todoShowEditor").removeClass("selected"); }
   );
   $("#" + listID).find("img.todoRemoveIcon").click(removeItem);
   $("#" + listID + " img.todoEditItem").click(editItem);
   $("#" + listID + " span.todoControl").hide();
   $("#" + listID + " li").hover(function() {
      $(this).find("span.todoControl").show(); }
   , function() {
      $(this).find("span.todoControl").hide(); }
   );
   $("#" + listID).find("a.todoShowComplete").click( function () {
      if ($("#" + listID).find("ul.todoCompleteList").is(":hidden")) {
         $("#" + listID).find("ul.todoCompleteList").slideDown(speed); $(this).html("Hide Completed"); }
      else {
         $("#" + listID).find("ul.todoCompleteList").slideUp(speed); $(this).html("Show Completed"); }
      }
   );
   $("#" + listID).find("a.todoShowComplete").hover( function () {
      $("#" + listID).find("a.todoShowComplete").addClass("selected"); }
   , function () {
      $("#" + listID).find("a.todoShowComplete").removeClass("selected"); }
   );
   };
$(document).ready(function() {
   $("div.todoMainList").each(function (i) {
      id = $(this).attr("id"); makeToDoList(id); }
   ); }
);