Option to only notify on (you)s references #191

gulp/res/js/forms.js

@@ -63,12 +63,6 @@ function formToJSON(form) {
 	return JSON.stringify(data);
 }
 
-function saveYouFromPath(path) {
-	const redirectBoard = path.split('/')[1];
-	const redirectPostId = path.split('#')[1];
-	appendLocalStorageArray('yous', `${redirectBoard}-${redirectPostId}`);
-}
-
 class formHandler {
 
 	constructor(form) {
@@ -183,9 +177,6 @@ class formHandler {
 						if (json.postId) {
 							window.myPostId = json.postId;
 						}
-						if (json.redirect) {
-							saveYouFromPath(json.redirect);
-						}
 						if (json.message || json.messages || json.error || json.errors) {
 							doModal(json);
 							if (json.message === 'Incorrect captcha answer') {

gulp/res/js/live.js

@@ -1,8 +1,6 @@
 setDefaultLocalStorage('live', true);
-setDefaultLocalStorage('notifications', false);
 setDefaultLocalStorage('scroll', false);
 let liveEnabled = localStorage.getItem('live') == 'true';
-let notificationsEnabled = localStorage.getItem('notifications') == 'true';
 let scrollEnabled = localStorage.getItem('scroll') == 'true';
 let socket;
 let forceUpdate;
@@ -63,17 +61,6 @@ window.addEventListener('settingsReady', function(event) { //after domcontentloa
 		if (scrollEnabled) {
 			newPostAnchor.scrollIntoView(); //scroll to post if enabled;
 		}
-		if (notificationsEnabled) {
-			if (!window.myPostId || window.myPostId != postData.postId) {
-				const notifTitle = document.title;
-				const notifOptions = {
-					body: postData.nomarkup ? postData.nomarkup.substring(0,100) : ''
-				}
-				try {
-					new Notification(notifTitle, notifOptions);
-				} catch (e) { /* dont break when notification cant send for some reason */ }
-			}
-		}
 		const newPostEvent = new CustomEvent('addPost', {
 			detail: {
 				post: newPost,
@@ -82,9 +69,9 @@ window.addEventListener('settingsReady', function(event) { //after domcontentloa
 			}
 		});
 		//dispatch the event so quote click handlers, image expand, etc can be added in separate scripts by listening to the event
-//		setTimeout(() => {
+		setTimeout(() => {
 			window.dispatchEvent(newPostEvent);
-//		}, 5);
+		}, 50);
 	}
 
 	let jsonParts = window.location.pathname.replace(/\.html$/, '.json').split('/');
@@ -227,24 +214,6 @@ window.addEventListener('settingsReady', function(event) { //after domcontentloa
 	liveSetting.checked = liveEnabled;
 	liveSetting.addEventListener('change', toggleLive, false);
 
-	const notificationSetting = document.getElementById('notification-setting');
-	const toggleNotifications = async () => {
-		notificationsEnabled = !notificationsEnabled;
-		if (notificationsEnabled) {
-			const result = await Notification.requestPermission()
-			if (result != 'granted') {
-				//user denied permission popup
-				notificationsEnabled = false;
-				notificationSetting.checked = false;
-				return;
-			}
-		}
-		console.log('toggling notifications', notificationsEnabled);
-		setLocalStorage('notifications', notificationsEnabled);
-	}
-	notificationSetting.checked = notificationsEnabled;
-	notificationSetting.addEventListener('change', toggleNotifications, false);
-
 	const scrollSetting = document.getElementById('scroll-setting');
 	const toggleScroll = () => {
 		scrollEnabled = !scrollEnabled;

gulp/res/js/localstorage.js

@@ -12,12 +12,6 @@ function setLocalStorage(key, value) {
 	}
 }
 
-function appendLocalStorageArray(key, value) {
-	const storedArray = JSON.parse(localStorage.getItem(key));
-	storedArray.push(value);
-	setLocalStorage(key, JSON.stringify(storedArray));
-}
-
 function clearLocalStorageJunk() {
 	//clears hover cache when localstorage gets full
 	const hoverCaches = Object.keys(localStorage).filter(k => k.startsWith('hovercache'));

gulp/res/js/yous.js

@@ -1,7 +1,11 @@
+setDefaultLocalStorage('notifications', false);
+let notificationsEnabled = localStorage.getItem('notifications') == 'true';
+setDefaultLocalStorage('notification-yous-only', false);
+let notificationYousOnly = localStorage.getItem('notification-yous-only') == 'true';
 setDefaultLocalStorage('yous-setting', true);
 let yousEnabled = localStorage.getItem('yous-setting') == 'true';
 setDefaultLocalStorage('yous', '[]');
-let savedYous = JSON.parse(localStorage.getItem('yous'));
+let savedYous = new Set(JSON.parse(localStorage.getItem('yous')));
 
 const toggleAll = () => savedYous.forEach(y => toggleOne(y));
 
@@ -31,24 +35,43 @@ if (yousEnabled) {
 }
 
 window.addEventListener('addPost', (e) => {
-	savedYous = JSON.parse(localStorage.getItem('yous'));
 	const postYou = `${e.detail.json.board}-${e.detail.postId}`;
-	if (window.myPostId == e.detail.postId) {
-		savedYous.push(postYou);
-		setLocalStorage('yous', JSON.stringify(savedYous));
+	const isYou = window.myPostId == e.detail.postId
+	if (isYou) {
+		//save you
+		savedYous.add(postYou);
+		setLocalStorage('yous', JSON.stringify([...savedYous]));
 	}
-	if (savedYous.includes(postYou)) {
+	if (savedYous.has(postYou)) {
+		//toggle forn own post for name field
 		toggleOne(postYou);
 	}
+	const quotesYou = e.detail.json.quotes
+		.map(q => `${e.detail.json.board}-${q.postId}`)
+		.filter(y => savedYous.has(y))
+		.length > 0;
 	const youHoverQuotes = e.detail.json.quotes
 		.concat(e.detail.json.backlinks)
 		.map(q => `${e.detail.json.board}-${q.postId}`)
-		.filter(y => savedYous.includes(y))
+		.filter(y => savedYous.has(y))
 		.map(y => {
 			const [board, postId] = y.split('-');
 			return e.detail.post.querySelector(`.quote[href^="/${board}/"][href$="#${postId}"]`)
 		});
+	//toggle for any quotes in a new post that quote (you)
 	toggleQuotes(youHoverQuotes);
+	//if not a hover newpost, and enabled/for yous, send notification
+	if (!e.detail.hover && notificationsEnabled && !isYou) {
+		if (notificationYousOnly && !quotesYou) {
+			return; //only send notif for (you) if setting
+		}
+		try {
+			console.log('attempting to send notification', postYou);
+			new Notification(`${quotesYou ? 'New quote in: ' : ''}${document.title}`, {
+				body: postData.nomarkup ? postData.nomarkup.substring(0,100) : ''
+			});
+		} catch (e) { /* notification cant send for some reason -- user revoked perms in browser? */ }
+	}
 });
 
 window.addEventListener('settingsReady', () => {
@@ -63,4 +86,31 @@ window.addEventListener('settingsReady', () => {
     yousSetting.checked = yousEnabled;
     yousSetting.addEventListener('change', toggleYousSetting, false);
 
+    const notificationYousOnlySetting = document.getElementById('notification-yous-only');
+    const toggleNotificationYousOnlySetting = () => {
+        notificationYousOnly = !notificationYousOnly;
+        setLocalStorage('notification-yous-only', notificationYousOnly);
+        console.log('toggling notification only for yous', yousEnabled);
+    }
+    notificationYousOnlySetting.checked = notificationYousOnly;
+    notificationYousOnlySetting.addEventListener('change', toggleNotificationYousOnlySetting, false);
+
+	const notificationSetting = document.getElementById('notification-setting');
+	const toggleNotifications = async () => {
+		notificationsEnabled = !notificationsEnabled;
+		if (notificationsEnabled) {
+			const result = await Notification.requestPermission()
+			if (result != 'granted') {
+				//user denied permission popup
+				notificationsEnabled = false;
+				notificationSetting.checked = false;
+				return;
+			}
+		}
+		console.log('toggling notifications', notificationsEnabled);
+		setLocalStorage('notifications', notificationsEnabled);
+	}
+	notificationSetting.checked = notificationsEnabled;
+	notificationSetting.addEventListener('change', toggleNotifications, false);
+
 });

views/mixins/modal.pug

@@ -39,6 +39,10 @@ mixin modal(data)
 								label.postform-style.ph-5
 									input#notification-setting(type='checkbox')
 								.rlabel Notifications
+							.row
+								label.postform-style.ph-5
+									input#notification-yous-only(type='checkbox')
+								.rlabel Only notify (You)s
 							.row
 								label.postform-style.ph-5
 									input#scroll-setting(type='checkbox')
@@ -59,10 +63,6 @@ mixin modal(data)
 								label.postform-style.ph-5
 									input#noncolorids-setting(type='checkbox')
 								.rlabel Non-color IDs
-							.row
-								label.postform-style.ph-5
-									input#yous-setting(type='checkbox')
-								.rlabel Show (You)'s
 
 						.col
 
@@ -94,6 +94,10 @@ mixin modal(data)
 								label.postform-style.ph-5
 									input#alwaysshowspoilers-setting(type='checkbox')
 								.rlabel Always reveal spoilers
+							.row
+								label.postform-style.ph-5
+									input#yous-setting(type='checkbox')
+								.rlabel Show (You)s
 
 					.row
 						.label Video/Audio volume