From d0c911bd41333056fdc1f183f26bd584daa9d100 Mon Sep 17 00:00:00 2001
From: steveseguin <punkrawker@gmail.com>
Date: Tue, 26 Dec 2023 18:04:29 -0500
Subject: [PATCH] teams ; resize if large image

---
 emotes.html   |  2 +-
 manifest.json |  2 +-
 teams.js      | 41 +++++++++++++++++++++++++++++++++--------
 waitlist.html | 25 +++++++++++++------------
 4 files changed, 48 insertions(+), 22 deletions(-)

diff --git a/emotes.html b/emotes.html
index 8d04a2d2..cf4e152a 100644
--- a/emotes.html
+++ b/emotes.html
@@ -634,7 +634,7 @@
 							this.src = this.srcBackup;
 							this.srcBackup = null;
 							delete this.srcBackup;
-						} else if (this.alt.length!==2){
+						} else if (!this.alt || (this.alt.length!==2)){
 							this.style.display='none';
 							this.remove();
 						} else {
diff --git a/manifest.json b/manifest.json
index 36831c44..8ef170b7 100644
--- a/manifest.json
+++ b/manifest.json
@@ -2,7 +2,7 @@
   "name": "Social Stream Ninja",
   "description": "Powerful tooling to engage live chat on Youtube, Twitch, Zoom, and more",
   "manifest_version": 2,
-  "version": "1.67.9",
+  "version": "1.67.10",
   "homepage_url": "http://socialstream.ninja/",
   "icons": {
     "128": "icons/icon-128.png"
diff --git a/teams.js b/teams.js
index 289c5269..b3d263c4 100644
--- a/teams.js
+++ b/teams.js
@@ -1,23 +1,48 @@
 (function () {
-	function toDataURL(blobUrl, callback) {
+	function toDataURL(blobUrl, callback, maxSizeKB = 10) {
 		var xhr = new XMLHttpRequest;
 		xhr.responseType = 'blob';
 
 		xhr.onload = function() {
-		   var recoveredBlob = xhr.response;
+			var recoveredBlob = xhr.response;
 
-		   var reader = new FileReader;
+			if (recoveredBlob.size / 1024 > maxSizeKB) { // Check if image size is greater than maxSizeKB
+				var img = new Image();
 
-		   reader.onload = function() {
-			 callback(reader.result);
-		   };
+				img.onload = function() {
+					var canvas = document.createElement('canvas');
+					var ctx = canvas.getContext('2d');
+					
+					// Resize logic (example: 250x250)
+					var maxSideSize = 250;
+					var ratio = Math.min(maxSideSize / img.width, maxSideSize / img.height);
+					canvas.width = img.width * ratio;
+					canvas.height = img.height * ratio;
+
+					ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
+
+					// Convert to base64, can choose format and quality
+					var newDataUrl = canvas.toDataURL('image/jpeg', 0.7);
+					callback(newDataUrl);
+				};
+
+				var urlCreator = window.URL || window.webkitURL;
+				img.src = urlCreator.createObjectURL(recoveredBlob);
+			} else {
+				// If image is not too large, use original
+				var reader = new FileReader();
+
+				reader.onload = function() {
+					callback(reader.result);
+				};
 
-		   reader.readAsDataURL(recoveredBlob);
+				reader.readAsDataURL(recoveredBlob);
+			}
 		};
 
 		xhr.open('GET', blobUrl);
 		xhr.send();
-	};
+	}
 
 	var lastMessage = {};
 	var lastName = "";
diff --git a/waitlist.html b/waitlist.html
index 58f43e37..5f9511c4 100644
--- a/waitlist.html
+++ b/waitlist.html
@@ -571,15 +571,16 @@
 		document.documentElement.style.setProperty("--outline", "0px");
 	}
 	
-	function hideImage(e){
-		if (this.srcBackup){
-			this.src = this.srcBackup;
-			this.srcBackup = null;
-			delete this.srcBackup;
-		} else if (this.alt.length!==2){
-			this.classList.add("spacer");
+	function hideImage(ele){
+		if (ele.srcBackup){
+			ele.src = ele.srcBackup;
+			ele.srcBackup = null;
+			delete ele.srcBackup;
+		} else if (!ele.alt || (ele.alt.length!==2)){
+			ele.style.display='none';
+			ele.remove();
 		} else {
-			this.outerHTML = this.alt;
+			ele.outerHTML = ele.alt;
 		}
 	}
 	
@@ -634,19 +635,19 @@
 						}
 						let extraData = "";
 						if (showsource){
-							extraData = "<img onerror='hideImage' src='"+data.waitlist[i].type+".png'>";
+							extraData = "<img onerror='hideImage(this)' src='"+data.waitlist[i].type+".png'>";
 						}
 						if (randomize){
 							var nodes = document.getElementById("waitlist").childNodes;
 							var choice = randomNumber(0,nodes.length+1);
 							if (choice == 0){
-								document.getElementById("waitlist").innerHTML = "<div class='guestListHolder "+classAdd+"'>"+extraData+"<img onerror='hideImage' src='"+data.waitlist[i].chatimg+"'>"+data.waitlist[i].chatname+"</div>" + document.getElementById("waitlist").innerHTML;
+								document.getElementById("waitlist").innerHTML = "<div class='guestListHolder "+classAdd+"'>"+extraData+"<img onerror='hideImage(this)' src='"+data.waitlist[i].chatimg+"'>"+data.waitlist[i].chatname+"</div>" + document.getElementById("waitlist").innerHTML;
 							} else {
-								nodes[choice-1].outerHTML = nodes[choice-1].outerHTML+"<div class='guestListHolder "+classAdd+"'>"+extraData+"<img onerror='hideImage' src='"+data.waitlist[i].chatimg+"'>"+data.waitlist[i].chatname+"</div>";
+								nodes[choice-1].outerHTML = nodes[choice-1].outerHTML+"<div class='guestListHolder "+classAdd+"'>"+extraData+"<img onerror='hideImage(this)' src='"+data.waitlist[i].chatimg+"'>"+data.waitlist[i].chatname+"</div>";
 							}
 						} else {
 							if (data.waitlist[i].chatimg){
-								document.getElementById("waitlist").innerHTML += "<div class='guestListHolder "+classAdd+"'>"+extraData+"<img onerror='hideImage' src='"+data.waitlist[i].chatimg+"'>"+data.waitlist[i].chatname+"</div>";
+								document.getElementById("waitlist").innerHTML += "<div class='guestListHolder "+classAdd+"'>"+extraData+"<img onerror='hideImage(this)' src='"+data.waitlist[i].chatimg+"'>"+data.waitlist[i].chatname+"</div>";
 							} else {
 								document.getElementById("waitlist").innerHTML += "<div class='guestListHolder "+classAdd+"'>"+extraData+"<div class='spacer'></div>"+data.waitlist[i].chatname+"</div>";
 							}