diff --git a/js/id/behavior/tail.js b/js/id/behavior/tail.js index bbc1e569e..642aeb791 100644 --- a/js/id/behavior/tail.js +++ b/js/id/behavior/tail.js @@ -3,8 +3,7 @@ iD.behavior.Tail = function() { container, xmargin = 25, tooltipSize = [0, 0], - selectionSize = [0, 0], - transformProp = iD.util.prefixCSSProperty('Transform'); + selectionSize = [0, 0]; function tail(selection) { if (!text) return; @@ -22,9 +21,7 @@ iD.behavior.Tail = function() { var xoffset = ((d3.event.clientX + tooltipSize[0] + xmargin) > selectionSize[0]) ? -tooltipSize[0] - xmargin : xmargin; container.classed('left', xoffset > 0); - container.style(transformProp, 'translate(' + - (~~d3.event.clientX + xoffset) + 'px,' + - ~~d3.event.clientY + 'px)'); + iD.util.setTransform(container, d3.event.clientX + xoffset, d3.event.clientY); } function mouseout() { diff --git a/js/id/renderer/map.js b/js/id/renderer/map.js index 8c12a2f52..118759d3f 100644 --- a/js/id/renderer/map.js +++ b/js/id/renderer/map.js @@ -12,7 +12,6 @@ iD.Map = function(context) { transformStart, transformed = false, minzoom = 0, - transformProp = iD.util.prefixCSSProperty('Transform'), points = iD.svg.Points(roundedProjection, context), vertices = iD.svg.Vertices(roundedProjection, context), lines = iD.svg.Lines(projection), @@ -179,13 +178,8 @@ iD.Map = function(context) { tX = Math.round((d3.event.translate[0] / scale - transformStart[1][0]) * scale), tY = Math.round((d3.event.translate[1] / scale - transformStart[1][1]) * scale); - var transform = - (iD.detect().opera ? - 'translate(' + tX + 'px,' + tY + 'px)' : - 'translate3d(' + tX + 'px,' + tY + 'px, 0)') + ' scale(' + scale + ')'; - transformed = true; - supersurface.style(transformProp, transform); + iD.util.setTransform(supersurface, tX, tY, scale); queueRedraw(); dispatch.move(map); @@ -193,7 +187,7 @@ iD.Map = function(context) { function resetTransform() { if (!transformed) return false; - supersurface.style(transformProp, iD.detect().opera ? '' : 'translate3d(0,0,0)'); + iD.util.setTransform(supersurface, 0, 0); transformed = false; return true; } diff --git a/js/id/ui/background.js b/js/id/ui/background.js index 26b0d5af9..bd3f5677c 100644 --- a/js/id/ui/background.js +++ b/js/id/ui/background.js @@ -7,8 +7,7 @@ iD.ui.Background = function(context) { ['right', [-1, 0]], ['bottom', [0, 1]]], opacityDefault = (context.storage('background-opacity') !== null) ? - (+context.storage('background-opacity')) : 0.5, - transformProp = iD.util.prefixCSSProperty('Transform'); + (+context.storage('background-opacity')) : 0.5; // Can be 0 from <1.3.0 use or due to issue #1923. if (opacityDefault === 0) opacityDefault = 0.5; @@ -22,7 +21,7 @@ iD.ui.Background = function(context) { .attr('data-opacity', d); if (!iD.detect().opera) { - bg.style(transformProp, 'translate3d(0,0,0)'); + iD.util.setTransform(bg, 0, 0); } opacityList.selectAll('li') diff --git a/js/id/util.js b/js/id/util.js index f590edb0d..357fec0fd 100644 --- a/js/id/util.js +++ b/js/id/util.js @@ -82,6 +82,15 @@ iD.util.prefixCSSProperty = function(property) { return false; }; + +iD.util.setTransform = function(el, x, y, scale) { + var prop = iD.util.transformProperty = iD.util.transformProperty || iD.util.prefixCSSProperty('Transform'), + translate = iD.detect().opera ? + 'translate(' + x + 'px,' + y + 'px)' : + 'translate3d(' + x + 'px,' + y + 'px,0)'; + return el.style(prop, translate + (scale ? ' scale(' + scale + ')' : '')); +}; + iD.util.getStyle = function(selector) { for (var i = 0; i < document.styleSheets.length; i++) { var rules = document.styleSheets[i].rules || document.styleSheets[i].cssRules || [];