Refresh snapshot modal after creation or deletion

customize.dist/src/less2/include/modals-ui-elements.less

@@ -128,6 +128,7 @@
         margin-bottom: @snapshot_spacing;
         max-height: 245px;
         overflow: auto;
+        min-height: 100px;
         .cp-snapshot-element {
             display: flex;
             align-items: center;

customize.dist/src/less2/include/toolbar-history.less

@@ -85,7 +85,7 @@
                 border-left: none;
                 width: 2px !important;
                 background: @pos-color;
-                &:before {
+                &:before {
                     left: -6px;
                 }
             }

www/common/common-ui-elements.js

@@ -3315,56 +3315,11 @@ define([
     Messages.snapshots_open = "View";
     Messages.snapshots_delete = "Delete";
     UIElements.openSnapshotsModal = function (common, load, make, remove) {
-        var metadataMgr = common.getMetadataMgr();
-        var md = metadataMgr.getMetadata();
-        var snapshots = md.snapshots || {};
         var modal;
         var readOnly = common.getMetadataMgr().getPrivateData().readOnly;
 
-        var list = Object.keys(snapshots).sort(function (h1, h2) {
-            var s1 = snapshots[h1];
-            var s2 = snapshots[h2];
-            return s1.time - s2.time;
-        }).map(function (hash) {
-            var s = snapshots[hash];
-
-            var openButton = h('button.cp-snapshot-view.btn.btn-light', [
-                h('i.fa.fa-eye'),
-                h('span', Messages.snapshots_open)
-            ]);
-            $(openButton).click(function () {
-                load(hash, s);
-                if (modal && modal.closeModal) {
-                    modal.closeModal();
-                }
-            });
-
-            var deleteButton = h('button.cp-snapshot-delete.btn.btn-light', [
-                h('i.fa.fa-trash'),
-                h('span', Messages.snapshots_delete)
-            ]);
-            UI.confirmButton(deleteButton, {
-                classes: 'btn-danger'
-            }, function () {
-                remove(hash, s);
-                if (modal && modal.closeModal) {
-                    modal.closeModal();
-                    UIElements.openSnapshotsModal(common, load, make, remove);
-                }
-            });
-
-            return h('span.cp-snapshot-element', {tabindex:0}, [
-                h('i.fa.fa-camera'),
-                h('span.cp-snapshot-title', [
-                    h('span', s.title),
-                    h('span.cp-snapshot-time', new Date(s.time).toLocaleString())
-                ]),
-                h('span.cp-snapshot-buttons', [
-                    readOnly ? undefined : deleteButton,
-                    openButton,
-                ])
-            ]);
-        });
+        var container = h('div.cp-snapshots-container', {tabindex:0});
+        var $container = $(container);
 
         var input = h('input', {
             placeholder: Messages.snapshots_placeholder
@@ -3372,11 +3327,66 @@ define([
         var $input = $(input);
         var content = h('div.cp-snapshots-modal', [
             h('h5', Messages.snapshots_button),
-            h('div.cp-snapshots-container', list),
+            container,
             readOnly ? undefined : h('h6', Messages.snapshots_new),
             readOnly ? undefined : input
         ]);
 
+        var refresh = function () {
+            var metadataMgr = common.getMetadataMgr();
+            var md = metadataMgr.getMetadata();
+            var snapshots = md.snapshots || {};
+
+            var list = Object.keys(snapshots).sort(function (h1, h2) {
+                var s1 = snapshots[h1];
+                var s2 = snapshots[h2];
+                return s1.time - s2.time;
+            }).map(function (hash) {
+                var s = snapshots[hash];
+
+                var openButton = h('button.cp-snapshot-view.btn.btn-light', [
+                    h('i.fa.fa-eye'),
+                    h('span', Messages.snapshots_open)
+                ]);
+                $(openButton).click(function () {
+                    load(hash, s);
+                    if (modal && modal.closeModal) {
+                        modal.closeModal();
+                    }
+                });
+
+                var deleteButton = h('button.cp-snapshot-delete.btn.btn-light', [
+                    h('i.fa.fa-trash'),
+                    h('span', Messages.snapshots_delete)
+                ]);
+                UI.confirmButton(deleteButton, {
+                    classes: 'btn-danger'
+                }, function () {
+                    remove(hash, s);
+                    refresh();
+                });
+
+                return h('span.cp-snapshot-element', {tabindex:0}, [
+                    h('i.fa.fa-camera'),
+                    h('span.cp-snapshot-title', [
+                        h('span', s.title),
+                        h('span.cp-snapshot-time', new Date(s.time).toLocaleString())
+                    ]),
+                    h('span.cp-snapshot-buttons', [
+                        readOnly ? undefined : deleteButton,
+                        openButton,
+                    ])
+                ]);
+            });
+
+            $container.html('').append(list);
+            setTimeout(function () {
+                if (list.length) { return void $container.focus(); }
+                $input.focus();
+            });
+        };
+        refresh();
+
         var buttons = [{
             className: 'cancel',
             name: Messages.filePicker_close,
@@ -3391,23 +3401,19 @@ define([
                 onClick: function () {
                     var val = $input.val();
                     if (!val) { return true; }
-                    make(val);
-                    setTimeout(function () {
-                        UIElements.openSnapshotsModal(common, load, make, remove);
+                    $container.html('');
+                    UI.spinner($container).get().show();
+                    make(val, function (err) {
+                        if (err) { return; }
+                        refresh();
                     });
+                    return true;
                 },
                 keys: [],
             });
         }
 
         modal = UI.openCustomModal(UI.dialog.customModal(content, {buttons: buttons }));
-        setTimeout(function () {
-            if (list.length) {
-                $(list[0]).focus();
-                return;
-            }
-            $input.focus();
-        });
     };
 
     return UIElements;

www/common/sframe-app-framework.js

@@ -137,21 +137,22 @@ define([
             cpNfInner.metadataMgr.updateMetadata(md);
             onLocal();
         };
-        var makeSnapshot = function (title) {
+        var makeSnapshot = function (title, cb) {
             var sframeChan = common.getSframeChannel();
             sframeChan.query("Q_GET_LAST_HASH", null, function (err, obj) {
                 if (err || (obj && obj.error)) { return void UI.warn(Messages.error); }
                 var hash = obj.hash;
-                if (!hash) { return void UI.warn(Messages.error); }
+                if (!hash) { cb('NO_HASH'); return void UI.warn(Messages.error); }
                 var md = Util.clone(cpNfInner.metadataMgr.getMetadata());
                 var snapshots = md.snapshots = md.snapshots || {};
-                if (snapshots[hash]) { return void UI.warn(Messages.error); } // XXX EEXISTS
+                if (snapshots[hash]) { cb('EEXISTS'); return void UI.warn(Messages.error); } // XXX
                 snapshots[hash] = {
                     title: title,
                     time: +new Date()
                 };
                 cpNfInner.metadataMgr.updateMetadata(md);
                 onLocal();
+                cpNfInner.chainpad.onSettle(cb);
             });
         };