Move to iD.svg.TagClasses

This commit is contained in:
John Firebaugh
2013-01-11 11:22:48 -08:00
parent 7b092b7856
commit b8310e2d9f
10 changed files with 82 additions and 79 deletions
+2
View File
@@ -39,6 +39,8 @@ all: \
js/id/format/*.js \
js/id/graph/*.js \
js/id/renderer/*.js \
js/id/svg.js \
js/id/svg/*.js \
js/id/ui/*.js \
js/id/end.js
+1
View File
@@ -43,6 +43,7 @@
<script src="js/id/svg/midpoints.js"></script>
<script src="js/id/svg/points.js"></script>
<script src="js/id/svg/vertices.js"></script>
<script src="js/id/svg/tag_classes.js"></script>
<script src='js/id/ui/inspector.js'></script>
<script src='js/id/ui/modal.js'></script>
-29
View File
@@ -36,32 +36,3 @@ iD.Style.waystack = function(a, b) {
}
return as - bs;
};
iD.Style.TAG_CLASSES = iD.util.trueObj([
'highway', 'railway', 'motorway', 'amenity', 'natural',
'landuse', 'building', 'oneway', 'bridge'
]);
iD.Style.styleClasses = function() {
var tagClassRe = /^tag-/;
return function(selection) {
selection.each(function(d, i) {
var classes, value = this.className;
if (value.baseVal !== undefined) value = value.baseVal;
classes = value.trim().split(/\s+/).filter(function(name) {
return name.length && !tagClassRe.test(name);
});
var tags = d.tags;
for (var k in tags) {
if (!iD.Style.TAG_CLASSES[k]) continue;
classes.push('tag-' + k);
classes.push('tag-' + k + '-' + tags[k]);
}
return d3.select(this).attr('class', classes.join(' '));
});
};
};
+1 -1
View File
@@ -28,7 +28,7 @@ iD.svg.Areas = function() {
paths
.order()
.attr('d', lineString)
.call(iD.Style.styleClasses());
.call(iD.svg.TagClasses());
paths.exit()
.remove();
+1 -1
View File
@@ -33,7 +33,7 @@ iD.svg.Lines = function() {
paths
.order()
.attr('d', lineString)
.call(iD.Style.styleClasses());
.call(iD.svg.TagClasses());
paths.exit()
.remove();
+27
View File
@@ -0,0 +1,27 @@
iD.svg.TagClasses = function() {
var keys = iD.util.trueObj([
'highway', 'railway', 'motorway', 'amenity', 'natural',
'landuse', 'building', 'oneway', 'bridge'
]), tagClassRe = /^tag-/;
return function(selection) {
selection.each(function(d, i) {
var classes, value = this.className;
if (value.baseVal !== undefined) value = value.baseVal;
classes = value.trim().split(/\s+/).filter(function(name) {
return name.length && !tagClassRe.test(name);
});
var tags = d.tags;
for (var k in tags) {
if (!keys[k]) continue;
classes.push('tag-' + k);
classes.push('tag-' + k + '-' + tags[k]);
}
return d3.select(this).attr('class', classes.join(' '));
});
};
};
+3 -1
View File
@@ -45,6 +45,7 @@
<script src="../js/id/svg/midpoints.js"></script>
<script src="../js/id/svg/points.js"></script>
<script src="../js/id/svg/vertices.js"></script>
<script src="../js/id/svg/tag_classes.js"></script>
<script src='../js/id/ui/inspector.js'></script>
<script src='../js/id/ui/commit.js'></script>
@@ -137,7 +138,8 @@
<script src="spec/renderer/background.js"></script>
<script src="spec/renderer/hash.js"></script>
<script src="spec/renderer/map.js"></script>
<script src="spec/renderer/style.js"></script>
<script src="spec/svg/tag_classes.js"></script>
<script src="spec/ui/inspector.js"></script>
<script src="spec/ui/geocoder.js"></script>
+2 -1
View File
@@ -56,7 +56,8 @@
<script src="spec/renderer/background.js"></script>
<script src="spec/renderer/hash.js"></script>
<script src="spec/renderer/map.js"></script>
<script src="spec/renderer/style.js"></script>
<script src="spec/svg/tag_classes.js"></script>
<script src="spec/ui/inspector.js"></script>
<script src="spec/connection.js"></script>
-46
View File
@@ -14,50 +14,4 @@ describe('iD.Style', function() {
expect(iD.Style.waystack(b, a)).to.equal(-1);
});
});
describe('#styleClasses', function() {
var selection;
beforeEach(function () {
selection = d3.select(document.createElement('div'));
});
it('adds no classes to elements whose datum has no tags', function() {
selection
.datum(iD.Entity())
.call(iD.Style.styleClasses());
expect(selection.attr('class')).to.equal('');
});
it('adds classes for highway tags', function() {
selection
.datum(iD.Entity({tags: {highway: 'primary'}}))
.call(iD.Style.styleClasses());
expect(selection.attr('class')).to.equal('tag-highway tag-highway-primary');
});
it('removes classes for tags that are no longer present', function() {
selection
.attr('class', 'tag-highway tag-highway-primary')
.datum(iD.Entity())
.call(iD.Style.styleClasses());
expect(selection.attr('class')).to.equal('');
});
it('preserves existing non-"tag-"-prefixed classes', function() {
selection
.attr('class', 'selected')
.datum(iD.Entity())
.call(iD.Style.styleClasses());
expect(selection.attr('class')).to.equal('selected');
});
it('works on SVG elements', function() {
selection = d3.select(document.createElementNS('http://www.w3.org/2000/svg', 'g'));
selection
.datum(iD.Entity())
.call(iD.Style.styleClasses());
expect(selection.attr('class')).to.equal('');
});
});
});
+45
View File
@@ -0,0 +1,45 @@
describe("iD.svg.TagClasses", function () {
var selection;
beforeEach(function () {
selection = d3.select(document.createElement('div'));
});
it('adds no classes to elements whose datum has no tags', function() {
selection
.datum(iD.Entity())
.call(iD.svg.TagClasses());
expect(selection.attr('class')).to.equal('');
});
it('adds classes for highway tags', function() {
selection
.datum(iD.Entity({tags: {highway: 'primary'}}))
.call(iD.svg.TagClasses());
expect(selection.attr('class')).to.equal('tag-highway tag-highway-primary');
});
it('removes classes for tags that are no longer present', function() {
selection
.attr('class', 'tag-highway tag-highway-primary')
.datum(iD.Entity())
.call(iD.svg.TagClasses());
expect(selection.attr('class')).to.equal('');
});
it('preserves existing non-"tag-"-prefixed classes', function() {
selection
.attr('class', 'selected')
.datum(iD.Entity())
.call(iD.svg.TagClasses());
expect(selection.attr('class')).to.equal('selected');
});
it('works on SVG elements', function() {
selection = d3.select(document.createElementNS('http://www.w3.org/2000/svg', 'g'));
selection
.datum(iD.Entity())
.call(iD.svg.TagClasses());
expect(selection.attr('class')).to.equal('');
});
});