TT#13100 Ngcp CSC scrolling issues fixed

Change-Id: I691df8b6ed35a041bf67c23345b91a0e87123c3d

classic/sass/src/view/core/GridCards.scss

@@ -49,6 +49,11 @@ $grid-row-cell-focus-border-color: '#fff';
     }
 }
 
+
+.extra-left {
+    left: 7px;
+}
+
 .card-wrapper {
     float: left;
     width: 100%;

classic/src/view/main/MainController.js

@@ -13,6 +13,11 @@ Ext.define('NgcpCsc.view.main.MainController', {
                 updateconversationtitle: 'setSectionTitle',
                 setCentralContentHeight: 'setCentralContentHeight'
             }
+        },
+        component: {
+            '*': {
+                cardContainerResized: 'cardContainerResized'
+            }
         }
     },
 
@@ -360,6 +365,17 @@ Ext.define('NgcpCsc.view.main.MainController', {
         }
     },
 
+
+    cardContainerResized: function(cmp) {
+        var cmpEl = cmp.getEl();
+        var contEl = this.lookupReference('mainCardPanel');
+        var tbarEl = cmpEl.down('.x-toolbar');
+        var gridEl = cmpEl.down('.card-grid');
+        var contHeight = contEl.getHeight() - tbarEl.getHeight();
+        var gridHeight = gridEl.getHeight();
+        (gridHeight > contHeight) ? gridEl.addCls('extra-left') : gridEl.removeCls('extra-left');
+    },
+
     newSearch: function(el) {
         this.fireEvent('newSearchFieldInput', el);
     },

classic/src/view/pages/callblocking/CallBlocking.js

@@ -12,7 +12,8 @@ Ext.define('NgcpCsc.view.pages.callblocking.CallBlocking', {
             fn: 'onIconClicked',
             element: 'el',
             delegate: 'div.toggle-section'
-        }
+        },
+        afterrender: 'afterCBRendered'
     },
 
     initComponent: function() {

classic/src/view/pages/callblocking/CallBlockingController.js

@@ -17,6 +17,12 @@ Ext.define('NgcpCsc.view.pages.callblocking.CallBlockingController', {
         };
     },
 
+    afterCBRendered: function(cmp){
+        cmp.on('resize', function(){
+            cmp.fireEvent('cardContainerResized', cmp);
+        });
+    },
+
     renderBarrNumber: function(value, meta, record) {
         if (record.get('enabled') === false) {
             return Ext.String.format('<div style="color: #666;text-decoration: line-through;font-size: 16px;padding-left: 10px;">{0}</div>', value);
@@ -37,11 +43,13 @@ Ext.define('NgcpCsc.view.pages.callblocking.CallBlockingController', {
     },
 
     addToStore: function(newNumber, newId, store) {
+        var view = this.getView();
         store.add({
             "id": newId,
             "block_list": newNumber,
             "enabled": true
         });
+        view.fireEvent('cardContainerResized', view);
         this.fireEvent('showmessage', true, Ngcp.csc.locales.common.add_success[localStorage.getItem('languageSelected')]);
     },
 
@@ -143,8 +151,10 @@ Ext.define('NgcpCsc.view.pages.callblocking.CallBlockingController', {
     },
 
     confirmCallBlockingRemoval: function(record) {
+        var view = this.getView();
         var store = record.store;
         store.remove(record);
+        view.fireEvent('cardContainerResized', view);
     },
 
     enableNumberBlocking: function(event) {

classic/src/view/pages/pbxconfig/PbxConfig.js

@@ -5,6 +5,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfig', {
     viewModel: 'pbxconfig',
     controller: 'pbxconfig',
 
+    listeners: {
+        afterrender: 'afterPbxContRendered'
+    },
+
     initComponent: function() {
 
         this.dockedItems = [{

classic/src/view/pages/pbxconfig/PbxConfigController.js

@@ -12,6 +12,12 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
         }
     },
 
+    afterPbxContRendered: function(cmp){
+        cmp.on('resize', function(){
+            cmp.fireEvent('cardContainerResized', cmp);
+        });
+    },
+
     onRouteChange: function() {
         var vm = this.getViewModel();
         switch (window.location.hash) {
@@ -77,7 +83,8 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
         plugin.toggleRow(store.indexOf(record), record);
         Ext.defer(function() {
             view.grid.updateLayout();
-        }, 50);
+            view.fireEvent('cardContainerResized', me.getView())
+        }, 1);
         if (currentRoute == '#pbxconfig/devices') {
             var grid = this.lookupReference('devicesGrid');
             var nodes = plugin.view.getNodes();
@@ -89,7 +96,6 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
                     plugin.toggleRow(index, store.getAt(index)); // collapse all cards but the active one
                 }
             });
-
         }
     },
 
@@ -190,6 +196,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
 
     addNewEmptyRowToGrid: function(store, storeName, newId) {
         var newRec;
+        var view = this.getView();
         switch (storeName) {
             case 'Seats':
                 newRec = store.add({
@@ -222,7 +229,10 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
                 });
                 break;
         }
-        this.getView().down('grid').getSelectionModel().select(newRec);
+        view.down('grid').getSelectionModel().select(newRec);
+        Ext.Function.defer(function(){
+            view.fireEvent('cardContainerResized', view);
+        },1);
     },
 
     addPbx: function() {
@@ -376,9 +386,13 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
         me.fireEvent('showconfirmbox', title, question, sucessMsg, 'confirmPbxCardRemoval', selectedRow);
     },
 
-    confirmPbxCardRemoval:function(card){
+    confirmPbxCardRemoval: function(card) {
+        var view = this.getView();
         var store = card.store;
         store.remove(card);
+        Ext.Function.defer(function(){
+            view.fireEvent('cardContainerResized', view);
+        },1);
     },
 
     toggleCancelCard: function(el, state) {
@@ -439,5 +453,4 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.PbxConfigController', {
             }
         }, 1);
     }
-
 });

classic/src/view/pages/pbxconfig/seats/SeatsGrid.js

@@ -5,6 +5,7 @@ Ext.define('NgcpCsc.view.pages.pbxconfig.seats.SeatsGrid', {
     reference: 'seatsGrid',
     store: 'Seats',
 
+
     viewConfig: {
         stripeRows: false,
         enableTextSelection: true