Add showFullscreen and showCompact for dashboard

application/controllers/IndexController.php

@@ -4,6 +4,7 @@ namespace Icinga\Module\Businessprocess\Controllers;
 
 use Icinga\Module\Businessprocess\Web\Controller;
 use Icinga\Module\Businessprocess\Web\Component\Dashboard;
+use Icinga\Module\Businessprocess\Web\Component\DashboardFullscreen;
 
 class IndexController extends Controller
 {
@@ -13,8 +14,18 @@ class IndexController extends Controller
     public function indexAction()
     {
         $this->setTitle($this->translate('Business Process Overview'));
-        $this->controls()->add($this->overviewTab());
+
-        $this->content()->add(Dashboard::create($this->Auth(), $this->storage()));
+        if (! $this->view->compact) {
-        $this->setAutorefreshInterval(15);
+            $this->controls()->add($this->overviewTab());
+        }
+
+        if ($this->view->showFullscreen) {
+            $this->content()->add(DashboardFullscreen::create($this->storage()));
+            $this->setAutorefreshInterval(120);
+            $this->controls()->getAttributes()->add('class', 'want-fullscreen');
+        } else {
+            $this->content()->add(Dashboard::create($this->Auth(), $this->storage()));
+            $this->setAutorefreshInterval(15);
+        }
     }
 }

library/Businessprocess/Web/Component/BpDashboardFullscreenTile.php

@@ -0,0 +1,59 @@
+<?php
+
+namespace Icinga\Module\Businessprocess\Web\Component;
+
+use Icinga\Module\Businessprocess\BpConfig;
+use Icinga\Web\Url;
+use ipl\Html\BaseHtmlElement;
+use ipl\Html\Html;
+use ipl\Html\Text;
+
+class BpDashboardFullscreenTile extends BaseHtmlElement
+{
+    protected $tag = 'div';
+
+    protected $defaultAttributes = ['class' => 'dashboard-tile'];
+
+    protected $bp;
+
+    protected $title;
+
+    protected $description;
+
+    public function __construct(BpConfig $bp, $title, $description)
+    {
+        $this->bp = $bp;
+        $this->title = $title;
+        $this->description = $description;
+    }
+
+    protected function assemble()
+    {
+        $baseUrl = Url::fromPath('businessprocess/process/show', ['config' => $this->bp->getName()]);
+        $this->add(Html::tag(
+            'div',
+            ['class' => 'bp-link', 'data-base-target' => '_main'],
+            Html::tag('a', ['href' => $baseUrl])
+                ->add(Html::tag('span', ['class' => 'header'], $this->title))
+                ->add($this->description)
+        ));
+
+        $tiles = Html::tag('div', ['class' => 'bp-root-tiles-fullscreen']);
+
+        foreach ($this->bp->getChildren() as $node) {
+            $state = strtolower($node->getStateName());
+
+            $tiles->add(Html::tag(
+                'a',
+                [
+                    'href'  => $baseUrl->with(['node' => $node->getName()]),
+                    'class' => "badge badge-fullscreen state-{$state}",
+                    'title' => $node->getAlias()
+                ],
+                Text::create($node->getAlias())
+            ));
+        }
+
+        $this->add($tiles);
+    }
+}

library/Businessprocess/Web/Component/DashboardFullscreen.php

@@ -0,0 +1,93 @@
+<?php
+
+namespace Icinga\Module\Businessprocess\Web\Component;
+
+use Exception;
+use Icinga\Application\Modules\Module;
+use Icinga\Authentication\Auth;
+use Icinga\Module\Businessprocess\BpConfig;
+use Icinga\Module\Businessprocess\ProvidedHook\Icingadb\IcingadbSupport;
+use Icinga\Module\Businessprocess\State\IcingaDbState;
+use Icinga\Module\Businessprocess\State\MonitoringState;
+use Icinga\Module\Businessprocess\Storage\Storage;
+use ipl\Html\BaseHtmlElement;
+use ipl\Html\Html;
+
+class DashboardFullscreen extends BaseHtmlElement
+{
+    protected $contentSeparator = "\n";
+
+    protected $tag = 'div';
+
+    protected $defaultAttributes = ['class' => 'overview-dashboard', 'data-base-target' => '_next'];
+
+    /** @var Storage */
+    protected $storage;
+
+    /**
+     * Dashboard constructor.
+     * @param Storage $storage
+     */
+    protected function __construct(Storage $storage)
+    {
+        $this->storage = $storage;
+    }
+
+    protected function assemble()
+    {
+        $processes = $this->storage->listProcessNames();
+        if (empty($processes)) {
+            $this->add(Html::tag(
+                'div',
+                [
+                    Html::tag('h1', mt('businessprocess', 'Not available')),
+                    Html::tag('p', mt('businessprocess', 'No Business Process has been defined for you'))
+                ]
+            ));
+        }
+
+        foreach ($processes as $name) {
+            $meta = $this->storage->loadMetadata($name);
+            $title = $meta->get('Title');
+
+            if ($title === null) {
+                $title = $name;
+            }
+
+            try {
+                $bp = $this->storage->loadProcess($name);
+            } catch (Exception $e) {
+                $this->add(new BpDashboardFullscreenTile(
+                    (new BpConfig())->setName($name),
+                    $title,
+                    sprintf(mt('businessprocess', 'File %s has faulty config'), $name . '.conf')
+                ));
+
+                continue;
+            }
+
+            if (Module::exists('icingadb') &&
+                (! $bp->hasBackendName() && IcingadbSupport::useIcingaDbAsBackend())
+            ) {
+                IcingaDbState::apply($bp);
+            } else {
+                MonitoringState::apply($bp);
+            }
+
+            $this->add(new BpDashboardFullscreenTile(
+                $bp,
+                $title,
+                $meta->get('Description')
+            ));
+        }
+    }
+
+    /**
+     * @param Storage $storage
+     * @return static
+     */
+    public static function create(Storage $storage)
+    {
+        return new static($storage);
+    }
+}

public/css/module.less

@@ -383,6 +383,33 @@ ul.broken-files {
         }
     }
 }
+
+#layout.fullscreen-layout {
+    @noOfBadgesPerRow: 3;
+
+    .overview-dashboard {
+        display: flex;
+        flex-wrap: wrap;
+
+        .dashboard-tile {
+            flex: 1 1 auto;
+
+            .bp-root-tiles-fullscreen {
+                @columnGapWidth: 1px;
+
+                display: flex;
+                flex-wrap: wrap;
+                gap: @columnGapWidth;
+
+                .badge {
+                    @minColumnWidth: 100%/@noOfBadgesPerRow;
+                    flex: 1 1 ~"calc(@{minColumnWidth} - @{columnGapWidth})";
+                    .text-ellipsis();
+                }
+            }
+        }
+    }
+}
 /** END Dashboard **/
 
 // State summary badges