Map - place map above table and back to window

SE/VERSION

@@ -1 +1 @@
-3.9.8.3
+3.9.8.4

SE/se-lib/TableAjax.php

@@ -364,6 +364,12 @@ class TableAjax extends ViewAjax {
   .AjaxTableCont .mapEditor-panel a:hover { color:#006CD7; text-decoration:none; }
   .AjaxTableCont .mapEditor-panel a.mapEditor-panel-close:hover { color:#f00; }
  .AjaxTableCont .mapEditor-map { background:#fff; height:300px; }
+.AjaxTableCont-mapEditorContainer { border:1px solid red; overflow:hidden; }
+/* .mapEditor-btnBackToWindow "olControlSave",overview_replacement */
+.mapEditor-btnBackToWindowItemInactive { background-image: url(stuff/open-layers/theme/default/img/overview_replacement.gif); }
+.mapEditor-btnBackToWindowItemActive { background-image: url(stuff/open-layers/theme/default/img/overview_replacement.gif); }
+.ui-dialog-content .mapEditor-btnBackToWindowItemInactive,
+.ui-dialog-content .mapEditor-btnBackToWindowItemActive { display:none; }
 
 .AjaxTableCont .valign-btns-bottom a { vertical-align:text-bottom; font-weight:normal; font-size:12px; line-height:14px; }
 		</style>
@@ -462,7 +468,7 @@ class TableAjax extends ViewAjax {
 		};
 
 		publ.setValue = function(value) {
-			console.log('TEST setValue: ', value, 'this', this);
+			if (priv.options.debug) console.log('TEST setValue: ', value, 'this', this);
 			priv.options.fieldValue = value;
 			priv.render();
 		};
@@ -531,7 +537,8 @@ class TableAjax extends ViewAjax {
 			filtersClean: false,
 			router: false,
 			longDesc: false,
-			mapEditor: false	// mapEditor visible or not
+			mapEditor: false,	// mapEditor visible or not
+			mapEditorContainer: 'window' // 'window' or 'dock'
 		};
 
 		var _cont; // container holding table
@@ -576,6 +583,10 @@ class TableAjax extends ViewAjax {
 			priv.options.types.number = ((priv.options.types || {}).number || {});
 			priv.options.types.bool = ((priv.options.types || {}).bool || {});
 			priv.options.types.date = ((priv.options.types || {}).date || {});
+			if (priv.options.mapEditorContainer != 'dock'
+					&& priv.options.mapEditorContainer != 'window') {
+				priv.options.mapEditorContainer = 'window';
+			}
 
 			if (priv.options.specialFilterFunctions && priv.options.filterInit) {
 				$.map(priv.options.specialFilterFunctions, function(groupObj, groupName) {
@@ -591,7 +602,6 @@ class TableAjax extends ViewAjax {
 
 			if (typeof priv.options.router == "function") {
 				$(window).bind('hashchange', function() {
-					//console.log('hashchange: location.hash: ' + location.hash);
 					priv.options.router.apply(this);
 				});
 			}
@@ -1001,7 +1011,7 @@ class TableAjax extends ViewAjax {
 										linkRemoveClassName: 'remove',
 										linkRemoveAddClassNames: 'ico-remove',
 										onSelect: function(recordID, geomShape) {
-											//console.log('recordID:', recordID, 'geomShape:', geomShape);
+											if (priv.options.debug) console.log('recordID:', recordID, 'geomShape:', geomShape);
 											priv.mapEditorShow();
 											_mapEditor.TableAjaxMapSelectRecord(recordID, geomShape);
 										},
@@ -1043,13 +1053,13 @@ class TableAjax extends ViewAjax {
 												})
 												.done(function(data, textStatus, jqXHR){
 													notifyAjaxCallback(data);
-													console.log('TODO: data.record.the_geom:', data.record.the_geom);
+													if (priv.options.debug) console.log('data.record.the_geom:', data.record.the_geom);
 													if (data && data.record && data.record.the_geom) {
-														console.log('TODO: data.record.the_geom:2:', data.record.the_geom);
+														if (priv.options.debug) console.log('data.record.the_geom:2:', data.record.the_geom);
 														geomField.setValue(data.record.the_geom);
 													}
 													else if (data && data.record) {
-														console.log('TODO: data.record.the_geom:2:', data.record.the_geom);
+														if (priv.options.debug) console.log('data.record.the_geom:2:', data.record.the_geom);
 														geomField.setValue(data.record.the_geom);
 													}
 												})
@@ -1273,16 +1283,12 @@ class TableAjax extends ViewAjax {
 			if (undefined === _tableWidth) {
 				_tableWidth = true;
 				var contW = jQuery(_cont).width();
-//console.log('_cont.width: ' + jQuery(_cont).width());
 				var th1 = _table.find('.stickyCol1:first');
 				var th2 = th1.next();
 				var th1W = th1.innerWidth();
 				var th2W = 50 + 2 * 5;//th2.innerWidth();
 				var colsW = stickyCol1Width + 2 * 5 + 1 + stickyCol2Width + 2 * 5 + 1;
-//console.log('thF.width: ' + th1W + '; ' +  th2W + '; colsW: ' + colsW);
-				//jQuery(_cont).width(contW - colsW);
 				jQuery(_cont).css({width:'' + (contW - colsW) + 'px', marginLeft:'' + colsW + 'px', overflowX:'scroll', overflowY:'visible', paddingBottom:'1px'});
-//console.log('_cont.width new: ' + jQuery(_cont).width());
 			}
 			_table.find('.stickyCol1').css({position:'absolute',
 				left:'0',
@@ -1335,7 +1341,7 @@ class TableAjax extends ViewAjax {
 							publ.loadPage(_currPage);
 						},
 						error: function (jhr, textStatus, errorThrown) {
-							console.log('_inlineEditBox submit ajax error');
+							if (priv.options.debug) console.log('_inlineEditBox submit ajax error');
 						}
 					});
 
@@ -1672,8 +1678,7 @@ class TableAjax extends ViewAjax {
 		 * what: triggers filtering on the value
 		 */
 		priv.specialFilterChanged = function (e) {
-			console.log('specialFilterChanged...');
-			console.log(e.data);
+			if (priv.options.debug) console.log('specialFilterChanged e.data:', e.data);
 			_specialFilters[e.data.group] = e.data.value;
 
 			publ.loadPage(0);
@@ -1697,16 +1702,22 @@ class TableAjax extends ViewAjax {
 				}
 			});
 			return false;
-		},
+		};
 
 		priv.mapEditorHide = function() {
 			priv.options.mapEditor = false;
-			//_mapEditorDialog.dialog("close");
-			_mapEditorDialog.dialog("destroy");
-		}
+			if ('window' == priv.options.mapEditorContainer) {
+				//_mapEditorDialog.dialog("close");
+				_mapEditorDialog.dialog("destroy");
+			}
+			_mapEditorWrap.hide();
+			_mapEditor.hide();
+		};
 
 		priv.mapEditorShow = function() {
+			//console.log('TODO:mapEditorShow():', priv.options.mapEditorContainer, 'visible:', priv.options.mapEditor);
 			priv.options.mapEditor = true;
+			_mapEditor.show();
 			_mapEditorWrap.show();
 			_mapEditor.TableAjaxMap({
 				//debug: true,
@@ -1714,8 +1725,17 @@ class TableAjax extends ViewAjax {
 				wfsUrl: 'http://biuro.biall-net.pl/wps',
 				zoomStrategyActivate: 14,
 				layerName: '<?php echo $this->getLabelHtml(); ?>',
+				addBtn: {
+					title: 'Przenieś mapę do okna',
+					displayClass: 'mapEditor-btnBackToWindow',
+					trigger: function() {
+						priv.mapEditorHide();
+						priv.options.mapEditorContainer = 'window';
+						priv.mapEditorShow();
+					}
+				},
 				onSaveFeature: function(selectedRecordId, selectedFeatureExtent) {
-					console.log('onSaveFeature (',selectedRecordId,'/',selectedFeatureExtent,') ', this);
+					if (priv.options.debug) console.log('onSaveFeature (',selectedRecordId,'/',selectedFeatureExtent,') ', this);
 					if (!selectedRecordId) {
 						alert('Brak zaznaczonego rekordu - wybierz rekord z tabeli');
 						return;
@@ -1789,24 +1809,68 @@ class TableAjax extends ViewAjax {
 				}
 			});
 
-			_mapEditorDialog = _mapEditorWrap.dialog({
-				width: 540,
-				minWidth: 400,
-				minHeight: 300,
-				resizeStop: function(){
-					_mapEditor.TableAjaxMapUpdateSize(); //to prevent drag-zoom error
-				},
-				dragStop: function(){
-					_mapEditor.TableAjaxMapUpdateSize(); //to prevent drag-zoom error
+			priv.mapEditorShowElement();
+		};
+
+		priv.mapEditorShowElement = function() {
+			if ('window' == priv.options.mapEditorContainer) {
+				var mapEditor = _mapEditorWrap.children('.mapEditor-map');
+				if (!mapEditor || !mapEditor.length) {
+					var tblCont = jQuery(_cont).parent('.AjaxTableCont');
+					var mapEditor = tblCont.children('.AjaxTableCont-mapEditorContainer').children('.mapEditor-map');
+					if (!mapEditor || !mapEditor.length) {
+						// TODO: create new map
+					}
+					_mapEditorWrap.append(mapEditor);
 				}
-			});
-			_mapEditorWrap.bind('dialogclose', function(e) {
-				priv.options.mapEditor = false;
-			});
-		}
+
+				_mapEditorDialog = _mapEditorWrap.dialog({
+					width: 540,
+					minWidth: 400,
+					minHeight: 300,
+					resizeStop: function(){
+						_mapEditor.TableAjaxMapUpdateSize(); //to prevent drag-zoom error
+					},
+					dragStop: function(){
+						_mapEditor.TableAjaxMapUpdateSize(); //to prevent drag-zoom error
+					}
+				});
+				_mapEditorWrap.bind('dialogclose', function(e) {
+					priv.options.mapEditor = false;
+				});
+				var dialogTitleBar = _mapEditorDialog.parent().parent().find('.ui-dialog-titlebar');
+				var dialogTitleBarCloseBtn = dialogTitleBar.find('.ui-dialog-titlebar-close');
+				if (dialogTitleBarCloseBtn) {
+					var btnToggle = jQuery('<span style="width:18px;height:18px;position:absolute;top:50%;right:25px;margin-top:-9px;" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"><i style="margin-top:3px;" class="icon-fullscreen"></i></span>');
+					btnToggle.on('click', function(e) {
+						priv.options.mapEditorContainer = 'dock';
+						_mapEditorWrap.dialog('close');
+						priv.mapEditorShowElement();
+					});
+					btnToggle.insertBefore(dialogTitleBarCloseBtn);
+				}
+			}
+			else if ('dock' == priv.options.mapEditorContainer) {
+				var mapEditor = _mapEditorWrap.children('.mapEditor-map');
+				if (mapEditor && mapEditor.length) {// map is inside _mapEditorWrap (window)
+					_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);
+					} else {
+						_mapDockNode.insertAfter(breadcrumb);
+					}
+					_mapDockNode.append(mapEditor);					
+				}
+				_mapEditor.TableAjaxMapUpdateSize();
+			}
+
+		};
 
 		priv.mapEditorChanged = function(e) {
-			console.log('mapEditorChanged option(',priv.options.mapEditor,') e:', e);
+			if (priv.options.debug) console.log('mapEditorChanged option(',priv.options.mapEditor,')');
 			priv.options.mapEditor = !priv.options.mapEditor;
 			if (priv.options.mapEditor) {
 				priv.mapEditorShow();
@@ -1815,7 +1879,7 @@ class TableAjax extends ViewAjax {
 				priv.mapEditorHide();
 			}
 			return false;
-		},
+		};
 
 		/*
 		 when: changing page in pager
@@ -2065,7 +2129,6 @@ class TableAjax extends ViewAjax {
 							fld.focus();
 
 							fld.keydown(function(event) {
-								console.log('input keydown: ', event.which);
 								if (event.which == 13) {
 									event.preventDefault();
 									_inlineEditBox.find('form').submit();
@@ -2074,17 +2137,16 @@ class TableAjax extends ViewAjax {
 						}
 					},
 					error: function (err) {
-						console.log('err');
+						if (priv.options.debug) console.log('err');
 					}
 				});
 			} else {
-				console.log('NO data');
+				if (priv.options.debug) console.log('NO data');
 				return false;
 			}
 		};
 
 		priv.ajaxLoadTypeSpeciallCell = function(id, col) {
-			//console.log('ajaxLoadTypeSpeciallCell load id=' + id + ' col=' + col);
 			if (_popoverCellAjaxXhr) {
 				_popoverCellAjaxXhr.abort();
 			}
@@ -2096,7 +2158,6 @@ class TableAjax extends ViewAjax {
 				contentType: "application/json; charset=utf-8",
 				data: '',
 				success: function(req){
-					//console.log('ajaxLoadTypeSpeciallCell Data: ', req);
 					if (req.data && req.data.tbl_id > 0) {
 						var addHtml = '';
 						for(var i in req.data.items){
@@ -2154,7 +2215,7 @@ class TableAjax extends ViewAjax {
 					_popoverCellCurrent.popover('show');
 				}
 			} else {
-				console.log('NO data');
+				if (priv.options.debug) console.log('NO data');
 				return false;
 			}
 			return;
@@ -2231,7 +2292,7 @@ class TableAjax extends ViewAjax {
 					_table.parent().parent().removeClass('AjaxTable-loading');
 				},
 				error: function (err) {
-					//console.log('request error: {0}'.f(JSON.stringify(err)));
+					if (priv.options.debug) console.log('request error: {0}'.f(JSON.stringify(err)));
 				}
 			});
 		};
@@ -2259,7 +2320,6 @@ class TableAjax extends ViewAjax {
 	};
 
 	$.fn.TableAjaxLoadPage = function (page, pageSize) {
-		//console.log('TableAjaxLoadPage: ' + page + ' size: ' + pageSize);
 		return this.each(function () {
 			var tblAjax = jQuery(this).data('TableAjax');
 			var curPage = page || tblAjax.getCurrentPage();
@@ -2368,7 +2428,6 @@ jQuery(document).ready(function(){
 						async: true,
 						success: function (data) {
 							taskCnt.removeClass('AjaxTable-loading');
-							//console.log('request finished L.<?php echo __LINE__; ?>');
 							jQuery(data).appendTo(taskCnt);
 
 							taskCnt.find('.se_type-date').datepicker({
@@ -2614,7 +2673,7 @@ function tableAjaxCopy(args) {
 		},
 		error: function (err) {
 			alert.remove();
-			console.log(err);
+			if (priv.options.debug) console.log(err);
 		}
 	});
 
@@ -4230,7 +4289,7 @@ function fileListUpdateAjax<?php echo $this->_htmlID; ?>() {
 			fileListUpdate<?php echo $this->_htmlID; ?>(data);
 		},
 		error: function (jhr, textStatus, errorThrown) {
-			console.log('request error: ', errorThrown, ' textStatus: ', textStatus);
+			if (priv.options.debug) console.log('request error: ', errorThrown, ' textStatus: ', textStatus);
 		}
 	});
 }
@@ -4280,11 +4339,11 @@ function fileListUpdate<?php echo $this->_htmlID; ?>(fileListJson) {
 								//console.log('TODO: ERROR msg: ', data.string);
 							}
 						} else {
-							console.log('TODO: ??? data: ', data);
+							if (priv.options.debug) console.log('TODO: ??? data: ', data);
 						}
 					},
 					error: function (jhr, textStatus, errorThrown) {
-						console.log('rm error: ', errorThrown, ' textStatus: ', textStatus);
+						if (priv.options.debug) console.log('rm error: ', errorThrown, ' textStatus: ', textStatus);
 					}
 				});
 			}
@@ -4311,7 +4370,7 @@ function connTblListUpdateAjax<?php echo $this->_htmlID; ?>(connTblID) {
 		error: function (jqXHR, textStatus, errorThrown) {
 			var txt = jqXHR.responseText || 'Error';
 			jQuery('#FILES_CONN_TBLS_<?php echo $this->_htmlID; ?>').find('.files-list').html('<tr><td colspan="6"><div class="alert alert-error">' + txt + '</div></td></tr>');
-			console.log('connTblListUpdateAjax error: ', errorThrown, ' textStatus: ', textStatus);
+			if (priv.options.debug) console.log('connTblListUpdateAjax error: ', errorThrown, ' textStatus: ', textStatus);
 		}
 	});
 }
@@ -4345,18 +4404,18 @@ jQuery(document).ready(function(){
 			// validate
 			if (argsMap['M_DIST_UPLOAD_SOURCE'] == 'local') {
 				if (!argsMap['M_DIST_FILES_NAME']) {
-					console.log('TODO: nie wybrano lokalnego pliku!');
+					if (priv.options.debug) console.log('TODO: nie wybrano lokalnego pliku!');
 					return false;
 				}
 			}
 			else if (argsMap['M_DIST_UPLOAD_SOURCE'] == 'scan') {
 				if (!argsMap['SCANS_COLUMN_ADD']) {
-					console.log('TODO: nie wybrano pliku ze skanów!');
+					if (priv.options.debug) console.log('TODO: nie wybrano pliku ze skanów!');
 					return false;
 				}
 			}
 			else {
-				console.log('TODO: nie wybrano źródła pliku!');
+				if (priv.options.debug) console.log('TODO: nie wybrano źródła pliku!');
 				return false;
 			}
 
@@ -4427,7 +4486,7 @@ jQuery(document).ready(function(){
 			_connTblsWrap.find('.conn-tbl-load').each(function(){
 				jQuery(this).click(function(e){
 					var tblID = jQuery(e.target).data('zasobid');
-					console.log('clicked: ', tblID);
+					if (priv.options.debug) console.log('clicked: ', tblID);
 					if (tblID) {
 						connTblListUpdateAjax<?php echo $this->_htmlID; ?>(tblID);
 					}// TODO: else show error

SE/se-lib/TableAjaxMap.php

@@ -64,6 +64,9 @@ OpenLayers.ProxyHost = "index-ajax.php?_zasobID=<?php echo $this->_zasobID; ?>&_
 			wfsUrl: '',
 			layerName: 'Warstwa rysowania',
 			zoomStrategyActivate: 15,
+			onSaveFeature: null,
+			onSelectBox: null,
+			addBtn: null,
 			debug: false
 		};
 
@@ -340,6 +343,20 @@ OpenLayers.ProxyHost = "index-ajax.php?_zasobID=<?php echo $this->_zasobID; ?>&_
 				})
 			]);
 
+			if (priv.options.addBtn) {
+				toolbar.addControls([
+					new OpenLayers.Control.Button({
+						title: priv.options.addBtn.title,
+						displayClass: priv.options.addBtn.displayClass,
+						trigger: function() {
+							if (typeof priv.options.addBtn.trigger == "function") {
+								priv.options.addBtn.trigger.call(this);
+							}
+						}
+					})
+				]);
+			}
+
 			var gphy =  new OpenLayers.Layer.OSM("Mapa", null, {
 				resolutions: [156543.03390625, 78271.516953125, 39135.7584765625,
 					19567.87923828125, 9783.939619140625, 4891.9698095703125,