Added real notifications (not AJAX jet)

Former-commit-id: 5d0dee32c4fb96ad8dcb4f3f70049e1d1c4936fc

pandora_console/include/functions_messages.php

@@ -411,18 +411,20 @@ function messages_get_count_sent(string $user='')
 /**
  * Get message overview in array
  *
- * @param string  $order     How to order them valid:
+ * @param string  $order            How to order them valid:
- *                           (status (default), subject, timestamp, sender).
+ *                                  (status (default), subject, timestamp, sender).
- * @param string  $order_dir Direction of order
+ * @param string  $order_dir        Direction of order
- *                           (ASC = Ascending, DESC = Descending).
+ *                                  (ASC = Ascending, DESC = Descending).
- * @param boolean $incl_read Include read messages in return.
+ * @param boolean $incl_read        Include read messages in return.
+ * @param boolean $incl_source_info Include source info.
  *
  * @return integer The number of messages this user has
  */
 function messages_get_overview(
     string $order='status',
     string $order_dir='ASC',
-    bool $incl_read=true
+    bool $incl_read=true,
+    bool $incl_source_info=false
 ) {
     global $config;
 
@@ -453,21 +455,32 @@ function messages_get_overview(
         $read = 'where t.read is null';
     }
 
+    $source_fields = '';
+    $source_join = '';
+    if ($incl_source_info) {
+        $source_fields = ', tns.*';
+        $source_join = 'INNER JOIN tnotification_source tns
+            ON tns.id=tm.id_source';
+    }
+
     $sql = sprintf(
         'SELECT * FROM (
-            SELECT tm.*, utimestamp_read > 0 as "read" FROM tmensajes tm 
+            SELECT tm.*, utimestamp_read > 0 as "read" %s FROM tmensajes tm 
             LEFT JOIN tnotification_user nu
                 ON tm.id_mensaje=nu.id_mensaje 
             LEFT JOIN (tnotification_group ng
                 INNER JOIN tusuario_perfil up
                     ON ng.id_group=up.id_grupo
                     AND up.id_grupo=ng.id_group
-            ) ON tm.id_mensaje=ng.id_mensaje 
+            ) ON tm.id_mensaje=ng.id_mensaje
+            %s
             WHERE utimestamp_erased is null
                 AND (up.id_usuario="%s" OR nu.id_user="%s" OR ng.id_group=0)
         ) t 
         %s
         ORDER BY %s',
+        $source_fields,
+        $source_join,
         $config['id_user'],
         $config['id_user'],
         $read,

pandora_console/include/functions_notifications.php

@@ -523,6 +523,11 @@ function notifications_set_user_label_status($source, $user, $label, $value)
 }
 
 
+// /////////////////////////////////////////////////////////////////////////////
+// UI FUNCTIONS
+// /////////////////////////////////////////////////////////////////////////////
+
+
 /**
  * Print the notification ball to see unread messages.
  *
@@ -533,7 +538,11 @@ function notifications_print_ball()
     $num_notifications = messages_get_count();
     $class_status = ($num_notifications == 0) ? 'notification-ball-no-messages' : 'notification-ball-new-messages';
     return sprintf(
-        '<div class="notification-ball %s" id="notification-ball-header">
+        '<div
+            onclick="addNotifications(event)"
+            class="notification-ball %s"
+            id="notification-ball-header"
+        >
             %s
         </div>',
         $class_status,
@@ -807,3 +816,58 @@ function notifications_print_user_switch($source, $user, $label)
         ]
     );
 }
+
+
+/**
+ * Generates the dropdown notifications menu.
+ *
+ * @return string HTML with dropdown menu.
+ */
+function notifications_print_dropdown()
+{
+    $mess = messages_get_overview('status', 'DESC', false, true);
+    if ($mess === false) {
+        $mess = [];
+    }
+
+    return sprintf(
+        "<div class='notification-wrapper' style='display:none;'>
+            %s
+        </div>",
+        array_reduce(
+            $mess,
+            function ($carry, $message) {
+                return $carry.notifications_print_dropdown_element($message);
+            },
+            ''
+        )
+    );
+}
+
+
+/**
+ * Print a single notification box
+ *
+ * @param array $message_info Info of printed message.
+ *
+ * @return string HTML code of single message
+ */
+function notifications_print_dropdown_element($message_info)
+{
+    return sprintf(
+        "<div class='notification-item'>
+            <img src='%s'>
+            <div class='notification-info'>
+                <h4 class='notification-title'>
+                    %s
+                </h4>
+                <p class='notification-subtitle'>
+                    %s
+                </p>
+            </div>
+        </div>",
+        html_print_image('images/'.$message_info['icon'], true),
+        $message_info['description'],
+        $message_info['mensaje']
+    );
+}

pandora_console/include/styles/pandora.css

@@ -4929,6 +4929,59 @@ div#dialog_messages table th:last-child {
   background-color: #fc4444;
 }
 
+.notification-wrapper {
+  background: white;
+  border: #a5a5a5 solid 1px;
+  z-index: 900000;
+  position: absolute;
+  width: 400px;
+  margin-top: -5px;
+}
+.notification-wrapper::before {
+  content: "";
+  display: block;
+  position: absolute;
+  width: 0px;
+  height: 0;
+  border-color: transparent;
+  border-width: 12px;
+  border-style: solid;
+  bottom: 100%;
+  left: 78%;
+  left: calc(78% - 2px);
+  margin-left: -12px;
+  border-bottom-color: white;
+}
+.notification-item {
+  background: whitesmoke;
+  height: 100px;
+  margin: 7px;
+  border: #cccccc solid 1px;
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+}
+.notification-item > * {
+  padding-left: 15px;
+}
+
+.notification-info {
+  width: 87%;
+  display: flex;
+  flex-flow: column nowrap;
+}
+.notification-item img {
+  max-width: 100%;
+  max-height: 100%;
+}
+.notification-title {
+  margin: 0;
+}
+.notification-subtitle {
+  margin: 0;
+  color: #373737;
+}
+
 .global-config-notification-title {
   display: flex;
   flex-direction: row;