athen---how-to-correctly-write-your-own-view.md

@@ -26,7 +26,7 @@ So the controller (our view class) serves as the glue between the actual UI and
 The goal is to create the CorefView, a view with the purpose to quickly annotate character references and their corresponding cluster-ID.
 The final result should look like this:
 
-<img src="/uploads/fe1a1897b773194d50daad49cb3eedf2/corefViewOpened.PNG" alt="MVC of the editor and the views" style="width: 640px;" style="height: 480px;"/>
+<img src="/uploads/fe1a1897b773194d50daad49cb3eedf2/corefViewOpened.PNG" alt="MVC of the editor and the views" style="width: 640px;" style="height: 480px;" align="middle"/>
 
 
 ## Creating the View (The corresponding UI Element)
@@ -189,7 +189,124 @@ Last but not least, a refresh method is created, which is invoked by the control
 	}
 ```
 
+With this, the first part of the UI is done, we can now check a sub component. (this tutorial does not go thorugh all of the code, it just does this until all principles are introduced once)
 
+### The Button Composite *CorefViewButtonComposite*
+
+Since so far, there was no example of how to actually communicate with the controller we take a look at the button composite
+
+```java
+public class CorefViewButtonComposite extends Composite {
+
+	// Buttons of the first row
+	private Button buttonNewEntity;
+	private Button buttonIsEntity;
+	private Button buttonNoEntity;
+
+	// Buttons of the second row
+	private Button buttonAddRelation;
+	private Button buttonRemoveRelation;
+
+	// Buttons of the third row
+	private Button buttonPreprocess;
+	private Button buttonDeleteHandled;
+	private Button buttonShowSocialNetwork;
+
+	// the controller
+	private CorefView part;
+
+	public CorefViewButtonComposite(Composite parent, int style) {
+		super(parent, style);
+
+	}
+
+	public void setInput(CorefView part) {
+		this.part = part;
+
+		initLayout();
+
+		initEventHandler();
+
+	}
+
+	private void initLayout() {
+
+		this.setLayout(new GridLayout(3, false));
+
+		// first row
+		buttonNewEntity = new Button(this, SWT.PUSH);
+		buttonNewEntity.setText("New Entity");
+
+		buttonIsEntity = new Button(this, SWT.PUSH);
+		buttonIsEntity.setText("Is Entity");
+
+		buttonNoEntity = new Button(this, SWT.PUSH);
+		buttonNoEntity.setText("Delete Entity");
+
+		// Second row
+		buttonAddRelation = new Button(this, SWT.PUSH);
+		buttonAddRelation.setText("Add Relation");
+
+		// needs a dummy becasue this row only has two buttons
+		new Label(this, SWT.NONE).setVisible(false);
+
+		buttonRemoveRelation = new Button(this, SWT.PUSH);
+		buttonRemoveRelation.setText("Remove Relation");
+
+		// third row
+		buttonPreprocess = new Button(this, SWT.PUSH);
+		buttonPreprocess.setText("Preprocess");
+
+		buttonDeleteHandled = new Button(this, SWT.PUSH);
+		buttonDeleteHandled.setText("Delete Handled");
+
+		buttonShowSocialNetwork = new Button(this, SWT.PUSH);
+		buttonShowSocialNetwork.setText("Show social network");
+
+	}
+
+	private void initEventHandler() {
+
+		// first row
+		buttonNewEntity.addListener(SWT.Selection, (Event e) -> part.createNewEntity());
+		buttonIsEntity.addListener(SWT.Selection, (Event e) -> part.entityAccepted());
+		buttonNoEntity.addListener(SWT.Selection, (Event e) -> part.deleteEntity());
+		
+		//Second row
+		buttonAddRelation.addListener(SWT.Selection, (Event e) -> part.addRelation());
+		buttonRemoveRelation.addListener(SWT.Selection, (Event e) -> part.deleteRelation());
+		//third row
+		buttonPreprocess.addListener(SWT.Selection, (Event e) -> part.preprocess());
+		buttonDeleteHandled.addListener(SWT.Selection, (Event e) -> part.deleteAllHandled());
+		buttonShowSocialNetwork.addListener(SWT.Selection, (Event e) -> part.showSocialNetwork());
+		
+	}
+
+```
+
+This class follows strictly the previously introduced concept of having a method to set the input, to init the layout, a another one to register the handler to the UI elements. The last method is the focus of this current discussion. As you can see, structuring your code this way, makes it very easy to read and clean. Since all of those buttons are active all the time and completely independent of the current state of the model, we do not need a refresh method in here. Lets take a closer look at the method to register the event handler:
+
+```java
+	private void initEventHandler() {
+
+		// first row
+		buttonNewEntity.addListener(SWT.Selection, (Event e) -> part.createNewEntity());
+		buttonIsEntity.addListener(SWT.Selection, (Event e) -> part.entityAccepted());
+		buttonNoEntity.addListener(SWT.Selection, (Event e) -> part.deleteEntity());
+		
+		//Second row
+		buttonAddRelation.addListener(SWT.Selection, (Event e) -> part.addRelation());
+		buttonRemoveRelation.addListener(SWT.Selection, (Event e) -> part.deleteRelation());
+		//third row
+		buttonPreprocess.addListener(SWT.Selection, (Event e) -> part.preprocess());
+		buttonDeleteHandled.addListener(SWT.Selection, (Event e) -> part.deleteAllHandled());
+		buttonShowSocialNetwork.addListener(SWT.Selection, (Event e) -> part.showSocialNetwork());
+		
+	}
+
+```
+
+On all those buttons, a selectionlistener is added. Thanks to Java8 this can be done in a very clean fashion. And all those handler should do, is to call a method in the controller! The controller takes care of the rest.