[Mapbender-commits] r8337 - branches/2.7/http/javascripts
svn_mapbender at osgeo.org
svn_mapbender at osgeo.org
Fri Apr 27 08:20:58 EDT 2012
Author: astrid_emde
Date: 2012-04-27 05:20:58 -0700 (Fri, 27 Apr 2012)
New Revision: 8337
Modified:
branches/2.7/http/javascripts/mod_coords_div.php
branches/2.7/http/javascripts/mod_dragMapSize.php
branches/2.7/http/javascripts/mod_selArea.js
branches/2.7/http/javascripts/requestGeometryConstructor.js
Log:
script modified for use with IPAD http://trac.osgeo.org/mapbender/ticket/822
Modified: branches/2.7/http/javascripts/mod_coords_div.php
===================================================================
--- branches/2.7/http/javascripts/mod_coords_div.php 2012-04-27 12:11:28 UTC (rev 8336)
+++ branches/2.7/http/javascripts/mod_coords_div.php 2012-04-27 12:20:58 UTC (rev 8337)
@@ -47,6 +47,9 @@
mb_button[ind].stop = mod_showCoords_div_disable;
}
function mod_showCoords_div_run(){
+ if ($.extend(mod_showCoords_div_mapObj).defaultTouch) {
+ $.extend(mod_showCoords_div_mapObj).defaultTouch.deactivate();
+ }
var $map = $(mod_showCoords_div_mapObj.getDomElement());
$map.bind("mousemove", mod_showCoords_div_display);
$map.bind("click", mod_showCoords_div_click);
@@ -58,6 +61,9 @@
if(document.getElementById(displayTarget)){
writeTag("",displayTarget,"");
}
+ if ($.extend(mod_showCoords_div_mapObj).defaultTouch) {
+ $.extend(mod_showCoords_div_mapObj).defaultTouch.activate();
+ }
}
function mod_showCoords_div_click(e){
var click = mod_showCoords_div_mapObj.getMousePosition(e);
Modified: branches/2.7/http/javascripts/mod_dragMapSize.php
===================================================================
--- branches/2.7/http/javascripts/mod_dragMapSize.php 2012-04-27 12:11:28 UTC (rev 8336)
+++ branches/2.7/http/javascripts/mod_dragMapSize.php 2012-04-27 12:20:58 UTC (rev 8337)
@@ -1,7 +1,7 @@
<?php
# $Id$
# http://www.mapbender.org/index.php/mod_dragMapSize.php
-# Copyright (C) 2002 CCGIS
+# Copyright (C) 2002 CCGIS
#
# This program is free software; you can redistribute it and/or modify
# it under the terms of the GNU General Public License as published by
@@ -22,6 +22,9 @@
?>
var mod_dragMapSize_offset = 15;
var mod_dragMapSize_active = false;
+var isTouchable = false;
+var isMainTouchActiv = false;
+try {document.createEvent("TouchEvent"); isTouchable = true; } catch(e){}
eventInit.register(function () {
mod_dragMapSize_init();
@@ -31,45 +34,185 @@
mod_dragMapSize_arrange()
});
+function mod_dragMapSize_init(){
+ var el = document.getElementById("dragMapSize");
+ if (isTouchable) {
+ $('.ui-icon').css({width:'30px',height:'30px'});
+ el.addEventListener("mousedown", mod_dragMapSize_touchOn, true);
+ el.addEventListener("mouseup", mod_dragMpaSize_touchOff, true);
+ el.addEventListener("touchstart", mod_dragMapSize_touchOn, true);
+ } else {
+// $('.ui-icon').css({width:'30px',height:'30px'});
+ el.onmousedown = mod_dragMapSize_down;
+ }
+ $(el).hover(function () {
+ $(this).addClass("ui-state-hover");
+ },
+ function () {
+ $(this).removeClass("ui-state-hover");
+ }
+ );
+ mod_dragMapSize_arrange();
+}
+
function mod_dragMapSize_arrange(){
- var left = parseInt(document.getElementById(mod_dragMapSize_target).style.left, 10) +
- parseInt(document.getElementById(mod_dragMapSize_target).style.width, 10) +
- mod_dragMapSize_offset -
- (parseInt(document.getElementById('dragMapSize').style.width, 10)/2);
- var top = parseInt(document.getElementById(mod_dragMapSize_target).style.top, 10) +
- parseInt(document.getElementById(mod_dragMapSize_target).style.height, 10) +
- mod_dragMapSize_offset -
- (parseInt(document.getElementById('dragMapSize').style.height, 10)/2);
+ var left = parseInt(document.getElementById(mod_dragMapSize_target).style.left, 10) +
+ parseInt(document.getElementById(mod_dragMapSize_target).style.width, 10) +
+ mod_dragMapSize_offset -
+ (parseInt(document.getElementById('dragMapSize').style.width, 10)/2);
+ var top = parseInt(document.getElementById(mod_dragMapSize_target).style.top, 10) +
+ parseInt(document.getElementById(mod_dragMapSize_target).style.height, 10) +
+ mod_dragMapSize_offset -
+ (parseInt(document.getElementById('dragMapSize').style.height, 10)/2);
mb_arrangeElement('','dragMapSize' , left, top);
}
+function mod_dragMapSize_touchOn(e){
-function mod_dragMapSize_init(){
- var el = document.getElementById("dragMapSize");
- el.onmousedown = mod_dragMapSize_down;
- $(el).hover(function () {
- $(this).addClass("ui-state-hover");
- },
- function () {
- $(this).removeClass("ui-state-hover");
- }
- );
- mod_dragMapSize_arrange();
+ body.addEventListener("touchstart", mod_dragMapSize_touch_down, true);
+ body.addEventListener("touchmove", mod_dragMapSize_touch_drag, true);
+ body.addEventListener("touchend", mod_dragMapSize_touch_up, true);
+ mod_dragMapSize_touch_down(e);
}
+function mod_dragMpaSize_touchOff(e){
+ body.removeEventListener("touchstart", mod_dragMapSize_touch_down, true);
+ body.removeEventListener("touchmove", mod_dragMapSize_touch_drag, true);
+ body.removeEventListener("touchend", mod_dragMapSize_touch_up, true);
+}
+function mod_dragMapSize_touch_down(e){
+ e.preventDefault();
+ var elm = findElement(e, "");
+ if(mod_dragMapSize_active == false && isSingleTouch(e)){
+
+ mb_start_x = e.touches[0].pageX;
+ mb_start_y = e.touches[0].pageY;
+ mb_end_x = mb_start_x;
+ mb_end_y = mb_start_y;
+
+ mod_dragMapSize_active = true;
+
+ //create a div that catches all mouse interactions
+ var dragElement = document.getElementById("dragMapSize");
+ $('.ui-state-active').css({width:'30px',height:'30px'});
+ $(dragElement).addClass("ui-state-active");
+ var mouseCatcher = dragElement.parentNode.appendChild(document.createElement('div'));
+ mouseCatcher.setAttribute("id", "dragMapSize_helper");
+ mouseCatcher.style.position = "absolute";
+ mouseCatcher.style.cursor = "move";
+ mouseCatcher.style.width = "200px";
+ mouseCatcher.style.height = "200px";
+ mouseCatcher.style.zIndex = 160;
+ if($.browser.msie)
+ mouseCatcher.style.background = "url(../img/transparent.gif)";
+ mouseCatcher.style.left=(mb_start_x-parseInt(mouseCatcher.style.width)) + "px";
+ mouseCatcher.style.top=(mb_start_x-parseInt(mouseCatcher.style.height)) + "px";
+ }
+ return true;
+}
+
+function mod_dragMapSize_touch_drag(e){
+ e.preventDefault();
+ var elm = findElement(e, "");
+ if(mod_dragMapSize_active && isSingleTouch(e)){
+// var x, y;
+ mb_end_x = e.touches[0].pageX;
+ mb_end_y = e.touches[0].pageY;
+ var dif_x = mb_end_x - (parseInt(document.getElementById('dragMapSize').style.width)/2);
+ var dif_y = mb_end_y - (parseInt(document.getElementById('dragMapSize').style.height)/2);
+ mb_arrangeElement('', "dragMapSize", dif_x, dif_y);
+ var mouseCatcher = document.getElementById("dragMapSize_helper");
+ mb_arrangeElement('', "dragMapSize_helper", mb_end_x-parseInt(mouseCatcher.style.width), mb_end_y-parseInt(mouseCatcher.style.height));
+ }
+}
+
+function mod_dragMapSize_touch_up(e){
+ e.preventDefault();
+ var elm = findElement(e, "");
+ body.removeEventListener("touchstart", mod_dragMapSize_touch_down, true);
+ body.removeEventListener("touchmove", mod_dragMapSize_touch_drag, true);
+ body.removeEventListener("touchend", mod_dragMapSize_touch_up, true);
+// if (isMainTouchActiv) {
+// $.extend(Mapbender.modules.mobile_Map).defaultTouch.activate();
+// }
+
+// if (isSingleTouch(e)) {
+// mb_end_x = e.touches[0].pageX;
+// mb_end_y = e.touches[0].pageY;
+
+
+ var dragElement = document.getElementById("dragMapSize");
+ $(dragElement).removeClass("ui-state-active");
+
+ var mouseCatcher = document.getElementById("dragMapSize_helper");
+ mouseCatcher.parentNode.removeChild(mouseCatcher);
+
+ mod_dragMapSize_active = false;
+
+ targetObject = getMapObjByName(mod_dragMapSize_target);
+ var dif_x = (parseFloat(mb_end_x) - parseFloat(mb_start_x));
+ var dif_y = (parseFloat(mb_end_y) - parseFloat(mb_start_y));
+
+ if(parseFloat(targetObject.width) + parseFloat(dif_x)<0 ||
+ parseFloat(targetObject.height) + parseFloat(dif_y)<0){
+
+ var dif_x = mb_start_x - (parseInt(document.getElementById('dragMapSize').style.width) / 2);
+ var dif_y = mb_start_y - (parseInt(document.getElementById('dragMapSize').style.height) / 2);
+ mb_arrangeElement('', "dragMapSize", dif_x, dif_y);
+ return true;
+ }
+
+ var newX = (parseFloat(targetObject.width) + parseFloat(dif_x));
+ var newY = (parseFloat(targetObject.height) + parseFloat(dif_y));
+ var pos = makeClickPos2RealWorldPos(mod_dragMapSize_target, newX, newY);
+ targetObject.setWidth(targetObject.getWidth() + parseFloat(dif_x));
+ targetObject.setHeight(targetObject.getHeight() + parseFloat(dif_y));
+
+ var mybbox = targetObject.getExtent().split(",");
+ if (typeof mybbox !== "object" || mybbox.length !== 4) {
+ return;
+ }
+ targetObject.setExtent(mybbox[0], pos[1], pos[0], mybbox[3]);
+ targetObject.setMapRequest();
+ eventResizeMap.trigger();
+// }
+ return true;
+}
+
+function findElement(event, tagName) {
+ var element = getElement(event);
+ while (element.parentNode && (!element.tagName ||
+ (element.tagName.toUpperCase() != tagName.toUpperCase()))){
+ element = element.parentNode;
+ return element;
+ }
+}
+
+function getElement(event) {
+ return event.target || event.srcElement;
+}
+
+function isSingleTouch(event) {
+ return event.touches && event.touches.length == 1;
+}
+
+function isMultiTouch(event) {
+ return event.touches && event.touches.length > 1;
+}
+
function mod_dragMapSize_down(e){
if(mod_dragMapSize_active == false){
- document.onmouseup = mod_dragMapSize_up;
- document.onmousemove = mod_dragMapSize_drag;
-
- mb_getMousePos(e);
- mb_start_x = clickX;
- mb_start_y = clickY;
- mb_end_x = clickX;
- mb_end_y = clickY;
+ document.onmouseup = mod_dragMapSize_up;
+ document.onmousemove = mod_dragMapSize_drag;
+ mb_getMousePos(e);
+ mb_start_x = clickX;
+ mb_start_y = clickY;
+ mb_end_x = clickX;
+ mb_end_y = clickY;
mod_dragMapSize_active = true;
//create a div that catches all mouse interactions
var dragElement = document.getElementById("dragMapSize");
+// $('.ui-state-active').css({width:'30px',height:'30px'});
$(dragElement).addClass("ui-state-active");
var mouseCatcher = dragElement.parentNode.appendChild(document.createElement('div'));
mouseCatcher.setAttribute("id", "dragMapSize_helper");
@@ -79,32 +222,31 @@
mouseCatcher.style.height = "500px";
mouseCatcher.style.zIndex = 160;
if($.browser.msie)
- mouseCatcher.style.background = "url(../img/transparent.gif)";
- mouseCatcher.style.left=(clickX-250) + "px";
- mouseCatcher.style.top=(clickY-250) + "px";
-
+ mouseCatcher.style.background = "url(../img/transparent.gif)";
+ mouseCatcher.style.left=(mb_start_x-parseInt(mouseCatcher.style.width)) + "px";
+ mouseCatcher.style.top=(mb_start_x-parseInt(mouseCatcher.style.height)) + "px";
+
return false;
}
}
-function mod_dragMapSize_up(e){
- document.onmouseup = null;
- document.onmousemove = null;
-
+function mod_dragMapSize_up(e){
+ mb_getMousePos(e);
+ mb_end_x = clickX;
+ mb_end_y = clickY;
+ document.onmouseup = null;
+ document.onmousemove = null;
var dragElement = document.getElementById("dragMapSize");
$(dragElement).removeClass("ui-state-active");
var mouseCatcher = document.getElementById("dragMapSize_helper");
mouseCatcher.parentNode.removeChild(mouseCatcher);
-
+
mod_dragMapSize_active = false;
- mb_getMousePos(e);
- mb_end_x = clickX;
- mb_end_y = clickY;
+
targetObject = getMapObjByName(mod_dragMapSize_target);
var dif_x = (parseFloat(mb_end_x) - parseFloat(mb_start_x));
var dif_y = (parseFloat(mb_end_y) - parseFloat(mb_start_y));
-
if(parseFloat(targetObject.width) + parseFloat(dif_x)<0 ||
parseFloat(targetObject.height) + parseFloat(dif_y)<0)
{
@@ -119,10 +261,10 @@
targetObject.setWidth(targetObject.getWidth() + parseFloat(dif_x));
targetObject.setHeight(targetObject.getHeight() + parseFloat(dif_y));
- var mybbox = targetObject.getExtent().split(",");
- if (typeof mybbox !== "object" || mybbox.length !== 4) {
- return;
- }
+ var mybbox = targetObject.getExtent().split(",");
+ if (typeof mybbox !== "object" || mybbox.length !== 4) {
+ return;
+ }
targetObject.setExtent(mybbox[0], pos[1], pos[0], mybbox[3]);
targetObject.setMapRequest();
eventResizeMap.trigger();
@@ -130,12 +272,16 @@
function mod_dragMapSize_drag(e){
if(mod_dragMapSize_active){
- if (!e)
- e = window.event;
- mb_getMousePos(e);
- var dif_x = clickX - (parseInt(document.getElementById('dragMapSize').style.width)/2);
- var dif_y = clickY - (parseInt(document.getElementById('dragMapSize').style.height)/2);
- mb_arrangeElement('', "dragMapSize", dif_x, dif_y);
- mb_arrangeElement('', "dragMapSize_helper", clickX-250, clickY-250);
+ var x, y;
+ if (!e)
+ e = window.event;
+ mb_getMousePos(e);
+ x = clickX;
+ y = clickY;
+ var dif_x = x - (parseInt(document.getElementById('dragMapSize').style.width)/2);
+ var dif_y = y - (parseInt(document.getElementById('dragMapSize').style.height)/2);
+ mb_arrangeElement('', "dragMapSize", dif_x, dif_y);
+ mb_arrangeElement('', "dragMapSize_helper", x-250, y-250);
}
}
+
Modified: branches/2.7/http/javascripts/mod_selArea.js
===================================================================
--- branches/2.7/http/javascripts/mod_selArea.js 2012-04-27 12:11:28 UTC (rev 8336)
+++ branches/2.7/http/javascripts/mod_selArea.js 2012-04-27 12:20:58 UTC (rev 8337)
@@ -3,83 +3,200 @@
*
* Description:
* Zoom by rectangle
- *
+ *
* Files:
* - http/javascripts/mod_selArea.js
*
* SQL:
- * > <SQL for element>
- * >
- * > <SQL for element var>
+ * > <SQL for element>
+ * >
+ * > <SQL for element var>
*
* Help:
* http://www.mapbender.org/SelArea1
*
* Maintainer:
* http://www.mapbender.org/User:Christoph_Baudson
- *
+ *
* License:
* Copyright (c) 2009, Open Source Geospatial Foundation
- * This program is dual licensed under the GNU General Public License
- * and Simplified BSD license.
+ * This program is dual licensed under the GNU General Public License
+ * and Simplified BSD license.
* http://svn.osgeo.org/mapbender/trunk/mapbender/license/license.txt
*/
var that = this;
+
Mapbender.events.init.register(function () {
-
- var box;
- var map = Mapbender.modules[options.target];
-
- var button = new Mapbender.Button({
- domElement: that,
- over: options.src.replace(/_off/, "_over"),
- on: options.src.replace(/_off/, "_on"),
- off: options.src,
- name: options.id,
- go: function () {
- if (!map) {
- new Mb_exception(options.id + ": " +
- options.target + " is not a map!");
- return;
- }
-
- box = new Mapbender.Box({
- target: options.target
- });
- $(map.getDomElement()).css(
- "cursor", "crosshair"
- ).mousedown(function (e) {
- box.start(e);
- return false;
- }).mouseup(function (e) {
- box.stop(e, function (extent) {
- if (typeof extent === "undefined") {
- return false;
- }
- if (extent.constructor === Mapbender.Extent) {
- var xt = map.calculateExtent(extent);
- map.setMapRequest();
- }
- else if (extent.constructor === Mapbender.Point) {
- map.setCenter(extent);
- map.setMapRequest();
- }
- });
- return false;
- });
- },
- stop: function () {
- if (!map) {
- return;
- }
- $(map.getDomElement())
- .css("cursor", "default")
- .unbind("mousedown")
- .unbind("mouseup")
- .unbind("mousemove");
- box = null;
- }
- });
-});
\ No newline at end of file
+ var touch;
+ var box;
+ var map = Mapbender.modules[options.target];
+ var isTouchable = false;
+ try {
+ document.createEvent("TouchEvent");
+ isTouchable = true;
+ } catch(e){}
+ var button = new Mapbender.Button({
+ domElement: that,
+ over: options.src.replace(/_off/, "_over"),
+ on: options.src.replace(/_off/, "_on"),
+ off: options.src,
+ name: options.id,
+ go: function () {
+ if (!map) {
+ new Mb_exception(options.id + ": " +
+ options.target + " is not a map!");
+ return;
+ }
+ if(isTouchable) {
+ $(map.getDomElement()).css("cursor", "crosshair");
+
+ if ($.extend(map).defaultTouch) {
+ $.extend(map).defaultTouch.deactivate();
+ }
+ box = new Mapbender.BoxMobile({
+ target: options.target
+ });
+ touch = new selAreaTouch(map,$(map.getDomElement()), map.getDomElement(), box);
+ touch.activate();
+ } else {
+ box = new Mapbender.Box({
+ target: options.target
+ });
+
+ $(map.getDomElement()).css(
+ "cursor", "crosshair"
+ ).mousedown(function (e) {
+ box.start(e);
+ return false;
+ }).mouseup(function (e) {
+ box.stop(e, function (extent) {
+ if (typeof extent === "undefined") {
+ return false;
+ }
+ if (extent.constructor === Mapbender.Extent) {
+ var xt = map.calculateExtent(extent);
+ map.setMapRequest();
+ }
+ else if (extent.constructor === Mapbender.Point) {
+ map.setCenter(extent);
+ map.setMapRequest();
+ }
+ });
+ return false;
+ });
+ }
+ },
+ stop: function () {
+ if (!map) {
+ return;
+ }
+ if(isTouchable) {
+ $(map.getDomElement()).css("cursor", "default");
+ touch.deactivate();
+ touch = null;
+ box = null;
+ if ($.extend(map).defaultTouch) {
+ $.extend(map).defaultTouch.activate();
+ }
+ } else {
+ $(map.getDomElement())
+ .css("cursor", "default")
+ .unbind("mousedown")
+ .unbind("mouseup")
+ .unbind("mousemove");
+ box = null;
+ }
+ }
+ });
+ function selAreaTouch(map, $map, mapDom, box){
+ this.map = map;
+ this.$elm = $map;
+ this.elm = mapDom;
+ this.box = box;
+ this.startPos = null;
+ this.activate = function() {
+ this.elm.addEventListener("touchstart", touch.startTouch, true);
+ this.elm.addEventListener("touchmove", touch.moveTouch, true);
+ this.elm.addEventListener("touchend", touch.endTouch, true);
+ }
+ this.deactivate = function() {
+ this.elm.removeEventListener("touchstart", touch.startTouch, true);
+ this.elm.removeEventListener("touchmove", touch.moveTouch, true);
+ this.elm.removeEventListener("touchend", touch.endTouch, true);
+ }
+ this.startTouch = function(event) {
+ event.preventDefault();
+ var elm = findElement(event, "");
+ if (isSingleTouch(event)) {
+ touch.startPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ var stopPos = new Point(touch.startPos.x, touch.startPos.y);
+ touch.box.start(touch.startPos, stopPos);
+ } else if (isMultiTouch(event)) {
+ var startPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ var stopPos = new Point(
+ event.touches[1].pageX - touch.$elm.offset().left,
+ event.touches[1].pageY - touch.$elm.offset().top);
+ touch.box.start(startPos, stopPos);
+ }
+ return true;
+ }
+ this.moveTouch = function(event) {
+ event.preventDefault();
+ var elm = findElement(event, "");
+ if (isSingleTouch(event)) {
+ var stopPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ touch.box.run(touch.startPos, stopPos);
+ } else if (isMultiTouch(event)) {
+ var startPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ var stopPos = new Point(
+ event.touches[1].pageX - touch.$elm.offset().left,
+ event.touches[1].pageY - touch.$elm.offset().top);
+ touch.box.run(startPos, stopPos);
+ }
+ return true;
+ }
+ this.endTouch = function(event) {
+ return touch.box.stop(function (extent) {
+ if (typeof extent === "undefined") {
+ return false;
+ }
+ if (extent.constructor === Mapbender.Extent) {
+ var xt = touch.map.calculateExtent(extent);
+ touch.map.setMapRequest();
+ }
+ else if (extent.constructor === Mapbender.Point) {
+ touch.map.setCenter(extent);
+ touch.map.setMapRequest();
+ }
+ });
+ }
+
+ function findElement(event, tagName) {
+ var element = getElement(event);
+ while (element.parentNode && (!element.tagName ||
+ (element.tagName.toUpperCase() != tagName.toUpperCase()))){
+ element = element.parentNode;
+ return element;
+ }
+ }
+ function getElement(event) {
+ return event.target || event.srcElement;
+ }
+ function isSingleTouch (event) {
+ return event.touches && event.touches.length == 1;
+ }
+ function isMultiTouch(event) {
+ return event.touches && event.touches.length > 1;
+ }
+ }
+});
Modified: branches/2.7/http/javascripts/requestGeometryConstructor.js
===================================================================
--- branches/2.7/http/javascripts/requestGeometryConstructor.js 2012-04-27 12:11:28 UTC (rev 8336)
+++ branches/2.7/http/javascripts/requestGeometryConstructor.js 2012-04-27 12:20:58 UTC (rev 8337)
@@ -1,7 +1,7 @@
-/*
+/*
* $Id: requestGeometryConstructor.js 1882 2007-12-03 09:01:24Z verenadiewald $
* COPYRIGHT: (C) 2001 by ccgis. This program is free software under the GNU General Public
-* License (>=v2). Read the file gpl.txt that comes with Mapbender for details.
+* License (>=v2). Read the file gpl.txt that comes with Mapbender for details.
*/
//http://www.mapbender.org/index.php/requestGeometryConstructor.js
@@ -12,250 +12,424 @@
* @param {String} geomType type of the {@link RequestGeometryConstructor}
* @param {String} geomType target of the {@link RequestGeometryConstructor}
*/
- function RequestGeometryConstructor(geomTarget){
- /**
+function RequestGeometryConstructor(geomTarget){
+ /**
* geomTarget target of the {@link RequestGeometryConstructor}
*
* @type String
*/
+ this.geomTarget = geomTarget;
- this.geomTarget = geomTarget;
-
- var box = new Mapbender.Box({
- target: geomTarget
- });
-
- var that = this;
+ var that = this;
+ var ind = getMapObjIndexByName(this.geomTarget);
+ var myMapObj = mb_mapObj[ind];
+ var map_el = myMapObj.getDomElement();
- var ind = getMapObjIndexByName(this.geomTarget);
- var myMapObj = mb_mapObj[ind];
- var map_el = myMapObj.getDomElement();
- if(!map_el.ownerDocument.getElementById(myMapObj.elementName+"_request_geometry_polygon")){
- //create Box Elements
- var el_top = map_el.ownerDocument.createElement("div");
- el_top.style.position = "absolute";
- el_top.style.top = "0px";
- el_top.style.left = "0px";
- el_top.style.zIndex = "500";
- el_top.style.fontSize = "10px";
- el_top.id = myMapObj.elementName+"_request_geometry_polygon";
- map_el.appendChild(el_top);
- }
-
- if(!map_el.ownerDocument.getElementById(myMapObj.elementName+"_measure_display")){
- //create Box Elements
- var el_top = map_el.ownerDocument.createElement("div");
- el_top.style.position = "absolute";
- el_top.style.top = "0px";
- el_top.style.left = "0px";
- el_top.style.zIndex = "510";
- el_top.id = myMapObj.elementName+"_measure_display";
- map_el.appendChild(el_top);
- }
+ var box;
+ var touch;
+ var isTouchable = false;
+ try {
+ document.createEvent("TouchEvent");
+ isTouchable = true;
+ } catch(e){}
-
- this.getGeometry = function(queryType,callbackFunction){
- var target = this.geomTarget;
- s = new Snapping(this.geomTarget);
- callback = callbackFunction;
-
- var ind = getMapObjIndexByName(target);
- var el = mb_mapObj[ind].getDomElement();
- $(el).unbind("mousedown")
- .unbind("mouseover")
- .unbind("mouseup")
- .unbind("mousemove");
-
- if (queryType == "point") {
- queryGeom = new Geometry(geomType.point);
- $(el).mousedown(function (e) {
- realWorldPos = mapToReal(target,myMapObj.getMousePosition(e));
- queryGeom.addPoint(realWorldPos);
- callback(target, queryGeom);
- $(el).unbind("mousedown")
- .unbind("mouseover")
- .unbind("mouseup")
- .unbind("mousemove");
- queryGeom = null;
- });
- }
- else if (queryType == "polygon") {
- queryGeom = new Geometry(geomType.polygon);
- $(el).mousedown(function (e) {
- wfsSpatialRequestStart(e);
- }).mousemove(function (e) {
- wfsSpatialRequestRun(e);
- });
- }
- else if (queryType == "rectangle") {
- queryGeom = new Geometry(geomType.line);
- $(el).mousedown(function (e) {
- box.start(e);
- return false;
- }).mouseup(function (e) {
- var targetMap = Mapbender.modules[that.geomTarget];
- if (!targetMap) {
- return false;
- }
- box.stop(e, function (extent) {
- if (typeof extent === "undefined") {
- return false;
- }
- if (extent.constructor === Mapbender.Extent) {
- queryGeom = new Geometry(geomType.line);
- queryGeom.addPoint(extent.min);
- queryGeom.addPoint(extent.max);
- queryGeom.close();
- callback(that.geomTarget,queryGeom);
- $(el)
- .css("cursor", "default")
- .unbind("mousedown")
- .unbind("mouseup")
- .unbind("mousemove");
- box = null;
+ if(!map_el.ownerDocument.getElementById(myMapObj.elementName+"_request_geometry_polygon")){
- }
- });
- return false;
-
- });
- }
- else if (queryType == "extent") {
- queryGeom = new Geometry(geomType.line);
- var ind = getMapObjIndexByName(target);
- var p0 = mapToReal(target, new Point(0,0));
- var p1 = mapToReal(target, new Point(mb_mapObj[ind].width,mb_mapObj[ind].height));
- queryGeom.addPoint(p0);
- queryGeom.addPoint(p1);
- callback(target, queryGeom);
- $(el).unbind("mousedown")
- .unbind("mouseover")
- .unbind("mouseup")
- .unbind("mousemove");
+ //create Box Elements
+ var el_top = map_el.ownerDocument.createElement("div");
+ el_top.style.position = "absolute";
+ el_top.style.top = "0px";
+ el_top.style.left = "0px";
+ el_top.style.zIndex = "500";
+ el_top.style.fontSize = "10px";
+ el_top.id = myMapObj.elementName+"_request_geometry_polygon";
+ map_el.appendChild(el_top);
+ }
- queryGeom = null;
- }
-
- }
-
- var s;
- var callback;
-
- var wfsSpatialRequestStart = function(e){
- this.geomTarget = geomTarget;
- var that = this;
- var realWorldPos;
- if (s.isSnapped() == true) {
- realWorldPos = s.getSnappedPoint();
- s.clean();
- }
- else {
- realWorldPos = mapToReal(that.geomTarget,myMapObj.getMousePosition(e));
- }
- queryGeom.addPoint(realWorldPos);
-
- if (queryGeom.count() == 1) {
- s.add(queryGeom.get(0));
- }
- if (s.isSnapped() && queryGeom.count() >= 3 && queryGeom.get(-1).equals(queryGeom.get(0))) {
- queryGeom.close();
- callback(that.geomTarget,queryGeom);
- writeTag(myMapObj.frameName, myMapObj.elementName+"_request_geometry_polygon", "");
- writeTag(myMapObj.frameName, myMapObj.elementName+"_measure_display", "");
- var ind = getMapObjIndexByName("mapframe1");
- var el = mb_mapObj[ind].getDomElement();
- $(el).unbind("mousedown")
- .unbind("mouseover")
- .unbind("mouseup")
- .unbind("mousemove");
- queryGeom = null;
- return;
- }
- drawDashedLineExt();
- }
-
- var wfsSpatialRequestRun = function(e){
- this.geomTarget = geomTarget;
- var that = this;
- if (queryGeom.count() >= 3) {
- var pos = myMapObj.getMousePosition(e);
- s.check(pos);
- }
- }
-
- var drawDashedLineExt = function(e){
- this.geomTarget = geomTarget;
- var that = this;
- var ind = getMapObjIndexByName(that.geomTarget);
- var str_mPoints = "<div style='position:absolute;left:0px;top:0px' ><img src='"+mb_trans.src+"' width='"+mb_mapObj[ind].width+"' height='0'></div>";
- str_mPoints += "<div style='position:absolute;left:0px;top:0px' ><img src='"+mb_trans.src+"' width='0' height='"+mb_mapObj[ind].height+"'></div>";
- if (queryGeom != null) {
- for(var i=0; i<queryGeom.count(); i++){
- var pos = realToMap(that.geomTarget,queryGeom.get(i));
- str_mPoints += "<div style='font-size:1px;position:absolute;top:"+(pos.y-2)+"px;left:"+(pos.x-2)+"px;width:3px;height:3px;background-color:#ff0000'></div>";
- }
- if(queryGeom.count()>1){
- for(var k=1; k<queryGeom.count(); k++){
- var pos0 = realToMap(that.geomTarget,queryGeom.get(k));
- var pos1 = realToMap(that.geomTarget,queryGeom.get(k-1));
- str_mPoints += evaluateDashesExt(pos1,pos0,k);
- }
- }
- }
- writeTag(myMapObj.frameName, myMapObj.elementName+"_request_geometry_polygon", str_mPoints);
- }
-
- var evaluateDashesExt = function(p1,p0,count){
- this.geomTarget = geomTarget;
- var that = this;
- var ind = getMapObjIndexByName(that.geomTarget);
- var str_dashedLine = "";
- var d = p0.dist(p1);
- var n = Math.round(d);
- var s = p0.minus(p1).dividedBy(n);
- for(var i=1; i<n; i++){
- var currPoint = p1.plus(s.times(i)).minus(new Point(2,2)).round(0);
- if(currPoint.x >= 0 && currPoint.x <= mb_mapObj[ind].width && currPoint.y >= 0 && currPoint.y <= mb_mapObj[ind].height){
- str_dashedLine += "<div style='font-size:1px;position:absolute;top:"+currPoint.y+"px;left:"+currPoint.x+"px;width:3px;height:3px;background-color:#ff0000'></div>";
- }
- }
- return str_dashedLine;
- }
-
- var selAreaExtInit = function(e){
- mb_isBF = that.geomTarget;
- mb_zF = that.geomTarget;
- }
-
- var selAreaExtGet = function(e){
- selAreaExtSetValidClipping(mod_box_stop(e));
- mb_isBF = that.geomTarget;
- mb_zF = that.geomTarget;
- }
-
- var selAreaExtSetValidClipping = function(coords){
- this.geomTarget = geomTarget;
- var that = this;
- if (queryGeom != null) {
- queryGeom.addPoint(new Point(coords[0],coords[1]));
- queryGeom.addPoint(new Point(coords[2],coords[3]));
-
- if(queryGeom.count() == 2){
- callback(that.geomTarget,queryGeom);
- var ind = getMapObjIndexByName("mapframe1");
- var el = mb_mapObj[ind].getDomElement();
- $(el).unbind("mousedown")
- .unbind("mouseover")
- .unbind("mouseup")
- .unbind("mousemove");
- queryGeom = null;
- }
- else{
- callback(that.geomTarget,queryGeom);
- }
- }
- }
+ if(!map_el.ownerDocument.getElementById(myMapObj.elementName+"_measure_display")){
+ //create Box Elements
+ var el_top = map_el.ownerDocument.createElement("div");
+ el_top.style.position = "absolute";
+ el_top.style.top = "0px";
+ el_top.style.left = "0px";
+ el_top.style.zIndex = "510";
+ el_top.id = myMapObj.elementName+"_measure_display";
+ map_el.appendChild(el_top);
+ }
+
+
+ this.getGeometry = function(queryType,callbackFunction){
+ var target = this.geomTarget;
+ s = new Snapping(this.geomTarget);
+ callback = callbackFunction;
+
+ var ind = getMapObjIndexByName(target);
+ var el = mb_mapObj[ind].getDomElement();
+ $(el).unbind("mousedown")
+ .unbind("mouseover")
+ .unbind("mouseup")
+ .unbind("mousemove");
+ if (queryType == "point") {
+ if ($.extend(myMapObj).defaultTouch) {
+ $.extend(myMapObj).defaultTouch.deactivate();
+ }
+ queryGeom = new Geometry(geomType.point);
+ $(el).mousedown(function (e) {
+ realWorldPos = mapToReal(target,myMapObj.getMousePosition(e));
+ queryGeom.addPoint(realWorldPos);
+ callback(target, queryGeom);
+ $(el).unbind("mousedown")
+ .unbind("mouseover")
+ .unbind("mouseup")
+ .unbind("mousemove");
+ queryGeom = null;
+ if ($.extend(myMapObj).defaultTouch) {
+ $.extend(myMapObj).defaultTouch.activate();
+ }
+ });
+ }
+ else if (queryType == "polygon") {
+ if ($.extend(myMapObj).defaultTouch) {
+ $.extend(myMapObj).defaultTouch.deactivate();
+ }
+ queryGeom = new Geometry(geomType.polygon);
+ if(isTouchable){
+ $(el).mousedown(function (e) {
+ wfsSpatialRequestStart(e);
+ })
+ } else {
+ $(el).mousedown(function (e) {
+ wfsSpatialRequestStart(e);
+ }).mousemove(function (e) {
+ wfsSpatialRequestRun(e);
+ });
+ }
+
+ }
+ else if (queryType == "rectangle") {
+ if(isTouchable) {
+ if ($.extend(myMapObj).defaultTouch) {
+ $.extend(myMapObj).defaultTouch.deactivate();
+ }
+ box = new Mapbender.BoxMobile({
+ target: geomTarget
+ });
+ touch = new selAreaTouch(myMapObj,$(myMapObj.getDomElement()), myMapObj.getDomElement(), box);
+ touch.activate();
+ queryGeom = new Geometry(geomType.line);
+// $(el).mousedown(function (e) {
+// box.start(e);
+// return false;
+// }).mouseup(function (e) {
+// var targetMap = Mapbender.modules[that.geomTarget];
+// if (!targetMap) {
+// return false;
+// }
+// box.stop(e, function (extent) {
+// if (typeof extent === "undefined") {
+// return false;
+// }
+// if (extent.constructor === Mapbender.Extent) {
+// queryGeom = new Geometry(geomType.line);
+// queryGeom.addPoint(extent.min);
+// queryGeom.addPoint(extent.max);
+// queryGeom.close();
+// callback(that.geomTarget,queryGeom);
+//
+// $(el)
+// .css("cursor", "default")
+// .unbind("mousedown")
+// .unbind("mouseup")
+// .unbind("mousemove");
+// box = null;
+//
+// }
+// });
+// return false;
+//
+// });
+ } else {
+ box = new Mapbender.Box({
+ target: geomTarget
+ });
+ queryGeom = new Geometry(geomType.line);
+ $(el).mousedown(function (e) {
+ box.start(e);
+ return false;
+ }).mouseup(function (e) {
+ var targetMap = Mapbender.modules[that.geomTarget];
+ if (!targetMap) {
+ return false;
+ }
+ box.stop(e, function (extent) {
+ if (typeof extent === "undefined") {
+ return false;
+ }
+ if (extent.constructor === Mapbender.Extent) {
+ queryGeom = new Geometry(geomType.line);
+ queryGeom.addPoint(extent.min);
+ queryGeom.addPoint(extent.max);
+ queryGeom.close();
+ callback(that.geomTarget,queryGeom);
+
+ $(el)
+ .css("cursor", "default")
+ .unbind("mousedown")
+ .unbind("mouseup")
+ .unbind("mousemove");
+ box = null;
+
+ }
+ });
+ return false;
+
+ });
+ }
+
+ }
+ else if (queryType == "extent") {
+ queryGeom = new Geometry(geomType.line);
+ var ind = getMapObjIndexByName(target);
+ var p0 = mapToReal(target, new Point(0,0));
+ var p1 = mapToReal(target, new Point(mb_mapObj[ind].width,mb_mapObj[ind].height));
+ queryGeom.addPoint(p0);
+ queryGeom.addPoint(p1);
+ callback(target, queryGeom);
+ $(el).unbind("mousedown")
+ .unbind("mouseover")
+ .unbind("mouseup")
+ .unbind("mousemove");
+
+ queryGeom = null;
+ }
+
+ }
+
+ var s;
+ var callback;
+
+ var wfsSpatialRequestStart = function(e){
+ this.geomTarget = geomTarget;
+ var that = this;
+ var realWorldPos;
+ if(isTouchable) {
+ if (queryGeom.count() >= 3) {
+ var pos = myMapObj.getMousePosition(e);
+ s.check(pos);
+ }
+ }
+ if (s.isSnapped() == true) {
+ realWorldPos = s.getSnappedPoint();
+ s.clean();
+ }
+ else {
+ realWorldPos = mapToReal(that.geomTarget,myMapObj.getMousePosition(e));
+ }
+ queryGeom.addPoint(realWorldPos);
+
+ if (queryGeom.count() == 1) {
+ s.add(queryGeom.get(0));
+ }
+ if (s.isSnapped() && queryGeom.count() >= 3 && queryGeom.get(-1).equals(queryGeom.get(0))) {
+ queryGeom.close();
+ callback(that.geomTarget,queryGeom);
+ writeTag(myMapObj.frameName, myMapObj.elementName+"_request_geometry_polygon", "");
+ writeTag(myMapObj.frameName, myMapObj.elementName+"_measure_display", "");
+ var ind = getMapObjIndexByName("mapframe1");
+ var el = mb_mapObj[ind].getDomElement();
+ $(el).unbind("mousedown")
+ .unbind("mouseover")
+ .unbind("mouseup")
+ .unbind("mousemove");
+ queryGeom = null;
+ if ($.extend(myMapObj).defaultTouch) {
+ $.extend(myMapObj).defaultTouch.activate();
+ }
+ return;
+ }
+ drawDashedLineExt();
+ }
+
+ var wfsSpatialRequestRun = function(e){
+ this.geomTarget = geomTarget;
+ var that = this;
+ if (queryGeom.count() >= 3) {
+ var pos = myMapObj.getMousePosition(e);
+ s.check(pos);
+ }
+ }
+
+ var drawDashedLineExt = function(e){
+ this.geomTarget = geomTarget;
+ var that = this;
+ var ind = getMapObjIndexByName(that.geomTarget);
+ var str_mPoints = "<div style='position:absolute;left:0px;top:0px' ><img src='"+mb_trans.src+"' width='"+mb_mapObj[ind].width+"' height='0'></div>";
+ str_mPoints += "<div style='position:absolute;left:0px;top:0px' ><img src='"+mb_trans.src+"' width='0' height='"+mb_mapObj[ind].height+"'></div>";
+ if (queryGeom != null) {
+ for(var i=0; i<queryGeom.count(); i++){
+ var pos = realToMap(that.geomTarget,queryGeom.get(i));
+ str_mPoints += "<div style='font-size:1px;position:absolute;top:"+(pos.y-2)+"px;left:"+(pos.x-2)+"px;width:3px;height:3px;background-color:#ff0000'></div>";
+ }
+ if(queryGeom.count()>1){
+ for(var k=1; k<queryGeom.count(); k++){
+ var pos0 = realToMap(that.geomTarget,queryGeom.get(k));
+ var pos1 = realToMap(that.geomTarget,queryGeom.get(k-1));
+ str_mPoints += evaluateDashesExt(pos1,pos0,k);
+ }
+ }
+ }
+ writeTag(myMapObj.frameName, myMapObj.elementName+"_request_geometry_polygon", str_mPoints);
+ }
+
+ var evaluateDashesExt = function(p1,p0,count){
+ this.geomTarget = geomTarget;
+ var that = this;
+ var ind = getMapObjIndexByName(that.geomTarget);
+ var str_dashedLine = "";
+ var d = p0.dist(p1);
+ var n = Math.round(d);
+ var s = p0.minus(p1).dividedBy(n);
+ for(var i=1; i<n; i++){
+ var currPoint = p1.plus(s.times(i)).minus(new Point(2,2)).round(0);
+ if(currPoint.x >= 0 && currPoint.x <= mb_mapObj[ind].width && currPoint.y >= 0 && currPoint.y <= mb_mapObj[ind].height){
+ str_dashedLine += "<div style='font-size:1px;position:absolute;top:"+currPoint.y+"px;left:"+currPoint.x+"px;width:3px;height:3px;background-color:#ff0000'></div>";
+ }
+ }
+ return str_dashedLine;
+ }
+
+ var selAreaExtInit = function(e){
+ mb_isBF = that.geomTarget;
+ mb_zF = that.geomTarget;
+ }
+
+ var selAreaExtGet = function(e){
+ selAreaExtSetValidClipping(mod_box_stop(e));
+ mb_isBF = that.geomTarget;
+ mb_zF = that.geomTarget;
+ }
+
+ var selAreaExtSetValidClipping = function(coords){
+ this.geomTarget = geomTarget;
+ var that = this;
+ if (queryGeom != null) {
+ queryGeom.addPoint(new Point(coords[0],coords[1]));
+ queryGeom.addPoint(new Point(coords[2],coords[3]));
+
+ if(queryGeom.count() == 2){
+ callback(that.geomTarget,queryGeom);
+ var ind = getMapObjIndexByName("mapframe1");
+ var el = mb_mapObj[ind].getDomElement();
+ $(el).unbind("mousedown")
+ .unbind("mouseover")
+ .unbind("mouseup")
+ .unbind("mousemove");
+ queryGeom = null;
+ }
+ else{
+ callback(that.geomTarget,queryGeom);
+ }
+ }
+ }
+
+ function selAreaTouch(map, $map, mapDom, box){
+ this.map = map;
+ this.$elm = $map;
+ this.elm = mapDom;
+ this.box = box;
+ this.startPos = null;
+ this.activate = function() {
+ this.elm.addEventListener("touchstart", touch.startTouch, true);
+ this.elm.addEventListener("touchmove", touch.moveTouch, true);
+ this.elm.addEventListener("touchend", touch.endTouch, true);
+ }
+ this.deactivate = function() {
+ this.elm.removeEventListener("touchstart", touch.startTouch, true);
+ this.elm.removeEventListener("touchmove", touch.moveTouch, true);
+ this.elm.removeEventListener("touchend", touch.endTouch, true);
+ }
+ this.startTouch = function(event) {
+ event.preventDefault();
+ var elm = findElement(event, "");
+ if (isSingleTouch(event)) {
+ touch.startPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ var stopPos = new Point(touch.startPos.x, touch.startPos.y);
+ touch.box.start(touch.startPos, stopPos);
+ } else if (isMultiTouch(event)) {
+ var startPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ var stopPos = new Point(
+ event.touches[1].pageX - touch.$elm.offset().left,
+ event.touches[1].pageY - touch.$elm.offset().top);
+ touch.box.start(startPos, stopPos);
+ }
+ return true;
+ }
+ this.moveTouch = function(event) {
+ event.preventDefault();
+ var elm = findElement(event, "");
+ if (isSingleTouch(event)) {
+ var stopPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ touch.box.run(touch.startPos, stopPos);
+ } else if (isMultiTouch(event)) {
+ var startPos = new Point(
+ event.touches[0].pageX - touch.$elm.offset().left,
+ event.touches[0].pageY - touch.$elm.offset().top);
+ var stopPos = new Point(
+ event.touches[1].pageX - touch.$elm.offset().left,
+ event.touches[1].pageY - touch.$elm.offset().top);
+ touch.box.run(startPos, stopPos);
+ }
+ return true;
+ }
+ this.endTouch = function(event) {
+ box = null;
+ touch.deactivate();
+ if ($.extend(myMapObj).defaultTouch) {
+ $.extend(myMapObj).defaultTouch.activate();
+ }
+ return touch.box.stop(
+ function (extent) {
+ if (typeof extent === "undefined") {
+ return false;
+ }
+ if (extent.constructor === Mapbender.Extent) {
+ queryGeom = new Geometry(geomType.line);
+ queryGeom.addPoint(extent.min);
+ queryGeom.addPoint(extent.max);
+ queryGeom.close();
+ callback(that.geomTarget,queryGeom);
+ }
+ }
+ );
+ touch.box = null;
+ touch = null;
+ }
+
+ function findElement(event, tagName) {
+ var element = getElement(event);
+ while (element.parentNode && (!element.tagName ||
+ (element.tagName.toUpperCase() != tagName.toUpperCase()))){
+ element = element.parentNode;
+ return element;
+ }
+ }
+ function getElement(event) {
+ return event.target || event.srcElement;
+ }
+ function isSingleTouch (event) {
+ return event.touches && event.touches.length == 1;
+ }
+ function isMultiTouch(event) {
+ return event.touches && event.touches.length > 1;
+ }
+ }
}
More information about the Mapbender_commits
mailing list