* Added new notification module

src/Modules/Dimatec/Dimatec.php

@@ -28,9 +28,11 @@ class Dimatec extends PluginStrategy
     $this->AddRoute('GET|POST /pick2light/@step', __NAMESPACE__ . '\Pages->Pick2Light');
     $this->AddRoute("GET|POST /bind", __NAMESPACE__ . '\Pages->Bind');
     $this->AddRoute("GET|POST /dualframe", __NAMESPACE__ . '\Pages->IcamControlIFrame');
+    $this->AddRoute("GET|POST /mav2as400", __NAMESPACE__ . '\Pages->MAV2AS400');
 
     $imgClass = 'shadow p-3 rounded bg-white';
 
+    $this->AddMenuItem('mav2as400', ['url' => 'mav2as400', 'imgClass' => $imgClass, 'image' => 'ui/images/mav2as400.png']);
     $this->AddMenuItem('bind', ['url' => 'bind', 'imgClass' => $imgClass, 'image' => 'ui/images/bind.png']);
     $this->AddMenuItem('pick2light', ['url' => 'pick2light/1', 'imgClass' => $imgClass, 'image' => 'ui/images/magazzinoverticale.png']);
   }

src/Modules/Dimatec/Pages.php

@@ -198,4 +198,9 @@ class Pages extends Controller
   {
     echo \Template::instance()->render('icamcontrol.tpl');
   }
+
+  public function MAV2AS400($f3)
+  {
+    echo \Template::instance()->render('masterpage.tpl');
+  }
 }

src/OpenMind/System/Notifications.php

@@ -8,10 +8,54 @@
 
 namespace OpenMind\System;
 
+use DB\SQL\Mapper;
 
-class Notifications
+class Notifications extends Mapper
 {
+  /** @var \Base $f3 */
+  private $f3;
+
+  // Used internally
+  private $initLoad;
+
   public function __construct()
   {
+    global $f3;
+    $this->f3 = $f3;
+
+    parent::__construct($f3->get('DB'), 'notifications');
+    $this->count = 'count(code)';
   }
+
+  /**
+   * Retrieve notifications
+   *
+   * @return array|FALSE
+   */
+  public function check()
+  {
+    if (!$this->initLoad) {
+      $this->initLoad = true;
+      $this->load();
+    }
+    return $this->dry();
+  }
+
+  /**
+   * @param int $code of notification to remove from database
+   */
+  public function Remove(int $code)
+  {
+    $this->reset();
+    $this->erase(['code=?', $code]);
+  }
+
+  /**
+   * Truncate all table
+   */
+  public function emptyAll()
+  {
+    $this->f3->get('DB')->exec('TRUNCATE TABLE notifications');
+  }
+
 }

src/OpenMind/System/QueueSystem.php

@@ -78,5 +78,4 @@ class QueueSystem extends Mapper
     $this->erase(['servicename=?', $this->serviceName]);
   }
 
-
 }

src/OpenMind/System/System.php

@@ -22,6 +22,10 @@ class System extends PluginStrategy
 
     // Set Database connection
     try {
+      $dbMode = (strtolower(PHP_OS_FAMILY) == 'linux') ? TRUE : FALSE;
+      if ($f3->get('CLI')) // from cli, always persistent mode
+        $dbMode = TRUE;
+
       $f3->set('DB',
         new \DB\SQL(
           $f3->get('DSN'),
@@ -29,7 +33,7 @@ class System extends PluginStrategy
           $f3->get('dbpass'),
           array(
             \PDO::ATTR_ERRMODE => \PDO::ERRMODE_EXCEPTION,
-            \PDO::ATTR_PERSISTENT => (strtolower(PHP_OS_FAMILY) == 'linux') ? TRUE : FALSE  // To avoid massive new persistant connections due to php-cgi processes
+            \PDO::ATTR_PERSISTENT => $dbMode  // To avoid massive new persistent connections due to php-cgi processes
           )));
     } catch (PDOException $e) {
       die($e->getMessage());
@@ -41,8 +45,9 @@ class System extends PluginStrategy
 
   private function setSystemRoutes()
   {
-    $this->AddRoute('GET /getserverstatus', __NAMESPACE__ . '\System->getServerStatus');
-    $this->AddRoute('PUT /api.system.kbd.insert', __NAMESPACE__ . '\System->insertKbdCode');
+    $this->AddRoute('GET /api.system.getserverstatus', __NAMESPACE__ . '\System->getServerStatus');
+    $this->AddRoute('POST /api.system.removenotification/@code', __NAMESPACE__ . '\System->NotificationDelete');
+    $this->AddRoute('POST /api.system.kbd.insert', __NAMESPACE__ . '\System->insertKbdCode');
   }
 
   /**
@@ -57,10 +62,25 @@ class System extends PluginStrategy
 
   public function getServerStatus($f3)
   {
-    // TODO da finire
-    echo json_encode([
-      'notify' => 9
-    ]);
+    $ret = [];
+    $notifications = new Notifications();
+    $sqlGroupBy = array(
+      'order' => 'timestamp DESC',
+      'group' => 'code'
+    );
+    $ret['notify'] = array_map(array($notifications, 'cast'), $notifications->find(NULL, $sqlGroupBy));
+
+    echo json_encode($ret);
+  }
+
+  public function NotificationDelete($f3, $args)
+  {
+    global $f3;
+
+    if($args['code']!=0)
+      (new Notifications())->Remove($args['code']);
+    else
+      (new Notifications())->emptyAll();
   }
 }
 

ui/css/omlink.css

@@ -159,4 +159,25 @@ input::-ms-input-placeholder {
   animation: blink alternate 1s infinite ease-in-out;
 }
 
+#sysmsgnum {
+  color: white;
+  background-color: red;
+  font-size: 40%;
+  position: absolute;
+  left: 15px;
+  bottom: 0;
+}
+
+#notification_area {
+  padding-bottom: 0;
+  border-radius: 10px 10px;
+}
+
+#notification_area_deleteall {
+  background-color: #3380BD;
+  color: white;
+  border-radius: 0 0 10px 10px;
+  padding: 0;
+}
+
 /*# sourceMappingURL=omlink.css.map */

ui/css/omlink.scss

@@ -84,7 +84,7 @@ input:focus {
 }
 
 .form-control:focus, .btn:focus {
-//  border-color: #c5ac0f !important;
+  //  border-color: #c5ac0f !important;
   background-color: lighten($inputBgColor, 8%) !important;
   border-color: darken($inputBgColor, 10%) !important;
   box-shadow: 0 0 10px $inputBgColor !important;
@@ -137,12 +137,12 @@ input::-ms-input-placeholder {
 // Blink Effect
 @keyframes blink {
   0% {
-   @include prefix(opacity, 0.1);
+    @include prefix(opacity, 0.1);
     // background-color: lighten(#28a745, 40%);
   }
   100% {
-   @include prefix(opacity, 1);
-   // background-color: darken(#28a745, 10%);
+    @include prefix(opacity, 1);
+    // background-color: darken(#28a745, 10%);
   }
 }
 
@@ -160,4 +160,25 @@ input::-ms-input-placeholder {
 .blink {
   @include prefix(transition, all 0.1s ease-in-out);
   @include prefix(animation, blink alternate 1s infinite ease-in-out);
+}
+
+#sysmsgnum {
+  color: white;
+  background-color: red;
+  font-size: 40%;
+  position: absolute;
+  left: 15px;
+  bottom: 0;
+}
+
+#notification_area {
+  padding-bottom: 0;
+  border-radius: 10px 10px
+}
+
+#notification_area_deleteall {
+  background-color: #3380BD;
+  color: white;
+  border-radius: 0 0 10px 10px;
+  padding: 0;
 }

ui/header.tpl

@@ -1,11 +1,13 @@
 <nav class="navbar sticky-top navbar-dark om-shadow navbar-expand">
 	<a href="{{@BASEURL}}/"><img class="img-fluid om-shadow navbar-brand customerlogo" src="{{@LOGO_CUSTOMER}}"/></a>
-	<div class="collapse navbar-collapse"></div>
-	<div class="navbar-brand">
-		<a href="javascript:void(0)" onclick="javascript:alert('Not implemented')" style="position: relative; margin-right: 20px">
+	<div class="ml-auto dropdown dropleft navbar-brand">
+		<a id="notification_area_button" class="disabled" href="javascript:void(0)" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="mr-3" style="position: relative">
 			<span>&#x1f514;</span>
-			<span id="sysmsgnum" class="blink badge badge-light" style="color: white; background-color: red; font-size: 40%; position: absolute; left: 15px; bottom: 0"></span>
+			<span id="sysmsgnum" class="blink badge badge-light"></span>
 		</a>
+		<div id="notification_area" class="dropdown-menu" aria-labelledby="dropdownMenuButton"></div>
+	</div>
+	<div>
 		<a href="{{@BASEURL}}/logout"><img src="{{@ICON_LOGOUT}}" class="img-fluid om-shadow"/></a>
 	</div>
 </nav>

ui/icamcontrol.tpl

@@ -14,12 +14,12 @@
 <body>
 
 <div class="container-fluid" style="position: absolute; top: 0; bottom: 0">
-	<div class="row" style="height: 100%">
-		<div class="col" style="height: 100%">
-			<iframe src="http://localhost/omlink" width="100%" height="100%"></iframe>
+	<div class="row h-100">
+		<div class="col h-100">
+			<iframe class="h-100 w-100" src="http://localhost/omlink"></iframe>
 		</div>
-		<div class="col" style="height: 100%">
-			<iframe src="http://192.168.253.128/" width="100%" height="100%"></iframe>
+		<div class="col h-100">
+			<iframe class="h-100 w-100" src="http://192.168.253.128/"></iframe>
 		</div>
 	</div>
 </div>

ui/images/svg/disegno.svg

@@ -71,9 +71,9 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="1.1072939"
-     inkscape:cx="3177.3669"
-     inkscape:cy="2230.105"
+     inkscape:zoom="0.19574376"
+     inkscape:cx="1779.5434"
+     inkscape:cy="1560.3508"
      inkscape:document-units="mm"
      inkscape:current-layer="layer1"
      showgrid="false"
@@ -129,8 +129,8 @@
      style="display:inline">
     <g
        id="cornice_per_esportazione"
-       transform="translate(451.89615,723.24807)"
-       inkscape:export-filename="C:\nginx\html\lamborghini\ui\images\import.png"
+       transform="translate(446.57808,722.9313)"
+       inkscape:export-filename="C:\nginx\html\omlink\ui\images\mav2as400.png"
        inkscape:export-xdpi="96"
        inkscape:export-ydpi="96"
        style="display:inline;fill:none;fill-opacity:1;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:3.00000008, 1.00000003;stroke-dashoffset:0;stroke-opacity:1">
@@ -1035,11 +1035,11 @@
        id="elenco_distinta">
       <polygon
          style="fill:#edeada"
-         points="51.5,58 51.5,14 37.5,0 6.5,0 6.5,58 "
+         points="51.5,14 37.5,0 6.5,0 6.5,58 51.5,58 "
          id="polygon5174" />
       <polygon
          style="fill:#cec9ae"
-         points="37.5,0 37.5,14 51.5,14 "
+         points="37.5,14 51.5,14 37.5,0 "
          id="polygon5176" />
       <path
          inkscape:connector-curvature="0"
@@ -1229,7 +1229,7 @@
        id="geoloc">
       <polygon
          style="fill:#ffffff"
-         points="53.057,24.76 43.057,24.76 17.057,24.76 7.057,24.76 3.402,53.76 56.171,53.76 "
+         points="3.402,53.76 56.171,53.76 53.057,24.76 43.057,24.76 17.057,24.76 7.057,24.76 "
          id="polygon5393" />
       <path
          inkscape:connector-curvature="0"
@@ -1388,11 +1388,11 @@
              transform="matrix(3.1189539,0,0,3.4848635,1220.9139,-1058.656)">
             <polygon
                id="polygon5174-1"
-               points="37.5,0 6.5,0 6.5,58 51.5,58 51.5,14 "
+               points="6.5,0 6.5,58 51.5,58 51.5,14 37.5,0 "
                style="fill:#edeada" />
             <polygon
                id="polygon5176-8"
-               points="37.5,14 51.5,14 37.5,0 "
+               points="51.5,14 37.5,0 37.5,14 "
                style="fill:#cec9ae" />
             <path
                id="path5178-6"
@@ -6017,202 +6017,120 @@
       </g>
     </g>
     <g
-       style="display:inline"
-       transform="matrix(1.2591978,0,0,1.3026184,543.7218,-959.87244)"
-       id="database-2"
-       inkscape:export-filename="C:\nginx\html\lamborghini\ui\images\import.png"
+       id="g2341"
+       transform="matrix(0.62539987,0,0,0.62539987,-245.73161,-222.88622)"
+       inkscape:export-filename="C:\nginx\html\omlink\ui\images\mav2as400.png"
        inkscape:export-xdpi="96"
        inkscape:export-ydpi="96">
       <g
-         id="g4834-1">
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#424a60"
-           d="M 24,35 V 34.625 34.25 25.625 25.25 h 0.034 C 24.013,25.374 24,25.499 24,25.625 24,23.188 27.862,21.073 33.534,20 H 3.608 C 1.616,20 0,21.615 0,23.608 V 35.391 C 0,37.385 1.616,39 3.608,39 H 24 Z"
-           id="path4832-3" />
-      </g>
-      <g
-         id="g4838-3">
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#556080"
-           d="M 24.034,53 H 24 V 44 43.625 43.25 39 H 3.608 C 1.616,39 0,40.615 0,42.608 V 54.391 C 0,56.385 1.616,58 3.608,58 h 28.718 c -4.725,-1.069 -7.948,-2.897 -8.292,-5 z"
-           id="path4836-8" />
-      </g>
-      <path
-         inkscape:connector-curvature="0"
-         style="fill:#556080"
-         d="M 54.392,20 H 3.608 C 1.616,20 0,18.384 0,16.392 V 4.608 C 0,2.616 1.616,1 3.608,1 H 54.391 C 56.384,1 58,2.616 58,4.608 V 16.391 C 58,18.384 56.384,20 54.392,20 Z"
-         id="path4840-4" />
-      <circle
-         style="fill:#7383bf"
-         cx="9.5"
-         cy="10.5"
-         r="3.5"
-         id="circle4842-6" />
-      <circle
-         style="fill:#7383bf"
-         cx="49"
-         cy="9"
-         r="1"
-         id="circle4844-7" />
-      <circle
-         style="fill:#7383bf"
-         cx="45"
-         cy="9"
-         r="1"
-         id="circle4846-5" />
-      <circle
-         style="fill:#7383bf"
-         cx="51"
-         cy="12"
-         r="1"
-         id="circle4848-6" />
-      <circle
-         style="fill:#7383bf"
-         cx="47"
-         cy="12"
-         r="1"
-         id="circle4850-0" />
-      <circle
-         style="fill:#7383bf"
-         cx="41"
-         cy="9"
-         r="1"
-         id="circle4852-1" />
-      <circle
-         style="fill:#7383bf"
-         cx="43"
-         cy="12"
-         r="1"
-         id="circle4854-8" />
-      <circle
-         style="fill:#7383bf"
-         cx="37"
-         cy="9"
-         r="1"
-         id="circle4856-8" />
-      <circle
-         style="fill:#7383bf"
-         cx="39"
-         cy="12"
-         r="1"
-         id="circle4858-1" />
-      <circle
-         style="fill:#7383bf"
-         cx="33"
-         cy="9"
-         r="1"
-         id="circle4860-5" />
-      <circle
-         style="fill:#7383bf"
-         cx="35"
-         cy="12"
-         r="1"
-         id="circle4862-4" />
-      <circle
-         style="fill:#7383bf"
-         cx="9.5"
-         cy="29.5"
-         r="3.5"
-         id="circle4864-2" />
-      <circle
-         style="fill:#7383bf"
-         cx="9.5"
-         cy="48.5"
-         r="3.5"
-         id="circle4866-6" />
-      <g
-         id="g4874-6">
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#1a9172"
-           d="m 42,48.75 c -9.941,0 -18,-2.854 -18,-6.375 V 53 h 0.034 c 0.548,3.346 8.381,6 17.966,6 9.585,0 17.418,-2.654 17.966,-6 H 60 V 42.375 c 0,3.521 -8.059,6.375 -18,6.375 z"
-           id="path4868-1" />
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#1a9172"
-           d="m 24,42 v 0.375 C 24,42.249 24.013,42.124 24.034,42 Z"
-           id="path4870-4" />
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#1a9172"
-           d="M 59.966,42 C 59.987,42.124 60,42.249 60,42.375 V 42 Z"
-           id="path4872-9" />
-      </g>
-      <g
-         id="g4882-4">
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#25ae88"
-           d="M 42,38 C 32.059,38 24,35.146 24,31.625 V 42.75 h 0.034 c 0.548,3.346 8.381,6 17.966,6 9.585,0 17.418,-2.654 17.966,-6 H 60 V 31.625 C 60,35.146 51.941,38 42,38 Z"
-           id="path4876-2" />
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#25ae88"
-           d="m 24,31.25 v 0.375 c 0,-0.126 0.013,-0.251 0.034,-0.375 z"
-           id="path4878-9" />
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#25ae88"
-           d="M 59.966,31.25 C 59.987,31.374 60,31.499 60,31.625 V 31.25 Z"
-           id="path4880-2" />
-      </g>
-      <ellipse
-         style="fill:#88c057"
-         cx="42"
-         cy="21.375"
-         rx="18"
-         ry="6.375"
-         id="ellipse4884-8" />
-      <g
-         id="g4892-1">
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#61b872"
-           d="m 42,27.75 c -9.941,0 -18,-2.854 -18,-6.375 V 32 h 0.034 c 0.548,3.346 8.381,6 17.966,6 9.585,0 17.418,-2.654 17.966,-6 H 60 V 21.375 c 0,3.521 -8.059,6.375 -18,6.375 z"
-           id="path4886-1" />
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#61b872"
-           d="m 24,21 v 0.375 C 24,21.249 24.013,21.124 24.034,21 Z"
-           id="path4888-7" />
-        <path
-           inkscape:connector-curvature="0"
-           style="fill:#61b872"
-           d="M 59.966,21 C 59.987,21.124 60,21.249 60,21.375 V 21 Z"
-           id="path4890-2" />
-      </g>
-      <g
-         id="g4894-1" />
-      <g
-         id="g4896-9" />
-      <g
-         id="g4898-1" />
-      <g
-         id="g4900-1" />
-      <g
-         id="g4902-3" />
-      <g
-         id="g4904-0" />
-      <g
-         id="g4906-8" />
-      <g
-         id="g4908-3" />
-      <g
-         id="g4910-0" />
-      <g
-         id="g4912-1" />
-      <g
-         id="g4914-0" />
-      <g
-         id="g4916-9" />
-      <g
-         id="g4918-9" />
-      <g
-         id="g4920-7" />
-      <g
-         id="g4922-9" />
+         transform="matrix(0.26458333,0,0,0.26458333,-85.497711,-1166.1734)"
+         id="g2224">
+	<path
+   id="path2218"
+   d="m 587.3,167.5 21.9,58.1 21.8,-58.1 h 17 v 75.9 h -13.1 v -25 l 1.3,-33.5 -22.4,58.5 h -9.4 L 582,185 l 1.3,33.4 v 25 h -13.1 v -75.9 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+	<path
+   id="path2220"
+   d="m 707,225.7 h -29.4 l -6.1,17.7 h -13.7 l 28.7,-75.9 h 11.8 l 28.7,75.9 h -13.8 z m -25.7,-10.6 h 22 l -11,-31.5 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+	<path
+   id="path2222"
+   d="m 758.3,226.9 19.3,-59.3 H 792 l -27.3,75.9 H 752 l -27.2,-75.9 h 14.4 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+</g>
+      <g
+         transform="matrix(0.26458333,0,0,0.26458333,-85.497711,-1166.1734)"
+         id="g2238">
+	<path
+   id="path2226"
+   d="m 555.7,576.3 h -29.4 l -6.1,17.7 h -13.7 l 28.7,-75.9 H 547 L 575.7,594 H 561.9 Z M 530,565.7 h 22 l -11,-31.5 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+	<path
+   id="path2228"
+   d="m 623.9,574.4 c 0,-3.3 -1.2,-5.9 -3.5,-7.7 -2.3,-1.8 -6.6,-3.6 -12.7,-5.5 -6.1,-1.8 -11,-3.9 -14.6,-6.1 -6.9,-4.3 -10.4,-10 -10.4,-17 0,-6.1 2.5,-11.2 7.5,-15.1 5,-4 11.5,-5.9 19.4,-5.9 5.3,0 10,1 14.1,2.9 4.1,1.9 7.4,4.7 9.7,8.3 2.4,3.6 3.5,7.6 3.5,12 h -13.1 c 0,-4 -1.2,-7.1 -3.7,-9.3 -2.5,-2.2 -6,-3.4 -10.7,-3.4 -4.3,0 -7.7,0.9 -10,2.8 -2.4,1.8 -3.6,4.4 -3.6,7.7 0,2.8 1.3,5.1 3.9,7 2.6,1.9 6.8,3.7 12.7,5.4 5.9,1.8 10.6,3.8 14.2,6 3.6,2.2 6.2,4.8 7.9,7.7 1.7,2.9 2.5,6.3 2.5,10.2 0,6.3 -2.4,11.4 -7.3,15.1 -4.9,3.7 -11.4,5.6 -19.7,5.6 -5.5,0 -10.5,-1 -15.1,-3 -4.6,-2 -8.2,-4.8 -10.7,-8.4 -2.6,-3.6 -3.8,-7.7 -3.8,-12.5 h 13.2 c 0,4.3 1.4,7.6 4.3,10 2.8,2.4 6.9,3.5 12.2,3.5 4.6,0 8,-0.9 10.3,-2.8 2.3,-1.9 3.5,-4.4 3.5,-7.5 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+	<path
+   id="path2230"
+   d="m 651,600.5 h -10 l 29.9,-82.4 h 10 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+	<path
+   id="path2232"
+   d="m 731.6,566.9 h 9.4 v 10.2 h -9.4 V 594 H 719 v -16.9 h -32.8 l -0.4,-7.7 32.7,-51.3 h 13.1 z m -32.5,0 H 719 v -31.7 l -0.9,1.7 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+	<path
+   id="path2234"
+   d="m 798.9,562 c 0,10.9 -2,19.1 -6.1,24.7 -4.1,5.5 -10.3,8.3 -18.6,8.3 -8.2,0 -14.4,-2.7 -18.5,-8.1 -4.2,-5.4 -6.3,-13.4 -6.4,-24 v -13.1 c 0,-10.9 2,-19.1 6.1,-24.5 4.1,-5.5 10.3,-8.2 18.7,-8.2 8.3,0 14.5,2.7 18.6,8 4.1,5.3 6.2,13.3 6.3,23.9 v 13 z m -12.7,-14.1 c 0,-7.1 -1,-12.3 -2.9,-15.7 -1.9,-3.3 -5,-5 -9.3,-5 -4.1,0 -7.2,1.6 -9.1,4.7 -1.9,3.1 -3,8.1 -3.1,14.7 v 17.2 c 0,7.1 1,12.4 3,15.8 2,3.5 5.1,5.2 9.3,5.2 4.1,0 7.1,-1.6 9,-4.8 1.9,-3.2 3,-8.2 3.1,-15.1 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+	<path
+   id="path2236"
+   d="m 859.6,562 c 0,10.9 -2,19.1 -6.1,24.7 -4.1,5.5 -10.3,8.3 -18.6,8.3 -8.2,0 -14.4,-2.7 -18.5,-8.1 -4.2,-5.4 -6.3,-13.4 -6.4,-24 v -13.1 c 0,-10.9 2,-19.1 6.1,-24.5 4.1,-5.5 10.3,-8.2 18.7,-8.2 8.3,0 14.5,2.7 18.6,8 4.1,5.3 6.2,13.3 6.3,23.9 v 13 z m -12.7,-14.1 c 0,-7.1 -1,-12.3 -2.9,-15.7 -1.9,-3.3 -5,-5 -9.3,-5 -4.1,0 -7.2,1.6 -9.1,4.7 -1.9,3.1 -3,8.1 -3.1,14.7 v 17.2 c 0,7.1 1,12.4 3,15.8 2,3.5 5.1,5.2 9.3,5.2 4.1,0 7.1,-1.6 9,-4.8 1.9,-3.2 3,-8.2 3.1,-15.1 z"
+   class="st0"
+   inkscape:connector-curvature="0"
+   style="fill:#5966b1" />
+
+</g>
+      <g
+         transform="matrix(0.26458333,0,0,0.26458333,-85.497711,-1166.1734)"
+         id="g2250">
+	<g
+   id="g2242">
+		<rect
+   id="rect2240"
+   height="147.10001"
+   width="9.1000004"
+   class="st1"
+   y="284.10001"
+   x="680.70001"
+   style="fill:#00b96f" />
+
+	</g>
+
+	<g
+   id="g2248">
+		<g
+   id="g2246">
+			<polygon
+   id="polygon2244"
+   points="708.1,424.5 662.5,424.5 685.3,464 "
+   class="st1"
+   style="fill:#00b96f" />
+
+		</g>
+
+	</g>
+
+</g>
     </g>
   </g>
+  <style
+     id="style2216"
+     type="text/css">
+	.st0{fill:#5966B1;}
+	.st1{fill:#00B96F;}
+	.st2{fill:none;stroke:#00B96F;stroke-width:6;stroke-miterlimit:10;}
+</style>
 </svg>

ui/js/omlink.js

@@ -6,18 +6,58 @@
  * @time 17:42
  */
 
-$(function () {
+function NotificationBuilder(notifications) {
+  let tplNotify = '';
+  let htmlNotificationArea = '';
+  if (notifications.length == 0) {
+    $('#notification_area_button').addClass('disabled');
+    $('#sysmsgnum').empty();
+  } else {
+    notifications.forEach(function (element) {
+      tplNotify += `<a class="dropdown-item" href="javascript:NotificationDelete('${element.link}', ${element.code})">${element.caption}<span class="ml-1 badge badge-danger">${element.count}</span></a>`;
+    });
 
-  var ws = new WebSocket('ws://localhost:80');
-  ws.onopen = function () {
-    console.log('websocket  connection stabilita...')
-    ws.send('hello')
-  }
-  ws.onmessage = function (message) {
-    console.log('Messaggio ricevuto :',message);
+    htmlNotificationArea = `
+${tplNotify}
+<a id="notification_area_deleteall" class="dropdown-item text-center" href="javascript:NotificationDelete('#', 0)" >Cancella tutto</a>
+`;
+    $('#notification_area_button').removeClass('disabled');
+    $('#sysmsgnum').html(notifications.length);
   }
 
 
+  $('#notification_area').html(htmlNotificationArea);
+}
+
+function refreshNotificationArea() {
+  fetch('/omlink/api.system.getserverstatus')
+    .then(resp => {
+      if (resp.status == 200)
+        return resp.json();
+      else
+        return Promise.reject("getserverstatus: error");
+    })
+    .then(data => {
+      NotificationBuilder(data.notify);
+    })
+    .catch(err => {
+      console.log(err);
+    });
+}
+
+function NotificationDelete(link, code) {
+  fetch(`/omlink/api.system.removenotification/${code}`, {method: "POST"})
+    .then(() => {
+      window.location.href = `${BASEURL}${link}`;
+    })
+    .catch(() => {
+      alert('NotificationDelete error');
+    });
+}
+
+$(function () {
+  refreshNotificationArea();
+
   $('form').on('submit', function () {
     $('form input,select').prop('disabled', false);
     setTimeout(function () {
@@ -26,19 +66,6 @@ $(function () {
   });
 
   setInterval(() => {
-    fetch('/omlink/getserverstatus')
-      .then(resp => {
-        if (resp.status == 200)
-          return resp.json();
-        else
-          return Promise.reject("getserverstatus: error");
-      })
-      .then(data => {
-        $('#sysmsgnum').html(data.notify);
-      })
-      .catch(err => {
-        console.log(err);
-      });
+    refreshNotificationArea();
   }, 5000);
 });
-