From 66250b1342781a87d40fdadf4df86e457aa4f4d2 Mon Sep 17 00:00:00 2001 From: euzuro Date: Tue, 3 Oct 2006 19:07:24 +0000 Subject: [PATCH] add opacity support to createDiv() and createImage(). update their tests. also small update to modify tests for more completeness. updated one single complete usage of createImage() due to argument reordering git-svn-id: http://svn.openlayers.org/trunk/openlayers@1549 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf --- lib/OpenLayers/Tile/Image.js | 1 + lib/OpenLayers/Util.js | 15 +++++++++------ tests/test_Util.html | 34 +++++++++++++++++++++++++--------- 3 files changed, 35 insertions(+), 15 deletions(-) diff --git a/lib/OpenLayers/Tile/Image.js b/lib/OpenLayers/Tile/Image.js index 167abf6cfe..6f78ff7256 100644 --- a/lib/OpenLayers/Tile/Image.js +++ b/lib/OpenLayers/Tile/Image.js @@ -104,6 +104,7 @@ OpenLayers.Tile.Image.prototype = null, "absolute", null, + null, true); } this.layer.div.appendChild(this.imgDiv); diff --git a/lib/OpenLayers/Util.js b/lib/OpenLayers/Util.js index 4df87440f0..88c73b42ab 100644 --- a/lib/OpenLayers/Util.js +++ b/lib/OpenLayers/Util.js @@ -55,12 +55,13 @@ OpenLayers.Util.modifyDOMElement = function(element, id, px, sz, position, * @param {String} position * @param {String} border * @param {String} overflow +* @param {float} opacity Fractional value (0.0 - 1.0) * * @returns A DOM Div created with the specified attributes. * @type DOMElement */ OpenLayers.Util.createDiv = function(id, px, sz, imgURL, position, - border, overflow) { + border, overflow, opacity) { var dom = document.createElement('div'); @@ -78,8 +79,8 @@ OpenLayers.Util.createDiv = function(id, px, sz, imgURL, position, if (!position) { position = "absolute"; } - OpenLayers.Util.modifyDOMElement(dom, id, px, sz, - position, border, overflow); + OpenLayers.Util.modifyDOMElement(dom, id, px, sz, position, + border, overflow, opacity); return dom; }; @@ -92,12 +93,13 @@ OpenLayers.Util.createDiv = function(id, px, sz, imgURL, position, * @param {String} position * @param {String} border * @param {Boolean} delayDisplay +* @param {float} opacity Fractional value (0.0 - 1.0) * * @returns A DOM Image created with the specified attributes. * @type DOMElement */ -OpenLayers.Util.createImage = function(id, px, sz, imgURL, position, border, - delayDisplay) { +OpenLayers.Util.createImage = function(id, px, sz, imgURL, position, border, + opacity, delayDisplay) { image = document.createElement("img"); @@ -124,7 +126,8 @@ OpenLayers.Util.createImage = function(id, px, sz, imgURL, position, border, if (!position) { position = "relative"; } - OpenLayers.Util.modifyDOMElement(image, id, px, sz, position, border); + OpenLayers.Util.modifyDOMElement(image, id, px, sz, position, + border, null, opacity); return image; diff --git a/tests/test_Util.html b/tests/test_Util.html index 7306a02282..2a2101cded 100644 --- a/tests/test_Util.html +++ b/tests/test_Util.html @@ -49,7 +49,7 @@ } function test_04_Util_createDiv(t) { - t.plan( 20 ); + t.plan( 24 ); var id = "boo"; var px = new OpenLayers.Pixel(5,5); @@ -58,8 +58,9 @@ var position = "absolute"; var border = "13px solid"; var overflow = "hidden"; + var opacity = 0.5; - var div = OpenLayers.Util.createDiv(id, px, sz, img, position, border, overflow); + var div = OpenLayers.Util.createDiv(id, px, sz, img, position, border, overflow, opacity); if (!isMozilla) t.ok( true, "skipping element test outside of Mozilla"); @@ -77,6 +78,9 @@ t.eq( div.style.position, position, "div.style.positionset correctly"); t.ok( (div.style.border.indexOf(border) != -1), "div.style.border set correctly"); t.eq( div.style.overflow, overflow, "div.style.overflow set correctly"); + t.eq( div.style.opacity, opacity + "", "elemnt.style.opacity set correctly"); + var filterString = 'alpha(opacity=' + (opacity * 100) + ')'; + t.eq( div.style.filter, filterString, "element.style.filter set correctly"); //test defaults var div = OpenLayers.Util.createDiv(); @@ -97,11 +101,13 @@ t.eq( div.style.position, "absolute", "div.style.positionset correctly"); t.eq( div.style.border, "", "div.style.border set correctly"); t.eq(div.style.overflow, "", "div.style.overflow set correctly"); + t.ok( !div.style.opacity, "elemnt.style.opacity set correctly"); + t.ok( !div.style.filter, "element.style.filter set correctly"); } function test_05_Util_createImage(t) { - t.plan( 18 ); + t.plan( 22 ); var img = "http://www.openlayers.org/images/OpenLayers.trac.png"; var sz = new OpenLayers.Size(10,10); @@ -109,8 +115,9 @@ var position = "absolute"; var id = "boo"; var border = "1px solid"; + var opacity = 0.5; - var image = OpenLayers.Util.createImage(id, xy, sz, img, position, border); + var image = OpenLayers.Util.createImage(id, xy, sz, img, position, border, opacity); if (!isMozilla) t.ok( true, "skipping element test outside of Mozilla"); @@ -125,7 +132,10 @@ t.ok( (image.style.border.indexOf(border) != -1), "image.style.border set correctly"); t.eq( image.src, img, "image.style.backgroundImage correctly"); - t.eq( image.style.position, position, "image.style.positionset correctly"); + t.eq( image.style.position, position, "image.style.position set correctly"); + t.eq( image.style.opacity, opacity + "", "image.style.opacity set correctly"); + var filterString = 'alpha(opacity=' + (opacity * 100) + ')'; + t.eq( image.style.filter, filterString, "element.style.filter set correctly"); //test defaults var image = OpenLayers.Util.createImage(); @@ -144,6 +154,8 @@ t.ok((image.style.border == ""), "image.style.border set correctly"); t.eq(image.src, "", "image.style.backgroundImage correctly"); t.eq( image.style.position, "relative", "image.style.positionset correctly"); + t.ok( !image.style.opacity, "elemnt.style.opacity default unset"); + t.ok( !image.style.filter, "element.style.filter default unset"); } @@ -178,7 +190,7 @@ } function test_08_Util_createAlphaImageDiv(t) { - t.plan( 18 ); + t.plan( 19 ); var img = "http://www.openlayers.org/images/OpenLayers.trac.png"; var sz = new OpenLayers.Size(10,10); @@ -204,7 +216,9 @@ t.eq( imageDiv.style.height, sz.h + "px", "image.style.height set correctly"); t.eq( imageDiv.style.position, position, "image.style.positionset correctly"); - t.eq( imageDiv.style.opacity, opacity + "", "image.style.opacity set correctly"); + t.eq( imageDiv.style.opacity, opacity + "", "elemnt.style.opacity set correctly"); + var filterString = 'alpha(opacity=' + (opacity * 100) + ')'; + t.eq( imageDiv.style.filter, filterString, "element.style.filter set correctly"); image = imageDiv.firstChild; @@ -284,7 +298,7 @@ } function test_09_Util_modifyAlphaImageDiv(t) { - t.plan( 18 ); + t.plan( 19 ); var imageDiv = OpenLayers.Util.createAlphaImageDiv(); @@ -312,7 +326,9 @@ t.eq( imageDiv.style.height, sz.h + "px", "image.style.height set correctly"); t.eq( imageDiv.style.position, position, "image.style.position set correctly"); - t.eq( imageDiv.style.opacity, opacity + "", "image.style.opacity set correctly"); + t.eq( imageDiv.style.opacity, opacity + "", "elemnt.style.opacity set correctly"); + var filterString = 'alpha(opacity=' + (opacity * 100) + ')'; + t.eq( imageDiv.style.filter, filterString, "element.style.filter set correctly"); image = imageDiv.firstChild;