allow for editing cover url

static/js/coverDialog.js

@@ -1,30 +1,27 @@
 'use strict';
 
-oml.ui.coverDialog = function(id, url) {
+oml.ui.coverDialog = function(id, value) {
 
-    var $input = Ox.Input({
-                value: url,
+    var ui = oml.user.ui,
+
+        $input = Ox.Input({
+                style: 'squared',
+                value: value,
                 width: 480
             })
             .css({margin: '16px'})
             .bindEvent({
-                change: function(value) {
+                submit: function() {
                     that.close();
-                    oml.api.edit({
-                        id: id,
-                        cover: value
-                    }, function(result) {
-                        // ...
-                    });
                 }
             }),
     
         that = Ox.Dialog({
             buttons: [
                 Ox.Button({
-                    id: 'close',
+                    id: 'done',
                     style: 'squared',
-                    title: Ox._('Close')
+                    title: Ox._('Done')
                 })
                 .bindEvent({
                     click: function() {
@@ -35,12 +32,31 @@ oml.ui.coverDialog = function(id, url) {
             closeButton: true,
             content: $input,
             height: 48,
-            keys: {escape: 'close', enter: 'close'},
+            keys: {enter: 'done'},
             removeOnClose: true,
             title: Ox._('Edit Cover URL'),
             width: 512
         })
         .bindEvent({
+            close: function() {
+                var inputValue = $input.value();
+                if (inputValue != value) {
+                    oml.api.edit({
+                        id: id,
+                        cover: inputValue
+                    }, function(result) {
+                        if (ui.icons == 'cover') {
+                            oml.$ui.info.updateElement();
+                            oml.$ui.browser.value(ui.item, {
+                                cover: result.data.cover,
+                                coverRatio: result.data.coverRatio,
+                                modified: result.data.modified
+                            });
+                            oml.$ui.infoView.updateCover();
+                        }
+                    });
+                }
+            },
             open: function() {
                 $input.focusInput(true);
             }

static/js/info.js

@@ -15,6 +15,9 @@ oml.ui.info = function() {
                 toggle: function(data) {
                     oml.UI.set({showInfo: !data.collapsed});
                 },
+                oml_icons: function() {
+                    that.updateElement();
+                },
                 oml_item: function() {
                     that.updateElement();
                 },

static/js/infoView.js

@@ -122,14 +122,6 @@ oml.ui.infoView = function(externalData, isMixed) {
         };
     }
 
-    function getIconTooltip() {
-        return !externalData
-            ? 'Click to see ' + (ui.iconSize == 256 ? 'large' : 'small')
-                + ' ' + ui.icons + ', doubleclick to see '
-                + (ui.icons == 'cover' ? 'preview' : 'cover')
-            : '';
-    }
-
     function renderIdentifyButton(data) {
         return Ox.Button({
                 disabled: data.mediastate != 'available',
@@ -314,6 +306,11 @@ oml.ui.infoView = function(externalData, isMixed) {
         $reflection.css(css.reflection).show();
     }
 
+    that.updateCover = function(url) {
+        Ox.Request.clearCache('get');
+        that.updateElement(ui.item, $icon);
+    };
+
     that.updateElement = function(idOrData, $elements) {
 
         var data = Ox.isObject(idOrData) ? idOrData : null,
@@ -352,6 +349,8 @@ oml.ui.infoView = function(externalData, isMixed) {
                 size = iconSize,
                 reflectionSize = Math.round(size / 2);
 
+            Ox.print('SRC', src);
+
             $elements.forEach(function($element) {
 
                 $element.empty();
@@ -360,7 +359,9 @@ oml.ui.infoView = function(externalData, isMixed) {
 
                     $image = Ox.Element({
                             element: '<img>',
-                            tooltip: getIconTooltip()
+                            tooltip: !externalData
+                                ? Ox._('Doubleclick to edit')
+                                : ''
                         })
                         .on({
                             error: function() {
@@ -386,10 +387,9 @@ oml.ui.infoView = function(externalData, isMixed) {
                         .bindEvent({
                             doubleclick: function() {
                                 if (!externalData) {
-                                    oml.UI.set({
-                                        icons: ui.icons == 'cover'
-                                            ? 'preview' : 'cover'
-                                    });
+                                    oml.$ui.coverDialog = oml.ui.coverDialog(
+                                        id, data.cover
+                                    ).open();
                                 }
                             },
                             singleclick: function() {