[Chameleon] Hide/show keymap + floating

[Jason Grimes]

Hi Carlo,

I hope that this will help, but what I did is not exactly what you are 
attempting to do.  It sounds like an interesting idea though, could you 
post a link to your site when it is finished so I can see how it worked 
out?  Now what I coded may not be the best way to code this so YMMV.   
Most of all the modifications you need to do is in the 
KeyMapDHTML.widget.php code.    To move the keymap you will need to move 
all of it's layers as you are moving your current floating div.  I think 
that the keymap is comprised of about 6 to 8 layers, check the 
KeyMapDHTML.widget.php file to be sure.   The layers are created in this 
code too, but I don't know if you will need to make them floating or 
not.  I suspect that at the very least you will need to have a "onmove" 
handler that will move the keymap layers so they will keep up with your 
floating div layer as it moves. 

The first code I changed was the keymap layer zindexes.  Currently they 
are the same as the main map layers so it is not possible to overlay, or 
in your case drag them across the main map.  I'm just going to paste 
excerpts from our wiki here for each of the changes.  You can set these 
to whatever works for you as long as they are greater then 12 I think.

The following code needs to be changed in the KeyMapDHTML.widget.php 
widget code in the KeyMapWCreateDHTMLLayers function. Change all of the 
CWCDHTML_SetLayerZOrder statements so that the zindex starts at 30 
instead of 10. Set KeyMapLayerBG to 30, KeyMapLayerDiv to 31, and all 
the rest to 32.

The next issue you will need to take care of appears when the keymap is 
closed.  The mouse handlers are still running so if the user clicks 
where the keymap was, those clicks and mouse moves are still being 
captured.  So what you end up with is an invisible keymap window, very 
strange. :)  How I solved this is to create a form variable that I 
called "KeyMapVis".  The variable is set to either 2 or 1 depending on 
if the keymap layers are visible or not.   I have code that toggles this 
variable when the user clicks on the keymap icon.  You will most likely 
have to handle this another way, although having the form variable is 
nice for keeping the state of the keymap layers.  Then to make use of 
the variable I added the following code to the very beginning of the 
KeyMapWinsideKeyMap function in the KeyMapDHTML.widget.php code.

        if (document.forms[0].KeyMapVis.value == 1)
                {
                return false;
                }


All this does is tell the mouse handling code in the keymap widget to 
ignore the mouse if the keymap layers have been turned off.

Now you need to have a couple of functions that will turn the layers on 
and off, and also keep their state as the interface is reloaded.  Here 
is the two functions I coded, again this may not be the best way to 
handle this.

        function keymap_vis ()
                {
                keyvis = document.forms[0].KeyMapVis.value;

                if (keyvis == "1")
                        {
                        document.forms[0].KeyMapVis.value = 2;
                        CWCDHTML_SetLayerVis("GinaKeyMap", true);
                        CWCDHTML_SetLayerVis("KeyMapLayerDiv", true);
                        CWCDHTML_SetLayerVis("KeyMapLayerBG", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxLeft", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxBottom", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxRight", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxTop", true);
                        }

                if (keyvis == "KeyMapVis" || keyvis == "2")
                        {
                        document.forms[0].KeyMapVis.value = 1;
                        CWCDHTML_SetLayerVis("GinaKeyMap", false);
                        CWCDHTML_SetLayerVis("KeyMapLayerDiv", false);
                        CWCDHTML_SetLayerVis("KeyMapLayerBG", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxLeft", false);
                       CWCDHTML_SetLayerVis("zKeyMap2BoxLeft", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxBottom", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxRight", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxTop", false);
                        }
                }

        function keymap_reset ()
                {
                keyvis = document.forms[0].KeyMapVis.value;

                if (keyvis == "KeyMapVis" || keyvis == "2")
                        {
                        CWCDHTML_SetLayerVis("GinaKeyMap", true);
                        CWCDHTML_SetLayerVis("KeyMapLayerDiv", true);
                        CWCDHTML_SetLayerVis("KeyMapLayerBG", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxLeft", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxBottom", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxRight", true);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxTop", true);
                        }

                if (keyvis == "1")
                        {
                        CWCDHTML_SetLayerVis("GinaKeyMap", false);
                        CWCDHTML_SetLayerVis("KeyMapLayerDiv", false);
                        CWCDHTML_SetLayerVis("KeyMapLayerBG", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxLeft", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxBottom", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxRight", false);
                        CWCDHTML_SetLayerVis("zKeyMap2BoxTop", false);
                        }
                }

The keymap_vis function is linked to the button and turns the layers 
on/off and it toggles the KeyMapVis variable.  The keymap_reset function 
is added to the onload parameter in your <body> tag so that when the 
interface is reloaded the keymap will either stay visible or remain 
invisible depending on how the user has set KeyMapVis.  Here is the 
KeyMapVis form variable that I set up within the <form> tag in my template.

<input type="hidden" name="KeyMapVis" value="[$KeyMapVis$]">

Ok, thats it.  :)  Please let me know if you see anything here that is 
blatantly stupid or if there is a better way of handling it.

Jason

Carlo Tronnberg wrote:

>Hello Jason (or anybody else who might be able to help me...  :-) ),
>
>I am trying to make a user movable/hiding KeyMap in Chameleon. I created a floating div layer with a handle on top including 2 buttons such as minimize and close. Actually, when I move around the layer with the mouse, the frame and the 2 mini buttons are just fine, but the KeyMap stays on its original place.
>
>I read your previous correspondance with Joan and looked at your test map site. I think that your modification is just what I am looking for. Could you please specify the modification you made to allow the show/hide of the KeyMap?
>
>Thanks a lot in advance,
>
>Carlo
>