From af8dd428308dadbfff759a42f2468bbc264d492a Mon Sep 17 00:00:00 2001
From: Emi Matchu <emi@matchu.dev>
Date: Sat, 31 Aug 2024 12:07:52 -0700
Subject: [PATCH] Add better support for hashed pet names
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Closes #2, after making some tweaks to the PR to fit how JS templating
works here. Thanks @dice!!

I had to move `petThumbnailUrl` out of the closure, because this script
does a cute thing of having separate variable scopes for the separate
areas of the page—but this is used by two of them. Arguably it could
make sense to like, put this all in one larger shared IIFE closure that
wraps both of them, to preserve some of this code's intention of
avoiding adding to the global namespace on this page, but like.
*It's fine.*

Co-Authored-By: Steve C <diceroll123@gmail.com>
---
 app/assets/javascripts/pets/bulk.js | 15 ++++++++++-----
 app/views/pets/bulk.html.haml       |  2 +-
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/pets/bulk.js b/app/assets/javascripts/pets/bulk.js
index 44f69c97..265ab232 100644
--- a/app/assets/javascripts/pets/bulk.js
+++ b/app/assets/javascripts/pets/bulk.js
@@ -1,5 +1,14 @@
 var DEBUG = document.location.search.substr(0, 6) == "?debug";
 
+function petThumbnailUrl(pet_name) {
+  // if first character is "@", use the hash url
+  if (pet_name[0] == "@") {
+    return "https://pets.neopets.com/cp/" + pet_name.substr(1) + "/1/1.png";
+  }
+
+  return "https://pets.neopets.com/cpn/" + pet_name + "/1/1.png";
+}
+
 /* Needed items form */
 (function () {
   var UI = {};
@@ -65,10 +74,6 @@ var DEBUG = document.location.search.substr(0, 6) == "?debug";
     loadItems(data.query);
   }
 
-  function petThumbnailUrl(pet_name) {
-    return "https://pets.neopets.com/cpn/" + pet_name + "/1/1.png";
-  }
-
   /* Items */
 
   function loadItems(query) {
@@ -127,7 +132,7 @@ var DEBUG = document.location.search.substr(0, 6) == "?debug";
 
     function Pet(name) {
       var el = $("#bulk-pets-submission-template")
-        .tmpl({ pet_name: name })
+        .tmpl({ pet_name: name, pet_thumbnail: petThumbnailUrl(name) })
         .appendTo(queue_el);
 
       this.load = function () {
diff --git a/app/views/pets/bulk.html.haml b/app/views/pets/bulk.html.haml
index 44d7a0aa..a2d0e5fa 100644
--- a/app/views/pets/bulk.html.haml
+++ b/app/views/pets/bulk.html.haml
@@ -68,7 +68,7 @@
   
   %script#bulk-pets-submission-template{:type => 'text/x-jquery/tmpl'}
     %li.waiting
-      %img{:src => 'https://pets.neopets.com/cpn/${pet_name}/1/1.png'}
+      %img{:src => '${pet_thumbnail}'}
       %span.name ${pet_name}
       %span.waiting-message= t '.bulk_pets.waiting'
       %span.loading-message= t '.bulk_pets.loading'