Skip to content

Commit

Permalink
Merge pull request #14 from IGNF/feature-changeLayerColor2
Browse files Browse the repository at this point in the history 
Feature change layer color2 : adding grayScaled property to layerChanged event.
  • Loading branch information
@gcebelieu
gcebelieu authored Jun 23, 2017
2 parents c989e1c + 09e5056 commit d6c98fe
Show file tree
Hide file tree
Showing 3 changed files with 76 additions and 23 deletions.
11 changes: 11 additions & 0 deletions samples/ol3/ol3-events.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ <h1>Abonnement aux evenements</h1>
<input type="checkbox" name="zoomChanged" onclick="listen(this);"/>zoomChanged<br/>
<input type="checkbox" name="centerChanged" checked="true" onclick="listen(this);"/>centerChanged<br/>
<input type="checkbox" name="layerChanged" onclick="listen(this);"/>layerChanged<br/>
<input type="button" name="grayScale" onclick="toggleGS();" value="Toggle Orthos Grayscale / Color"/>
</div>
<div id="outputDiv"></div>
<script type="text/javascript">
Expand Down Expand Up @@ -70,6 +71,16 @@ <h1>Abonnement aux evenements</h1>
}
}

function toggleGS(elem) {
lo = map.getLayersOptions(["ORTHOIMAGERY.ORTHOPHOTOS"]) ;
if (!lo || !lo["ORTHOIMAGERY.ORTHOPHOTOS"]) {
console.log(lo) ;
return ;
}
lo["ORTHOIMAGERY.ORTHOPHOTOS"].grayScaled = (lo["ORTHOIMAGERY.ORTHOPHOTOS"].grayScaled ? false : true) ;
map.modifyLayers(lo) ;
}

</script>
</body>
</html>
2 changes: 1 addition & 1 deletion src/Map.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -203,7 +203,7 @@
* LayerChanged Event. Triggered when one of the map's layers has changed in some way : <br/>
* * If a layer has be removed from the map, property **layerRemoved** will host the removed layer definition.
* * If a layer has be added to the map, property **layerAdded** will host the added layer definition.
* * If properties (among *visibility*, *opacity* and *position*) of a layer has changed, property **layerChanged** will host the modified layer definition and **property**, **oldValue** and **newValues** will host the modified property with its old and new value.
* * If properties (among *visibility*, *opacity*, *position* and *grayScaled*) of a layer has changed, property **layerChanged** will host the modified layer definition and **property**, **oldValue** and **newValues** will host the modified property with its old and new value.
* <br/>
* One can listen to this event with [Gp.Map.listen()](Gp.Map.html#listen) method
*
Expand Down
86 changes: 64 additions & 22 deletions src/ol3/OL3.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ define([
visible : "visibility",
opacity : "opacity",
zIndex : "position",
grayScaled : "grayScaled",
minResolution : "maxZoom",
maxResolution : "minZoom"
} ;
Expand Down Expand Up @@ -2487,28 +2488,53 @@ define([
map.logger.trace("[OL3] listen : abonnement layerProperty : " + obsProperty) ;
this.libMap.getLayers().forEach(function (olLayer,i,array) {
var layerOpts = this._getLayerOpts(olLayer) ;
olEventKey = olLayer.on(
"change:" + obsProperty,
function (ol3evt) {
// la fonction _getCommonLayerParams permet de faire la conversion
// propriete ol3 => propriete commune
var oldOl3obj = {} ;
oldOl3obj[ol3evt.key] = ol3evt.oldValue ;
var oldCommonProp = map._getCommonLayerParams(oldOl3obj) ;
var newOl3obj = {} ;
newOl3obj[ol3evt.key] = this.get(ol3evt.key) ;
var newCommonProp = map._getCommonLayerParams(newOl3obj) ;
if ( obsProperty === "grayScaled" ) {

/** layerChangeGrayScaled callback */
var callBack = function (evt) {
action.call(context,{
property : OL3.LAYERPROPERTIES[ol3evt.key],
oldValue : oldCommonProp[OL3.LAYERPROPERTIES[ol3evt.key]],
newValue : newCommonProp[OL3.LAYERPROPERTIES[ol3evt.key]],
property : "grayScaled",
oldValue : evt.detail.oldValue,
newValue : evt.detail.newValue,
layerChanged : layerOpts
}) ;
},
olLayer
) ;
this._registerEvent(olEventKey,eventId,action,context) ;
olEventKey = null ;
};

var gpEventKey = {
type : "change:grayScaled",
handler : callBack,
target : olLayer
};

gpEventKey.target.addEventListener(gpEventKey.type, gpEventKey.handler);

this._registerEvent(gpEventKey, eventId, action, context) ;

} else {
olEventKey = olLayer.on(
"change:" + obsProperty,
function (ol3evt) {
// la fonction _getCommonLayerParams permet de faire la conversion
// propriete ol3 => propriete commune
var oldOl3obj = {} ;
oldOl3obj[ol3evt.key] = ol3evt.oldValue ;
var oldCommonProp = map._getCommonLayerParams(oldOl3obj) ;
var newOl3obj = {} ;
newOl3obj[ol3evt.key] = this.get(ol3evt.key) ;
var newCommonProp = map._getCommonLayerParams(newOl3obj) ;
action.call(context,{
property : OL3.LAYERPROPERTIES[ol3evt.key],
oldValue : oldCommonProp[OL3.LAYERPROPERTIES[ol3evt.key]],
newValue : newCommonProp[OL3.LAYERPROPERTIES[ol3evt.key]],
layerChanged : layerOpts
}) ;
},
olLayer
) ;

this._registerEvent(olEventKey,eventId,action,context) ;
olEventKey = null ;
}
},
map) ;
}
Expand Down Expand Up @@ -2563,10 +2589,16 @@ define([
var evKey = null ;
for (var i = 0 ; i < rEvents.length ; i ++) {
if (rEvents[i].action == action) {
evKey = rEvents[i].key ;
evKey = rEvents[i].key;
rEvents.splice(i,1) ;
this.logger.trace("[OL3] : forgetting : " + eventId + " (" + evKey + ")") ;
ol.Observable.unByKey(evKey) ;

if ( evKey.type === "change:grayScaled" ) {
evKey.target.removeEventListener(evKey.type, evKey.handler);
} else {
ol.Observable.unByKey(evKey) ;
}

// on decale i d'un cran en arriere pour ne pas sauter d'elements
i -= 1 ;
}
Expand Down Expand Up @@ -2598,6 +2630,17 @@ define([
}

this._colorGrayscaleLayerSwitch(gpLayer,toGrayScale);

var event = IMap.CustomEvent(
"change:grayScaled",
{
detail : {
oldValue : !toGrayScale,
newValue : toGrayScale
}
}
);
gpLayer.obj.dispatchEvent(event);
};

/**
Expand Down Expand Up @@ -2697,7 +2740,6 @@ define([
source.loadstartListenerKey = null;
source.loadendListenerKey = null;
}
gpLayer.options.grayScaled = toGrayScale;

// maj du cache
source.refresh();
Expand Down

0 comments on commit d6c98fe

Please sign in to comment.