update documents panel and dialog

static/js/documentDialog.js

@@ -2,19 +2,21 @@
 
 'use strict';
 
-pandora.ui.documentDialog = function(items, index) {
+pandora.ui.documentDialog = function(options) {
+
+    Ox.print('OPTIONS', options)
 
     var dialogHeight = Math.round((window.innerHeight - 48) * 0.9),
         dialogWidth = Math.round(window.innerWidth * 0.9),
-        documentHeight = dialogHeight - 24,
-        documentWidth = dialogWidth,
-        item = items[index],
+        items = options.items,
+        item = items[options.index],
     
         $content = Ox.Element(),
 
         that = Ox.Dialog({
                 closeButton: true,
                 content: $content,
+                focus: false,
                 height: dialogHeight,
                 maximizeButton: true,
                 minHeight: 256,
@@ -30,7 +32,7 @@ pandora.ui.documentDialog = function(items, index) {
                 },
                 resize: function(data) {
                     $content.options({
-                        height: data.height - 24,
+                        height: data.height,
                         width: data.width
                     });
                 },
@@ -50,18 +52,24 @@ pandora.ui.documentDialog = function(items, index) {
                 ],
                 type: 'image'
             })
-            .css({float: 'right', margin: '4px'})
+            .css({
+                position: 'absolute',
+                right: '4px',
+                top: '4px'
+            })
             .bindEvent({
                 click: function(data) {
-                    index = Ox.mod(
-                        index + (data.id == 'previous' ? -1 : 1),
+                    options.index = Ox.mod(
+                        options.index + (data.id == 'previous' ? -1 : 1),
                         items.length
                     );
-                    pandora.UI.set({document: items[index].id});
+                    pandora.UI.set({document: items[options.index].id});
                 }
             });
 
     $(that.find('.OxBar')[0]).append($selectButton);
+    // fixme: why is this needed?
+    $(that.find('.OxContent')[0]).css({overflow: 'hidden'});
 
     setContent();
 
@@ -71,13 +79,13 @@ pandora.ui.documentDialog = function(items, index) {
                 item.extension == 'pdf'
                 ? Ox.Element()
                 : Ox.ImageViewer({
-                    height: documentHeight,
+                    height: dialogHeight,
                     imageHeight: item.dimensions[1],
                     imagePreviewURL: '/documents/' + item.id + '/256p.jpg',
                     imageURL: '/documents/' + item.id + '/'
                         + item.name + '.' + item.extension,
                     imageWidth: item.dimensions[0],
-                    width: documentWidth
+                    width: dialogWidth
                 })
             )
             .bindEvent({