From aca0098ea098d53a7191aa98297cb77187fba633 Mon Sep 17 00:00:00 2001 From: Tom MacWright Date: Wed, 2 Jan 2013 13:01:18 -0500 Subject: [PATCH] Use 2d transforms and fix jshint problems --- js/id/behavior/drag.js | 2 +- js/id/id.js | 4 ++-- js/id/renderer/map.js | 38 +++++++++++++++----------------------- js/id/ui/commit.js | 8 ++++---- js/id/ui/notice.js | 2 +- js/id/ui/tag_reference.js | 4 ++-- js/id/ui/userpanel.js | 2 +- js/id/util.js | 14 -------------- 8 files changed, 26 insertions(+), 48 deletions(-) diff --git a/js/id/behavior/drag.js b/js/id/behavior/drag.js index fefcd2c99..fcf31fb14 100644 --- a/js/id/behavior/drag.js +++ b/js/id/behavior/drag.js @@ -123,7 +123,7 @@ iD.behavior.drag = function () { return mousedown.call(target, target.__data__); } } - } + }; } selection.on("mousedown.drag" + selector, delegate) diff --git a/js/id/id.js b/js/id/id.js index 12219b38a..c041e21f9 100644 --- a/js/id/id.js +++ b/js/id/id.js @@ -170,7 +170,7 @@ window.iD = function(container) { .attr('class', 'inspector-wrap fillL') .style('display', 'none'); - var about = container.append('div') + var about = container.append('div'); about.append('ul') .attr('id','about') @@ -226,7 +226,7 @@ window.iD = function(container) { if (!hash.hadHash) { map.zoom(20) - .center([-77.02405, 38.87952]); + .center([-77.02271,38.90085]); } d3.select('.user-container').call(iD.userpanel(connection) diff --git a/js/id/renderer/map.js b/js/id/renderer/map.js index afc2a5f46..60cfad861 100644 --- a/js/id/renderer/map.js +++ b/js/id/renderer/map.js @@ -20,7 +20,6 @@ iD.Map = function() { class_casing = iD.Style.styleClasses('way line casing'), class_area = iD.Style.styleClasses('way area'), transformProp = iD.util.prefixCSSProperty('Transform'), - support3d = iD.util.support3d(), supersurface, surface, defs, tilegroup, r, g, alength; function map() { @@ -141,16 +140,16 @@ iD.Map = function() { function drawVertices(vertices, parentStructure, filter) { function shared(d) { return parentStructure[d.id] > 1; } - var vertices = g.hit.selectAll('circle.vertex') + var circles = g.hit.selectAll('circle.vertex') .filter(filter) .data(vertices, key); - vertices.exit().remove(); + circles.exit().remove(); - vertices.enter().insert('circle', ':first-child') + circles.enter().insert('circle', ':first-child') .attr('class', 'node vertex'); - vertices.attr('transform', function(entity) { + circles.attr('transform', function(entity) { var p = projection(entity.loc); return 'translate(' + [~~p[0], ~~p[1]] + ')'; @@ -158,7 +157,7 @@ iD.Map = function() { .classed('shared', shared) .classed('hover', classHover); - vertices.transition().duration(50).attr('r', function(d) { + circles.transition().duration(50).attr('r', function(d) { return d.id === hover ? 8: 4; }); } @@ -209,22 +208,22 @@ iD.Map = function() { } function drawPoints(points, filter) { - var points = g.hit.selectAll('g.point') + var groups = g.hit.selectAll('g.point') .filter(filter) .data(points, key); - points.exit().remove(); - var group = points.enter().append('g') + groups.exit().remove(); + var group = groups.enter().append('g') .attr('class', 'node point'); group.append('circle') .attr({ r: 10, cx: 8, cy: 8 }); group.append('image') .attr({ width: 16, height: 16 }); - points.attr('transform', function(d) { + groups.attr('transform', function(d) { var pt = projection(d.loc); return 'translate(' + [~~pt[0], ~~pt[1]] + ') translate(-8, -8)'; }); - points.classed('hover', classHover); - points.select('image').attr('xlink:href', iD.Style.pointImage); + groups.classed('hover', classHover); + groups.select('image').attr('xlink:href', iD.Style.pointImage); } function drawStrokes(ways, filter) { @@ -299,17 +298,10 @@ iD.Map = function() { if (!translateStart) translateStart = d3.event.translate.slice(); var a = d3.event.translate, b = translateStart; - if (support3d) { - tilegroup.style(transformProp, - 'translate3d(' + ~~(a[0] - b[0]) + 'px,' + ~~(a[1] - b[1]) + 'px, 0px)'); - surface.style(transformProp, - 'translate3d(' + ~~(a[0] - b[0]) + 'px,' + ~~(a[1] - b[1]) + 'px, 0px)'); - } else { - tilegroup.style(transformProp, - 'translate(' + ~~(a[0] - b[0]) + 'px,' + ~~(a[1] - b[1]) + 'px)'); - surface.style(transformProp, - 'translate(' + ~~(a[0] - b[0]) + 'px,' + ~~(a[1] - b[1]) + 'px)'); - } + tilegroup.style(transformProp, + 'translate(' + ~~(a[0] - b[0]) + 'px,' + ~~(a[1] - b[1]) + 'px)'); + surface.style(transformProp, + 'translate(' + ~~(a[0] - b[0]) + 'px,' + ~~(a[1] - b[1]) + 'px)'); } else { redraw(); translateStart = null; diff --git a/js/id/ui/commit.js b/js/id/ui/commit.js index fa3ba810b..314433e7e 100644 --- a/js/id/ui/commit.js +++ b/js/id/ui/commit.js @@ -24,15 +24,15 @@ iD.commit = function() { comment: d3.select('textarea.changeset-comment').node().value }); }); - savebutton.append('span').attr('class','icon save icon-pre-text') - savebutton.append('span').attr('class','label').text('Save') + savebutton.append('span').attr('class','icon save icon-pre-text'); + savebutton.append('span').attr('class','label').text('Save'); var cancelbutton = buttonwrap.append('button') .attr('class', 'cancel wide') .on('click.cancel', function() { event.cancel(); }); - cancelbutton.append('span').attr('class','icon close icon-pre-text') - cancelbutton.append('span').attr('class','label').text('Cancel') + cancelbutton.append('span').attr('class','icon close icon-pre-text'); + cancelbutton.append('span').attr('class','label').text('Cancel'); var section = body.selectAll('div.commit-section') .data(['modified', 'deleted', 'created'].filter(function(d) { diff --git a/js/id/ui/notice.js b/js/id/ui/notice.js index d1d3eec52..05f3c85b6 100644 --- a/js/id/ui/notice.js +++ b/js/id/ui/notice.js @@ -3,7 +3,7 @@ iD.notice = function(selection) { notice = {}; notice.message = function(_) { - selection.attr('class','inner') + selection.attr('class','inner'); if (!arguments.length) return _; if (!message && _) { selection diff --git a/js/id/ui/tag_reference.js b/js/id/ui/tag_reference.js index 945f03b7b..4835f1eaa 100644 --- a/js/id/ui/tag_reference.js +++ b/js/id/ui/tag_reference.js @@ -23,7 +23,7 @@ iD.tagReference = function(selection) { .attr('class','modal-section'); referenceBody .append('h5') - .text('Description') + .text('Description'); referenceBody .append('p') .text(g('description')); @@ -36,4 +36,4 @@ iD.tagReference = function(selection) { return d.title + ' on wiki.osm.org'; }); }); -}; \ No newline at end of file +}; diff --git a/js/id/ui/userpanel.js b/js/id/ui/userpanel.js index 6543620cd..e04ba0d0c 100644 --- a/js/id/ui/userpanel.js +++ b/js/id/ui/userpanel.js @@ -7,7 +7,7 @@ iD.userpanel = function(connection) { if (connection.authenticated()) { selection.style('display', 'block'); connection.userDetails(function(user_details) { - selection.append('span').attr('class','icon avatar icon-pre-text') + selection.append('span').attr('class','icon avatar icon-pre-text'); selection.append('span') .append('a') .attr('href', connection.url() + '/user/' + diff --git a/js/id/util.js b/js/id/util.js index fb377bf9c..7e2df0d34 100644 --- a/js/id/util.js +++ b/js/id/util.js @@ -90,20 +90,6 @@ iD.util.prefixCSSProperty = function(property) { return false; }; -iD.util.support3d = function() { - // test for translate3d support. Based on https://gist.github.com/3794226 by lorenzopolidori and webinista - var transformProp = iD.util.prefixCSSProperty('Transform'); - var el = document.createElement('div'), - has3d = false; - document.body.insertBefore(el, null); - if (el.style[transformProp] !== undefined) { - el.style[transformProp] = 'translate3d(1px,1px,1px)'; - has3d = window.getComputedStyle(el).getPropertyValue(transformProp); - } - document.body.removeChild(el); - return (has3d && has3d.length>0 && has3d!=="none"); -}; - iD.util.geo = {}; iD.util.geo.roundCoords = function(c) {