NotificationInbox
TsgcHTMLComponent_NotificationInbox: een bel met een ongelezen-badge en een dropdownlijst met de meldingen van één gebruiker, in Delphi, C++ Builder en .NET. Je applicatie bewaart de rijen, het component rendert ze.
TsgcHTMLComponent_NotificationInbox: een bel met een ongelezen-badge en een dropdownlijst met de meldingen van één gebruiker, in Delphi, C++ Builder en .NET. Je applicatie bewaart de rijen, het component rendert ze.
De bibliotheek slaat niets op. Je applicatie beantwoordt OnLoadNotifications met de rijen die ze bewaart en krijgt via OnMarkRead en OnMarkAllRead te horen wat de gebruiker deed, zodat ze dat kan vastleggen. Het component rendert UI en dwingt geen autorisatie af. Het werkt op elke editie, via WebSocket of Server-Sent Events.
TsgcHTMLComponent_NotificationInbox (unit sgcHTML_Component_NotificationInbox)
Bootstrap-dropdownmarkup: een bel, een ongelezen-badge en een lijst
Delphi, C++ Builder, .NET
Geef de inbox een InboxID, vul die vanuit je eigen opslag in OnLoadNotifications, leg vast wat de gebruiker deed in OnMarkRead en OnMarkAllRead, en routeer de geposte acties naar ProcessAction met de gebruiker uit de sessie.
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());
De members die je het vaakst gebruikt.
Items is een TsgcHTMLInboxItems-verzameling; elk TsgcHTMLInboxItem heeft Id, Title, Text, Timestamp, Url, Icon en Read. Alles in een rij is data en wordt bij het renderen geëscaped, ook de Icon: geef een letterlijke glyph mee, nooit een HTML-entiteit of markup. Url wordt gesanitized en links met javascript: en data: worden geweigerd.
Het component bewaart alleen wat het rendert. OnLoadNotifications(aUserID, aList) wordt aangeroepen met een aList die al is leeggemaakt: vul die met de meldingen van de gebruiker, nieuwste eerst. OnMarkRead(aUserID, aNotificationID) wordt aangeroepen nadat het item als gelezen is gemarkeerd, en OnMarkAllRead(aUserID) nadat elk item dat is.
LoadNotifications(aUserID), MarkRead(aUserID, aNotificationID) en MarkAllRead(aUserID) doen het werk. ProcessAction(aUserID, aAction, aNotificationID) routeert één geposte actie naar de juiste en geeft False terug wanneer de actie geen inbox-actie is, zodat je verder kunt zoeken naar de eigenaar ervan.
De dropdown post inboxMarkRead (velden action, inbox, id), inboxMarkAllRead en inboxRefresh (velden action, inbox) als data-sgc-ws-send-formulieren. Het veld inbox bevat de element-id van de inbox die het formulier heeft gerenderd, en dat is InboxID wanneer je die instelt. Zo routeert een pagina met meerdere inboxen de actie naar het juiste component.
Het component rendert UI en dwingt geen autorisatie af. Elke actie reist als data die door de client wordt verstuurd, dus een vijandige client kan elke actie en elke id van een melding vervalsen. Er wordt geen gebruikers-id in de markup geschreven: neem de handelende gebruiker uit de sessie van het verzoek (sgcHTMLRequestSession), nooit uit het formulier, en controleer of de gebruiker eigenaar is van de melding waarvan de id binnenkwam voordat je iets vastlegt.
Title is de kop van de dropdown, EmptyText de tijdelijke tekst wanneer er niets te tonen is en BellIcon het trigger-glyph, vertrouwde markup met standaard een HTML-entiteit. MaxItems beperkt de zichtbare rijen (standaard 10, met 0 worden ze allemaal getoond), ShowMarkAllRead en ShowBadge staan standaard aan, en AddNotification(aId, aTitle, aText, aTimestamp, aUrl, aIcon) voegt een rij toe of werkt die met dezelfde id bij.
Elke melding, de badge en de lijst hebben een stabiele element-id. Render na één wijziging alleen de betreffende markup met GetItemFragmentHTML(aId), GetBadgeFragmentHTML of GetListFragmentHTML en push die met TsgcHTMX_Engine_Server.PushFragment of BroadcastFragment, in plaats van de pagina opnieuw te renderen. UnreadCount telt de items waarvan Read False is.
De unit compileert wanneer SGC_HTML is gedefinieerd, wat sgcVer.inc niet doet voor Android en iOS. Het werkt op elke editie, via WebSocket of Server-Sent Events. sgcHTML is een zelfstandig pack, los van sgcWebSockets verkocht.
De inbox kiest zelf niet tussen de pagina en een push: dat doet TsgcHTMLComponent_Notification, zie Notification en WebPush. Welke kanalen elke gebruiker wil, wordt ingesteld in NotificationPreferences.
| Online helpVolledige API-referentie en gebruikshandleiding voor dit onderdeel. | Openen | |
| Alle sgcHTML-componentenBlader door de volledige functiematrix van 80+ componenten. | Openen | |
| Download gratis proefversieDe proefversie van 30 dagen bevat de 60.HTML-demoprojecten, waaronder 17.FieldService, dat de inbox gebruikt. | Openen | |
| PrijzenSingle-, Team- en Site-licenties met volledige broncode. | Openen |