Implemented delete functionality in nb browser.

* Dialog confirms the notebook delete.
* Notebook element is removed from list upon deletion.

IPython/frontend/html/notebook/notebookmanager.py

@@ -46,7 +46,6 b' class NotebookManager(Configurable):'
         names = os.listdir(self.notebook_dir)
         names = [name.split(u'.')[0] \
             for name in names if name.endswith(self.filename_ext)]
-        print names
         data = []
         for name in names:
             if name not in self.rev_mapping:

IPython/frontend/html/notebook/static/js/notebooklist.js

@@ -40,17 +40,62 b' var IPython = (function (IPython) {'
     NotebookList.prototype.list_loaded = function (data, status, xhr) {
         var len = data.length;
         for (var i=0; i<len; i++) {
-            var div = $('<div/>').addClass('notebook_item ui-widget ui-widget-content ui-helper-clearfix');
-            var nbname = $('<span/>').addClass('item_name').append(
-                $('<a/>').attr('href','/'+data[i].notebook_id).
+            var notebook_id = data[i].notebook_id;
+            var nbname = data[i].name;
+
+            var item = $('<div/>');
+            item.addClass('notebook_item ui-widget ui-widget-content ui-helper-clearfix');
+            var item_name = $('<span/>').addClass('item_name').append(
+                $('<a/>').attr('href','/'+notebook_id).
                 attr('target','_blank').
-                text(data[i].name)
+                text(nbname)
             );
-            var buttons = $('<span/>').addClass('item_buttons').append(
-                $('<button>Delete</button>').button()
-            )
-            div.append(nbname).append(buttons);
-            this.element.append(div);
+            // Store the nbname and notebook_id on the item for later usage. We have to do this
+            // because the loop over elements changes the values of the local nbname and notebook_id
+            // variables.
+            item.data('notebook_id',notebook_id);
+            item.data('nbname',nbname);
+
+            var buttons = $('<span/>').addClass('item_buttons');
+            var delete_button = $('<button>Delete</button>').button().
+                click(function (e) {
+                    // $(this) is the button that was clicked.
+                    var that = $(this);
+                    // We use the nbname and notebook_id from the parent notebook_item element's
+                    // data because the outer scopes values change as we iterate through the loop.
+                    var parent_item = that.parents('div.notebook_item');
+                    var nbname = parent_item.data('nbname');
+                    var notebook_id = parent_item.data('notebook_id');
+                    var dialog = $('<div/>');
+                    dialog.html('Are you sure you want to permanently delete the notebook: ' + nbname + '?');
+                    parent_item.append(dialog);
+                    dialog.dialog({
+                        resizable: false,
+                        modal: true,
+                        title: "Delete notebook",
+                        buttons : {
+                            "Delete": function () {
+                                var settings = {
+                                    processData : false,
+                                    cache : false,
+                                    type : "DELETE",
+                                    dataType : "json",
+                                    success : function (data, status, xhr) {
+                                        parent_item.remove();
+                                    }
+                                };
+                                $.ajax("/notebooks/" + notebook_id, settings);
+                                $(this).dialog('close');
+                            },
+                            "Cancel": function () {
+                                $(this).dialog('close');
+                            }
+                        }
+                    });
+                });
+            buttons.append(delete_button);
+            item.append(item_name).append(buttons);
+            this.element.append(item);
         }
     };