Notifications work with dms now

js/main.js

@@ -138,10 +138,17 @@ function on_timer_save() {
 }
 
 function on_timer_tick() {
-	//return;
-	setTimeout(() => {
-		DAMUS.relay_que.forEach((que, relay) => {
-			model_fetch_next_profile(DAMUS, relay);
+	const model = DAMUS;
+	setTimeout(async () => {
+		if (model.dms_need_redraw && view_get_timeline_el().dataset.mode == VM_DM) {
+			// if needs decryption do it
+			await decrypt_dms(model);
+			view_dm_update(model);
+			model.dms_need_redraw = false;
+		}
+		update_notifications(model);
+		model.relay_que.forEach((que, relay) => {
+			model_fetch_next_profile(model, relay);
 		});
 		on_timer_tick();
 	}, 1 * 1000);

js/model.js

@@ -197,10 +197,11 @@ function model_process_event_dm(model, ev, update_view) {
 	dm.events.splice(i, 0, ev);
 
 	// Check if DM is new
-	const b = model.all_events[dm.last_seen];
+	const b = model.all_events[dm.last_viewed];
 	if (!b || b.created_at < ev.created_at) {
-		// TODO update notification UI 
 		dm.new_count++;
+		// dirty hack
+		model.dms_need_redraw = true;
 	}
 }
 
@@ -213,7 +214,7 @@ function model_get_dm(model, target) {
 			// all_events. It should not be a copy to reduce memory.
 			events: [], 
 			// Last read event by the client/user
-			last_seen: "", 
+			last_viewed: "", 
 			new_count: 0,
 			// Notifies the renderer that this dm is out of date
 			needs_redraw: false,
@@ -223,6 +224,20 @@ function model_get_dm(model, target) {
 	return model.dms.get(target);
 }
 
+function model_dm_seen(model, target) {
+	const dm = model_get_dm(model, target);
+	dm.last_viewed = dm.events[0];
+	dm.new_count = 0;
+	dm.needs_redraw = true;
+}
+
+function model_mark_dms_seen(model) {
+	model.dms.forEach((dm) => {
+		model_dm_seen(model, dm.pubkey);
+	});
+	model.dms_need_redraw = true;
+}
+
 /* model_process_event_reaction updates the reactions dictionary
  */
 function model_process_event_reaction(model, ev, update_view) {

js/ui/dm.js

@@ -1,6 +1,7 @@
 function view_dm_update(model) {
 	const el = find_node("#dms");
 	const order = [];
+	let reorder = false;
 	model.dms.forEach((dm, pubkey, m) => {
 		if (!dm.events.length)
 			return;
@@ -16,6 +17,7 @@ function view_dm_update(model) {
 		}
 		update_el_dmgroup(model, dm, gel);
 		dm.needs_redraw = false;
+		reorder = true;
 	});
 
 	// I'm not sure what is faster, doing a frag update all at once OR just
@@ -23,6 +25,7 @@ function view_dm_update(model) {
 	// chances of them all updating is is small and only garuenteed when it 
 	// draws the first time.
 	//const frag = new DocumentFragment();
+	if (!reorder) return;
 	for (let i = 0; i < order.length; i++) {
 		let dm = order[i];
 		let xel = el.children[i];
@@ -51,7 +54,7 @@ function update_el_dmgroup(model, dm, el) {
 	const message = ev.decrypted || ev.content || "No Message.";
 	const time = fmt_datetime(new Date(ev.created_at * 1000));
 	const cel = find_node(".count", el)
-	cel.innerText = dm.new_count;
+	cel.innerText = dm.new_count || dm.events.length;
 	cel.classList.toggle("active", dm.new_count > 0);
 	find_node(".time", el).innerText = time;
 	find_node(".message", el).innerText = message;

js/ui/state.js

@@ -112,6 +112,7 @@ function view_timeline_apply_mode(model, mode, opts={}, push_state=true) {
 	switch (mode) {
 		case VM_DM_THREAD:
 			decrypt_dms(model);
+			model_dm_seen(model, pubkey);
 			el_their_pfp.src = get_profile_pic(profile);
 			el_their_pfp.dataset.pubkey = pubkey;
 			break;
@@ -234,16 +235,19 @@ function view_timeline_update(model) {
 
 	// If there are new things to show on our current view lets do it
 	if (count > 0) {
-		if (!latest_ev) {
+		if (!latest_ev || mode == VM_DM_THREAD) {
 			view_timeline_show_new(model);
 		}
-		view_set_show_count(count, true, false);	
+		if (mode == VM_DM_THREAD) {
+			model_mark_dms_seen(model, opts.pubkey);
+			view_dm_update(model);
+		}
+		view_set_show_count(count, true, false);
 	}
 	// Update notification markers and count
 	if (ncount > 0) {
-		log_debug(`new notis ${ncount}`);
+		//log_debug(`new notis ${ncount}`);
 		model.notifications.count += ncount;
-		update_notifications(model);
 	}
 	// Update the dms list view
 	if (decrypted) {

js/ui/util.js

@@ -28,8 +28,8 @@ function init_message_textareas() {
 // update_notification_markers will find all markers and hide or show them
 // based on the passed in state of 'active'. This applies to the navigation 
 // icons.
-function update_notification_markers(active) {
-	let els = document.querySelectorAll(".new-notifications")
+function update_notification_markers(active, type) {
+	let els = document.querySelectorAll(`.new-notifications[role='${type}']`)
 	for (const el of els) {
 		el.classList.toggle("hide", !active)
 	}
@@ -142,12 +142,20 @@ function update_favicon(path) {
 // update_notifications updates the document title & visual indicators based on if the
 // number of notifications that are unseen by the user.
 function update_notifications(model) {
+	let dm_count = 0;
+	for (const item of model.dms) {
+		if (item[1].new_count)
+			dm_count += item[1].new_count;
+	}
+	
 	const { count } = model.notifications;
 	const suffix = "Yo Sup";
-	document.title = count ? `(${count}) ${suffix}` : suffix;
-	// TODO I broke the favicons. I will fix with notications update
+	const total = count + dm_count;
+	document.title = total ? `(${total}) ${suffix}` : suffix;
+	// TODO I broke the favicons; I will fix with later.
 	//update_favicon(has_notes ? "img/damus_notif.svg" : "img/damus.svg");
-	update_notification_markers(count);
+	update_notification_markers(count, "activity");
+	update_notification_markers(dm_count, "dm");
 }
 
 async function get_pubkey(use_prompt=true) {