Highlight active pet

src/app/pets.coffee

@@ -28,6 +28,7 @@ module.exports.app = (appExports, model) ->
     petStr = "#{text}-#{modifier}"
     pet = _.findWhere pets, text: text
     pet.modifier = modifier
+    pet.str = petStr
     ownsThisPet = user.get('items.pets').indexOf petStr
     if ownsThisPet != -1
       user.set 'items.currentPet', pet

styles/app/avatar.styl

@@ -21,3 +21,7 @@
 
 .character-sprites span
     position: absolute
+
+#profileStable
+    .active
+        border 1px solid black

views/app/avatar.html

@@ -241,7 +241,7 @@
                 <p>You don't have any pets yet.</p>
             {/if}
             {#each _user.items.pets as :pet}
-                <div class="Pet-{removeWhitespace(:pet)}" data-pet="{:pet}" x-bind="click:choosePet">{:pet}</div>
+                <div class="Pet-{:pet} {#if equal(_user.items.currentPet.str, :pet)}active{/if}" data-pet="{:pet}" x-bind="click:choosePet">{:pet}</div>
             {/each}
         </div>
     </div>