aboutsummaryrefslogtreecommitdiffstats
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/css.css5
-rwxr-xr-xweb/index.cgi4
-rw-r--r--web/js.js169
-rw-r--r--web/yui/utilities.js4
4 files changed, 70 insertions, 112 deletions
diff --git a/web/css.css b/web/css.css
index 552a5f1ff..af4b907c0 100644
--- a/web/css.css
+++ b/web/css.css
@@ -181,12 +181,15 @@ fieldset div.checkbox label, label.n {
overflow: hidden;
float: right;
position: relative;
+ background-color: #f1f1f1;
}
#drag {
- position: relative;
+ position: absolute;
width: 508px;
height: 508px;
+ left: 0;
+ top: 0;
}
#side {
diff --git a/web/index.cgi b/web/index.cgi
index 10acae833..90fa62741 100755
--- a/web/index.cgi
+++ b/web/index.cgi
@@ -6,7 +6,7 @@
# Copyright (c) 2006 UK Citizens Online Democracy. All rights reserved.
# Email: matthew@mysociety.org. WWW: http://www.mysociety.org
#
-# $Id: index.cgi,v 1.52 2007-01-19 16:57:28 matthew Exp $
+# $Id: index.cgi,v 1.53 2007-01-19 23:16:54 matthew Exp $
# TODO
# Nothing is done about the update checkboxes - not stored anywhere on anything!
@@ -97,7 +97,7 @@ like graffiti, fly tipping, broken paving slabs, or street lighting</p>
EOF
$out .= '<p id="error">' . $error . 'Please try again.</p>' if ($error);
$out .= <<EOF;
-<form action="./" method="get" id="postcodeForm">
+<form action="./" method="post" id="postcodeForm">
<label for="pc">Enter a nearby postcode or street name:</label>
&nbsp;<input type="text" name="pc" value="$pc_h" id="pc" size="10" maxlength="200">
&nbsp;<input type="submit" value="Go">
diff --git a/web/js.js b/web/js.js
index 3c822feb8..47b8a49ee 100644
--- a/web/js.js
+++ b/web/js.js
@@ -3,16 +3,38 @@
* Neighbourhood Fix-It JavaScript
*
* TODO
- * Run all this onDocumentReady rather than onLoad
* Investigate jQuery
- * Stop annoying flickers/map spasms when dragging
* Tidy it all up
+ * Don't wrap around tiles as it's quite confusing if the tile server is slow to respond
* Selection of pin doesn't really need a server request, but I don't really care
*
*/
+YAHOO.util.Event.onContentReady('compass', function() {
+ var points = this.getElementsByTagName('a');
+ points[1].onclick = function() { pan(0, tileheight); return false; };
+ points[3].onclick = function() { pan(tilewidth, 0); return false; };
+ points[4].onclick = function() { pan(-tilewidth, 0); return false; };
+ points[6].onclick = function() { pan(0, -tileheight); return false; };
+ points[0].onclick = function() { pan(tilewidth, tileheight); return false; };
+ points[2].onclick = function() { pan(-tilewidth, tileheight); return false; };
+ points[5].onclick = function() { pan(tilewidth, -tileheight); return false; };
+ points[7].onclick = function() { pan(-tilewidth, -tileheight); return false; };
+});
+
+YAHOO.util.Event.onContentReady('mapForm', function() {
+ this.onsubmit = function() {
+ this.x.value = x + 2;
+ this.y.value = y + 2;
+ return true;
+ }
+});
-window.onload = onLoad;
+var in_drag;
+YAHOO.util.Event.onContentReady('drag', function() {
+ var dragO = new YAHOO.util.DDMap('map');
+ update_tiles(0, 0, false, true);
+});
// I love the global
var tile_x = 0;
@@ -20,52 +42,17 @@ var tile_y = 0;
var tilewidth = 254;
var tileheight = 254;
-var in_drag;
-function onLoad() {
- var compass = document.getElementById('compass');
- if (compass) {
- var points = compass.getElementsByTagName('a');
- points[1].onclick = function() { pan(0, tileheight); return false; };
- points[3].onclick = function() { pan(tilewidth, 0); return false; };
- points[4].onclick = function() { pan(-tilewidth, 0); return false; };
- points[6].onclick = function() { pan(0, -tileheight); return false; };
- points[0].onclick = function() { pan(tilewidth, tileheight); return false; };
- points[2].onclick = function() { pan(-tilewidth, tileheight); return false; };
- points[5].onclick = function() { pan(tilewidth, -tileheight); return false; };
- points[7].onclick = function() { pan(-tilewidth, -tileheight); return false; };
- }
-
- var drag = document.getElementById('drag');
- var form = document.getElementById('mapForm');
- if (form) form.onsubmit = form_submit;
- if (drag) {
- var inputs = drag.getElementsByTagName('input');
- update_tiles(0, 0, false, true);
- var map = document.getElementById('map');
- map.onmousedown = drag_start;
- document.onmouseout = drag_end_out;
+function drag_check(e) {
+ if (in_drag) {
+ in_drag=false;
+ return false;
}
-}
-
-/*
- var targ = '';
- if (!e) e = window.event;
- if (e.target) targ = e.target;
- else if (e.srcElement) targ = e.srcElement;
- if (targ.nodeType == 3) // defeat Safari bug
- targ = targ.parentNode;
-*/
-
-function form_submit() {
- this.x.value = x + 2;
- this.y.value = y + 2;
return true;
}
function image_rotate(i, j, x, y) {
var id = 't' + i + '.' + j;
var img = document.getElementById(id);
- // img.src = '/i/grey.gif';
if (x)
img.style.left = (img.offsetLeft + x*tilewidth) + 'px';
if (y)
@@ -76,7 +63,8 @@ var myAnim;
function pan(x, y) {
if (!myAnim || !myAnim.isAnimated()) {
update_tiles(x, y, true, false);
- myAnim = new YAHOO.util.Motion('drag', { points:{by:[x,y]} }, 1, YAHOO.util.Easing.easeBoth);
+ myAnim = new YAHOO.util.Motion('drag', { points:{by:[x,y]} }, 10, YAHOO.util.Easing.easeOut);
+ myAnim.useSeconds = false;
myAnim.animate();
}
}
@@ -167,76 +155,12 @@ function urls_loaded(o) {
}
}
-// Floor always closer to 0
-function floor(n) {
- if (n>=0) return Math.floor(n);
- return Math.ceil(n);
-}
-
// Mod always to positive result
function mod(m, n) {
if (m>=0) return m % n;
return (m % n) + n;
}
-/* Dragging */
-
-var last_mouse_pos = {};
-var mouse_pos = {};
-
-function drag_move(e) {
- if (!e) var e = window.event;
- var point = get_posn(e);
- if (point == mouse_pos) return false;
- in_drag = true;
- last_mouse_pos = mouse_pos;
- mouse_pos = point;
- var dx = mouse_pos.x-last_mouse_pos.x;
- var dy = mouse_pos.y-last_mouse_pos.y;
- update_tiles(dx, dy, false, false);
- return false;
-}
-
-function drag_check() {
- if (in_drag) {
- in_drag=false;
- return false;
- }
- return true;
-}
-
-function drag_start(e) {
- if (!e) var e = window.event;
- mouse_pos = get_posn(e);
- setCursor('move');
- document.onmousemove = drag_move;
- document.onmouseup = drag_end;
- return false;
-}
-
-function drag_end(e) {
- if (!e) var e = window.event;
- if (e.stopPropagation) e.stopPropagation();
- document.onmousemove = null;
- document.onmouseup = null;
- setCursor('crosshair');
- //if (in_drag) return false; // XXX I don't understand!
-}
-
-function drag_end_out(e) {
- if (!e) var e = window.event;
- var relTarg;
- if (e.relatedTarget) { relTarg = e.relatedTarget; }
- else if (e.toElement) { relTarg = e.toElement; }
- if (!relTarg) {
- // mouse out to unknown = left the window?
- document.onmousemove = null;
- document.onmouseup = null;
- setCursor('crosshair');
- }
- return false;
-}
-
/* Called every mousemove, so on first call, overwrite itself with quicker version */
function get_posn(ev) {
var posx, posy;
@@ -267,3 +191,34 @@ function setCursor(s) {
}
}
+var mouse_pos = {};
+YAHOO.util.DDMap = function(id, sGroup, config) {
+ if (id) {
+ this.init(id, sGroup, config);
+ }
+};
+YAHOO.extend(YAHOO.util.DDMap, YAHOO.util.DD, {
+ scroll: false,
+ b4MouseDown: function(e) { },
+ b4StartDrag: function(x, y) { },
+ startDrag: function(x, y) {
+ mouse_pos = { x: x, y: y };
+ setCursor('move');
+ in_drag = true;
+ },
+ onDrag: function(e) {
+ var point = get_posn(e);
+ if (point == mouse_pos) return false;
+ var dx = point.x-mouse_pos.x;
+ var dy = point.y-mouse_pos.y;
+ mouse_pos = point;
+ update_tiles(dx, dy, false, false);
+ },
+ b4EndDrag: function(e) { },
+ endDrag: function(e) {
+ setCursor('crosshair');
+ },
+ toString: function() {
+ return ("DDMap " + this.id);
+ }
+});
diff --git a/web/yui/utilities.js b/web/yui/utilities.js
index 9d12134a8..bbf37f201 100644
--- a/web/yui/utilities.js
+++ b/web/yui/utilities.js
@@ -324,7 +324,7 @@ return false;},isTypeOfDD:function(oDD){return(oDD&&oDD.__ygDragDrop);},isHandle
return null;},handleMouseDown:function(e,oDD){this.currentTarget=YAHOO.util.Event.getTarget(e);this.dragCurrent=oDD;var el=oDD.getEl();this.startX=YAHOO.util.Event.getPageX(e);this.startY=YAHOO.util.Event.getPageY(e);this.deltaX=this.startX-el.offsetLeft;this.deltaY=this.startY-el.offsetTop;this.dragThreshMet=false;this.clickTimeout=setTimeout(function(){var DDM=YAHOO.util.DDM;DDM.startDrag(DDM.startX,DDM.startY);},this.clickTimeThresh);},startDrag:function(x,y){clearTimeout(this.clickTimeout);if(this.dragCurrent){this.dragCurrent.b4StartDrag(x,y);this.dragCurrent.startDrag(x,y);}
this.dragThreshMet=true;},handleMouseUp:function(e){if(!this.dragCurrent){return;}
clearTimeout(this.clickTimeout);if(this.dragThreshMet){this.fireEvents(e,true);}else{}
-this.stopDrag(e);this.stopEvent(e);},stopEvent:function(e){if(this.stopPropagation){YAHOO.util.Event.stopPropagation(e);}
+this.stopDrag(e);/* MPS 2007-01-19 this.stopEvent(e); */},stopEvent:function(e){if(this.stopPropagation){YAHOO.util.Event.stopPropagation(e);}
if(this.preventDefault){YAHOO.util.Event.preventDefault(e);}},stopDrag:function(e){if(this.dragCurrent){if(this.dragThreshMet){this.dragCurrent.b4EndDrag(e);this.dragCurrent.endDrag(e);}
this.dragCurrent.onMouseUp(e);}
this.dragCurrent=null;this.dragOvers={};},handleMouseMove:function(e){if(!this.dragCurrent){return true;}
@@ -375,4 +375,4 @@ this.setDragElPos(iPageX,iPageY);YAHOO.util.Dom.setStyle(dragEl,"visibility","vi
if(isNaN(br)){br=0;}
if(isNaN(bb)){bb=0;}
if(isNaN(bl)){bl=0;}
-var newWidth=Math.max(0,el.offsetWidth-br-bl);var newHeight=Math.max(0,el.offsetHeight-bt-bb);DOM.setStyle(dragEl,"width",newWidth+"px");DOM.setStyle(dragEl,"height",newHeight+"px");}},b4MouseDown:function(e){var x=YAHOO.util.Event.getPageX(e);var y=YAHOO.util.Event.getPageY(e);this.autoOffset(x,y);this.setDragElPos(x,y);},b4StartDrag:function(x,y){this.showFrame(x,y);},b4EndDrag:function(e){YAHOO.util.Dom.setStyle(this.getDragEl(),"visibility","hidden");},endDrag:function(e){var DOM=YAHOO.util.Dom;var lel=this.getEl();var del=this.getDragEl();DOM.setStyle(del,"visibility","");DOM.setStyle(lel,"visibility","hidden");YAHOO.util.DDM.moveToEl(lel,del);DOM.setStyle(del,"visibility","hidden");DOM.setStyle(lel,"visibility","");},toString:function(){return("DDProxy "+this.id);}});YAHOO.util.DDTarget=function(id,sGroup,config){if(id){this.initTarget(id,sGroup,config);}};YAHOO.extend(YAHOO.util.DDTarget,YAHOO.util.DragDrop,{toString:function(){return("DDTarget "+this.id);}}); \ No newline at end of file
+var newWidth=Math.max(0,el.offsetWidth-br-bl);var newHeight=Math.max(0,el.offsetHeight-bt-bb);DOM.setStyle(dragEl,"width",newWidth+"px");DOM.setStyle(dragEl,"height",newHeight+"px");}},b4MouseDown:function(e){var x=YAHOO.util.Event.getPageX(e);var y=YAHOO.util.Event.getPageY(e);this.autoOffset(x,y);this.setDragElPos(x,y);},b4StartDrag:function(x,y){this.showFrame(x,y);},b4EndDrag:function(e){YAHOO.util.Dom.setStyle(this.getDragEl(),"visibility","hidden");},endDrag:function(e){var DOM=YAHOO.util.Dom;var lel=this.getEl();var del=this.getDragEl();DOM.setStyle(del,"visibility","");DOM.setStyle(lel,"visibility","hidden");YAHOO.util.DDM.moveToEl(lel,del);DOM.setStyle(del,"visibility","hidden");DOM.setStyle(lel,"visibility","");},toString:function(){return("DDProxy "+this.id);}});YAHOO.util.DDTarget=function(id,sGroup,config){if(id){this.initTarget(id,sGroup,config);}};YAHOO.extend(YAHOO.util.DDTarget,YAHOO.util.DragDrop,{toString:function(){return("DDTarget "+this.id);}});
generated by cgit v1.2.3 (git 2.25.1) at 2025-07-13 03:04:47 +0000