Difference between revisions of "STP/BPMN Component/EclipseCon2008"

From Eclipsepedia

Jump to: navigation, search
(Getting your own editor)
Line 245: Line 245:
  
 
In this  part, we will rebrand the modeler and add more functionalities to our diagram.
 
In this  part, we will rebrand the modeler and add more functionalities to our diagram.
 +
 +
{| border="0" cellspacing="15" valign="top" style="width:100%;"
 +
 +
|-valign="top"
 +
|style="width:50%;"|
  
 
== Opening a bug in the browser ==
 
== Opening a bug in the browser ==
Line 324: Line 329:
  
 
Now try opening the bug by double-clicking on the text annotation while pushing Shift. It should open the bug in an external browser.
 
Now try opening the bug by double-clicking on the text annotation while pushing Shift. It should open the bug in an external browser.
 
+
|
 
== Getting your own editor ==
 
== Getting your own editor ==
  
Line 386: Line 391:
  
 
And then we add the same customizations that are done on the modeler, by adding global action handlers.
 
And then we add the same customizations that are done on the modeler, by adding global action handlers.
 
+
|}
  
 
[[Category:BPMN]]
 
[[Category:BPMN]]
 
[[Category:STP]]
 
[[Category:STP]]
 
[[Category:EclipseCon 2008]]
 
[[Category:EclipseCon 2008]]

Revision as of 19:24, 10 March 2008

This page features the tutorial Get the most of the BPMN modeler for EclipseCon 2008.

This page is related to Developing with the STP BPMN modeler and Using the STP BPMN modeler.

This is a work in progress, please watch the page to stay tuned. If you want to submit something to this page, please post to this mailing list first.

Here is the outline of the tutorial:

  • 16h: Presentation
  • 16h15: Modeling BPMN
  • 16h45: Interactions with the modeler
  • 17h05: Get your own editor
  • 17h35: Future plans and conclusions
  • 17h50: Questions


Contents

What's in the box

An active Eclipse component

  • Going 1.0
  • Just i18n'ed

A GMF-based modeler

A tool to model BPMN

BPMN modeling sample

Below is a list of items we want to cover during the BPMN modeling sample.

File:Warning Sign.png This part of the tutorial needs extensive caring, it will probably be about the process to enter bugs in Bugzilla and deal with them.


  • Palette
  • Popup toolbar
  • Appearance tab
  • Creating basic shapes
    • Different activity types
    • Gateways
  • Sequence and messaging edges
    • Connection rules
    • Customized handles
    • Customize the edge and the reset connection button
    • Change the order of edges for an activity
  • Insert space tool
  • Using artifacts
    • TODO tags
  • Validation
    • Using the builder to validate the diagram
  • Documentation
    • Attaching a reference to a project file to a shape
    • Opening a file

The annotation coding sample

The bug view

This sample demonstrates how you can integrate the BPMN modeler with an external application. Our coding sample will consist in creating a new plugin, which will transform bugs into text annotations during a drag and drop operation.

In this sample we will use a plugin (org.eclipse.bpmn.sample.bugView) which shows a tree view of various bugs.

Creating the drag and drop plugin

Create the plugin, make it dependent of org.eclipse.stp.bpmn.diagram and org.eclipse.stp.bpmn.sample.bugView.

IDnDHandlers

Open the extensions tab and create a new extension for org.eclipse.core.runtime.adapters:

<extension point="org.eclipse.core.runtime.adapters">
   <factory adaptableType="org.eclipse.stp.bpmn.sample.bugView.bug.view.IBug" 
            class="org.eclipse.stp.bpmn.sample.bugDnD.dnd.BugAdapterFactory">
      <adapter type="org.eclipse.stp.bpmn.dnd.IDnDHandler"/>
   </factory>
</extension>

Then, we create the adapter factory by naming it BugAdapterFactory and placing it in dnd package under the plugin class.

The contents of the adapter factory should like this:

public class BugAdapterFactory implements IAdapterFactory {
 
    public Object getAdapter(Object adaptableObject, Class adapterType) {
        if (adaptableObject instanceof IBug && 
                IDnDHandler.class.equals(adapterType)) {
            return new BugDnDHandler((IBug) adaptableObject);
        }
        return null;
    }
 
    public Class[] getAdapterList() {
        return new Class[] {IDnDHandler.class};
    }
 
}

We create a BugDnDHandler class that will extend AbstractViewDnDHandler.

In its constructor this class takes a IBug object.

You can split the IDnDHandler implementation into two aspects. It implements a menu look and feel on one hand, and returns a command on the other hand.

We determine the number of items to show in the menu, and we provide a label and an image for each of them.

public int getItemCount() {
        return 1;
    }
 
    public Image getMenuItemImage(IGraphicalEditPart hoverPart, int index) {
        if (bug.getState() == IBug.FIXED) {
            return BugView.BUG_FIXED;
        } else {
            return BugView.BUG;
        }
    }
 
    public String getMenuItemLabel(IGraphicalEditPart hoverPart, int index) {
        return "Drop a bug over the diagram";
    }

Now for the interesting bits: the drop command itself.

    public Command getDropCommand(IGraphicalEditPart hoverPart, int index,
            Point dropLocation) {
        BPMNVisual2ProcessGenerator generator = new BPMNVisual2ProcessGenerator();
        TextAnnotation textA = generator.addTextAnnotation(null, bug.getSummary());
        Map<String, String> details = new HashMap<String, String>();
        details.put("state", String.valueOf(bug.getState()));
        details.put("number", String.valueOf(bug.getNumber()));
        generator.addAnnotation(textA, BUG_ANNOTATION_SOURCE, details);
        generator.generateViews();
        View textAnnotationView = generator.getSemantic2notationMap().get(textA);
 
        return getDropViewCommand(Collections.singletonList(textAnnotationView), 
                dropLocation, hoverPart);
    }

In this method, we use a generator to generate semantic elements and their views.

Let's create the generator:

BPMNVisual2ProcessGenerator generator = new BPMNVisual2ProcessGenerator();

Now we use it to create a text annotation that we annotate with an EAnnotation.

TextAnnotation textA = generator.addTextAnnotation(null, bug.getSummary());
Map<String, String> details = new HashMap<String, String>();
details.put("state", String.valueOf(bug.getState()));
details.put("number", String.valueOf(bug.getNumber()));
generator.addAnnotation(textA, BUG_ANNOTATION_SOURCE, details);

We generate the view of the text annnotation:

generator.generateViews();
View textAnnotationView = generator.getSemantic2notationMap().get(textA);

We use a helper method defined in the super class to create the command that will actually drop the view.

return getDropViewCommand(Collections.singletonList(textAnnotationView), 
                dropLocation, hoverPart);

File:Warning Sign.png If you try the run the plugin as is, nothing will happen. Adapter factories are lazy extensions, ie they do not trigger the activation of their bundle when being called. So you need to make sure the bundle is called by creating an other extension point or calling one of its class from another plugin.

So we need an other extension point to activate our plugin, uh ? We will settle for an annotation decorator.


Let's create the org.eclipse.stp.bpmn.sample.bugDnD.decorator package, and get back to the Manifest editor.

We select the org.eclipse.stp.bpmn.diagram.EAnnotationDecorator extension point in the wizard. The source attribute showing should be the bug annotation source.

Extension point annotation decorator part 1.png File:Extension point annotation decorator part 2.png


Then we instantiate the class in charge of decorating the annotated shapes, let's name it BugAnnotationDecorator.

This class implements IEAnnotationDecorator:

    public String getAssociatedAnnotationSource() {
        return BugDnDHandler.BUG_ANNOTATION_SOURCE;
    }
 
    public Direction getDirection(EditPart part, EModelElement elt,
            EAnnotation ann) {
        return Direction.SOUTH_WEST;
    }
 
    public ImageDescriptor getImageDescriptor(EditPart part,
            EModelElement element, EAnnotation annotation) {
        return BugDnDPlugin.imageDescriptorFromPlugin(BugDnDPlugin.PLUGIN_ID, "icons/bug_decorator.gif");
    }
 
    public IFigure getToolTip(EditPart part, EModelElement element,
            EAnnotation annotation) {
        Label label = new Label();
        label.setText("#" + annotation.getDetails().get("number"));
        return label;
    }

Now we can run the demo! Open the execution environment and a BPMN diagram, along with the bug view.

Drop a bug view over the pool and here is the result:

File:Bug drop view.png

Extending the modeler

In this part, we will rebrand the modeler and add more functionalities to our diagram.

Opening a bug in the browser

So far we have seen how to annotate shapes with bugs. While this is certainly looking good, it'd be great to actually use that for a practical purpose. In this section we will learn how to override the edit part provider to extend the annotation edit parts and give a different open edit policy that will open the bugs in a browser.

We create a new plugin named org.eclipse.stp.bpmn.sample.bugEditor for this.

In GMF, the edit part service looks for edit part providers, sorts them depending on their priority, and picks the one with the highest one (there are other ways to activate or deactivate the provider, see this help page for more).

We add an extension point on org.eclipse.gmf.runtime.diagram.ui.editpartProviders?, designating the class and the priority on which we want this provider to be executed.

We create the provider by extending the default edit part provider, setting a new factory.

public class BugEditPartProvider extends BpmnEditPartProvider {
 
    public BugEditPartProvider() {
        setFactory(new BugEditPartFactory());
        setAllowCaching(true);
    }
 
}

The factory extends the BPMN factory. Its only method consists in returning an edit part representing a view passed as an argument:

 
        /**
         * Creates a special text annotation edit part
         */
        public EditPart createEditPart(EditPart context, Object model) {
             if (model instanceof View) {
                 final View view = (View) model;
                 int viewVisualID = BpmnVisualIDRegistry.getVisualID(view);
                 switch (viewVisualID) {
                 case TextAnnotationEditPart.VISUAL_ID :
                     [...]
                 case TextAnnotation2EditPart.VISUAL_ID :
                     [...]
                 }
             }
             return super.createEditPart(context, model);
        }
    }

For the case of the text annotation edit parts, we override the default edit parts to change their default edit policies:

return new TextAnnotationEditPart(view) {
 
  @Override
  protected void createDefaultEditPolicies() {
     super.createDefaultEditPolicies();
     installEditPolicy(EditPolicyRoles.OPEN_ROLE, new OpenBugEditPolicy());
  }
};

We then write the open bug edit policy which will open a browser with the bug url when requested:

String number = EcoreUtil.getAnnotation(((EModelElement) object), BugDnDHandler.BUG_ANNOTATION_SOURCE, "number");
// and open the browser
try {
   PlatformUI.getWorkbench().getBrowserSupport().createBrowser(
                                            IWorkbenchBrowserSupport.AS_EXTERNAL
                                            | IWorkbenchBrowserSupport.NAVIGATION_BAR
                                            | IWorkbenchBrowserSupport.LOCATION_BAR,
                                            "openbug", // the id, use the same if you want to reuse the same browser 
                                            "Bug #" + number, // the title
                                            ""). // the tooltip
                             openURL(new URL("http://bugs.eclipse.org/" + number));
                        } catch (Exception e) {
                          e.printStackTrace();
                        }

Now try opening the bug by double-clicking on the text annotation while pushing Shift. It should open the bug in an external browser.

Getting your own editor

It's just a final touch on top of our additions; we want our own editor.

To do that we will subclass BpmnDiagramEditor, and declare it as the default one for *.bpmn_diagram files.

public class BugBpmnEditor extends BpmnDiagramEditor {
 
    public static final String ID = "org.eclipse.stp.bpmn.sample.bugeditor.editor";
 
    static {
 
        PlatformUI.getWorkbench().getEditorRegistry().
            setDefaultEditor("*.bpmn_diagram", ID); //$NON-NLS-1$
    }
}

We need to declare the BugBpmnEditor editor in plugin.xml.

On top of that we bind it to its diagram action bar contributor.

<extension point="org.eclipse.ui.editors">
      <editor
            class="org.eclipse.stp.bpmn.sample.bugeditor.BugBpmnEditor"
            contributorClass="org.eclipse.stp.bpmn.sample.bugeditor.BugDiagramActionBarContributor"
            extensions="bpmn_diagram"
            icon="icons/bug.gif"
            id="org.eclipse.stp.bpmn.sample.bugeditor.editor"
            name="Bug BPMN Editor">
      </editor>
</extension>

This contributor doesn't do much, just redirecting to our new editor the actions contributed to the BPMN editor.

public class BugDiagramActionBarContributor extends
        BpmnDiagramActionBarContributor {
 
    protected Class getEditorClass() {
        return BugBpmnEditor.class;
    }
 
    protected String getEditorId() {
        return BugBpmnEditor.ID;
    }
}

We bind the BPMN palette provider to the bug editor.

<extension point="org.eclipse.gmf.runtime.diagram.ui.paletteProviders">
   <paletteProvider class="org.eclipse.stp.bpmn.diagram.providers.BpmnPaletteProvider">
      <Priority name="Lowest"/>
      <editor id="org.eclipse.stp.bpmn.sample.bugeditor.editor"/>
   </paletteProvider>
</extension>

And then we add the same customizations that are done on the modeler, by adding global action handlers.