LEADTOOLS JavaScript (Leadtools.Controls)
LEAD Technologies, Inc

WorkingInteractiveMode Property

Example 

Gets the ImageViewerInteractiveMode that the viewer control is currently using to process input events.
Syntax
  get_workingInteractiveMode();  
!MISSING Scrap '_RTJavaScript_PROPERTY_SYNTAX'!

Property Value

TypeDescription
ImageViewerInteractiveModeThe ImageViewerInteractiveMode that the viewer control is currently using to process input events.
Remarks

ImageViewer will hook to the ImageViewerInteractiveMode.WorkStarted and ImageViewerInteractiveMode.WorkCompleted of the interactive modes set in SetMouseInteractiveMode, MouseWheelInteractiveMode or TouchInteractiveMode. When work starts or completes, the WorkingInteractiveModeChanged event fires and the value of WorkingInteractiveMode updates accordingly. You can use WorkingInteractiveMode to perform any custom action required by your application.

Example

Start with the ImageViewer example, remove all the code inside the example function (search for the // TODO: add example code here comment) and insert the following code:

Open the HTML page in your browser, now when you click the Example button, the label will be updated as you drag/zoom or use the magnify glass.

  • JavaScript
  •   
     
    example: function SiteLibrary_DefaultPage$example(viewer) {
       // Pan Zoom interactive mode is set in other parts of this demo
    
       // Hook to WorkingInteractiveMode of the viewer
       viewer.add_workingInteractiveModeChanged
       var exampleLabel = document.getElementById("exampleLabel");
       var content;
    
       // This will be used by mouse and touch, so delcare it here once
       var zoomPan = new Leadtools.Controls.ImageViewerPanZoomInteractiveMode();
    
       // Check if the browser supports mouse
       if(Leadtools.LTHelper.supportsMouse) {
          // Zoom pan with left button
          viewer.setMouseInteractiveMode(Leadtools.Controls.MouseButton.left, zoomPan);
    
          // Magnify glass with right button
          var magnifyGlass = new Leadtools.Controls.ImageViewerMagnifyGlassInteractiveMode();
          viewer.setMouseInteractiveMode(Leadtools.Controls.MouseButton.right, magnifyGlass);
    
          content = "Left button and drag to pan, left button with control and drag to zoom, right button use the magnify glass";
       } else {
          // Touch device, set zoom pan only
          viewer.set_touchInteractiveMode(zoomPan);
          content = "Touch and drag to pan, pinch to zoom";
       }
    
       exampleLabel.textContent = content;
    
       // Hook to the WorkingInteractiveModeChanged event
       viewer.add_workingInteractiveModeChanged(function(sender, e) {
          // Get the current working interactive mode
          var interactiveMode = viewer.get_workingInteractiveMode();
          if(interactiveMode != null) {
             exampleLabel.textContent = content + " - " + interactiveMode.get_name() + " is working";
          }
          else {
             exampleLabel.textContent = content + " - finished working";
          }
       });
    },
See Also

Reference

ImageViewer Object
ImageViewer Members

 

 


Products | Support | Contact Us | Copyright Notices

© 2006-2012 All Rights Reserved. LEAD Technologies, Inc.