Updated settings strings for the new artificial chat delay feature and made a couple tweaks to improve responsiveness.

src/ember/chatview.js

@@ -7,24 +7,33 @@ var FFZ = window.FrankerFaceZ,
 // Settings
 // --------------------
 
-FFZ.basic_settings.cure_cancer = {
+FFZ.basic_settings.delayed_chat = {
-	type: "boolean",
+	type: "select",
+	options: {
+		0: "No Delay",
+		300: "Minor (Bot Moderation; 0.3s)",
+		1200: "Normal (Human Moderation; 1.2s)",
+		5000: "Large (Spoiler Removal / Really Slow Mods; 5s)"
+	},
 
 	category: "Chat",
 
-	name: "Cure Cancer",
+	name: "Delayed Chat",
-	help: "Destroys all cancerous chat messages before they can even be seen.",
+	help: "Delay the appearance of chat messages to allow time for moderation and completely hide removed messages.",
 
 	get: function() {
-		return this.settings.remove_deleted &&
+		if ( ! this.settings.remove_deleted || ! this.settings.remove_bot_ban_notices )
-			this.settings.remove_bot_ban_notices &&
+			return 0;
-			+this.settings.chat_delay;
+
+		return this.settings.chat_delay;
 	},
 
 	set: function(val) {
-		this.settings.set('remove_deleted', val);
+		val = +val;
-		this.settings.set('remove_bot_ban_notices', val);
+
-		this.settings.set('chat_delay', val ? ''+(+this.settings.chat_delay || 300) : '0');
+		this.settings.set('remove_deleted', val !== 0);
+		this.settings.set('remove_bot_ban_notices', val !== 0);
+		this.settings.set('chat_delay', val);
 	}
 };
 
@@ -73,20 +82,25 @@ FFZ.settings_info.chat_delay = {
 	type: "select",
 	options: {
 		0: "No Delay",
-		300: "Wait for bot auto-bans (300ms)",
+		300: "Minor (Bot Moderation; 0.3s)",
-		1200: "Wait for human mods (1200ms)",
+		1200: "Normal (Human Moderation; 1.2s)",
-		5000: "ＥＳＰＯＲＴＳ (5000ms)"
+		5000: "Large (Spoiler Removal / Really Slow Mods; 5s)"
 	},
 	value: 0,
 
 	category: "Chat Appearance",
 	name: "Artificial Chat Delay",
-	help: "Delay messages allowing moderators to ban them before you see them.",
+	help: "Delay the appearance of chat messages to allow for moderation before you see them.",
+
+	process_value: function(val) {
+		if ( typeof val === "string" )
+			return parseInt(val || "0");
+		return val;
+	},
 
 	on_update: function (val) {
-		var delay_badge = document.querySelector('#ffz-stat-delay');
+		if ( this._roomv )
-		delay_badge.title = utils.number_commas(+val||300) + "ms of artifical chat delay added.";
+			this._roomv.ffzUpdateStatus();
-		delay_badge.classList.toggle('hidden', !+val);
 	}
 };
 

src/ember/room.js

@@ -250,18 +250,20 @@ FFZ.prototype._modify_rview = function(view) {
 				delay_badge.className = 'ffz room-state stat float-right';
 				delay_badge.id = 'ffz-stat-delay';
 				delay_badge.innerHTML = 'DELAY';
-				delay_badge.title = "300ms of artifical chat delay added.";
+				delay_badge.title = "You have enabled artificial chat delay. Messages are displayed after 0.3 seconds.";
 				cont.appendChild(delay_badge);
 				jQuery(delay_badge).tipsy({gravity:"s", offset:15});
 			}
 
 			r9k_badge.classList.toggle('hidden', !(room && room.get('r9k')));
 			sub_badge.classList.toggle('hidden', !(room && room.get('subsOnly')));
+			banned_badge.classList.toggle('hidden', !(room && room.get('ffz_banned')));
+
 			slow_badge.classList.toggle('hidden', !(room && room.get('slowMode')));
 			slow_badge.title = "This room is in slow mode. You may send messages every " + utils.number_commas(room && room.get('slow')||120) + " seconds.";
-			banned_badge.classList.toggle('hidden', !(room && room.get('ffz_banned')));
+
-			delay_badge.title = utils.number_commas(+f.settings.chat_delay||300) + "ms of artifical chat delay added.";
+			delay_badge.title = "You have enabled artificial chat delay. Messages are displayed after " + (f.settings.chat_delay/1000) + " seconds.";
-			delay_badge.classList.toggle('hidden', !+f.settings.chat_delay);
+			delay_badge.classList.toggle('hidden', f.settings.chat_delay === 0);
 
 			if ( btn ) {
 				btn.classList.toggle('ffz-waiting', (room && room.get('slowWait') || 0));
@@ -1014,16 +1016,15 @@ FFZ.prototype._modify_room = function(room) {
 
 		// Artificial chat delay
 		pushMessage: function(msg) {
-			if (+f.settings.chat_delay) {
+			if ( f.settings.chat_delay !== 0 ) {
-				if (!this.ffzPending)
+				if ( ! this.ffzPending )
 					this.ffzPending = [];
 
-				// uses black magic to ensure messages get flushed, but without a setInterval
+				var now = Date.now();
-				if (!this.ffzPending.length)
+				msg.time = now;
-					setTimeout(this.ffzPendingFlush.bind(this), 100);
-
-				msg.time = Date.now();
 				this.ffzPending.push(msg);
+				this.ffzSchedulePendingFlush(now);
+
 			} else {
 				this.ffzActualPushMessage(msg);
 			}
@@ -1038,19 +1039,36 @@ FFZ.prototype._modify_room = function(room) {
 			}
 		},
 
+		ffzSchedulePendingFlush: function(now) {
+			// Instead of just blindly looping every x seconds, we want to calculate the time until
+			// the next message should be displayed, and then set the timeout for that. We'll
+			// end up looping a bit more frequently, but it'll make chat feel more responsive.
+			if ( this._ffz_pending_flush )
+				clearTimeout(this._ffz_pending_flush);
+
+			if ( this.ffzPending && this.ffzPending.length ) {
+				var delay = 50 + Math.max(0, (f.settings.chat_delay + (this.ffzPending[0].time||0)) - (now || Date.now()));
+				this._ffz_pending_flush = setTimeout(this.ffzPendingFlush.bind(this), delay);
+			}
+		},
+
 		ffzPendingFlush: function() {
+			this._ffz_pending_flush = null;
+
 			var now = Date.now();
 			for (var i = 0, l = this.ffzPending.length; i < l; i++) {
 				var msg = this.ffzPending[i];
-				if (msg.removed) continue;
+				if ( msg.removed )
-				if (+f.settings.chat_delay + msg.time > now) break;
+					continue;
+
+				if ( f.settings.chat_delay + msg.time > now )
+					break;
+
 				this.ffzActualPushMessage(msg);
 			}
-			this.ffzPending = this.ffzPending.slice(i);
 
-			// uses black magic to ensure messages get flushed, but without a setInterval
+			this.ffzPending = this.ffzPending.slice(i);
-			if (this.ffzPending.length)
+			this.ffzSchedulePendingFlush(now);
-				setTimeout(this.ffzPendingFlush.bind(this), 100);
 		},
 
 		ffzShouldShowMessage: function (msg) {

src/settings.js

@@ -463,7 +463,7 @@ FFZ.menu_pages.settings = {
 						for(var ok in info.options) {
 							var op = document.createElement('option');
 							op.value = JSON.stringify(ok);
-							if ( val === ok )
+							if ( val == ok )
 								op.setAttribute('selected', true);
 							op.innerHTML = info.options[ok];
 							select.appendChild(op);
@@ -648,7 +648,7 @@ FFZ.menu_pages.settings = {
 						for(var ok in info.options) {
 							var op = document.createElement('option');
 							op.value = JSON.stringify(ok);
-							if ( val === ok )
+							if ( val == ok )
 								op.setAttribute('selected', true);
 							op.innerHTML = info.options[ok];
 							select.appendChild(op);
@@ -733,6 +733,14 @@ FFZ.prototype._setting_update = function(e) {
 		val = info.value || undefined;
 	}
 
+	if ( info.process_value )
+		try {
+			val = info.process_value.bind(this)(val);
+		} catch(err) {
+			this.log('Error processing value for setting "' + key + '": ' + err);
+			return;
+		}
+
 	this.settings[key] = val;
 	if ( info.on_update )
 		try {
@@ -755,10 +763,19 @@ FFZ.prototype._setting_get = function(key) {
 
 FFZ.prototype._setting_set = function(key, val) {
 	var info = FFZ.settings_info[key],
-		ls_key = info.storage_key || make_ls(key),
+		ls_key = info.storage_key || make_ls(key);
-		jval = JSON.stringify(val);
+
+	if ( info.process_value )
+		try {
+			val = info.process_value.bind(this)(val)
+		} catch(err) {
+			this.log('Error processing value for setting "' + key + '": ' + err);
+			return false;
+		}
 
 	this.settings[key] = val;
+
+	var jval = JSON.stringify(val);
 	localStorage.setItem(ls_key, jval);
 
 	this.log('Changed Setting "' + key + '" to: ' + jval);