[Chameleon] Chameleon 2.6 RC1 Broken Update Map in JSAPI
Nolte, Tim
Tim.Nolte at ipcswirelessinc.com
Fri Sep 21 08:43:52 EDT 2007
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.
template.html -
// this is within the <head> tags
<cwc2 type="SelectLayers" />
<script language="JavaScript" type="text/javascript">
<!--
function myOnLoad() {
CWC2OnLoadFunction();
goCheckboxManager.checkState();
}
//-->
</script>
// this is what I have in my section for my legend, including
the Update Map widget
<div style="margin-bottom:4px;">
<!-- UPDATE MAP -->
<cwc2 type="UpdateMap" styleresource="TextButtons"
visible="true" image="icons/icon_update.png" imagetip="update map"
label="Update">
<image state="normal"/>
<image state="selected"/>
<image state="hover"/>
</cwc2>
</div>
<!-- MAP LEGEND/LAYER CONTROL -->
<span class="generalLabel">Turn all Layers: </span><a
href="javascript:void(0)" onClick="goCheckboxManager.set( true ); return
false;"><span class="generalLabel">on</span></a><span
class="generalLabel"> |</span>
<a href="javascript:void(0)" onClick="goCheckboxManager.set(
false ); return false;"><span class="generalLabel">off</span></a><br>
<a href="javascript:void(0)"
onClick="goExpanderManager.expandAll( ); return false;"><span
class="generalLabel">expand all</span></a><span class="generalLabel">
|</span>
<a href="javascript:void(0)"
onClick="goExpanderManager.collapseAll( ); return false;"><span
class="generalLabel">collapse all</span></a>
<input type="hidden" name="expanderTracker"
value="[$expanderTracker|$]">
<script language="JavaScript" type="text/javascript"
src="jsExpander.js"></script>
<script language="JavaScript" type="text/javascript"
src="jsCheckbox.js"></script>
<script language="JavaScript" type="text/javascript">
goExpanderManager.formElement =
document.forms[0].expanderTracker;
</script>
<!-- LEGEND TEMPLATE -->
<cwc2 type="LegendTemplate" visible="true" embedded="true"
template="legend_template.html" popupstyleresource="TextButtons"
popupwidth="500" popupheight="400" status="false" menubar="false"/>
<script language="JavaScript" type="text/javascript">
goExpanderManager.initialize();
</script><br>
legend_template.html -
[leg_group_html]
<!-- comment on leg_group_html block -->
<div id="group_[leg_group_name]" name="group_[leg_group_name]"
class="legendGroup">
<script langauge="JavaScript" type="text/javascript">
oGroup = new cExpander( document.getElementById(
'group_[leg_group_name]' ));
goExpanderManager.add( oGroup );
</script>
<table cellspacing="0" cellpadding="0" border="0"
width="100%">
<tr>
<td width="15" valign="center" bgcolor="#ffffff"><a
href="javascript:void(0)" onclick="document.getElementById(
'group_[leg_group_name]' ).expander.toggle(); return false;"><img
name="img_[leg_group_name]" id="img_[leg_group_name]"
src="./images/expand.png" border="0"></a></td>
<td width="22" valign="top" bgcolor="#ffffff"><img
class="legendExpand" name="cbg_[leg_group_name]"
id="cbg_[leg_group_name]" src="./images/checkbox_1.png" width="13"
height="13" border="0">
<td><span
class="generalLabel"><b>[leg_group_name]</b></span></td>
</tr>
</table>
<script langauge="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";
goCheckboxManager.addChild( oGroupCB );
</script>
</div>
[/leg_group_html]
[leg_layer_html order=ascending opt_flag=14]
<!-- comment on leg_layer_html block -->
<div id="layer_[leg_layer_name]" style="display:none;"
class="legendLayer">
<script langauge="JavaScript" type="text/javascript">
oLayer = new cExpander( document.getElementById(
'layer_[leg_layer_name]' ));
oGroup.addElement( oLayer );
</script>
<table cellspacing="0" cellpadding="0" border="0"
width="100%">
<tr>
<td width="15"> </td>
<td width="19"> </td>
<td width="22" valign="top" bgcolor="#ffffff">
<input type="checkbox" id="cbl_[leg_layer_name]"
name="legendlayername[]" value="[leg_layer_name]" [if name=layer_status
oper=eq value=1]CHECKED[/if][if name=layer_status oper=eq
value=2]CHECKED[/if]>
</td>
<td width="19" valign="top">[if name=leg_icon_url
oper=isnull]<img src="[leg_icon width=15 height=15]" width="15"
height="15">[/if][if name=leg_icon_url oper=isset]<img src="[metadata
name=leg_icon_url]" width="15" height="15">[/if]</td>
<td><span class="generalLabel">[if name=leg_title_en
oper=isnull]<a href="javascript:void(0);"
onclick="javascript:LegendTemplateLayerInfo('[leg_layer_name]');">[leg_l
ayer_name]</a>[/if][if name=leg_title_en oper=isset][metadata
name=leg_title_en][/if]</span>
</td>
</tr>
</table>
</div>
<script langauge="JavaScript" type="text/javascript">
oLayerCB = new jsCheckbox( document.getElementById(
'cbl_[leg_layer_name]' ));
oGroupCB.addChild( oLayerCB );
</script>
[/leg_layer_html]
jsCheckbox.js -
var goCheckboxManager = new jsCheckbox();
function jsCheckbox( obj )
{
this.children = new Array();
this.obj = obj;
this.parent = null;
this.state = 1;
this.szOnImgSrc = '';
this.szPartialImgSrc = '';
this.szOffImgSrc = '';
if (this.obj != null)
{
this.obj.cb = this;
this.obj.onclick = jsCheckbox_onClick;
}
this.addChild = jsCheckbox_addChild;
this.checkState = jsCheckbox_checkState;
this.get = jsCheckbox_get;
this.set = jsCheckbox_set;
this.update = jsCheckbox_update;
}
function jsCheckbox_addChild( oChild )
{
this.children[this.children.length] = oChild;
oChild.parent = this;
}
function jsCheckbox_checkState() {
if (this.children.length == 0) {
if (this.obj.type == 'checkbox') {
this.state = (this.obj.checked) ? 1 : 0;
} else {
if (this.obj.src == this.szOnImgSrc) {
this.state = 1;
} else if (this.obj.src == this.szOffImgSrc) {
this.state = 0;
} else {
this.state = 2;
}
}
} else {
var nChildrenOn = 0;
for(var i=0; i<this.children.length;i++) {
if (this.children[i].checkState() != 0) {
nChildrenOn ++;
}
}
if (nChildrenOn == 0) {
this.state = 0;
} else if (nChildrenOn < this.children.length) {
this.state = 2;
} else {
this.state = 1;
}
}
if (this.obj != null) {
this.update();
}
return this.state;
}
function jsCheckbox_get()
{
if (this.obj != null)
{
return this.state;
}
else
{
return false;
}
}
function jsCheckbox_set( nState )
{
if (this.obj != null)
{
this.state = nState;
this.update();
}
for(var i=0; i<this.children.length;i++)
{
this.children[i].set(nState);
}
}
/**
* general click handler function, not part of the class
*/
function jsCheckbox_onClick( e )
{
//alert( 'here' );
var target;
if (CWCIsIE) {
e = window.event;
target = window.event.srcElement;
e.cancelBubble = true;
e.returnValue = true;
} else {
target = e.target
}
//alert( target.cb.state );
if (target.cb != null) {
if (target.cb.state == 1)
target.cb.set( 0 );
else
target.cb.set( 1 );
}
if (target.cb.parent != null) {
target.cb.parent.checkState();
}
return true;
}
function jsCheckbox_update()
{
if (this.obj.type == 'checkbox')
{
if (this.state == 2)
this.state = 0;
this.obj.checked = (this.state == 0) ? false : true;
}
else
{
//assume image
if (this.state == 0)
{
this.obj.src = this.szOnImgSrc;
}
else if (this.state == 1)
{
this.obj.src = this.szOffImgSrc;
}
else
{
this.obj.src = this.szPartialImgSrc;
}
}
}
function debug( obj, indent )
{
var result = '';
if (obj.obj != null)
result = obj.obj.id + "\n";
for( var i=0; i<obj.children.length; i++)
{
result = result + indent + debug( obj.children[i], "--"
+ indent);
}
return result;
}
jsExpander.js -
var goExpanderManager = new cExpanderManager();
/*
* class to manage top level expander state between page
* loads
*/
function cExpanderManager()
{
this.expanders = new Array();
this.formElement = null;
this.add = cExpanderManager_Add;
this.initialize = cExpanderManager_Initialize;
this.registerOpen = cExpanderManager_RegisterOpen;
this.registerClose = cExpanderManager_RegisterClose;
this.isVisible = function() { return true; }
this.isElementVisible = cExpanderManager_IsElementVisible;
this.expandAll = cExpanderManager_ExpandAll;
this.collapseAll = cExpanderManager_CollapseAll;
}
function cExpanderManager_Add( oExpander )
{
this.expanders[this.expanders.length] = oExpander;
oExpander.manager = this;
}
function cExpanderManager_Initialize()
{
if (this.formElement == null)
return;
for(var i=0; i < this.expanders.length; i++)
{
if (this.expanders[i].bIsOpen)
this.registerOpen( this.expanders[i] );
this.expanders[i].initialize( this.isElementVisible(
this.expanders[i].element.id ));
}
}
function cExpanderManager_RegisterOpen( oExpander )
{
if (this.formElement == null)
return;
if (this.formElement.value.indexOf( oExpander.element.id ) <
0 )
{
if (this.formElement.value != '')
this.formElement.value += ",";
this.formElement.value += oExpander.element.id;
}
}
function cExpanderManager_RegisterClose( oExpander )
{
if (this.formElement == null)
return;
var rx = new RegExp( oExpander.element.id, '' );
var text = this.formElement.value;
text = text.replace( rx, '' );
text = text.replace( /,,/g, ',' );
if (text.substr(0, 1) == ',')
text = text.slice( 1 );
if (text.substr(-1) == ',')
text = text.slice( 0, -1);
this.formElement.value = text;
}
function cExpanderManager_IsElementVisible( id )
{
rx = new RegExp( id, '' );
return rx.test( this.formElement.value );
}
function cExpanderManager_ExpandAll()
{
for(var i=0; i < this.expanders.length; i++)
{
this.expanders[i].expandAll();
}
}
function cExpanderManager_CollapseAll()
{
for(var i=0; i < this.expanders.length; i++)
{
this.expanders[i].collapseAll();
}
return true;
}
/*
* basic expander class to handle an expandable element
* that expands or contracts child elements.
*/
function cExpander( elm )
{
this.element = elm;
this.element.expander = this;
this.children = new Array();
this.bIsOpen = false;
this.manager = null;
this.img = null;
this.szExpandImgSrc = '';
this.szCollapseImgSrc = '';
this.addElement = cExpander_AddElement;
this.open = cExpander_Open;
this.close = cExpander_Close;
this.expandAll = cExpander_ExpandAll;
this.collapseAll = cExpander_CollapseAll;
this.expand = cExpander_Expand;
this.contract = cExpander_Contract;
this.toggle = cExpander_Toggle;
this.initialize = cExpander_Initialize;
this.registerOpen = cExpander_RegisterOpen;
this.registerClose = cExpander_RegisterClose;
this.isVisible = cExpander_IsVisible;
}
function cExpander_AddElement( elm )
{
this.children[this.children.length] = elm;
elm.manager = this;
return true;
}
function cExpander_Open()
{
for( var i=0; i<this.children.length; i++)
{
this.children[i].element.style.display = 'block';
if (this.children[i].bIsOpen)
{
this.children[i].open();
}
}
if (this.img != null && this.szCollapseImgSrc != '')
{
this.img.src = this.szCollapseImgSrc;
}
return true;
}
function cExpander_Close()
{
for( var i=0; i<this.children.length; i++)
{
this.children[i].element.style.display = 'none';
this.children[i].close();
}
if (this.img != null && this.szExpandImgSrc != '')
{
this.img.src = this.szExpandImgSrc;
}
return true;
}
function cExpander_ExpandAll()
{
for( var i=0; i<this.children.length; i++)
{
this.children[i].expandAll();
}
this.expand();
return true;
}
function cExpander_CollapseAll()
{
for( var i=0; i<this.children.length; i++)
{
this.children[i].collapseAll();
}
this.contract();
return true;
}
function cExpander_Expand()
{
this.bIsOpen = true;
this.registerOpen( this );
this.open();
return true;
}
function cExpander_Contract()
{
this.bIsOpen = false;
this.registerClose( this );
this.close();
return true;
}
function cExpander_Toggle()
{
if (this.bIsOpen)
this.contract();
else
this.expand();
return true;
}
/* intialize this and all children recursively */
function cExpander_Initialize( bState )
{
this.bIsOpen = bState;
for( var i=0; i<this.children.length; i++)
{
var child = this.children[i];
if (this.isVisible())
child.element.style.display = 'block';
if (child.bIsOpen)
this.registerOpen( child );
this.children[i].initialize(
goExpanderManager.isElementVisible( child.element.id ));
}
if( this.img != null )
{
if (this.bIsOpen && this.szCollapseImgSrc != '')
{
this.img.src = this.szCollapseImgSrc;
}
else if (!this.bIsOpen && this.szExpandImgSrc != '')
{
this.img.src = this.szExpandImgSrc;
}
}
return true;
}
/* cascade registration to top level manager */
function cExpander_RegisterOpen(elm)
{
if (this.manager != null)
this.manager.registerOpen( elm );
return true;
}
function cExpander_RegisterClose(elm)
{
if (this.manager != null)
this.manager.registerClose( elm );
return true;
}
/* determine if all elements in heirarchy are also open */
function cExpander_IsVisible()
{
var bVisible = this.bIsOpen;
if (this.manager != null)
bVisible = bVisible && this.manager.isVisible();
return bVisible;
}
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!
----
Timothy J Nolte - tnolte at ilpcs.com
Associate Network Planning Engineer
iPCS Wireless, Inc.
4717 Broadmoor Ave, Suite G
Kentwood, MI 49512
Office: 616-656-5163
PCS: 616-706-2438
Fax: 616-554-6484
Web: www.ipcswirelessinc.com
More information about the Chameleon
mailing list