[Chameleon] Chameleon 2.6 RC1 Broken Update Map in JSAPI
Normand Savard
nsavard at mapgears.com
Wed Sep 26 12:21:08 EDT 2007
Nolte, Tim wrote:
>Ok, I'm not really getting anywhere on this Update Map button issue. I'm
>including all of my legend code in hopes that someone can help me find
>where the problem is.
>
>
>
>
>Perhaps someone can clue me in to where I need to make the change.
>Actually, what would be most helpful is a good explanation for the
>changes that need to be made not just a "insert here" or "change to
>this" sort of response. Thanks in advance!
>
>
>
Tim,
This is the solution to your problem and an explanation on why you have
to apply this. I hope that helps.
Norm
First you have to know that onclick event of the group and layer is set
in the jsCheckbox class (jsCheckbox.js). This is why eventhough we set
an onclick function call (ChangeLayerStatus()) for the checkbox at the
layer level in legend_template.html it has no effect. It is overwritten
when this class is instanciated. To make our function being called when
a user clicks the checkbox (group or layer) we need to set the onclick
function call after the jsCheckbox class has been instanciated. So the
legend template at the group level will look like this:
<script language="JavaScript" type="text/javascript">
oGroup.img = CWCDHTML_GetImage( "img_[leg_group_name]");
oGroup.szExpandImgSrc = "images/expand.png";
oGroup.szCollapseImgSrc = "images/collapse.png";
oGroupCB = new
jsCheckbox(CWCDHTML_GetImage("cbg_[leg_group_name]"));
oGroupCB.szOnImgSrc = "images/checkbox_0.png";
oGroupCB.szOffImgSrc = "images/checkbox_1.png";
oGroupCB.szPartialImgSrc = "images/checkbox_2.png";
oGroupCB.obj.onclick = ChangeLayerStatus; <<<<<<<<
oGroupCB.checkState(); <<<<<<<<<<<
goCheckboxManager.addChild( oGroupCB );
</script>
and at the layer level:
<script language="JavaScript" type="text/javascript">
oLayerCB = new jsCheckbox(
document.getElementById('cbl_[leg_layer_name]' ));
oLayerCB.obj.onclick = ChangeLayerStatus; <<<<<<<
oLayerCB.checkState(); <<<<<<<<<<<<
oGroupCB.addChild( oLayerCB );
</script>
The checkState() function call was added to correct an issue when the
application was first loaded. The layers state in the checkbox
architecture (jsCheckbox.js) was set to true by default and was not
corresponding to the layer status in the map file.
The ChangeLayerStatus function does two things. It sets the layer
status in the map file and sets the checkbox state in the checkbox
architecture so the checkbox will be correctly displayed. There are two
cases that we need to take care: when a user clicks a checkbox at the
group level and when a user clicks a checkbox at the layer level. A
click at the group level will set all the layers "ON" if there are some
layers "ON" and some "OFF. It will set all layers "OFF" if all layers
are "ON". A click at the layer level will toggle the layer status. The
ChangeLayerStatus function looks like the following:
function ChangeLayerStatus(e)
{
//alert('ChangeLayerStatus');
if(typeof goCWCJSAPI == "undefined")
{
return false;
}
bLayersOn = true;
oCheckboxGroup = e.target.cb;
if (oCheckboxGroup.children.length > 0)
{
for(var i=0; i<oCheckboxGroup.children.length;i++)
{
szLayerName = oCheckboxGroup.children[i].obj.value;
//alert(szLayerName);
szStatus =
goCWCJSAPI.oMap.GetLayerByName(szLayerName).GetStatus();
//alert('status='+szStatus);
if(szStatus == "OFF")
{
bLayersOn = false;
break;
}
}//End first for with i index
if(bLayersOn)
{
szStatus = "OFF";
}
else
{
szStatus = "ON";
}
for(var i=0; i<oCheckboxGroup.children.length;i++)
{
szLayerName = oCheckboxGroup.children[i].obj.value;
goCWCJSAPI.oMap.GetLayerByName(szLayerName).SetStatus(szStatus);
}
}//End first if
else //This is a layer only
{
szLayerName = e.target.value;
//alert(szLayerName);
szStatus = goCWCJSAPI.oMap.GetLayerByName(szLayerName).GetStatus();
//alert('status='+szStatus);
if(szStatus == "ON")
{
szStatus = "OFF";
}
else
{
szStatus = "ON";
}
goCWCJSAPI.oMap.GetLayerByName(szLayerName).SetStatus(szStatus);
//szStatus =
goCWCJSAPI.oMap.GetLayerByName(szLayerName).GetStatus();
//alert('status='+szStatus);
}
jsCheckbox_onClick(e);
}
To make the on/off control feature work you need a new function that
will be called in the application template. This function is saved in
sample.js. This function call is set like this:
<span class="generalLabel">Turn all Layers: </span><a
href="javascript:void(0)" onClick="ChangeAllLayersStatus(event, true);
return false;"><span class="generalLabel">on</span></a>
<span class="generalLabel"> |</span>
<a href="javascript:void(0)" onClick="ChangeAllLayersStatus(event,
false); return false;"><span class="generalLabel">off</span></a>
This function definition is like this:
function ChangeAllLayersStatus(e, nState)
{
// alert('ChangeAllLayersStatus');
if(typeof goCWCJSAPI == "undefined")
{
return false;
}
oCheckboxRoot = e.view.goCheckboxManager;
if (oCheckboxRoot.children.length > 0)
{
for(var i=0; i<oCheckboxRoot.children.length;i++)
{
if (oCheckboxRoot.children[i].children.length > 0)
{
for(var j=0;
j<oCheckboxRoot.children[i].children.length;j++)
{
szLayerName =
oCheckboxRoot.children[i].children[j].obj.value;
//alert(szLayerName);
szStatus =
goCWCJSAPI.oMap.GetLayerByName(szLayerName).GetStatus();
//alert('status='+szStatus);
if(nState == true)
{
szNewStatus = "ON";
}
else if(nState == false)
{
szNewStatus = "OFF";
}
if(szStatus != szNewStatus)
{
szStatus = szNewStatus;
}
goCWCJSAPI.oMap.GetLayerByName(szLayerName).SetStatus(szStatus);
//szStatus =
goCWCJSAPI.oMap.GetLayerByName(szLayerName).GetStatus();
//alert('status='+szStatus);
}//End second for with j index
}//End second if
}//End first for with i index
}//End first if
goCheckboxManager.set( nState );
}
More information about the Chameleon
mailing list