Map: fix handle resizable

SE/se-lib/TableAjax.php

@@ -1910,6 +1910,7 @@ class TableAjax extends ViewAjax {
 						priv.mapEditorHide();
 						priv.options.mapEditorContainer = 'window';
 						priv.mapEditorShow();
+						priv.resizableMapDockNode('destroy');
 					}
 				},
 				onSaveFeature: function(selectedRecordId, selectedFeatureExtent) {
@@ -2007,21 +2008,25 @@ class TableAjax extends ViewAjax {
 					width: 540,
 					minWidth: 400,
 					minHeight: 400,
-					resizeStart: function(e, d) {
-						jQuery(this).children(":first").css({display:'none'});
-					},
-					resizeStop: function(e, d){
-						console.log('d', d);
+					open: function(e, ui) {
 						var n = jQuery(this),
 								mapWrap = n.children(":first"),
 								map = mapWrap.children(":first");
-						n.width(n.parent().innerWidth() - 20);
-						map.css({height: n.height(), width: n.width()});
-						mapWrap.css({display: 'block'});
-						_mapEditor.TableAjaxMapUpdateSize(); //to prevent drag-zoom error
+						map.css({width: n.width() - 5, height: n.height() - 5});
+						_mapEditor.TableAjaxMapUpdateSize();
+					},
+					resizeStart: function(e, ui) {
+						jQuery(this).children(":first").children(":first").css({display:'none'});
 					},
-					dragStop: function(){
-						_mapEditor.TableAjaxMapUpdateSize(); //to prevent drag-zoom error
+					resizeStop: function(e, ui){
+						var n = jQuery(this),
+								map = n.children(":first").children(":first");
+						n.css({width: n.parent().width()});
+						map.css({display: 'block', height: n.height(), width: n.width()});
+						_mapEditor.TableAjaxMapUpdateSize();
+					},
+					dragStop: function(e, ui){
+						_mapEditor.TableAjaxMapUpdateSize();// to prevent drag-zoom error
 					}
 				});
 				_mapEditorWrap.bind('dialogclose', function(e) {
@@ -2040,36 +2045,45 @@ class TableAjax extends ViewAjax {
 				}
 			}
 			else if ('dock' == priv.options.mapEditorContainer) {
+				priv.resizableMapDockNode('prepare');
+				_mapEditor.TableAjaxMapUpdateSize();
+			}
+		};
+
+		priv.resizableMapDockNode = function(task) {
+			if ('prepare' == task) {
 				var mapEditor = _mapEditorWrap.children('.mapEditor-map');
 				if (mapEditor && mapEditor.length) {// map is inside _mapEditorWrap (window)
-					_mapDockNode = jQuery('<div class="AjaxTableCont-mapEditorContainer"></div>');
+					var mapDockNode = jQuery('<div class="AjaxTableCont-mapEditorContainer"></div>');
 					var tblCont = jQuery(_cont).parent('.AjaxTableCont');
 					tblCont.children('.AjaxTableCont-mapEditorContainer').remove();
 					var breadcrumb = tblCont.children('.breadcrumb');
 					if (!breadcrumb || !breadcrumb.length) {
-						tblCont.prepend(_mapDockNode);
+						tblCont.prepend(mapDockNode);
 					} else {
-						_mapDockNode.insertAfter(breadcrumb);
+						mapDockNode.insertAfter(breadcrumb);
 					}
-					_mapDockNode.append(mapEditor);					
+					mapDockNode.append(mapEditor);
 				}
-				_mapEditor.TableAjaxMapUpdateSize();
-				mapEditor.parent().resizable({minHeight: 300, minWidth: 300});
+				var mapDockResizable = mapEditor.parent();
+				mapDockResizable.resizable({handles: 's', minHeight: 300, minWidth: 300});
 				var resizeLineHeigth = 6;
-				mapEditor.parent().css({marginBottom: resizeLineHeigth+'px'});
+				mapDockResizable.children(":first").css({height: 'auto'});
+				mapDockResizable.css({marginBottom: resizeLineHeigth+'px'});
 				mapEditor.css({marginBottom: resizeLineHeigth+'px'});
-				mapEditor.parent().find('.ui-resizable-s').css({height:resizeLineHeigth+'px', bottom: '-'+resizeLineHeigth+'px'});
-				mapEditor.parent().on('resizestart', function(event, ui) {
+				mapEditor.children(":first").css({width: mapEditor.width()});
+				mapDockResizable.find('.ui-resizable-s').css({height:resizeLineHeigth+'px', bottom: '-'+resizeLineHeigth+'px'});
+				mapDockResizable.on('resizestart', function(event, ui) {
 					ui.element.children(":first").children(":first").css({display:'none'})
 				});
-				mapEditor.parent().on('resizestop', function(event, ui) {
-					var mapWrap = ui.element.children(":first"),
-							map = mapWrap.children(":first");
-					mapWrap.css({height: ui.element.height()});
-					map.css({display:'block', height: ui.element.height()});
+				mapDockResizable.on('resizestop', function(event, ui) {
+					ui.element.children(":first").children(":first").css({display:'block', height: ui.element.height()});
 				});
+			} else if ('destroy' == task) {
+				var mapDockResizable = jQuery(_cont).parent('.AjaxTableCont').children('.AjaxTableCont-mapEditorContainer');
+				mapDockResizable.resizable('destroy');
+				mapDockResizable.remove();
 			}
-
 		};
 
 		priv.mapEditorChanged = function(e) {