Schedule detail: Introduce Timescale

Author: sukhwinder33445

library/Notifications/Widget/Timeline.php

@@ -12,11 +12,9 @@
 use Icinga\Module\Notifications\Widget\TimeGrid\EntryProvider;
 use Icinga\Module\Notifications\Widget\TimeGrid\GridStep;
 use Icinga\Module\Notifications\Widget\TimeGrid\Timescale;
-use Icinga\Module\Notifications\Widget\TimeGrid\Util;
 use Icinga\Module\Notifications\Widget\Timeline\Entry;
 use Icinga\Module\Notifications\Widget\Timeline\MinimalGrid;
 use Icinga\Module\Notifications\Widget\Timeline\Rotation;
-use IntlDateFormatter;
 use ipl\Html\Attributes;
 use ipl\Html\BaseHtmlElement;
 use ipl\Html\HtmlElement;
@@ -26,7 +24,6 @@
 use ipl\Web\Url;
 use ipl\Web\Widget\Icon;
 use ipl\Web\Widget\Link;
-use Locale;
 use SplObjectStorage;
 use Traversable;
 
@@ -321,41 +318,8 @@ protected function assemble()
                 )
             );
 
-            $dateFormatter = new IntlDateFormatter(
-                Locale::getDefault(),
-                IntlDateFormatter::NONE,
-                IntlDateFormatter::SHORT
-            );
-
-            $now = new DateTime();
-            $currentTime = new HtmlElement(
-                'div',
-                new Attributes(['class' => 'time-hand']),
-                new HtmlElement(
-                    'div',
-                    new Attributes(['class' => 'now', 'title' => $dateFormatter->format($now)]),
-                    Text::create($this->translate('now'))
-                )
-            );
-
-            $now = Util::roundToNearestThirtyMinute($now);
-
-            $this->getStyle()->addFor($currentTime, [
-                '--timeStartColumn' =>
-                    $now->format('G') * 2 // 2 columns per hour
-                    + ($now->format('i') >= 30 ? 1 : 0) // 1 column for the half hour
-                    + 1 // CSS starts counting columns from 1, not zero
-            ]);
-
-            $clock = new HtmlElement(
-                'div',
-                new Attributes(['class' => 'clock']),
-                new HtmlElement('div', new Attributes(['class' => 'current-day']), $currentTime)
-            );
-
             $this->getGrid()
-                ->addHtml(new Timescale($this->days, $this->getStyle()))
-                ->addHtml($clock);
+                ->addHtml(new Timescale($this->days, $this->getStyle()));
         }
 
         $this->addHtml(

public/css/timeline.less

@@ -15,7 +15,7 @@
     .time-grid-header {
       box-sizing: border-box;
       position: sticky;
-      z-index: 2; // overlap the .clock .time-hand
+      z-index: 1;
       top: 0;
     }
 
@@ -49,7 +49,6 @@
     .overlay .entry {
       margin-top: 1em;
       margin-bottom: 1em;
-      z-index: 2; // overlap the .clock .time-hand
 
       .title {
         height: 100%;
@@ -116,34 +115,6 @@
         grid-area: ~"1 / -2 / 1 / -1";
       }
     }
-
-    .clock {
-      display: grid;
-      grid-template-columns: repeat(var(--primaryColumns), 1fr);
-      grid-area: ~"3 / 2 / 4 / 3";
-      border-top: 1px solid transparent; // left not required, otherwise the .time-hand is not aligned properly
-
-      .current-day {
-        display: grid;
-        grid-template-columns: repeat(var(--columnsPerStep), 1fr);
-        grid-area: ~"1 / 1 / 2 / 2";
-
-        .time-hand {
-          grid-area: ~"1 / var(--timeStartColumn) / 2 / calc(var(--timeStartColumn) + 1)";
-          display: flex;
-          align-items: flex-end;
-          width: 1px;
-          border-left: 1px solid red;
-          z-index: 1;
-
-          .now {
-            .rounded-corners();
-            padding: 0 .25em;
-            transform: translate(-50%, 50%);
-          }
-        }
-      }
-    }
   }
 }
 
@@ -214,13 +185,6 @@
     color: @gray-semilight;
     background: @body-bg-color;
   }
-
-  .clock .now {
-    background-color: @gray-light;
-    font-size: 0.75em;
-    color: red;
-    .user-select(none);
-  }
 }
 
 .timeline.minimal-layout .empty-notice {