From 106289615b413bb5455fd3ad38e908aa5f76ad15 Mon Sep 17 00:00:00 2001
From: Julia Svinareva <julia.svinaryova@onlyoffice.com>
Date: Fri, 9 Aug 2019 10:34:19 +0300
Subject: [PATCH] [SSE] Add resize window filter

---
 .../main/app/view/AutoFilterDialog.js         | 35 ++++++++++++++-----
 1 file changed, 27 insertions(+), 8 deletions(-)

diff --git a/apps/spreadsheeteditor/main/app/view/AutoFilterDialog.js b/apps/spreadsheeteditor/main/app/view/AutoFilterDialog.js
index 7bc92c5f1..eecd78c84 100644
--- a/apps/spreadsheeteditor/main/app/view/AutoFilterDialog.js
+++ b/apps/spreadsheeteditor/main/app/view/AutoFilterDialog.js
@@ -487,16 +487,19 @@ define([
                 title           : t.txtTitle,
                 modal           : false,
                 animate         : false,
-                items           : []
+                items           : [],
+                resizable       : true,
+                minwidth           : 450,
+                minheight          : 265
             }, options);
 
             this.template   =   options.template || [
-                '<div class="box" style="height:' + _options.height + 'px;">',
-                    '<div class="content-panel" style="width: 250px;">',
-                        '<div class="">',
+                '<div class="box" style="height: 100%; display: flex; justify-content: space-between;">',
+                    '<div class="content-panel" style="width: 100%; border-right: 1px solid #cbcbcb; display: flex; flex-direction: column; justify-content: space-between;">',
+                        '<div class="" style="display: flex; flex-direction: column; justify-content: flex-start; height: calc(100% - 40px);">',
                             '<div id="id-sd-cell-search" style="height:22px; margin-bottom:10px;"></div>',
-                            '<div class="border-values" style="">',
-                                '<div id="id-dlg-filter-values" class="combo-values"/>',
+                            '<div class="border-values" style="overflow: hidden; flex-grow: 1;">',
+                                '<div id="id-dlg-filter-values" class="combo-values" style=""/>',
                             '</div>',
                         '</div>',
                         '<div class="footer center">',
@@ -504,8 +507,7 @@ define([
                             '<button class="btn normal dlg-btn" result="cancel">', t.cancelButtonText, '</button>',
                         '</div>',
                     '</div>',
-                    '<div class="separator"/>',
-                    '<div class="menu-panel" style="width: 195px;">',
+                    '<div class="menu-panel" style="width: 195px; float: right;">',
                         '<div id="menu-container-filters" style=""><div class="dropdown-toggle" data-toggle="dropdown"></div></div>',
                     '</div>',
                 '</div>'
@@ -515,10 +517,13 @@ define([
             this.handler        =   options.handler;
             this.throughIndexes =   [];
             this.filteredIndexes =  [];
+            this.curSize = undefined;
 
             _options.tpl        =   _.template(this.template)(_options);
 
             Common.UI.Window.prototype.initialize.call(this, _options);
+
+            this.on('resize', _.bind(this.onWindowResize, this));
         },
         render: function () {
 
@@ -526,6 +531,12 @@ define([
 
             Common.UI.Window.prototype.render.call(this);
 
+            var $border = this.$window.find('.resize-border');
+            this.$window.find('.resize-border.left, .resize-border.top').css({'cursor': 'default'});
+            $border.removeClass('left');
+            $border.removeClass('top');
+
+
             this.$window.find('.btn').on('click', _.bind(this.onBtnClick, this));
 
             this.btnOk = new Common.UI.Button({
@@ -1359,6 +1370,14 @@ define([
             return false;
         },
 
+        onWindowResize: function () {
+            var size = this.getSize();
+            if (size !== this.curSize) {
+                this.$window.find('.combo-values').css({'height': size[1]-100 + 'px'});
+                this.curSize = size;
+            }
+        },
+
         okButtonText        : 'Ok',
         btnCustomFilter     : 'Custom Filter',
         textSelectAll       : 'Select All',