| 1 | <?xml version='1.0' encoding='UTF-8' ?> |
| 2 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| 3 | <html xmlns="http://www.w3.org/1999/xhtml" |
| 4 | xmlns:p="http://primefaces.prime.com.tr/ui" |
| 5 | xmlns:h="http://java.sun.com/jsf/html" |
| 6 | xmlns:f="http://java.sun.com/jsf/core" |
| 7 | xmlns:c="http://java.sun.com/jsp/jstl/core" |
| 8 | xmlns:ui="http://java.sun.com/jsf/facelets"> |
| 9 | <f:loadBundle basename="org.ufcspa.simdecs.resources.messages" var="msg" /> |
| 10 | <h:head> |
| 11 | <title>SimDeCS</title> |
| 12 | <link type="text/css" rel="stylesheet" href="styles.css" /> |
| 13 | </h:head> |
| 14 | <h:body> |
| 15 | <h:form id="fMenu"> |
| 16 | <p:menubar autoSubmenuDisplay="true" style="font-size: 11px; background: #ECECEC;" > |
| 17 | <p:submenu label="#{msg.editDiagramMenuFile}" icon="ui-icon ui-icon-document"> |
| 18 | <p:menuitem value="#{msg.editDiagramMenuNew}" url="#" /> |
| 19 | <p:menuitem value="#{msg.editDiagramMenuOpen}" url="#" /> |
| 20 | <p:menuitem value="#{msg.editDiagramMenuSave}" url="#" /> |
| 21 | </p:submenu> |
| 22 | <p:submenu label="#{msg.editDiagramMenuLanguage}" icon="ui-icon ui-icon-pencil"> |
| 23 | <p:menuitem value="#{msg.editDiagramMenuLanguagePortugueseLabel}" actionListener="#{languageSelector.handleLanguageChange()}" ajax="false" immediate="true"> |
| 24 | <f:param name="language" value="#{msg.editDiagramMenuLanguagePortugueseCode}" /> |
| 25 | </p:menuitem> |
| 26 | <p:menuitem value="#{msg.editDiagramMenuLanguageEnglishLabel}" actionListener="#{languageSelector.handleLanguageChange()}" ajax="false" immediate="true"> |
| 27 | <f:param name="language" value="#{msg.editDiagramMenuLanguageEnglishCode}" /> |
| 28 | </p:menuitem> |
| 29 | </p:submenu> |
| 30 | <p:submenu label="#{msg.editDiagramMenuHelp}" icon="ui-icon ui-icon-help"> |
| 31 | <p:menuitem value="#{msg.editDiagramMenuAbout}" url="#" /> |
| 32 | </p:submenu> |
| 33 | </p:menubar> |
| 34 | </h:form> |
| 35 | <br /> |
| 36 | |
| 37 | <p:ajaxStatus /> |
| 38 | <p:growl id="messageGrow1" showDetail="true" life="3000" /> |
| 39 | |
| 40 | |
| 41 | <p:panel id="diagramCanvas" header="#{editDiagram.diagramManager.diagramName}" style="font-size:12px;overflow: auto; height: 500px;"> |
| 42 | <h:form id="fdiagram"> |
| 43 | <table border="0" cellspacing="0"> |
| 44 | |
| 45 | <ui:repeat id="swimLanesLoop" value="#{editDiagram.diagramManager.swimLanes}" var="swimLane"> |
| 46 | <tr> |
| 47 | <td align="left" width="150"> |
| 48 | <p:commandLink actionListener="#{editActor.prepareWindowEditActor}" oncomplete="dialogNewActor.show();" update="fEditActor"> |
| 49 | <h:graphicImage id="swimLane#{swimLane.id}" value="#{swimLane.image}" height="150" /> |
| 50 | <f:param name="pActorID" value="#{swimLane.id}" /> |
| 51 | </p:commandLink> |
| 52 | <!-- <p:tooltip for="swimLane#{swimLane.id}" value="#{swimLane.name}" showEffect="fade" hideEffect="fade" showEffectLength="1000" hideEffectLength="1000"/> --> |
| 53 | </td> |
| 54 | <ui:repeat value="#{swimLane.nodes}" var="node"> |
| 55 | <td width="150"> |
| 56 | <p:commandLink rendered="#{!node.isInternal()}" actionListener="#{editBeginNode.prepareWindowEditBeginNode}" oncomplete="dialogBeginNode.show();" update="fEditBeginNode"> |
| 57 | <h:graphicImage rendered="#{!node.isInternal()}" id="node#{node.id}" value="#{node.currentImage}" width="150"/> |
| 58 | <f:param name="pActorID" value="#{swimLane.id}" /> |
| 59 | <f:param name="pNodeID" value="#{node.id}" /> |
| 60 | </p:commandLink> |
| 61 | <!-- <p:tooltip for="node#{node.id}" value="#{node.name}" showEffect="fade" hideEffect="fade" showEffectLength="1000" hideEffectLength="1000"/> --> |
| 62 | </td> |
| 63 | </ui:repeat> |
| 64 | <td align="left" width="150"> |
| 65 | <p:commandLink id="addNodeAction#{swimLane.id}" actionListener="#{editNode.prepareActionMenu}" oncomplete="dialogAddNodeMenu.show();" update="fAddNodeMenu"> |
| 66 | <f:param name="pActorID" value="#{swimLane.id}" /> |
| 67 | <h:graphicImage id="plus#{swimLane.id}" value="img/others/plus.png" /> |
| 68 | </p:commandLink> |
| 69 | </td> |
| 70 | </tr> |
| 71 | <tr> |
| 72 | <td style='background-image: url("img/swimLanes/separator.png");'> |
| 73 | </td> |
| 74 | <ui:repeat value="#{swimLane.nodes}" var="node"> |
| 75 | <td style='background-image: url("img/swimLanes/separator.png");'> |
| 76 | </td> |
| 77 | </ui:repeat> |
| 78 | <td style='background-image: url("img/swimLanes/separator.png");'> |
| 79 | </td> |
| 80 | </tr> |
| 81 | </ui:repeat> |
| 82 | </table> |
| 83 | </h:form> |
| 84 | </p:panel> |
| 85 | |
| 86 | <p:dialog id="dialogAddNodeMenu" widgetVar="dialogAddNodeMenu" closable="true" draggable="true" modal="true" width="500" height="300"> |
| 87 | <h:form id="fAddNodeMenu"> |
| 88 | <p:menu id="dinamycAddNodeMenu" model="#{editNode.menuActionList}" /> |
| 89 | </h:form> |
| 90 | </p:dialog> |
| 91 | |
| 92 | <p:dialog id="dialogEditNodeMenu" header="#{msg.editPropertiesTableTitle}" widgetVar="dialogEditNodeMenu" closable="true" draggable="true" modal="true" width="600" height="450"> |
| 93 | <h:form id="fEditNodeMenu"> |
| 94 | <p:dataTable var="property" value="#{editNode.properties}"> |
| 95 | |
| 96 | <p:column headerText="#{msg.editPropertiesTableName}"> |
| 97 | <h:outputText value="#{property.name}"/> |
| 98 | </p:column> |
| 99 | |
| 100 | <p:column headerText="#{msg.editPropertiesTableValue}"> |
| 101 | <p:resizable /> |
| 102 | <p:cellEditor> |
| 103 | <f:facet name="output"><h:outputText value="#{property.value}"/></f:facet> |
| 104 | <f:facet name="input"><h:inputText value="#{property.value}" required="#{property.required}" maxlength="#{property.maxLength}" /></f:facet> |
| 105 | </p:cellEditor> |
| 106 | </p:column> |
| 107 | |
| 108 | <p:column> |
| 109 | <p:rowEditor /> |
| 110 | </p:column> |
| 111 | </p:dataTable> |
| 112 | <center> |
| 113 | <p:commandButton id="changePropertiesButton" value="#{msg.editPropertiesButtonOk}" actionListener="#{editNode.addNode}" update="fdiagram" oncomplete="dialogEditNodeMenu.hide();" /> |
| 114 | <p:commandButton id="cancelChangePropertiesButton" value="#{msg.editPropertiesButtonCancel}" type="button" onclick="dialogAddNodeMenu.hide();"/> |
| 115 | </center> |
| 116 | </h:form> |
| 117 | </p:dialog> |
| 118 | |
| 119 | |
| 120 | <p:dialog id="dialogNewActor" widgetVar="dialogNewActor" header="#{msg.editDiagramEditActor}" closable="true" draggable="true" modal="true" width="500"> |
| 121 | <h:form id="fEditActor"> |
| 122 | <p:panel id="dialogNewActorPanel"> |
| 123 | <h:inputHidden id="editActorID" value="#{editActor.id}" /> |
| 124 | <table class="formTable"> |
| 125 | <tr> |
| 126 | <th><h:outputText value="#{msg.editDiagramActorName}" /></th> |
| 127 | <td> |
| 128 | <p:inputText id="editActorName" value="#{editActor.name}" required="true" size="50" maxlength="100" /> |
| 129 | </td> |
| 130 | </tr> |
| 131 | <tr> |
| 132 | <th><h:outputText value="#{msg.editDiagramActorType}" /></th> |
| 133 | <td> |
| 134 | <h:selectOneMenu id="editActorType" value="#{editActor.type}" required="true"> |
| 135 | <f:selectItem itemValue="" itemLabel="#{msg.selectOneOnList}" /> |
| 136 | <f:selectItems value="#{editActor.actorTypes}" /> |
| 137 | </h:selectOneMenu> |
| 138 | </td> |
| 139 | </tr> |
| 140 | <tr> |
| 141 | <th><h:outputText value="#{msg.editDiagramActorSex}" /></th> |
| 142 | <td> |
| 143 | <h:selectOneMenu id="editActorSex" value="#{editActor.sex}" required="true"> |
| 144 | <f:selectItem itemValue="" itemLabel="#{msg.selectOneOnList}" /> |
| 145 | <f:selectItem itemValue="M" itemLabel="#{msg.editDiagramActorSexMale}" /> |
| 146 | <f:selectItem itemValue="F" itemLabel="#{msg.editDiagramActorSexFemale}" /> |
| 147 | </h:selectOneMenu> |
| 148 | </td> |
| 149 | </tr> |
| 150 | <tr> |
| 151 | <th><h:outputText value="#{msg.editDiagramActorAge}" /></th> |
| 152 | <td> |
| 153 | <p:inputText id="editActorAge" value="#{editActor.age}" required="true" size="5" maxlength="3"> |
| 154 | <f:convertNumber integerOnly="true" minIntegerDigits="1" maxIntegerDigits="3" /> |
| 155 | <f:validateLongRange minimum="0" maximum="150" /> |
| 156 | </p:inputText> |
| 157 | </td> |
| 158 | </tr> |
| 159 | <tr> |
| 160 | <th><h:outputText value="#{msg.editDiagramActorHeight}" /></th> |
| 161 | <td> |
| 162 | <p:inputText id="editActorHeight" value="#{editActor.height}" required="true" size="5"> |
| 163 | <f:convertNumber maxIntegerDigits="1" minFractionDigits="2" maxFractionDigits="2" /> |
| 164 | </p:inputText> |
| 165 | <h:outputText value="#{msg.editDiagramActorHeightMeasureUnit}" /> |
| 166 | </td> |
| 167 | </tr> |
| 168 | <tr> |
| 169 | <th><h:outputText value="#{msg.editDiagramActorWeight}" /></th> |
| 170 | <td> |
| 171 | <p:inputText id="editActorWeight" value="#{editActor.weight}" required="true" size="5" maxlength="3"> |
| 172 | <f:convertNumber integerOnly="true" /> |
| 173 | </p:inputText> |
| 174 | <h:outputText value="#{msg.editDiagramActorWeightMeasureUnit}" /> |
| 175 | </td> |
| 176 | </tr> |
| 177 | </table> |
| 178 | <br /> |
| 179 | <p:commandButton id="buttonAddActor" value="#{msg.buttonAdd}" oncomplete="handleAddActorRequest(xhr, status, args);" actionListener="#{editActor.addActor}" update="diagramCanvas,dialogNewActorPanel,messageGrow1,fdiagram" /> |
| 180 | <p:commandButton id="buttonEditActor" value="#{msg.buttonEdit}" oncomplete="handleAddActorRequest(xhr, status, args);" actionListener="#{editActor.editActor}" update="diagramCanvas,dialogNewActorPanel,messageGrow1,fdiagram" /> |
| 181 | <p:commandButton id="buttonRemoveActor" value="#{msg.buttonRemove}" style="color: red;" oncomplete="dialogNewActor.hide();" actionListener="#{editActor.removeActor}" ajax="false" update="swimLanesLoop" /> |
| 182 | </p:panel> |
| 183 | <script type="text/javascript"> |
| 184 | function handleAddActorRequest(xhr, status, args) { |
| 185 | if(args.validationFailed) { |
| 186 | jQuery('#dialogNewActor').parent().effect("shake", { times:3 }, 100); |
| 187 | } else { |
| 188 | dialogNewActor.hide(); |
| 189 | } |
| 190 | } |
| 191 | </script> |
| 192 | </h:form> |
| 193 | </p:dialog> |
| 194 | |
| 195 | <h:form id="fdock"> |
| 196 | <p:dock id="dock"> |
| 197 | <p:menuitem id="dockAddActor" value="#{msg.editDiagramAddActor}" icon="/img/dock/addActor.png" immediate="true" actionListener="#{editActor.prepareWindowAddActor}" oncomplete="dialogNewActor.show();" update="fEditActor,dialogNewActorPanel"/> |
| 198 | </p:dock> |
| 199 | </h:form> |
| 200 | </h:body> |
| 201 | </html> |
| 202 | |