We've almost reached the state of a fully operational layer tree. The next step in the process is to add the capabilities of changing layer attributes. In this example, we will make sure that we can change any layer's visibility, opacity, and its name from the GUI. The example files are named ch03_attributes. As we are only adding further parts to the layer element, we mostly have to extend our createRegistry method.
In our concept, only active layers can be modified. With this consideration, only the active layer element's options are exposed. The other layers will have the same nice, uniform height that shows only the layer's name and the visibility checkbox. We can easily implement this behavior with CSS:
.layercontainer .layer.active {
border-color: orange;
min-height: 2em;
height: auto;
}
.layer div {
display: none;
}
.layer.active div {
display: block;
}