NotificationInbox

TsgcHTMLComponent_NotificationInbox: una campanella con un badge dei non letti e un elenco a discesa delle notifiche di un utente, in Delphi, C++ Builder e .NET. La tua applicazione conserva le righe, il componente le renderizza.

TsgcHTMLComponent_NotificationInbox

La libreria non memorizza nulla. La tua applicazione risponde a OnLoadNotifications con le righe che conserva e viene informata tramite OnMarkRead e OnMarkAllRead di ciò che l’utente ha fatto, così può salvarlo. Il componente renderizza l’interfaccia e non applica alcuna autorizzazione. Funziona in ogni edizione, tramite WebSocket o Server-Sent Events.

Classe del componente

TsgcHTMLComponent_NotificationInbox (unit sgcHTML_Component_NotificationInbox)

Renderizza

Markup del dropdown Bootstrap: una campanella, un badge dei non letti e un elenco

Linguaggi

Delphi, C++ Builder, .NET

Crealo, gestisci tre eventi, instrada le azioni

Assegna all’inbox un InboxID, riempila dal tuo archivio in OnLoadNotifications, salva ciò che l’utente ha fatto in OnMarkRead e OnMarkAllRead, e instrada le azioni inviate a ProcessAction con l’utente preso dalla sessione.

uses
  sgcHTML_Session, sgcHTML_Component_NotificationInbox;

var
  oInbox: TsgcHTMLComponent_NotificationInbox;
begin
  oInbox := TsgcHTMLComponent_NotificationInbox.Create(nil);
  try
    oInbox.InboxID := 'inbox';
    oInbox.Title := 'Notifications';
    oInbox.MaxItems := 10;
    oInbox.OnLoadNotifications := InboxLoad;
    oInbox.OnMarkRead := InboxMarkRead;
    oInbox.OnMarkAllRead := InboxMarkAllRead;

    // the user comes from the session, never from the form
    oInbox.LoadNotifications(sgcHTMLRequestSession.UserID);
    Response := oInbox.HTML;   // bell, unread badge and dropdown
  finally
    oInbox.Free;
  end;
end;

// the application owns the rows: fill the list, newest first
procedure TMain.InboxLoad(Sender: TObject; const aUserID: string;
  aList: TsgcHTMLInboxItems);
begin
  with aList.Add do
  begin
    Id := '1042';
    Title := 'New order';
    Text := 'Order #1042 was placed.';
    Timestamp := '2 min ago';
    Read := False;
  end;
end;

procedure TMain.InboxMarkRead(Sender: TObject; const aUserID,
  aNotificationID: string);
begin
  // persist it, after checking that aUserID owns aNotificationID
end;

// in the message handler that receives the actions the inbox posts
if oInbox.ProcessAction(vUser, vAction, vNotificationID) then
  oHTMX.PushFragment(vGuid, oInbox.GetListFragmentHTML +
    oInbox.GetBadgeFragmentHTML);
// includes: sgcHTML_Session.hpp, sgcHTML_Component_NotificationInbox.hpp

TsgcHTMLComponent_NotificationInbox *oInbox = new TsgcHTMLComponent_NotificationInbox(NULL);
try
{
  oInbox->InboxID = "inbox";
  oInbox->Title = "Notifications";
  oInbox->MaxItems = 10;
  oInbox->OnLoadNotifications = InboxLoad;
  oInbox->OnMarkRead = InboxMarkRead;
  oInbox->OnMarkAllRead = InboxMarkAllRead;

  // the user comes from the session, never from the form
  oInbox->LoadNotifications(sgcHTMLRequestSession()->UserID);
  String html = oInbox->HTML;   // bell, unread badge and dropdown
}
__finally
{
  delete oInbox;
}

// the application owns the rows: fill the list, newest first
void __fastcall TMain::InboxLoad(TObject *Sender, const String aUserID,
  TsgcHTMLInboxItems *aList)
{
  TsgcHTMLInboxItem *item = aList->Add();
  item->Id = "1042";
  item->Title = "New order";
  item->Text = "Order #1042 was placed.";
  item->Timestamp = "2 min ago";
  item->Read = false;
}

void __fastcall TMain::InboxMarkRead(TObject *Sender, const String aUserID,
  const String aNotificationID)
{
  // persist it, after checking that aUserID owns aNotificationID
}

// in the message handler that receives the actions the inbox posts
if (oInbox->ProcessAction(vUser, vAction, vNotificationID))
  oHTMX->PushFragment(vGuid, oInbox->GetListFragmentHTML() +
    oInbox->GetBadgeFragmentHTML());
using esegece.sgcWebSockets;

var inbox = new TsgcHTMLComponent_NotificationInbox();
inbox.InboxID = "inbox";
inbox.Title = "Notifications";
inbox.MaxItems = 10;
inbox.OnLoadNotifications += InboxLoad;
inbox.OnMarkRead += InboxMarkRead;
inbox.OnMarkAllRead += InboxMarkAllRead;

// the user comes from the session, never from the form
string user = sgcHTMLSessionHelpers.sgcHTMLRequestSession()?.UserID ?? "";
inbox.LoadNotifications(user);
string html = inbox.HTML;   // bell, unread badge and dropdown

// the application owns the rows: fill the list, newest first
void InboxLoad(object sender, string userID, TsgcHTMLInboxItems list)
{
    var item = list.Add();
    item.Id = "1042";
    item.Title = "New order";
    item.Text = "Order #1042 was placed.";
    item.Timestamp = "2 min ago";
    item.Read = false;
}

void InboxMarkRead(object sender, string userID, string notificationID)
{
    // persist it, after checking that userID owns notificationID
}

// in the message handler that receives the actions the inbox posts
if (inbox.ProcessAction(user, action, notificationId))
    htmx.PushFragment(guid, inbox.GetListFragmentHTML() + inbox.GetBadgeFragmentHTML());

Proprietà e metodi principali

I membri che utilizzerai più spesso.

Items

Items è una collezione TsgcHTMLInboxItems; ogni TsgcHTMLInboxItem ha Id, Title, Text, Timestamp, Url, Icon e Read. Tutto ciò che sta in una riga è un dato e viene sottoposto a escape quando viene renderizzato, Icon compreso: passa un glifo letterale, mai un’entità HTML o del markup. Url viene sanificato e i link javascript: e data: vengono rifiutati.

Eventi di archiviazione

Il componente conserva solo ciò che sta renderizzando. OnLoadNotifications(aUserID, aList) scatta con aList già svuotato: riempilo con le notifiche dell’utente, dalla più recente. OnMarkRead(aUserID, aNotificationID) scatta dopo che l’elemento è stato contrassegnato come letto, e OnMarkAllRead(aUserID) dopo che lo sono tutti.

Azioni lato server

LoadNotifications(aUserID), MarkRead(aUserID, aNotificationID) e MarkAllRead(aUserID) fanno il lavoro. ProcessAction(aUserID, aAction, aNotificationID) instrada un’azione inviata a quello giusto e restituisce False quando l’azione non è un’azione dell’inbox, così puoi continuare a cercarne il proprietario.

Azioni che invia

Il dropdown invia inboxMarkRead (campi action, inbox, id), inboxMarkAllRead e inboxRefresh (campi action, inbox) come moduli data-sgc-ws-send. Il campo inbox contiene l’id dell’elemento dell’inbox che ha renderizzato il modulo, che è InboxID quando lo imposti, ed è così che una pagina con più inbox instrada l’azione al componente giusto.

Autorizzazione

Il componente renderizza l’interfaccia e non applica alcuna autorizzazione. Ogni azione viaggia come dato inviato dal client, quindi un client ostile può falsificare qualsiasi azione e qualsiasi id di notifica. Nessun id utente viene scritto nel markup: prendi l’utente che agisce dalla sessione della richiesta (sgcHTMLRequestSession), mai dal modulo, e verifica che l’utente sia il proprietario dell’id di notifica arrivato prima di salvare qualsiasi cosa.

Aspetto

Title è l’intestazione del dropdown, EmptyText il testo segnaposto quando non c’è nulla da mostrare e BellIcon il glifo dell’attivatore, markup attendibile con un’entità HTML per impostazione predefinita. MaxItems limita le righe visibili (predefinito 10, 0 le mostra tutte), ShowMarkAllRead e ShowBadge sono attivi per impostazione predefinita, e AddNotification(aId, aTitle, aText, aTimestamp, aUrl, aIcon) aggiunge una riga o aggiorna quella con lo stesso id.

Aggiornamenti in tempo reale

Ogni notifica, il badge e l’elenco hanno un id di elemento stabile. Dopo una modifica, renderizza solo il markup interessato con GetItemFragmentHTML(aId), GetBadgeFragmentHTML oppure GetListFragmentHTML e invialo con TsgcHTMX_Engine_Server.PushFragment o BroadcastFragment, invece di renderizzare di nuovo la pagina. UnreadCount conta gli elementi il cui Read è False.

Edizioni e canali

L’unit compila quando è definito SGC_HTML, cosa che sgcVer.inc non fa per Android e iOS. Funziona in ogni edizione, tramite WebSocket o Server-Sent Events. sgcHTML è un pack autonomo, venduto indipendentemente da sgcWebSockets.

Pagina o push

L’inbox non sceglie da sola tra la pagina e un push: lo fa TsgcHTMLComponent_Notification, vedi Notification e WebPush. I canali che ogni utente desidera si impostano in NotificationPreferences.

Continua a esplorare

Guida in lineaRiferimento API completo e guida all’uso per questo componente.
Tutti i componenti sgcHTMLEsplora la matrice completa delle funzionalità di oltre 80 componenti.
Scarica la Prova GratuitaLa prova di 30 giorni include i progetti demo 60.HTML, tra cui 17.FieldService, che usa l’inbox.
PrezziLicenze Single, Team e Site con codice sorgente completo.
La scelta più conveniente: All-AccessTutti i prodotti eSeGeCe, con Supporto Premium incluso, a partire da €1,059/anno.
Vedi i prezzi All-Access

Pronto a Iniziare?

Scarica la versione di prova gratuita e inizia a creare interfacce web in Delphi, C++ Builder e .NET.