Managing selection

> > > > >

Selection in a Web application is handled through the IlvSelectionManager and IlvSelectInteractor classes.

The IlvSelectionManager allows you to select one or more objects in the view and to move the current selection. The IlvSelectInteractor directly uses the selection manager to perform these tasks.

Note

Selection makes sense in multisession mode only.

Client-side configuration

To use the selection on the client side, import the following scripts:

<script TYPE="text/javascript" src="script/IlvAbstractSelectionManager.js"></
script>
<script TYPE="text/javascript" src="script/framework/IlvSelectionManager.js"></
script>
<script TYPE="text/javascript" src="script/framework/IlvSelectInteractor.js"></
script>

To retrieve the selection manager on the client side, use the following code:

var selectionManager = view.getSelectionManager();

Server-side configuration

By default, the selection feature is not enabled in the image servlet support.

To make the selection feature available, you need to call setSelectionEnabled(true) .

Example:

public class DiagrammerServlet  extends IlvDiagrammerServlet  {

  protected IlvSDMServletSupport createServletSupport(ServletContext context) {
    return new DiagrammerServletSupport(context);
  }

}

public class DiagrammerServletSupport extends IlvDiagrammerServletSupport {  
  public DiagrammerServletSupport(ServletContext context) {
    super(context);    
    setSelectionEnabled(true); 
  }  
}

Image mode or Rectangle mode

The selection manager provides two modes for displaying the selection of objects:

Image mode: after each selection on the client, an image request is issued.
Rectangle mode: after each selection on the client, the bounding box of each selected object is queried to the server and displayed on the client.

The color and thickness of the bounding box rectangles can be configured through the selection manager.

Properties

The selection servlet can be configured to provide additional information for each selected object. This information corresponds to additional properties that can be used on the client.

To do so, you need to subclass the selection support implementation to override

getAdditionalProperties(IlvSelectionResponse
								response, Object object)

, as in the following example.

The following selection support adds the properties of an SDM node:

//Subclass to override the getAdditionalProperties method
public class DiagrammerSelectionSupport extends IlvDiagrammerSelectionSupport {

  public DiagrammerSelectionSupport(IlvDiagrammerServletSupport support) {
    super(support);
  }

  protected ArrayList getAdditionalProperties(IlvSelectionResponse response,
   Object object) {
    ArrayList props = super.getAdditionalProperties(response, object);
    
    IlvSDMNode node = (IlvSDMNode) object;
    IlvDiagrammer diagrammer = (IlvDiagrammer)
       response.getProperty(DIAGRAMMER_KEY);
    IlvSDMModel model = diagrammer.getEngine().getModel();
           
    String names[] = model.getObjectPropertyNames(node);
    
    for (int i = 0; i < names.length; i++) {
      ArrayList l = new ArrayList();
      l.add(names[i]);
      l.add(model.getObjectProperty(node, names[i]));
      props.add(l);
    }
    
     return props;
  }

}

//Use the new selection selection support class in the servlet support.
public class DiagrammerServletSupport extends IlvDiagrammerServletSupport {
  
  [...]

  protected IlvSelectionSupport createSelectionSupport() {
    return new DiagrammerSelectionSupport(this);
  }
  
}

In image mode, you need to issue an additional request to get the selection information (the information is disabled by default). To force this additional request on each selection, use view.getSelectionManager().setForceUpdateProperties(true) .

In rectangle mode, the selection information is always enabled.

There are two ways to retrieve the selection information on the client side:

Get the current selection at any time.

view.getSelectionManager().getSelection()
Register a listener for selection changes.

The listener is notified of the current selection.

The additional properties are available in the properties of a selection rectangle.

If the selection support example illustrated earlier in this section is used, the following listener example fills a panel with properties of the selected object:

function showProperties(rList) {

  if (rList.length == 1) {
    var p = "<table>";

    for(var i=0; i<rList[0].getProperties(length); i++){
      var props = rList[0].getProperties();
      p += "<td>" + props[i][0]+ "</td>";
      p += "<td>" + props[i][1]+ "</td>";
    }						
    p +="<table>";
    propPanel.setContent(p);
  }
}

Listeners

Listeners can be registered for the selection manager to keep track of the selection when the selection manager is in rectangle mode. To add a listener to the selection manager, use the following method:

view.getSelectionManager().addSelectionChangedListener(listener)

listener is a function with one parameter that corresponds to the selection: a list of rectangles with additional properties.

In image mode, you need to issue an additional request to get the selection information; listeners are not notified by default.

To force this second request on each selection, use:

view.getSelectionManager().setForceUpdateProperties(true)

Moving

If moving objects is allowed on the client and server sides, the IlvSelectInteractor allows you to drag and drop objects.

Important

To avoid user actions to be overridden by the automatic layout, the node layout must be disabled when using that feature.

Current section

Developing JViews Diagrammer JavaScript Web applications