Load graphs' <img/>s synchronously

refs #48

application/controllers/ShowController.php

@@ -144,122 +144,6 @@ class ShowController extends Controller
         $this->view->image = $img->fetchImage();
     }
 
-    public function hostAction()
-    {
-        $this->handleDatasourceToggles();
-        $this->handleGraphParams();
-        $hostname = $this->view->hostname = $this->params->get('host');
-        if (! $hostname) {
-            throw new NotFoundError('Host is required');
-        }
-
-        $view = $this->view;
-        $this->getTabs()->add('host', array(
-            'label' => $this->translate('Graphite - Single Host'),
-            'url' => $this->getRequest()->getUrl()
-        ))->activate('host');
-
-        $imgs = array();
-        $this->view->templates = array();
-
-        foreach ($this->templateStore->loadTemplateSets() as $setname => $set) {
-
-            $patterns = $set->getBasePatterns();
-            if (! array_key_exists('icingaHost', $patterns)) continue;
-
-            foreach ($set->loadTemplates() as $key => $template) {
-                if (strpos($template->getFilterString(), '$service') !== false) continue;
-
-                $imgParams = (new UrlParams())
-                    ->set('template', $key)
-                    ->set('start', $view->start)
-                    ->set('width', $view->width)
-                    ->set('height', $view->height);
-
-                if ($this->view->disabledDatasources) {
-                    $imgParams->set('disabled', $this->view->disabledDatasources);
-                    foreach ($this->view->disabledDatasources as $dis) {
-                        if ($template->hasDatasource($dis)) {
-                            $template->getDatasource($dis)->disable();
-                        }
-                    }
-                }
-
-                $this->view->templates[$key] = $template;
-
-                $imgs[$key] = $this->graphiteWeb
-                    ->select()
-                    ->from($template->getFilterString())
-                    ->where('hostname', $hostname)
-                    ->getWrappedImageLinks($template, TimeRangePickerTrait::copyAllRangeParameters($imgParams));
-
-            }
-        }
-
-        $view->images = $imgs;
-    }
-
-    public function serviceAction()
-    {
-        $this->handleDatasourceToggles();
-        $this->handleGraphParams();
-        $hostname = $this->view->hostname = $this->params->get('host');
-        $service = $this->view->service = $this->params->get('service');
-        if (! $hostname) {
-            throw new NotFoundError('Host is required');
-        }
-        if (! $service) {
-            throw new NotFoundError('Service is required');
-        }
-        $this->getTabs()->add('service', array(
-            'label' => $this->translate('Graphite - Single service'),
-            'url' => $this->getRequest()->getUrl()
-        ))->activate('service');
-
-        $view = $this->view;
-
-        $imgs = array();
-        $this->view->templates = array();
-
-        foreach ($this->templateStore->loadTemplateSets() as $setname => $set) {
-
-            $patterns = $set->getBasePatterns();
-            if (! array_key_exists('icingaHost', $patterns)) continue;
-
-            foreach ($set->loadTemplates() as $key => $template) {
-                if (strpos($template->getFilterString(), '$service') === false) continue;
-
-                $imgParams = (new UrlParams())
-                    ->set('template', $key)
-                    ->set('start', $view->start)
-                    ->set('width', $view->width)
-                    ->set('height', $view->height);;
-
-                if ($this->view->disabledDatasources) {
-                    $imgParams->set('disabled', $this->view->disabledDatasources);
-                    foreach ($this->view->disabledDatasources as $dis) {
-                        if ($template->hasDatasource($dis)) {
-                            $template->getDatasource($dis)->disable();
-                        }
-
-                    }
-                }
-
-                $this->view->templates[$key] = $template;
-
-                $imgs[$key] = $this->graphiteWeb
-                    ->select()
-                    ->from($template->getFilterString())
-                    ->where('hostname', $hostname)
-                    ->where('service',  $service)
-                    ->getWrappedImageLinks($template, TimeRangePickerTrait::copyAllRangeParameters($imgParams));
-
-            }
-        }
-
-        $view->images = $imgs;
-    }
-
     public function XXXserviceAction()
     {
         $this->handleDatasourceToggles();

application/views/scripts/list/hosts.phtml

@@ -1,6 +1,6 @@
 <?php
 
-use Icinga\Module\Graphite\EmbedGraphs;
+use Icinga\Module\Graphite\Web\Widget\Graphs\Host;
 use Icinga\Web\Url;
 
 /** @var \Icinga\Web\View $this */
@@ -39,7 +39,7 @@ if ($filterEditor->getFilter()->isEmpty()) {
                 )
                 . '</h2>';
         }
-        echo EmbedGraphs::host($host->host_name);
+        echo (new Host($host->host_name))->setCompact()->handleRequest();
 
         echo '</div>';
     }

application/views/scripts/list/services.phtml

@@ -1,6 +1,6 @@
 <?php
 
-use Icinga\Module\Graphite\EmbedGraphs;
+use Icinga\Module\Graphite\Web\Widget\Graphs\Service;
 use Icinga\Web\Url;
 
 /** @var \Icinga\Web\View $this */
@@ -49,7 +49,7 @@ if ($filterEditor->getFilter()->isEmpty()) {
                 )
                 . '</h2>';
         }
-        echo EmbedGraphs::service($service->host_name, $service->service_description);
+        echo (new Service($service->host_name, $service->service_description))->setCompact()->handleRequest();
     }
 
     if (! $compact && $services->hasMore()) {

application/views/scripts/show/host.phtml

@@ -1,40 +0,0 @@
-<?php
-/** @var \Icinga\Web\View $this */
-
-if (! $compact): ?>
-<div class="controls">
-<?= $this->tabs ?>
-<h1><?= $this->hostname ?></h1>
-</div>
-<?php endif ?>
-
-<div class="content">
-<?php foreach ($this->images as $type => $imgs): ?>
-<?php if (count($imgs) > 0): ?>
-
-<div class="images">
-<?php
-if (! $compact) {
-    echo "<h3>{$this->escape(ucfirst($type))}</h3>";
-    echo $this->partial(
-        'show/legend.phtml',
-        array(
-            'template'            => $this->templates[$type],
-            'disabledDatasources' => $this->disabledDatasources
-        )
-    );
-}
-?>
-<?php foreach ($imgs as $title => $url): ?>
-<img src="<?= $url ?>" class="graphiteImg" alt="" width="<?= $this->width ?>" height="<?= $this->height ?>" />
-<?php endforeach ?>
-</div>
-
-<?php endif ?>
-<?php endforeach ?>
-
-<?php if (! isset($title)): ?>
-<p><?= $this->translate('No graphs found') ?></p>
-<?php endif ?>
-
-</div>

application/views/scripts/show/service.phtml

@@ -1,40 +0,0 @@
-<?php
-/** @var \Icinga\Web\View $this */
-
-if (! $compact): ?>
-<div class="controls">
-<?= $this->tabs ?>
-<h1><?= $this->hostname ?>: <?= $this->service ?></h1>
-</div>
-<?php endif ?>
-
-<div class="content">
-<?php foreach ($this->images as $type => $imgs): ?>
-<?php if (count($imgs) > 0): ?>
-
-<div class="images">
-<?php
-if (! $compact) {
-    echo "<h3>{$this->escape(ucfirst($type))}</h3>";
-    echo $this->partial(
-        'show/legend.phtml',
-        array(
-            'template'            => $this->templates[$type],
-            'disabledDatasources' => $this->disabledDatasources
-        )
-    );
-}
-?>
-<?php foreach ($imgs as $title => $url): ?>
-<img src="<?= $url ?>" class="graphiteImg" alt="" width="<?= $this->width ?>" height="<?= $this->height ?>" />
-<?php endforeach ?>
-</div>
-
-<?php endif ?>
-<?php endforeach ?>
-
-<?php if (! isset($title)): ?>
-<p><?= $this->translate('No graphs found') ?></p>
-<?php endif ?>
-
-</div>

library/Graphite/EmbedGraphs.php

@@ -1,66 +0,0 @@
-<?php
-
-namespace Icinga\Module\Graphite;
-
-use Icinga\Application\Icinga;
-use Icinga\Module\Graphite\Forms\TimeRangePicker\TimeRangePickerTrait;
-use Icinga\Web\Url;
-use Icinga\Web\View;
-
-class EmbedGraphs
-{
-    /**
-     * Embed all graphs of the given host (but none of its services)
-     *
-     * @param   string  $host
-     *
-     * @return  string
-     */
-    public static function host($host)
-    {
-        return static::url(static::getView()->href('graphite/show/host', ['host'  => $host]));
-    }
-
-    /**
-     * Embed all graphs of the given service of the given host
-     *
-     * @param   string  $host
-     * @param   string  $service
-     *
-     * @return  string
-     */
-    public static function service($host, $service)
-    {
-        return static::url(static::getView()->href('graphite/show/service', [
-            'host'      => $host,
-            'service'   => $service
-        ]));
-    }
-
-    /**
-     * Return a <div/> which causes the framework JS to embed the given URL
-     *
-     * @param   Url $url
-     *
-     * @return  string
-     */
-    protected static function url(Url $url)
-    {
-        TimeRangePickerTrait::copyAllRangeParameters($url->getParams());
-
-        // TODO(ak): EL says "<div class="container" data-icinga-url="..." /> is enough",
-        // but this seems not to work for me
-        return '<div class="container" data-base-target="_main" data-last-update="-1" data-icinga-refresh="15"'
-            . ' data-icinga-url="' . $url->setParam('view', 'compact') . '"></div>';
-    }
-
-    /**
-     * Get the current response view
-     *
-     * @return View
-     */
-    protected static function getView()
-    {
-        return Icinga::app()->getViewRenderer()->view;
-    }
-}

library/Graphite/ProvidedHook/Monitoring/DetailviewExtension.php

@@ -2,37 +2,20 @@
 
 namespace Icinga\Module\Graphite\ProvidedHook\Monitoring;
 
-use Icinga\Module\Graphite\EmbedGraphs;
 use Icinga\Module\Graphite\Web\Controller\TimeRangePickerTrait;
+use Icinga\Module\Graphite\Web\Widget\Graphs;
 use Icinga\Module\Monitoring\Hook\DetailviewExtensionHook;
-use Icinga\Module\Monitoring\Object\Host;
 use Icinga\Module\Monitoring\Object\MonitoredObject;
-use Icinga\Module\Monitoring\Object\Service;
 
 class DetailviewExtension extends DetailviewExtensionHook
 {
     use TimeRangePickerTrait;
 
     public function getHtmlForObject(MonitoredObject $object)
-    {
-        switch ($object->getType()) {
-            case 'host':
-                /** @var Host $object */
-                return $this->getGeneric() . EmbedGraphs::host($object->getName());
-            case 'service':
-                /** @var Service $object */
-                return $this->getGeneric() . EmbedGraphs::service($object->getHost()->getName(), $object->getName());
-        }
-    }
-
-    /**
-     * Get monitored object type independend HTML to use
-     *
-     * @return string
-     */
-    protected function getGeneric()
     {
         $this->handleTimeRangePickerRequest();
-        return '<h2>' . mt('graphite', 'Graphs') . '</h2>' . $this->renderTimeRangePicker($this->getView());
+        return '<h2>' . mt('graphite', 'Graphs') . '</h2>'
+            . $this->renderTimeRangePicker($this->getView())
+            . Graphs::forMonitoredObject($object)->setCompact()->handleRequest();
     }
 }

library/Graphite/Web/Widget/Graphs.php

@@ -0,0 +1,259 @@
+<?php
+
+namespace Icinga\Module\Graphite\Web\Widget;
+
+use Icinga\Application\Icinga;
+use Icinga\Module\Graphite\Forms\TimeRangePicker\TimeRangePickerTrait;
+use Icinga\Module\Graphite\GraphiteQuery;
+use Icinga\Module\Graphite\GraphiteWeb;
+use Icinga\Module\Graphite\GraphiteWebClient;
+use Icinga\Module\Graphite\GraphTemplate;
+use Icinga\Module\Graphite\TemplateSet;
+use Icinga\Module\Graphite\TemplateStore;
+use Icinga\Module\Graphite\Web\Widget\Graphs\Host as HostGraphs;
+use Icinga\Module\Graphite\Web\Widget\Graphs\Service as ServiceGraphs;
+use Icinga\Module\Monitoring\Object\Host;
+use Icinga\Module\Monitoring\Object\MonitoredObject;
+use Icinga\Module\Monitoring\Object\Service;
+use Icinga\Web\Request;
+use Icinga\Web\UrlParams;
+use Icinga\Web\View;
+use Icinga\Web\Widget\AbstractWidget;
+
+abstract class Graphs extends AbstractWidget
+{
+    /**
+     * Graph image width
+     *
+     * @var string
+     */
+    protected $width;
+
+    /**
+     * Graph image height
+     *
+     * @var string
+     */
+    protected $height;
+
+    /**
+     * Graph range start
+     *
+     * @var string
+     */
+    protected $start;
+
+    /**
+     * Graph range end
+     *
+     * @var string
+     */
+    protected $end;
+
+    /**
+     * Whether to render as compact as possible
+     *
+     * @var bool
+     */
+    protected $compact = false;
+
+    /**
+     * The image links to be shown
+     *
+     * [$type => [$title => $url]]
+     *
+     * @var string[string][string]
+     */
+    protected $images;
+
+    /**
+     * @var GraphTemplate[string]
+     */
+    protected $templates;
+
+    /**
+     * Factory, based on the given object
+     *
+     * @param   MonitoredObject $object
+     *
+     * @return  static
+     */
+    public static function forMonitoredObject(MonitoredObject $object)
+    {
+        switch ($object->getType()) {
+            case 'host':
+                /** @var Host $object */
+                return (new HostGraphs($object->getName()));
+
+            case 'service':
+                /** @var Service $object */
+                return (new ServiceGraphs($object->getHost()->getName(), $object->getName()));
+        }
+    }
+
+    /**
+     * Process the given request using this widget
+     *
+     * @param   Request $request    The request to be processed
+     *
+     * @return  $this
+     */
+    public function handleRequest(Request $request = null)
+    {
+        if ($request === null) {
+            $request = Icinga::app()->getRequest();
+        }
+
+        $this->handleGraphParams($request);
+        $this->collectTemplates();
+        $this->collectImages();
+
+        return $this;
+    }
+
+    public function render()
+    {
+        /** @var View $view */
+        $view = $this->view();
+        $rendered = '';
+
+        foreach ($this->images as $type => $images) {
+            if (count($images) > 0) {
+                $rendered .= '<div class="images">';
+
+                if (! $this->compact) {
+                    $rendered .= "<h3>{$view->escape(ucfirst($type))}</h3>{$view->partial(
+                        'show/legend.phtml',
+                        ['template' => $this->templates[$type]]
+                    )}";
+                }
+
+                foreach ($images as $title => $url) {
+                    $rendered .= "<img src=\"$url\" class=\"graphiteImg\" alt=\"\" width=\"$this->width\" height=\"$this->height\" />";
+                }
+
+                $rendered .= '</div>';
+            }
+        }
+
+        return $rendered ?: "<p>{$view->escape($view->translate('No graphs found'))}</p>";
+    }
+
+    /**
+     * Handle the given request's parameters
+     *
+     * @param   Request $request
+     */
+    protected function handleGraphParams(Request $request)
+    {
+        $params = $request->getUrl()->getParams();
+        list($this->start, $this->end) = $this->getRangeFromTimeRangePicker($request);
+        $this->width  = $params->shift('width', '300');
+        $this->height = $params->shift('height', '150');
+    }
+
+    /**
+     * Get time range parameters for Graphite from the URL
+     *
+     * @param   Request $request    The request to be used
+     *
+     * @return  string[]
+     */
+    protected function getRangeFromTimeRangePicker(Request $request)
+    {
+        $params = $request->getUrl()->getParams();
+        $relative = $params->get(TimeRangePickerTrait::getRelativeRangeParameter());
+        if ($relative !== null) {
+            return ["-{$relative}s", null];
+        }
+
+        $absolute = TimeRangePickerTrait::getAbsoluteRangeParameters();
+        return [$params->get($absolute['start'], '-1hours'), $params->get($absolute['end'])];
+    }
+
+    /**
+     * Initialize {@link templates}
+     */
+    protected function collectTemplates()
+    {
+        foreach ((new TemplateStore())->loadTemplateSets() as $setname => $set) {
+            /** @var TemplateSet $set */
+
+            if (array_key_exists('icingaHost', $set->getBasePatterns())) {
+                foreach ($set->loadTemplates() as $templateName => $template) {
+                    /** @var GraphTemplate $template */
+
+                    if ($this->includeTemplate($template)) {
+                        $this->templates[$templateName] = $template;
+                    }
+                }
+            }
+        }
+    }
+
+    /**
+     * Initialize {@link images}
+     */
+    protected function collectImages()
+    {
+        $graphiteWeb = new GraphiteWeb(GraphiteWebClient::getInstance());
+        foreach ($this->templates as $templateName => $template) {
+            /** @var GraphTemplate $template */
+
+            $this->images[$templateName] = $this->filterGraphiteQuery(
+                $graphiteWeb->select()->from($template->getFilterString())
+            )
+                ->getWrappedImageLinks(
+                    $template,
+                    TimeRangePickerTrait::copyAllRangeParameters(
+                        (new UrlParams())
+                            ->set('template', $templateName)
+                            ->set('start', $this->start)
+                            ->set('width', $this->width)
+                            ->set('height', $this->height)
+                    )
+                );
+        }
+    }
+
+    /**
+     * Add filters to the given query so that only specific graphs are shown
+     *
+     * @param   GraphiteQuery   $query
+     *
+     * @return  GraphiteQuery           The given query
+     */
+    abstract protected function filterGraphiteQuery(GraphiteQuery $query);
+
+    /**
+     * Return whether to use the given template
+     *
+     * @param   GraphTemplate   $template
+     *
+     * @return  bool
+     */
+    abstract protected function includeTemplate(GraphTemplate $template);
+
+    /**
+     * Get {@link compact}
+     *
+     * @return bool
+     */
+    public function getCompact()
+    {
+        return $this->compact;
+    }
+
+    /**
+     * Set {@link compact}
+     *
+     * @param bool $compact
+     *
+     * @return $this
+     */
+    public function setCompact($compact = true)
+    {
+        $this->compact = $compact;
+        return $this;
+    }
+}

library/Graphite/Web/Widget/Graphs/Host.php

@@ -0,0 +1,37 @@
+<?php
+
+namespace Icinga\Module\Graphite\Web\Widget\Graphs;
+
+use Icinga\Module\Graphite\GraphiteQuery;
+use Icinga\Module\Graphite\GraphTemplate;
+use Icinga\Module\Graphite\Web\Widget\Graphs;
+
+class Host extends Graphs
+{
+    /**
+     * The host to render the graphs of
+     *
+     * @var string
+     */
+    protected $host;
+
+    /**
+     * Constructor
+     *
+     * @param   string  $host   The host to render the graphs of
+     */
+    public function __construct($host)
+    {
+        $this->host = $host;
+    }
+
+    protected function filterGraphiteQuery(GraphiteQuery $query)
+    {
+        return $query->where('hostname', $this->host);
+    }
+
+    protected function includeTemplate(GraphTemplate $template)
+    {
+        return strpos($template->getFilterString(), '$service') === false;
+    }
+}

library/Graphite/Web/Widget/Graphs/Service.php

@@ -0,0 +1,48 @@
+<?php
+
+namespace Icinga\Module\Graphite\Web\Widget\Graphs;
+
+use Icinga\Module\Graphite\GraphiteQuery;
+use Icinga\Module\Graphite\GraphTemplate;
+use Icinga\Module\Graphite\Web\Widget\Graphs;
+
+class Service extends Graphs
+{
+    /**
+     * The host to render the graphs of
+     *
+     * @var string
+     */
+    protected $host;
+
+    /**
+     * The service to render the graphs of
+     *
+     * @var string
+     */
+    protected $service;
+
+    /**
+     * Constructor
+     *
+     * @param   string  $host       The host to render the graphs of
+     * @param   string  $service    The service to render the graphs of
+     */
+    public function __construct($host, $service)
+    {
+        $this->host = $host;
+        $this->service = $service;
+    }
+
+    protected function filterGraphiteQuery(GraphiteQuery $query)
+    {
+        return $query
+            ->where('hostname', $this->host)
+            ->where('service',  $this->service);
+    }
+
+    protected function includeTemplate(GraphTemplate $template)
+    {
+        return strpos($template->getFilterString(), '$service') !== false;
+    }
+}

public/css/module.less

@@ -55,7 +55,7 @@ div.graphs-host {
   vertical-align: top;
   margin-right: 2em;
 
-  > div.container[data-icinga-url] {
+  > p {
     width: 300px;
   }
 }