ThinkGeo.com    |     Documentation    |     Premium Support

ContextMenu going off screen when too close to edges

My context menu has a lot of items, and if you right click on the map towards the bottom, the menu comes up half cropped by the end of the page, thus creating scrollbars. 


Is there a way to make the menu come up above the cursor, rather than below, when it won't fit on the page? Basically offset the top by the height. Same thing goes for when right clicking too close to the right side of the screen.


Thanks,

Rob



Rob, 
  
 We don’t support this feature currently and it’s a new requirement for us; we think we can enhanced our ContextMenu in the future. On the other hand, you could achieve the same result through Popup; the disadvantage is that you need to handle the server events. 
  
 Sorry for the inconvenience and let me know if you have any more questions. 
  
 Thanks, 
 Howard

I have another feature request related to ContextMenus. It would be cool if we could setup sub-menu items. This would be a great way to group and shorten the long list of frequently accessed functions that I place in the right click menu.

Rob, 
  
 Thank you for your good suggestion, I think our web product will be more powerful after adding this enhancement; we have added this feature in our work list, please keep an eye on our website.  
  
 If you have any more questions, please let us know. 
  
 Thanks, 
 Howard

Any progress on either of these features? Coming soon?

 


Rob,
 
I think we can’t make the menu coming up above the cursor, rather then below, because there will be some problems when raising events. We have supported sub-menu now, and following is the sample code:
 


ContextMenu menuOnMap = new ContextMenu("area", 180);
ContextMenuItem redirectItem = new ContextMenuItem("<a href='thinkgeo.com' target='_blank'>ThinkGeo<a>");
redirectItem.MenuItems.Add(new ContextMenuItem("Sub-menu"));
menuOnMap.MenuItems.Add(redirectItem);
Map1.ContextMenu = menuOnMap;

 
 
Sorry that we forgot reminding you. You can download the lasted DLL package from the helpdesk.thinkgeo.com, and any question about downloading please refer to gis.thinkgeo.com/Support/Dis...fault.aspx.
 
Thanks,
 
Johnny,

If I had to choose 1 of the 2, SubMenus are my pick. Perfect!  
  
 Is there a way to display an arrow or something to show which items have sub menus?

Hi Rob,


We already have an arrow icon behind the items which have sub menus. Please see the screenshot. 





If you still cannot see the icon, please delete the theme folder which you can find at [your project path]\theme. We’ll automatically generate the new styles and icons for you. Please have a try. If the icon is still invisible, please show us your version and I’ll check it for you.


On the other hand, you can try to use the following JavaScript to fix the position of the context menu when it’s too close to the edge of the web browser.

var tgMap = null;
var OnMapCreating = function(map) {
    tgMap = map;

    Class.Extent(ContextMenu.prototype, {
        moveTo: function(x, y) {
            var screenWidth = parseInt(document.body.clientWidth);
            var screenHeight = parseInt(document.body.clientHeight);

            var ctxWidth = parseInt(this.div.style.width);
            if (x + ctxWidth > screenWidth) {
                x -= ctxWidth;
            }

            var ctxHeight = this.div.children.length * 20;
            if (y + ctxHeight > screenHeight) {
                y -= ctxHeight;
            }

            this.div.style.left = x + 'px';
            this.div.style.top = y + 'px';
        }
    })
}


Hope it works fine.


Thanks,

Howard

 



I am running into problems using SubMenus in Firefox and Chrome.



In Firefox, the submenu doesn't appear where it should. Instead it shows up at the coordinates (0, pageHeight). See screenshot.



In Chrome (and Firefox), once you hover over a submenu, the parent menu won't go away. You can duplicate this by right clicking, hover over submenu, then right click somewhere else on the map. See screenshots.


I am on todays daily build (3.1.399).


I also have not added the javascript from the previous post yet.


-Rob




 


Hi Rob,
 
The problems are caused by the browser compatibility. You can try using the following JavaScript. 
 

 

var tgMap = null;
        var OnMapCreating = function(map) {
            tgMap = map;
 
            Class.Extent(ContextMenu.prototype, {
                moveTo: function(x, y) {
                    var screenWidth = parseInt(document.body.clientWidth);
                   var screenHeight = parseInt(document.body.clientHeight);
                    if (!IsIE()) {
                        screenWidth = parseInt(document.documentElement.clientWidth);
                        screenHeight = parseInt(document.documentElement.clientHeight);
                    }
                    var ctxWidth = parseInt(this.div.style.width);
                    if (x + ctxWidth > screenWidth) {
                        x -= ctxWidth;
                    }
 
                    var ctxHeight = this.div.children.length * 20;
                    if (y + ctxHeight > screenHeight) {
                        y -= ctxHeight;
                    }
 
                this.div.style.left = x + 'px';
                this.div.style.top = y + 'px';
                }
            })
        }
 
        function IsIE() {
            if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
                return true;
            }
            else //Firefox
            {
                if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
                    return false;
                }
            }
        }


 



The code above is based on the updated DLL package and you can get it with version 3.1.401.0 or later from helpdesktop.thinkgeo.com . Any more questions please let us know.
 
Thanks,
 
Johnny

Although Chrome and Firefox are now working, Safari is not. It looks like it is loosing track of the CurrentContextMenu somewhere

Rob,


I did a simple test with safari (3.1.2), and all works fine. Please have a look at the attached sample and have a try or could you tell us your enviroment?


Thanks,


Johnny,



1821-ContextMenu_Test.zip (2.66 KB)

Maybe it was a issues with something cached in the browser. I can’t seem to duplicate it anymore. We’ll file that one under user error. :) 
  
 I am running into problems with the new daily builds. I can’t exactly put my finger on what is happening, but it seems like something with the layer rendering has changed under the hood between 3.1.364 and 3.1.401. For instance, when you first load a map, some layers that have isVisible=false, are on, and trying to turn on or off any layers or features does not change the map. If I had to guess, I’d say maybe something with your layer caching code, or session related. I currently do not use any of the server layer caching code, so I don’t think it is on my end. And The problems completely goes away with a simple restore of 3.1.364. 
  
 This brings up my next question: Is there some sort of documentation on what changes have been made to daily builds? It is really impossible to test everything when pulling a new dll. But if we knew what changed from the last major build, or what changed between daily builds, we could at least test those areas more before deploying. It would also be useful in discovering newly added features. 
  
 -Rob

Rob, 
  
 Thanks for submitting the issue. We did an improvement about session last days, and test with “How do I” sample which works fine, so we checked in. Thanks for yours again, I have recover all the code about it to before. Could you download the latest DLL package with version 3.1.405.0 or later and have a try? If it is ok, please let us know. 
  
 Thanks, 
  
 Johnny 


I just tried in 3.1.406, and its working fine again. Thanks. 
  
 I still think it would be helpful to see some sort of area dedicated to daily builds. Whats new, report bugs, etc.

Rob, 
  
 That’s great. Thanks for you advice, someone have working on the report, which will include all the bugs, new features we added. Please keep an eye on our website. 
  
 Thanks, 
  
 Johnny