Infrastructure Map Server Developer

Infrastructure Map Server Developer

Reply
Active Contributor
tmblackflag
Posts: 48
Registered: ‎07-20-2011
Message 1 of 3 (1,158 Views)

Who uses the MobileViewer? How to customize it

1158 Views, 2 Replies
05-01-2012 04:33 PM

Hello there,

 

I've read through all the Mobileviewer documentation and am somewhat comfortable with the architecture of it. I've removed some unwanted buttons and added a few news ones of my own. My question however is, with the out of the box panning and zoom to rectangle buttons, after a zoom to rectangle i want to deactivate that button and activate the pan and zoom button..

 

So in the Index.html file the two buttons are loaded like so:

 

Pan/zoom button:

        var mgNavigateButton = new mobileViewer.Button({map: mgMap, imageSrc: 'images/zoom-icon.png',
            label: mobileViewer.getString('PAN_ZOOM'),
            buttonId: 'navigateBtn',
            activeControls: [mgTapSelect, mgPan, mgPinchZoom, mgProperties, mgDoubleTapZoom]});

 

Zoom to rectangle button:

        var mgZoomRectButton = new mobileViewer.Button({map: mgMap, imageSrc: 'images/zoom-rectangle-icon.png',
            label: mobileViewer.getString('ZOOM_RECTANGLE'),
            buttonId: 'zoomRectBtn',
            activeControls: [mgTapSelect, mgProperties, mgDragZoomRect, mgPinchZoomRect, mgDoubleTapZoom]});

 

Zoom rectangle js file

<script type="text/javascript" src="lib/mobileviewer_control_dragzoomrectangle.js"></script>

 

Pan and zoom JS file

<script type="text/javascript" src="lib/mobileviewer_control_pan.js"></script>

 

In the onDeactivate function of mobileViewer.DragZoomRectangle i want to activate the mobileViewer.Pan control. I'm trying to do it like so with zoom to rectangle

 

    onDeactivate: function(e)
    {
        this.boxDiv.style.visibility = 'hidden';
        mgNavigateButton.activate();
    },

 

but firebug tells me: mgNavigateButton is not defined

 

This OOP Javascript is a bit new to me. How can I access the pan control from within the zoom to rectangle control?

Valued Mentor
jackie.ng
Posts: 284
Registered: ‎10-06-2008
Message 2 of 3 (1,155 Views)

Re: Who uses the MobileViewer? How to customize it

05-01-2012 07:48 PM in reply to: tmblackflag

Probably because these controls are independent of each other, so they would not know anything about other controls (ie. That DragZoomRectangle control would not be carrying a reference to the NavigateButton control)

 

Assuming all of these controls inherit from OpenLayers.Control, what you want to do instead is register a listener function to the deactivate event for your control(s) in question:

 

mgZoomRectButton.events.register("deactivate", this, function(e) {
    mgNavigateButton.activate();
});

The above code should be in the same place where you are creating the controls. You shouldn't really have to modify the control scripts in any way. They should be providing event hooks like the one above to do what you are after.

 

- Jackie

 

Disclaimer: Haven't looked at the Mobile Viewer code, but I do know it's built on top of OpenLayers, and the answer I've given is contextual to OpenLayers and not MapGuide/AIMS.

ADN Support Specialist
Daniel.Du
Posts: 270
Registered: ‎12-23-2008
Message 3 of 3 (1,064 Views)

Re: Who uses the MobileViewer? How to customize it

07-23-2012 11:50 PM in reply to: tmblackflag

Have you ever refer to this blog post? 

http://adndevblog.typepad.com/infrastructure/2012/06/creating-custom-control-for-mobile-viewer-of-ai...

 

Hope it is helpful for you.:smileyhappy:



Daniel Du
Developer Technical Services
Autodesk Developer Network

Post to the Community

Have questions about Autodesk products? Ask the community.

New Post
Announcements
Do you have 60 seconds to spare? The Autodesk Community Team is revamping our site ranking system and we want your feedback! Please click here to launch the 5 question survey. As always your input is greatly appreciated.