diff --git a/library/Businessprocess/Renderer/TileRenderer/NodeTile.php b/library/Businessprocess/Renderer/TileRenderer/NodeTile.php index 7cb0c81..6e7d8f0 100644 --- a/library/Businessprocess/Renderer/TileRenderer/NodeTile.php +++ b/library/Businessprocess/Renderer/TileRenderer/NodeTile.php @@ -115,6 +115,7 @@ class NodeTile extends BaseHtmlElement if ($node instanceof ServiceNode && $node->getRealState() !== $node->getState()) { $this->add((new StateBall(strtolower($node->getStateName($node->getRealState()))))->addAttributes([ + 'class' => 'overridden-state', 'title' => sprintf( '%s', $node->getStateName($node->getRealState()) diff --git a/library/Businessprocess/Renderer/TreeRenderer.php b/library/Businessprocess/Renderer/TreeRenderer.php index 3d58075..056cded 100644 --- a/library/Businessprocess/Renderer/TreeRenderer.php +++ b/library/Businessprocess/Renderer/TreeRenderer.php @@ -136,43 +136,25 @@ class TreeRenderer extends Renderer return $icons; } - public function getNodeRealState(Node $node) + public function getOverriddenState(Node $node) { - $realState = []; - $realState[] = Html::tag('i', ['class' => 'icon icon-flash']); - $realState[] = (new StateBall(strtolower($node->getStateName($node->getRealState()))))->addAttributes([ + $overriddenState = Html::tag('div', ['class' => 'overridden-state']); + $overriddenState->add((new StateBall(strtolower($node->getStateName($node->getRealState()))))->addAttributes([ 'title' => sprintf( '%s', $node->getStateName($node->getRealState()) ) - ]); + ])); + $overriddenState->add(Html::tag('i', ['class' => 'icon icon-right-small'])); + $overriddenState->add((new StateBall(strtolower($node->getStateName())))->addAttributes([ + 'title' => sprintf( + '%s', + $node->getStateName() + ), + 'class' => 'last' + ])); - return $realState; - } - - public function getNodeStateOverride(Node $node) - { - $statesOverrights = []; - - $states = $node->getStateOverrides(); - foreach ($states as $originalState => $overrideState) { - $statesOverrights[] = (new StateBall(strtolower($node->getStateName($originalState))))->addAttributes([ - 'title' => sprintf( - '%s', - $node->getStateName($originalState) - ) - ]); - $statesOverrights[] = Html::tag('i', ['class' => 'icon icon-right-small']); - $statesOverrights[] = (new StateBall(strtolower($node->getStateName($overrideState))))->addAttributes([ - 'title' => sprintf( - '%s', - $node->getStateName($overrideState) - ), - 'class' => 'last' - ]); - } - - return $statesOverrights; + return $overriddenState; } /** @@ -283,23 +265,13 @@ class TreeRenderer extends Renderer $li->add($link); if ($node->getRealState() !== $node->getState()) { - $li->add($this->getNodeRealState($node)); - } - - $leftAlign = Html::tag('div', [ - 'class' => 'left-side', - ]); - - if (! empty($node->getStateOverrides())) { - $leftAlign->add($this->getNodeStateOverride($node)); + $li->add($this->getOverriddenState($node)); } if (! $this->isLocked() && $node->getBpConfig()->getName() === $this->getBusinessProcess()->getName()) { - $leftAlign->add($this->getActionIcons($bp, $node)); + $li->add($this->getActionIcons($bp, $node)); } - $li->add($leftAlign); - return $li; } diff --git a/public/css/module.less b/public/css/module.less index 8d1dcf6..3db49bf 100644 --- a/public/css/module.less +++ b/public/css/module.less @@ -214,12 +214,17 @@ ul.bp { margin-right: .5em; } - a.action-link { - margin-left: 20px; + > :not(.overridden-state) + a.action-link { + margin-left: auto; // Let the first action link move everything to the right + + & + a.action-link { + margin-left: 0; // But really only the first one + } } - > .left-side { - margin-left: auto; // Left alligned Icons + .overridden-state { + margin-left: auto; + margin-right: 1em; } } @@ -260,18 +265,13 @@ ul.bp { } li.process > div > .state-ball, - li:not(.process) > .state-ball, - div.left-side > .state-ball { + li:not(.process) > .state-ball { border: .15em solid white; &.size-s { width: 7em/6em; height: 7em/6em; line-height: 7em/6em; - - &.last { - margin-right: 10px; - } } } } @@ -421,12 +421,13 @@ td > a > .badges { font-size: 0.5em; } - .state-ball { - position: absolute; - right: 0px; - bottom: 0px; - margin: 5px 5px 5px 5px; - border: 1px solid white; + .overridden-state { + font-size: .75em; + position: absolute; + left: 0; + bottom: 0; + margin: .5em; + border: 1px solid white; } > a {