Skip to content

Commit

Permalink
feat: improve the layout of the Hacktoberfest diagram (#555)
Browse files Browse the repository at this point in the history
Use a layout that better respects the "left-to-right" direction.
  • Loading branch information
tbouffard authored Sep 26, 2023
1 parent 337085c commit d443433
Show file tree
Hide file tree
Showing 2 changed files with 107 additions and 104 deletions.
Binary file modified examples/static/img/preview/demo/hacktoberfest-custom-themes.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
211 changes: 107 additions & 104 deletions examples/static/js/diagram/bpmn-diagrams.js
Original file line number Diff line number Diff line change
Expand Up @@ -1672,25 +1672,38 @@ function getHacktoberfestBpmnDiagram(projectName) {
<bpmn:outgoing>sequence_flow_1</bpmn:outgoing>
<bpmn:timerEventDefinition />
</bpmn:startEvent>
<bpmn:sequenceFlow id="sequence_flow_9" name="Yes" sourceRef="exclusive_gateway_3" targetRef="user_task_4">
<bpmn:conditionExpression xsi:type="bpmn:tFormalExpression" />
</bpmn:sequenceFlow>
<bpmn:sequenceFlow id="sequence_flow_8" name="No" sourceRef="exclusive_gateway_3" targetRef="user_task_2" />
<bpmn:sequenceFlow id="sequence_flow_6" sourceRef="user_task_2" targetRef="call_activity" />
<bpmn:sequenceFlow id="sequence_flow_5" sourceRef="exclusive_gateway_2" targetRef="user_task_2" />
<bpmn:sequenceFlow id="sequence_flow_4" name="Yes" sourceRef="exclusive_gateway_1" targetRef="exclusive_gateway_2">
<bpmn:conditionExpression xsi:type="bpmn:tFormalExpression" />
</bpmn:sequenceFlow>
<bpmn:sequenceFlow id="sequence_flow_3" sourceRef="user_task_1" targetRef="exclusive_gateway_2" />
<bpmn:sequenceFlow id="sequence_flow_2" name="No" sourceRef="exclusive_gateway_1" targetRef="user_task_1" />
<bpmn:sequenceFlow id="sequence_flow_1" sourceRef="start_event" targetRef="exclusive_gateway_1" />
<bpmn:exclusiveGateway id="exclusive_gateway_1" name="Already registered on the Hacktoberfest website?" default="sequence_flow_2">
<bpmn:incoming>sequence_flow_1</bpmn:incoming>
<bpmn:outgoing>sequence_flow_2</bpmn:outgoing>
<bpmn:outgoing>sequence_flow_4</bpmn:outgoing>
</bpmn:exclusiveGateway>
<bpmn:userTask id="user_task_1" name="Register on https://hacktoberfest.com/">
<bpmn:incoming>sequence_flow_2</bpmn:incoming>
<bpmn:outgoing>sequence_flow_3</bpmn:outgoing>
</bpmn:userTask>
<bpmn:exclusiveGateway id="exclusive_gateway_2">
<bpmn:incoming>sequence_flow_3</bpmn:incoming>
<bpmn:incoming>sequence_flow_4</bpmn:incoming>
<bpmn:outgoing>sequence_flow_5</bpmn:outgoing>
</bpmn:exclusiveGateway>
<bpmn:sequenceFlow id="sequence_flow_10" sourceRef="user_task_4" targetRef="user_task_5" />
<bpmn:userTask id="user_task_2" name="Find an issue labeled &#39;hacktoberfest&#39; 🔍">
<bpmn:incoming>sequence_flow_5</bpmn:incoming>
<bpmn:incoming>sequence_flow_8</bpmn:incoming>
<bpmn:incoming>sequence_flow_5</bpmn:incoming>
<bpmn:outgoing>sequence_flow_6</bpmn:outgoing>
</bpmn:userTask>
<bpmn:userTask id="user_task_4" name="Have a tree planted in your name 🎉">
<bpmn:incoming>sequence_flow_9</bpmn:incoming>
<bpmn:outgoing>sequence_flow_10</bpmn:outgoing>
</bpmn:userTask>
<bpmn:callActivity id="call_activity" name="Contribute to ${projectName} 🔧">
<bpmn:incoming>sequence_flow_6</bpmn:incoming>
<bpmn:outgoing>sequence_flow_7</bpmn:outgoing>
Expand All @@ -1700,153 +1713,143 @@ function getHacktoberfestBpmnDiagram(projectName) {
<bpmn:outgoing>sequence_flow_8</bpmn:outgoing>
<bpmn:outgoing>sequence_flow_9</bpmn:outgoing>
</bpmn:exclusiveGateway>
<bpmn:userTask id="user_task_4" name="Win a limited edition T-shirt 🎉">
<bpmn:incoming>sequence_flow_9</bpmn:incoming>
<bpmn:outgoing>sequence_flow_10</bpmn:outgoing>
</bpmn:userTask>
<bpmn:userTask id="user_task_5" name="Tweet how it was fun to contribute to ${projectName} 😃">
<bpmn:incoming>sequence_flow_10</bpmn:incoming>
<bpmn:outgoing>sequence_flow_11</bpmn:outgoing>
</bpmn:userTask>
<bpmn:sequenceFlow id="sequence_flow_7" sourceRef="call_activity" targetRef="exclusive_gateway_3" />
<bpmn:sequenceFlow id="sequence_flow_11" sourceRef="user_task_5" targetRef="end_event" />
<bpmn:endEvent id="end_event" name="Hacktoberfest finishes on October, 31st">
<bpmn:incoming>sequence_flow_11</bpmn:incoming>
<bpmn:terminateEventDefinition />
</bpmn:endEvent>
<bpmn:sequenceFlow id="sequence_flow_11" sourceRef="user_task_5" targetRef="end_event" />
<bpmn:sequenceFlow id="sequence_flow_10" sourceRef="user_task_4" targetRef="user_task_5" />
<bpmn:sequenceFlow id="sequence_flow_9" name="Yes" sourceRef="exclusive_gateway_3" targetRef="user_task_4">
<bpmn:conditionExpression xsi:type="bpmn:tFormalExpression" />
</bpmn:sequenceFlow>
<bpmn:sequenceFlow id="sequence_flow_8" name="No" sourceRef="exclusive_gateway_3" targetRef="user_task_2" />
<bpmn:sequenceFlow id="sequence_flow_7" sourceRef="call_activity" targetRef="exclusive_gateway_3" />
<bpmn:sequenceFlow id="sequence_flow_6" sourceRef="user_task_2" targetRef="call_activity" />
<bpmn:sequenceFlow id="sequence_flow_5" sourceRef="exclusive_gateway_2" targetRef="user_task_2" />
<bpmn:sequenceFlow id="sequence_flow_4" name="Yes" sourceRef="exclusive_gateway_1" targetRef="exclusive_gateway_2">
<bpmn:conditionExpression xsi:type="bpmn:tFormalExpression" />
</bpmn:sequenceFlow>
<bpmn:sequenceFlow id="sequence_flow_3" sourceRef="user_task_1" targetRef="exclusive_gateway_2" />
<bpmn:sequenceFlow id="sequence_flow_2" name="No" sourceRef="exclusive_gateway_1" targetRef="user_task_1" />
<bpmn:sequenceFlow id="sequence_flow_1" sourceRef="start_event" targetRef="exclusive_gateway_1" />
<bpmn:userTask id="user_task_1" name="Register for Hacktoberfest!">
<bpmn:incoming>sequence_flow_2</bpmn:incoming>
<bpmn:outgoing>sequence_flow_3</bpmn:outgoing>
</bpmn:userTask>
</bpmn:process>
<bpmndi:BPMNDiagram id="BPMNDiagram_1">
<bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="collaboration_1">
<bpmndi:BPMNShape id="shape_participant_1" bpmnElement="participant_1" isHorizontal="true">
<dc:Bounds x="160" y="60" width="979" height="430" />
<dc:Bounds x="160" y="60" width="940" height="420" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="edge_sequence_flow_1" bpmnElement="sequence_flow_1">
<di:waypoint x="268" y="210" />
<di:waypoint x="375" y="210" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_2" bpmnElement="sequence_flow_2">
<di:waypoint x="400" y="185" />
<di:waypoint x="400" y="119" />
<di:waypoint x="450" y="119" />
<bpmndi:BPMNLabel>
<dc:Bounds x="372" y="150" width="15" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_3" bpmnElement="sequence_flow_3">
<di:waypoint x="620" y="119" />
<di:waypoint x="660" y="119" />
<di:waypoint x="660" y="185" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_4" bpmnElement="sequence_flow_4">
<di:waypoint x="425" y="210" />
<di:waypoint x="635" y="210" />
<bpmndi:BPMNLabel>
<dc:Bounds x="521" y="223" width="18" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_5" bpmnElement="sequence_flow_5">
<di:waypoint x="685" y="210" />
<di:waypoint x="785" y="210" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_6" bpmnElement="sequence_flow_6">
<di:waypoint x="915" y="205" />
<di:waypoint x="1050" y="205" />
<di:waypoint x="1050" y="275" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_7" bpmnElement="sequence_flow_7">
<di:waypoint x="1050" y="345" />
<di:waypoint x="1050" y="410" />
<di:waypoint x="870" y="410" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_8" bpmnElement="sequence_flow_8">
<di:waypoint x="845" y="385" />
<di:waypoint x="845" y="240" />
<bpmndi:BPMNLabel>
<dc:Bounds x="852" y="343" width="15" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_9" bpmnElement="sequence_flow_9">
<di:waypoint x="820" y="410" />
<di:waypoint x="715" y="410" />
<bpmndi:BPMNLabel>
<dc:Bounds x="764" y="388" width="18" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_10" bpmnElement="sequence_flow_10">
<di:waypoint x="600" y="410" />
<di:waypoint x="505" y="410" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_11" bpmnElement="sequence_flow_11">
<di:waypoint x="355" y="410" />
<di:waypoint x="268" y="410" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNShape id="shape_start_event" bpmnElement="start_event">
<dc:Bounds x="232" y="192" width="36" height="36" />
<bpmndi:BPMNLabel>
<dc:Bounds x="204" y="235" width="87" height="40" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_exclusive_gateway_1" bpmnElement="exclusive_gateway_1" isMarkerVisible="true">
<dc:Bounds x="375" y="185" width="50" height="50" />
<dc:Bounds x="345" y="185" width="50" height="50" />
<bpmndi:BPMNLabel>
<dc:Bounds x="355" y="242" width="90" height="40" />
<dc:Bounds x="329" y="242" width="83" height="53" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_user_task_1" bpmnElement="user_task_1">
<dc:Bounds x="450" y="84" width="170" height="70" />
<dc:Bounds x="405" y="84" width="110" height="70" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_exclusive_gateway_2" bpmnElement="exclusive_gateway_2" isMarkerVisible="true">
<dc:Bounds x="635" y="185" width="50" height="50" />
<dc:Bounds x="525" y="185" width="50" height="50" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_user_task_2" bpmnElement="user_task_2">
<dc:Bounds x="785" y="170" width="130" height="70" />
<dc:Bounds x="615" y="175" width="130" height="70" />
<bpmndi:BPMNLabel>
<dc:Bounds x="792" y="193" width="113" height="45" />
<dc:Bounds x="622" y="198" width="113" height="45" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_call_activity" bpmnElement="call_activity">
<dc:Bounds x="985" y="275" width="130" height="70" />
<bpmndi:BPMNShape id="shape_user_task_4" bpmnElement="user_task_4">
<dc:Bounds x="622" y="357" width="115" height="70" />
<bpmndi:BPMNLabel>
<dc:Bounds x="995" y="285" width="110" height="45" />
<dc:Bounds x="632" y="382" width="95" height="45" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_exclusive_gateway_3" bpmnElement="exclusive_gateway_3" isMarkerVisible="true">
<dc:Bounds x="820" y="385" width="50" height="50" />
<bpmndi:BPMNShape id="shape_call_activity" bpmnElement="call_activity">
<dc:Bounds x="804" y="175" width="130" height="70" />
<bpmndi:BPMNLabel>
<dc:Bounds x="803" y="445" width="85" height="27" />
<dc:Bounds x="814" y="185" width="110" height="45" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_user_task_4" bpmnElement="user_task_4">
<dc:Bounds x="600" y="370" width="115" height="70" />
<bpmndi:BPMNShape id="shape_exclusive_gateway_3" bpmnElement="exclusive_gateway_3" isMarkerVisible="true">
<dc:Bounds x="984" y="185" width="50" height="50" />
<bpmndi:BPMNLabel>
<dc:Bounds x="610" y="395" width="95" height="45" />
<dc:Bounds x="1027" y="156" width="63" height="27" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_user_task_5" bpmnElement="user_task_5">
<dc:Bounds x="355" y="365" width="150" height="80" />
<dc:Bounds x="794" y="352" width="150" height="80" />
<bpmndi:BPMNLabel>
<dc:Bounds x="365" y="390" width="130" height="55" />
<dc:Bounds x="804" y="377" width="130" height="55" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="shape_end_event" bpmnElement="end_event">
<dc:Bounds x="232" y="387" width="36" height="36" />
<dc:Bounds x="991" y="374" width="36" height="36" />
<bpmndi:BPMNLabel>
<dc:Bounds x="216" y="430" width="68" height="40" />
<dc:Bounds x="975" y="417" width="69" height="40" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="edge_sequence_flow_9" bpmnElement="sequence_flow_9">
<di:waypoint x="1009" y="235" />
<di:waypoint x="1009" y="300" />
<di:waypoint x="550" y="300" />
<di:waypoint x="550" y="397" />
<di:waypoint x="622" y="397" />
<bpmndi:BPMNLabel>
<dc:Bounds x="988" y="245" width="19" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_8" bpmnElement="sequence_flow_8">
<di:waypoint x="1009" y="185" />
<di:waypoint x="1009" y="120" />
<di:waypoint x="680" y="120" />
<di:waypoint x="680" y="175" />
<bpmndi:BPMNLabel>
<dc:Bounds x="956" y="128" width="15" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_6" bpmnElement="sequence_flow_6">
<di:waypoint x="745" y="210" />
<di:waypoint x="804" y="210" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_5" bpmnElement="sequence_flow_5">
<di:waypoint x="575" y="210" />
<di:waypoint x="615" y="210" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_4" bpmnElement="sequence_flow_4">
<di:waypoint x="395" y="210" />
<di:waypoint x="525" y="210" />
<bpmndi:BPMNLabel>
<dc:Bounds x="396" y="183" width="19" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_3" bpmnElement="sequence_flow_3">
<di:waypoint x="515" y="119" />
<di:waypoint x="550" y="119" />
<di:waypoint x="550" y="185" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_2" bpmnElement="sequence_flow_2">
<di:waypoint x="370" y="185" />
<di:waypoint x="370" y="119" />
<di:waypoint x="405" y="119" />
<bpmndi:BPMNLabel>
<dc:Bounds x="342" y="150" width="15" height="14" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_1" bpmnElement="sequence_flow_1">
<di:waypoint x="268" y="210" />
<di:waypoint x="345" y="210" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_10" bpmnElement="sequence_flow_10">
<di:waypoint x="737" y="397" />
<di:waypoint x="794" y="397" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_7" bpmnElement="sequence_flow_7">
<di:waypoint x="934" y="210" />
<di:waypoint x="984" y="210" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="edge_sequence_flow_11" bpmnElement="sequence_flow_11">
<di:waypoint x="944" y="397" />
<di:waypoint x="992" y="397" />
</bpmndi:BPMNEdge>
</bpmndi:BPMNPlane>
</bpmndi:BPMNDiagram>
</bpmn:definitions>
Expand Down

0 comments on commit d443433

Please sign in to comment.