<a:form id="form">
<style>
.ui-organigram .ui-organigram-node.division {
background: #93e7ff;
background: -moz-linear-gradient(top, #93e7ff 0%, #007efc 100%);
background: -webkit-linear-gradient(top, #93e7ff 0%,#007efc 100%);
background: linear-gradient(to bottom, #93e7ff 0%,#007efc 100%);
}
.ui-organigram .ui-organigram-node.employee {
background: #88c048;
background: -moz-linear-gradient(top, #88c048 0%, #69a038 100%);
background: -webkit-linear-gradient(top, #88c048 0%,#69a038 100%);
background: linear-gradient(to bottom, #88c048 0%,#69a038 100%);
}
</style>
<a:growl id="growl" />
<a:organigram id="organigram"
widgetVar="organigram"
value="#\{organigramView.rootNode}"
var="node"
leafNodeConnectorHeight="#\{organigramView.leafNodeConnectorHeight}"
autoScrollToSelection="#\{organigramView.autoScrollToSelection}"
zoom="#\{organigramView.zoom}"
selection="#\{organigramView.selection}"
style="#\{organigramView.style}">
<a:ajax event="dragdrop" process="@this" update="@form:growl" listener="#\{organigramView.nodeDragDropListener}" />
<a:ajax event="select" process="@this" update="@form:growl" listener="#\{organigramView.nodeSelectListener}" />
<a:ajax event="contextmenu" process="@this" />
<a:ajax event="collapse" process="@this" update="@form:growl" listener="#\{organigramView.nodeCollapseListener}" />
<a:ajax event="expand" process="@this" update="@form:growl" listener="#\{organigramView.nodeExpandListener}" />
<a:organigramNode>
<h:outputText value="#\{node.data}" />
</a:organigramNode>
<a:organigramNode type="root"
style="border-radius: 10px;">
<h:outputText value="#\{node.data}" />
</a:organigramNode>
<a:organigramNode type="division"
styleClass="division"
icon="ui-icon-suitcase"
iconPos="left">
<h:outputText value="#\{node.data}" />
</a:organigramNode>
<a:organigramNode type="employee"
styleClass="employee"
icon="ui-icon-person">
<h:outputText value="#\{node.data}" />
</a:organigramNode>
</a:organigram>
<a:contextMenu for="organigram" nodeType="employee">
<a:menuitem value="fire employee"
update="organigram"
icon="ui-icon-close"
actionListener="#\{organigramView.removeEmployee()}" />
</a:contextMenu>
<a:contextMenu for="organigram" nodeType="division">
<a:menuitem value="Add employee"
ajax="false"
icon="ui-icon-plus"
onclick="PF('addEmployeeDialog').show(); return false;" />
<a:menuitem value="Remove division"
update="organigram @form:growl"
icon="ui-icon-close"
actionListener="#\{organigramView.removeDivision()}" />
</a:contextMenu>
<a:dialog id="addEmployeeDialog"
widgetVar="addEmployeeDialog"
header="Add employee">
<a:inputText value="#\{organigramView.employeeName}" />
<a:commandButton process="@parent"
update=":form:organigram"
value="Add"
actionListener="#\{organigramView.addEmployee()}"
oncomplete="PF('addEmployeeDialog').hide();"/>
</a:dialog>
</a:form>
<a:form>
<a:panel header="Options">
<h:panelGrid columns="2">
<h:outputLabel value="zoom" />
<a:selectBooleanCheckbox value="#\{organigramView.zoom}">
<a:ajax process="@this" update=":form:organigram" />
</a:selectBooleanCheckbox>
<h:outputLabel value="autoScrollToSelection" />
<a:selectBooleanCheckbox value="#\{organigramView.autoScrollToSelection}">
<a:ajax process="@this" update=":form:organigram" />
</a:selectBooleanCheckbox>
<h:outputLabel value="leafNodeConnectorHeight" />
<a:inputText value="#\{organigramView.leafNodeConnectorHeight}">
<a:ajax process="@this" update=":form:organigram" />
</a:inputText>
<h:outputLabel value="style" />
<a:inputText value="#\{organigramView.style}" size="100">
<a:ajax process="@this" update=":form:organigram" />
</a:inputText>
<a:commandButton value="scrollToSelection" onclick="PF('organigram').scrollToSelection(); return false;" />
<a:commandButton value="Update Organigram" update=":form:organigram" />
</h:panelGrid>
</a:panel>
</a:form>
package com.jarch.showcase.view.data;
import org.primefaces.component.organigram.OrganigramHelper;
import org.primefaces.event.organigram.OrganigramNodeCollapseEvent;
import org.primefaces.event.organigram.OrganigramNodeDragDropEvent;
import org.primefaces.event.organigram.OrganigramNodeExpandEvent;
import org.primefaces.event.organigram.OrganigramNodeSelectEvent;
import org.primefaces.model.DefaultOrganigramNode;
import org.primefaces.model.OrganigramNode;
import java.io.Serializable;
import javax.annotation.PostConstruct;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.context.FacesContext;
@ManagedBean
@ViewScoped
public class OrganigramView implements Serializable {
private OrganigramNode rootNode;
private OrganigramNode selection;
private boolean zoom = false;
private String style = "width: 800px";
private int leafNodeConnectorHeight = 0;
private boolean autoScrollToSelection = false;
private String employeeName;
@PostConstruct
public void init() {
selection = new DefaultOrganigramNode(null, "Ridvan Agar", null);
rootNode = new DefaultOrganigramNode("root", "CommerceBay GmbH", null);
rootNode.setCollapsible(false);
rootNode.setDroppable(true);
OrganigramNode softwareDevelopment = addDivision(rootNode, "Software Development", "Ridvan Agar");
OrganigramNode teamJavaEE = addDivision(softwareDevelopment, "Team JavaEE");
addDivision(teamJavaEE, "JSF", "Thomas Andraschko");
addDivision(teamJavaEE, "Backend", "Marie Louise");
OrganigramNode teamMobile = addDivision(softwareDevelopment, "Team Mobile");
addDivision(teamMobile, "Android", "Andy Ruby");
addDivision(teamMobile, "iOS", "Stevan Jobs");
addDivision(rootNode, "Managed Services", "Thorsten Schultze", "Sandra Becker");
OrganigramNode marketing = addDivision(rootNode, "Marketing");
addDivision(marketing, "Social Media", "Ali Mente", "Susanne Muster");
addDivision(marketing, "Press", "Manfred Mustermann", "Hans Peter");
addDivision(rootNode, "Management", "Hassan El Manfalouty");
}
protected OrganigramNode addDivision(OrganigramNode parent, String name, String... employees) {
OrganigramNode divisionNode = new DefaultOrganigramNode("division", name, parent);
divisionNode.setDroppable(true);
divisionNode.setDraggable(true);
divisionNode.setSelectable(true);
if (employees != null) {
for (String employee : employees) {
OrganigramNode employeeNode = new DefaultOrganigramNode("employee", employee, divisionNode);
employeeNode.setDraggable(true);
employeeNode.setSelectable(true);
}
}
return divisionNode;
}
public void nodeDragDropListener(OrganigramNodeDragDropEvent event) {
FacesMessage message = new FacesMessage();
message.setSummary("Node '" + event.getOrganigramNode().getData() + "' moved from " + event.getSourceOrganigramNode().getData() + " to '" + event.getTargetOrganigramNode().getData() + "'");
message.setSeverity(FacesMessage.SEVERITY_INFO);
FacesContext.getCurrentInstance().addMessage(null, message);
}
public void nodeSelectListener(OrganigramNodeSelectEvent event) {
FacesMessage message = new FacesMessage();
message.setSummary("Node '" + event.getOrganigramNode().getData() + "' selected.");
message.setSeverity(FacesMessage.SEVERITY_INFO);
FacesContext.getCurrentInstance().addMessage(null, message);
}
public void nodeCollapseListener(OrganigramNodeCollapseEvent event) {
FacesMessage message = new FacesMessage();
message.setSummary("Node '" + event.getOrganigramNode().getData() + "' collapsed.");
message.setSeverity(FacesMessage.SEVERITY_INFO);
FacesContext.getCurrentInstance().addMessage(null, message);
}
public void nodeExpandListener(OrganigramNodeExpandEvent event) {
FacesMessage message = new FacesMessage();
message.setSummary("Node '" + event.getOrganigramNode().getData() + "' expanded.");
message.setSeverity(FacesMessage.SEVERITY_INFO);
FacesContext.getCurrentInstance().addMessage(null, message);
}
public void removeDivision() {
// re-evaluate selection - might be a differenct object instance if viewstate serialization is enabled
OrganigramNode currentSelection = OrganigramHelper.findTreeNode(rootNode, selection);
setMessage(currentSelection.getData() + " will entfernt werden.", FacesMessage.SEVERITY_INFO);
}
public void removeEmployee() {
// re-evaluate selection - might be a differenct object instance if viewstate serialization is enabled
OrganigramNode currentSelection = OrganigramHelper.findTreeNode(rootNode, selection);
currentSelection.getParent().getChildren().remove(currentSelection);
}
public void addEmployee() {
// re-evaluate selection - might be a differenct object instance if viewstate serialization is enabled
OrganigramNode currentSelection = OrganigramHelper.findTreeNode(rootNode, selection);
OrganigramNode employee = new DefaultOrganigramNode("employee", employeeName, currentSelection);
employee.setDraggable(true);
employee.setSelectable(true);
}
private void setMessage(String msg, FacesMessage.Severity severity) {
FacesMessage message = new FacesMessage();
message.setSummary(msg);
message.setSeverity(severity);
FacesContext.getCurrentInstance().addMessage(null, message);
}
public OrganigramNode getRootNode() {
return rootNode;
}
public void setRootNode(OrganigramNode rootNode) {
this.rootNode = rootNode;
}
public OrganigramNode getSelection() {
return selection;
}
public void setSelection(OrganigramNode selection) {
this.selection = selection;
}
public boolean isZoom() {
return zoom;
}
public void setZoom(boolean zoom) {
this.zoom = zoom;
}
public String getEmployeeName() {
return employeeName;
}
public void setEmployeeName(String employeeName) {
this.employeeName = employeeName;
}
public String getStyle() {
return style;
}
public void setStyle(String style) {
this.style = style;
}
public int getLeafNodeConnectorHeight() {
return leafNodeConnectorHeight;
}
public void setLeafNodeConnectorHeight(int leafNodeConnectorHeight) {
this.leafNodeConnectorHeight = leafNodeConnectorHeight;
}
public boolean isAutoScrollToSelection() {
return autoScrollToSelection;
}
public void setAutoScrollToSelection(boolean autoScrollToSelection) {
this.autoScrollToSelection = autoScrollToSelection;
}
}