mirror of
https://github.com/FoggedLens/iD.git
synced 2026-02-13 01:02:58 +00:00
Selection-style rendering, no more uis
This commit is contained in:
@@ -3,7 +3,6 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>iD</title>
|
||||
<!-- load Dojo -->
|
||||
<link rel="stylesheet" href="css/app.css">
|
||||
</head>
|
||||
<body class="claro">
|
||||
@@ -15,6 +14,7 @@
|
||||
<script type="text/javascript" src="js/iD/Taginfo.js"></script>
|
||||
|
||||
<script type="text/javascript" src="js/iD/controller/controller.js"></script>
|
||||
|
||||
<script type="text/javascript" src="js/iD/controller/edit/edit.js"></script>
|
||||
<script type="text/javascript" src="js/iD/controller/edit/EditBaseState.js"></script>
|
||||
<script type="text/javascript" src="js/iD/controller/edit/NoSelection.js"></script>
|
||||
@@ -23,9 +23,6 @@
|
||||
<script type="text/javascript" src="js/iD/controller/edit/SelectedWayNode.js"></script>
|
||||
|
||||
<script type="text/javascript" src="js/iD/renderer/renderer.js"></script>
|
||||
<script type="text/javascript" src="js/iD/renderer/EntityUI.js"></script>
|
||||
<script type="text/javascript" src="js/iD/renderer/WayUI.js"></script>
|
||||
<script type="text/javascript" src="js/iD/renderer/NodeUI.js"></script>
|
||||
<script type="text/javascript" src="js/iD/renderer/Map.js"></script>
|
||||
|
||||
<script type="text/javascript" src="js/iD/Node.js"></script>
|
||||
|
||||
@@ -16,6 +16,10 @@ iD.Connection = function(apiURL) {
|
||||
|
||||
var connection = {};
|
||||
|
||||
function all() {
|
||||
return _.values(entities);
|
||||
}
|
||||
|
||||
function assign(obj) {
|
||||
// summary: Save an entity to the data store.
|
||||
if (obj.entityType === 'node' || obj.entityType === 'way') {
|
||||
@@ -154,6 +158,7 @@ iD.Connection = function(apiURL) {
|
||||
}
|
||||
|
||||
connection.entities = entities;
|
||||
connection.all = all;
|
||||
connection.relations = relations;
|
||||
connection.loadFromAPI = loadFromAPI;
|
||||
connection.loadFromURL = loadFromURL;
|
||||
|
||||
@@ -79,14 +79,11 @@ iD.renderer.Map.prototype = {
|
||||
|
||||
div: '', // <div> of this map
|
||||
surface: null, // <div>.surface containing the rendering
|
||||
container: null, // root-level group within the surface
|
||||
backdrop: null, // coloured backdrop (MapCSS canvas element)
|
||||
connection: null, // data store
|
||||
container: null, // root-level group within the surface
|
||||
connection: null, // data store
|
||||
controller: null, // UI controller
|
||||
uis: {},
|
||||
|
||||
tilegroup: null, // group within container for adding bitmap tiles
|
||||
tiles: {}, // index of tile objects
|
||||
tilebaseURL: 'http://ecn.t0.tiles.virtualearth.net/tiles/a$quadkey.jpeg?g=587&mkt=en-gb&n=z', // Bing imagery URL
|
||||
|
||||
height: NaN, // size of map object in pixels
|
||||
@@ -104,38 +101,6 @@ iD.renderer.Map.prototype = {
|
||||
this.controller = controller;
|
||||
},
|
||||
|
||||
createUI: function(e, stateClasses) {
|
||||
// summary: Create a UI (sprite) for an entity, assigning any specified state classes
|
||||
// (temporary attributes such as ':hover' or ':selected')
|
||||
if (!this.uis[e.id]) {
|
||||
if (e.entityType === 'node') {
|
||||
this.uis[e.id] = new iD.renderer.NodeUI(e, this, stateClasses);
|
||||
} else if (e.entityType === 'way') {
|
||||
this.uis[e.id] = new iD.renderer.WayUI(e, this, stateClasses);
|
||||
}
|
||||
} else {
|
||||
this.uis[e.id].setStateClasses(stateClasses).redraw();
|
||||
}
|
||||
},
|
||||
|
||||
getUI: function(e) {
|
||||
// summary: Return the UI for an entity, if it exists.
|
||||
return this.uis[e.id]; // iD.renderer.EntityUI
|
||||
},
|
||||
|
||||
refreshUI: function(e) {
|
||||
// summary: Redraw the UI for an entity.
|
||||
if (this.uis[e.id]) { this.uis[e.id].redraw(); }
|
||||
},
|
||||
|
||||
deleteUI: function(e) {
|
||||
// summary: Delete the UI for an entity.
|
||||
if (this.uis[e.id]) {
|
||||
this.uis[e.id].removeSprites();
|
||||
delete this.uis[e.id];
|
||||
}
|
||||
},
|
||||
|
||||
download: _.debounce(function() {
|
||||
// summary: Ask the connection to download data for the current viewport.
|
||||
this.connection.loadFromAPI(this.extent(), _.bind(this.updateUIs, this));
|
||||
@@ -151,34 +116,90 @@ iD.renderer.Map.prototype = {
|
||||
// summary: Draw/refresh all EntityUIs within the bbox, and remove any others.
|
||||
// redraw: Boolean Should we redraw any UIs that are already present?
|
||||
// remove: Boolean Should we delete any UIs that are no longer in the bbox?
|
||||
var o = this.connection.getObjectsByBbox(this.extent());
|
||||
|
||||
var touch = _(o).chain()
|
||||
.filter(function(w) { return w.loaded; })
|
||||
.map(_.bind(function(e) {
|
||||
if (!this.uis[e.id]) {
|
||||
this.createUI(e);
|
||||
} else {
|
||||
this.uis[e.id].draw();
|
||||
function classes(d) {
|
||||
var tags = d.tags;
|
||||
var c = [];
|
||||
function clean(x) {
|
||||
return x.indexOf(' ') === -1 && x.length < 30;
|
||||
}
|
||||
for (var k in tags) {
|
||||
var v = tags[k];
|
||||
if (!clean(k) || !clean(v)) {
|
||||
continue;
|
||||
}
|
||||
return '' + e.id;
|
||||
}, this)).value();
|
||||
c.push(k + '-' + v);
|
||||
c.push(k);
|
||||
c.push(v);
|
||||
}
|
||||
return c.join(' ');
|
||||
}
|
||||
|
||||
_.each(_.difference(_.keys(this.uis), touch), _.bind(function(k) {
|
||||
this.deleteUI(k);
|
||||
}, this));
|
||||
var linegen = this.linegen;
|
||||
|
||||
var all = this.connection.all();
|
||||
|
||||
function key(d) { return d._id; }
|
||||
|
||||
var ways = all.filter(function(a) {
|
||||
return a.entityType === 'way' && !a.isClosed();
|
||||
});
|
||||
|
||||
var areas = all.filter(function(a) {
|
||||
return a.entityType === 'way' && a.isClosed();
|
||||
});
|
||||
|
||||
var fills = this.layers[0].fill.selectAll('path.area')
|
||||
.data(areas, key);
|
||||
|
||||
fills.enter().append('path')
|
||||
.attr('class', function(d) {
|
||||
return 'area ' + classes(d);
|
||||
});
|
||||
fills.exit().remove();
|
||||
fills.attr("d", function(d) {
|
||||
return linegen(d.nodes);
|
||||
});
|
||||
|
||||
var casings = this.layers[0].casing.selectAll('path.casing')
|
||||
.data(ways, key);
|
||||
|
||||
casings.enter().append('path')
|
||||
.attr('class', function(d) {
|
||||
return 'casing ' + classes(d);
|
||||
});
|
||||
casings.exit().remove();
|
||||
casings.attr("d", function(d) {
|
||||
return linegen(d.nodes);
|
||||
});
|
||||
|
||||
var strokes = this.layers[0].stroke.selectAll('path.stroke')
|
||||
.data(ways, key);
|
||||
|
||||
strokes.enter().append('path')
|
||||
.attr('class', function(d) {
|
||||
return 'stroke ' + classes(d);
|
||||
});
|
||||
strokes.exit().remove();
|
||||
strokes.attr("d", function(d) {
|
||||
return linegen(d.nodes);
|
||||
});
|
||||
},
|
||||
|
||||
// -------------
|
||||
// Zoom handling
|
||||
zoomIn: function() {
|
||||
// summary: Zoom in by one level (unless maximum reached).
|
||||
return this.setZoom(this.zoom + 1);
|
||||
return this.setZoom(this.getZoom() + 1);
|
||||
},
|
||||
|
||||
zoomOut: function() {
|
||||
// summary: Zoom out by one level (unless minimum reached).
|
||||
return this.setZoom(this.zoom - 1);
|
||||
return this.setZoom(this.getZoom() - 1);
|
||||
},
|
||||
|
||||
getZoom: function(zoom) {
|
||||
var s = this.projection.scale();
|
||||
return Math.max(Math.log(s) / Math.log(2) - 8, 0);
|
||||
},
|
||||
|
||||
setZoom: function(zoom) {
|
||||
|
||||
Reference in New Issue
Block a user