diff --git a/static/js/documentDialog.js b/static/js/documentDialog.js
index adc053e1..203f7512 100644
--- a/static/js/documentDialog.js
+++ b/static/js/documentDialog.js
@@ -23,25 +23,36 @@ pandora.ui.documentDialog = function(options) {
                 minWidth: 512,
                 padding: 0,
                 removeOnClose: true,
-                title: item.name + '.' + item.extension,
+                title: '',
                 width: dialogWidth
             })
             .bindEvent({
                 close: function() {
                     pandora.UI.set({document: ''});
+                    delete pandora.$ui.documentDialog;
                 },
                 resize: function(data) {
+                    dialogHeight = data.height;
+                    dialogWidth = data.width;
                     $content.options({
-                        height: data.height,
-                        width: data.width
+                        height: dialogHeight,
+                        width: dialogWidth
                     });
                 },
                 pandora_document: function(data) {
-                    if (Ox.getObjectById(items, data.value)) {
-                        
+                    Ox.print('DOCUMENT', data)
+                    if (data.value.length) {
+                        if (Ox.getObjectById(items, data.value)) {
+
+                        } else {
+
+                        }
                     } else {
-                        
+                        that.close();
                     }
+                },
+                pandora_item: function(data) {
+                    pandora.UI.set({document: ''});
                 }
             }),
 
@@ -71,6 +82,7 @@ pandora.ui.documentDialog = function(options) {
     // fixme: why is this needed?
     $(that.find('.OxContent')[0]).css({overflow: 'hidden'});
 
+    setTitle();
     setContent();
 
     function setContent() {
@@ -89,10 +101,13 @@ pandora.ui.documentDialog = function(options) {
                 })
             )
             .bindEvent({
-                center: function() {
+                center: function(data) {
                     pandora.UI.set('document.' + item.id + '.center', data.center);
                 },
-                page: function() {
+                key_escape: function() {
+                    pandora.$ui.documentDialog.close();
+                },
+                page: function(data) {
                     pandora.UI.set('document.' + item.id + '.page', data.page);
                 },
                 zoom: function(data) {
@@ -102,6 +117,17 @@ pandora.ui.documentDialog = function(options) {
         );
     }
 
+    function setTitle() {
+        that.options({title: item.name + '.' + item.extension});
+    }
+
+    that.update = function(options) {
+        items = options.items;
+        item = items[options.index];
+        setTitle();
+        setContent();
+    };
+
     return that;
 
 };
diff --git a/static/js/documentsPanel.js b/static/js/documentsPanel.js
index a6aa6627..06e47e3a 100644
--- a/static/js/documentsPanel.js
+++ b/static/js/documentsPanel.js
@@ -113,7 +113,11 @@ pandora.ui.documentsPanel = function(options) {
         .css({float: 'left', margin: '4px 2px 4px 4px'})
         .bindEvent({
             click: function() {
-                
+                if (isItemView) {
+                    
+                } else {
+                    
+                }
             }
         })
         .appendTo($listBar),
@@ -190,7 +194,7 @@ pandora.ui.documentsPanel = function(options) {
         })
         .bindEvent({
             change: function(data) {
-                
+                $findInput.options({placeholder: data.title}).focusInput();
             }
         }),
 
@@ -247,7 +251,7 @@ pandora.ui.documentsPanel = function(options) {
             items: isItemView ? [
                 {id: 'open', title: '', keyboard: 'return'},
                 {id: 'edit', title: ''},
-                {id: 'remove', title: ''}
+                {id: 'remove', title: '', keyboard: 'delete'}
             ] : [
                 {id: 'open', title: '', keyboard: 'return'},
                 {id: 'addtoitem', title: ''},
@@ -376,6 +380,12 @@ pandora.ui.documentsPanel = function(options) {
         pandora.$ui.documentsDialog = pandora.ui.documentsDialog().open();
     }
 
+    function closeDocuments() {
+        if (pandora.$ui.documentDialog) {
+            pandora.$ui.documentDialog.close();
+        }
+    }
+
     function deleteDocuments() {
         pandora.ui.deleteDocumentDialog($list.options('selected'), function() {
             Ox.Request.clearCache();
@@ -393,7 +403,7 @@ pandora.ui.documentsPanel = function(options) {
     }
 
     function getOrderButtonTooltip() {
-        return Ox._(ui.documentsSort[0].operator == '+' ? 'ascending' : 'descending');
+        return Ox._(ui.documentsSort[0].operator == '+' ? 'Ascending' : 'Descending');
     }
 
     function getPreviewSize() {
@@ -412,6 +422,30 @@ pandora.ui.documentsPanel = function(options) {
         };
     }
 
+    function openDocuments() {
+        if (!pandora.$ui.documentDialog) {
+            pandora.$ui.documentDialog = pandora.ui.documentDialog({
+                index: 0,
+                items: $list.options('selected').map(function(id) {
+                    return $list.value(id);
+                })
+            })
+            .bindEvent({
+                close: function() {
+                    $list.closePreview();
+                }
+            })
+            .open();
+        } else {
+            pandora.$ui.documentDialog.update({
+                index: 0,
+                items: $list.options('selected').map(function(id) {
+                    return $list.value(id);
+                })
+            });
+        }
+    }
+
     function removeDocuments() {
         pandora.api.removeDocument({
             item: ui.item,
@@ -520,7 +554,7 @@ pandora.ui.documentsPanel = function(options) {
     function renderList() {
         var options = {
             items: pandora.api.findDocuments,
-            keys: ['dimensions', 'extension', 'name', 'ratio', 'size'],
+            keys: ['dimensions', 'extension', 'id', 'name', 'ratio', 'size'],
             query: {conditions: [], operator: '&'},
             selected: ui.documentsSelection[isItemView ? ui.item : ''],
             sort: ui.documentsSort.concat([
@@ -554,14 +588,16 @@ pandora.ui.documentsPanel = function(options) {
         })))
         .bindEvent({
             add: uploadDocuments,
+            closepreview: closeDocuments,
             'delete': deleteDocuments,
             init: function(data) {
-                Ox.print('INIT', data)
                 $listStatus.html(
                     Ox.toTitleCase(Ox.formatCount(data.items, 'document'))
                     + ', ' + Ox.formatValue(data.size, 'B')
                 );
             },
+            open: openDocuments,
+            openpreview: openDocuments,
             select: function(data) {
                 pandora.UI.set(
                     'documentsSelection.' + (isItemView ? ui.item : ''),
@@ -589,20 +625,15 @@ pandora.ui.documentsPanel = function(options) {
             cursor: 'pointer'
         })
         .on({
-            click: function() {
-                pandora.$ui.documentDialog = pandora.ui.documentDialog({
-                    index: 0,
-                    items: $list.options('selected').map(function(id) {
-                        return $list.value(id);
-                    })
-                }).open();
-                return;
-                var item = $list.value(selected);
-                window.open(
-                    '/documents/' + selected + '/' + item.name + '.' + item.extension,
-                    '_blank'
-                );
-            }
+            click: openDocuments
+            // FIXME
+            /*
+            var item = $list.value(selected);
+            window.open(
+                '/documents/' + selected + '/' + item.name + '.' + item.extension,
+                '_blank'
+            );
+            */
         });
     }