add ui.editSidebarSize and update on resize, fixes #2716

pandora/config.0xdb.jsonc

@@ -1226,6 +1226,7 @@
             "edit": "",
             "edits": {},
             "editSelection": [],
+            "editSidebarSize": 416,
             "editSort": [
                 {"key": "index", "operator": "+"},
                 {"key": "year", "operator": "+"},

pandora/config.indiancinema.jsonc

@@ -1697,6 +1697,7 @@
             "edit": "",
             "edits": {},
             "editSelection": [],
+            "editSidebarSize": 416,
             "editSort": [
                 {"key": "index", "operator": "+"},
                 {"key": "year", "operator": "+"},

pandora/config.padma.jsonc

@@ -1177,6 +1177,7 @@
             "edit": "",
             "edits": {},
             "editSelection": [],
+            "editSidebarSize": 416,
             "editSort": [
                 {"key": "index", "operator": "+"},
                 {"key": "director", "operator": "+"},

pandora/config.pandora.jsonc

@@ -1117,6 +1117,7 @@ examples (config.SITENAME.jsonc) that are part of this pan.do/ra distribution.
             "edit": "",
             "edits": {},
             "editSelection": [],
+            "editSidebarSize": 416,
             "editSort": [
                 {"key": "index", "operator": "+"},
                 {"key": "year", "operator": "+"},

static/js/editPanel.js

@@ -4,12 +4,6 @@ pandora.ui.editPanel = function(isEmbed) {
 
     var ui = pandora.user.ui,
         edit,
-        listSizes = [
-            144 + Ox.UI.SCROLLBAR_SIZE,
-            280 + Ox.UI.SCROLLBAR_SIZE,
-            416 + Ox.UI.SCROLLBAR_SIZE
-        ],
-        listSize = listSizes[ui.clipColumns],
         smallTimelineCanvas,
         smallTimelineContext,
         that = Ox.Element();
@@ -83,12 +77,11 @@ pandora.ui.editPanel = function(isEmbed) {
             annotationsCalendarSize: ui.annotationsCalendarSize,
             annotationsMapSize: ui.annotationsMapSize,
             annotationsRange: ui.annotationsRange,
-            annotationsSize: ui.annotationsSize,
             annotationsSort: ui.annotationsSort,
             clickLink: pandora.clickLink,
             clipRatio: pandora.site.video.previewRatio,
             clips: Ox.clone(edit.clips),
-            clipSize: listSize,
+            clipSize: ui.editSidebarSize + Ox.UI.SCROLLBAR_SIZE,
             clipTooltip: 'clips <span class="OxBright">' + Ox.SYMBOLS.shift + 'C</span>',
             clipView: ui.edits[ui.edit].view,
             controlsTooltips: {
@@ -155,6 +148,9 @@ pandora.ui.editPanel = function(isEmbed) {
             width: Ox.$document.width() - pandora.$ui.mainPanel.size(0) - 1
         })
         .bindEvent({
+            clipSize: function(data) {
+                pandora.UI.set({editSidebarSize: data.size - Ox.UI.SCROLLBAR_SIZE});
+            },
             copy: function(data) {
                 var ids = Ox.sort(data.ids, function(id) {
                     return Ox.getObjectById(edit.clips, id).index;
@@ -334,9 +330,6 @@ pandora.ui.editPanel = function(isEmbed) {
             select: function(data) {
                 pandora.UI.set({editSelection: data.ids});
             },
-            size: function(data) {
-                pandora.UI.set({clipSize: data.size});
-            },
             sort: function(data) {
                 pandora.UI.set({editSort: data});
                 sortClips(updateClips);