mirror of
https://github.com/FoggedLens/iD.git
synced 2026-02-12 16:52:50 +00:00
Cleanup, work on style
This commit is contained in:
@@ -10,46 +10,49 @@ declare("iD.controller.edit.SelectedWayNode", [iD.controller.edit.EditBaseState]
|
||||
node: null,
|
||||
way: null,
|
||||
|
||||
constructor:function(_node,_way) {
|
||||
constructor:function(node, way) {
|
||||
// summary: In 'Edit object' mode and a node in a way is selected.
|
||||
this.node=_node;
|
||||
this.way=_way;
|
||||
this.node = node;
|
||||
this.way = way;
|
||||
},
|
||||
enterState:function() {
|
||||
var map=this.controller.map;
|
||||
map.getUI(this.way ).setStateClass('shownodes').redraw();
|
||||
map.getUI(this.way).setStateClass('shownodes').redraw();
|
||||
map.getUI(this.node).setStateClass('selected' ).redraw();
|
||||
this.openEditorTooltip(map.lon2screen(this.node.lon),
|
||||
map.lat2screen(this.node.lat), this.node);
|
||||
},
|
||||
exitState:function() {
|
||||
var map=this.controller.map;
|
||||
map.getUI(this.way ).resetStateClass('shownodes').redraw();
|
||||
map.getUI(this.way).resetStateClass('shownodes').redraw();
|
||||
map.getUI(this.node).resetStateClass('selected' ).redraw();
|
||||
this.closeEditorTooltip();
|
||||
},
|
||||
|
||||
processMouseEvent:function(event,entityUI) {
|
||||
var entity=entityUI ? entityUI.entity : null;
|
||||
var entityType=entity ? entity.entityType : null;
|
||||
this.closeEditorTooltip();
|
||||
},
|
||||
|
||||
processMouseEvent:function(event,entityUI) {
|
||||
if (event.type !== 'click') return;
|
||||
var entity = entityUI ? entityUI.entity : null;
|
||||
var entityType = entity ? entity.entityType : null;
|
||||
|
||||
switch (entityType) {
|
||||
case null:
|
||||
return new iD.controller.edit.NoSelection();
|
||||
case 'node':
|
||||
var ways = entity.entity.parentWays();
|
||||
if (entity.entity.hasParent(this.way)) {
|
||||
return new iD.controller.edit.SelectedWayNode(entity,this.way);
|
||||
} else if (!ways.length) {
|
||||
return new iD.controller.edit.SelectedPOINode(entity);
|
||||
} else {
|
||||
return new iD.controller.edit.SelectedWayNode(entity,ways[0]);
|
||||
}
|
||||
break;
|
||||
case 'way':
|
||||
return new iD.controller.edit.SelectedWay(entityUI.entity, event);
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
if (event.type=='click') {
|
||||
switch (entityType) {
|
||||
case null:
|
||||
return new iD.controller.edit.NoSelection();
|
||||
case 'node':
|
||||
var ways=entity.parentWays();
|
||||
if (entity.hasParent(this.way)) { return new iD.controller.edit.SelectedWayNode(entity,this.way); }
|
||||
else if (!ways.length) { return new iD.controller.edit.SelectedPOINode(entity); }
|
||||
else { return new iD.controller.edit.SelectedWayNode(entity,ways[0]); }
|
||||
break;
|
||||
case 'way':
|
||||
return new iD.controller.edit.SelectedWay(entityUI.entity, event);
|
||||
}
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
@@ -41,29 +41,57 @@ declare("iD.renderer.NodeUI", [iD.renderer.EntityUI], {
|
||||
w = p.icon_width ? p.icon_width : 16;
|
||||
h = p.icon_height ? p.icon_height: w;
|
||||
|
||||
// Draw icon
|
||||
var shape;
|
||||
switch (p.icon_image) {
|
||||
case 'square':shape=this.targetGroup('stroke',p.sublayer).createRect({ x:x-w/2, y:y-h/2, width:w, height:h }); break;
|
||||
case 'circle':shape=this.targetGroup('stroke',p.sublayer).createCircle({ cx:x, cy:y, r:w }); break;
|
||||
default:shape=this.targetGroup('stroke',p.sublayer).createImage({ width:w, height:h, x: x-w/2, y: y-h/2, src:p.icon_image }); break;
|
||||
}
|
||||
switch (p.icon_image) {
|
||||
case 'square':
|
||||
case 'circle': shape.setStroke(s.shapeStrokeStyler()).setFill(s.shapeFillStyler()); break;
|
||||
// Draw icon
|
||||
var shape;
|
||||
if (p.icon_image === 'square') shape = this.targetGroup('stroke', p.sublayer)
|
||||
.createRect({
|
||||
x: x-w/2,
|
||||
y: y-h/2,
|
||||
width: w,
|
||||
height: h
|
||||
});
|
||||
else if (p.icon_image === 'circle') shape = this.targetGroup('stroke', p.sublayer)
|
||||
.createCircle({
|
||||
cx: x,
|
||||
cy: y,
|
||||
r: w
|
||||
});
|
||||
else shape = this.targetGroup('stroke',p.sublayer)
|
||||
.createImage({
|
||||
width: w,
|
||||
height: h,
|
||||
x: x-w/2,
|
||||
y: y-h/2,
|
||||
src: p.icon_image
|
||||
});
|
||||
if (p.icon_image === 'square' || p.icon_image === 'circle') {
|
||||
shape.setStroke(s.shapeStrokeStyler()).setFill(s.shapeFillStyler());
|
||||
}
|
||||
this.recordSprite(shape);
|
||||
|
||||
// Add text label
|
||||
// Add hit-zone
|
||||
var hit;
|
||||
switch (p.icon_image) {
|
||||
case 'circle': hit=this.targetGroup('hit').createCircle({ cx:x, cy:y, r:w }); break;
|
||||
default: hit=this.targetGroup('hit').createRect({ x:x-w/2, y:y-h/2, width:w, height: h}); break;
|
||||
}
|
||||
hit.setFill([0,1,0,0]).setStroke( { width:2, color:[0,0,0,0] } );
|
||||
if (p.icon_image === 'circle') {
|
||||
hit = this.targetGroup('hit').createCircle({
|
||||
cx: x,
|
||||
cy: y,
|
||||
r: w
|
||||
});
|
||||
} else {
|
||||
hit = this.targetGroup('hit').createRect({
|
||||
x: x-w/2,
|
||||
y: y-h/2,
|
||||
width: w,
|
||||
height: h
|
||||
});
|
||||
}
|
||||
hit.setFill([0,1,0,0]).setStroke({
|
||||
width:2,
|
||||
color:[0,0,0,0]
|
||||
});
|
||||
this.recordSprite(hit);
|
||||
hit.source= this;
|
||||
hit.source = this;
|
||||
hit.connect("onclick", _.bind(this.entityMouseEvent, this));
|
||||
hit.connect("onmousedown", _.bind(this.entityMouseEvent, this));
|
||||
hit.connect("onmouseup", _.bind(this.entityMouseEvent, this));
|
||||
|
||||
@@ -137,15 +137,15 @@ way .highlighted { color: pink; }
|
||||
|
||||
way !:drawn { z-index:10; width: 1; color: black; }
|
||||
way::highlight :hover { z-index: 2; width: eval('_width+10'); color: #ffff99; }
|
||||
way::highlight :selected { z-index: 2; width: eval('_width+10'); color: yellow; opacity: 0.7;}
|
||||
way::highlight :selected { z-index: 2; width: eval('_width+5'); color: #FFF68D; }
|
||||
|
||||
node :selectedway { z-index: 9; icon-image: square; icon-width: 8; color: red; layer: 5; }
|
||||
node :selectedway { z-index: 9; icon-image: circle; icon-width: 7; color: #DD4848; layer: 5; }
|
||||
node::junction :junction :selectedway, node::junction :junction :hoverway { z-index: 8; icon-image: square; icon-width: 11; casing-color: black; casing-width: 1; layer: 5; }
|
||||
|
||||
node !:drawn :poi { z-index: 2; icon-image: circle; icon-width: 4; color: green; casing-color: black; casing-width: 1; }
|
||||
node !:drawn :poi { z-index: 2; icon-image: circle; icon-width: 6; color: #98D1FD; casing-color: #135485; casing-width: 2; }
|
||||
|
||||
node :hoverway { z-index: 9; icon-image: square; icon-width: 7; color: blue; layer: 5; }
|
||||
node::highlight :selected { z-index: 1; icon-image: square; icon-width: eval('_width+10'); color: yellow; }
|
||||
node::highlight :selected { z-index: 1; icon-image: circle; icon-width: eval('_width+5'); color: #FFF68D; }
|
||||
|
||||
/* Descendant selectors provide an easy way to style relations: this example means "any way
|
||||
which is part of a relation whose type=route". */
|
||||
|
||||
Reference in New Issue
Block a user