Sure, no prob.
if (displayLeftPanel()) {
//create left panel
var bc = dijit.byId('leftPane');
esri.show(dojo.byId('leftPane'));
var cp = new dijit.layout.ContentPane({
id: 'leftPaneHeader',
region: 'top',
style: 'height:10px;',
content: esri.substitute({
close_title: i18n.panel.close.title,
close_alt: i18n.panel.close.label
}, '<div style="float:right;clear:both;" id="paneCloseBtn"><a title=${close_title} alt=${close_alt} href="JavaScript:hideLeftPanel();"><img src=images/closepanel.png border="0"/></a></div>')
});
bc.addChild(cp);
var cp2 = new dijit.layout.StackContainer({
id: 'stackContainer',
region: 'center',
style: 'height:98%;'
});
bc.addChild(cp2);
if (configOptions.embed) {
dojo.style(dojo.byId("leftPane"), "width", configOptions.leftpanewidth);
} else {
dojo.style(dojo.byId("leftPane"), "width", configOptions.leftpanewidth + "px");
}
//Add the Editor Button and Panel
if (configOptions.displayeditor == 'true' || configOptions.displayeditor === true) {
addEditor(editLayers); //only enabled if map contains editable layers
}
//Add the Detail button and panel
if (configOptions.displaydetails === true && configOptions.description !== "") {
var detailTb = new dijit.form.ToggleButton({
showLabel: true,
label: i18n.tools.details.label,
title: i18n.tools.details.title,
checked: true,
iconClass: 'esriDetailsIcon',
id: 'detailButton'
}, dojo.create('div'));
dojo.byId('webmap-toolbar-left').appendChild(detailTb.domNode);
dojo.connect(detailTb, 'onClick', function () {
navigateStack('detailPanel');
});
var detailCp = new dijit.layout.ContentPane({
title: i18n.tools.details.title,
selected: true,
region: 'center',
id: "detailPanel"
});
var tpcontent = dojo.create("div", {});
var tp1 = new dijit.TitlePane({title: "Annual Percent Chance of Occurrence", content: tpcontent});
var rulerLabelTop = new dijit.form.HorizontalRuleLabels({
container: 'topDecoration',
style: "height:1.5em;font-size:75%;color:gray;margin:0 12px;",
count: 5,
labels: ["2-yr", "5-yr", "10-yr", "20-yr", "50-yr"]
});
tp1.addChild(rulerLabelTop);
var ruler = new dijit.form.HorizontalRule({
count: 5,
style: "height:5px;margin:0 14px;"
});
tp1.addChild(ruler);
var slider = new dijit.form.HorizontalSlider({
name: "slider-1",
showButtons: false,
value: 0,
minimum: 0,
maximum: 4,
discreteValues: 5,
intermediateChanges: true,
style: "",
onChange: function(value){
var list = ['02','05','10','20','50'];
if (dojo.some(SBDELayers, function(s) { return s.visible; })) {
dojo.forEach(SBDELayers, function(layer) {
layer.setVisibility(false);
map2.getLayer(layer.id).setVisibility(false);
});
map.getLayer('SBDE-'+list[value]).setVisibility(true);
map2.getLayer('SBDE-'+list[value]).setVisibility(true);
}
if (dojo.some(SBDLayers, function(s) { return s.visible; })) {
dojo.forEach(SBDLayers, function(layer) {
layer.setVisibility(false);
map2.getLayer(layer.id).setVisibility(false);
});
map.getLayer('SBD-'+list[value]).setVisibility(true);
map2.getLayer('SBD-'+list[value]).setVisibility(true);
}
}
});
tp1.addChild(slider);
var rulerLabelBottom = new dijit.form.HorizontalRuleLabels({
container: 'topDecoration',
style: "height:1.5em;font-size:75%;color:gray;",
count: 5,
labels: ["5-year", "20-year"]
});