diff --git a/assets/js/controllers/inventoryCtrl.js b/assets/js/controllers/inventoryCtrl.js
index 0cb028ff64..7e8db4340c 100644
--- a/assets/js/controllers/inventoryCtrl.js
+++ b/assets/js/controllers/inventoryCtrl.js
@@ -5,4 +5,42 @@ habitrpg.controller("InventoryCtrl", ['$scope', 'User',
     $scope.userEggs = User.user.items.eggs;
     $scope.userHatchingPotions = User.user.items.hatchingPotions;
 
+    $scope.chooseEgg = function(egg){
+      if($scope.userHatchingPotions && $scope.userHatchingPotions.length < 1) {
+        return alert("You have no hatching potion!");
+      }
+
+      $scope.selectedEgg = egg;
+      $scope.selectedPotion = $scope.userHatchingPotions[0];
+      $scope.hatching = true;
+    }
+
+    $scope.pour = function(){
+      var i = _.indexOf($scope.userEggs, $scope.selectedEgg);
+      $scope.userEggs.splice(i, 1);
+
+      i = _.indexOf($scope.userHatchingPotions, $scope.selectedPotion);
+      $scope.userHatchingPotions.splice(i, 1);
+
+      var pet = $scope.selectedEgg.name + '-' + $scope.selectedPotion;
+
+      if(User.user.items.pets && User.user.items.pets.indexOf(pet) != -1) {
+        return alert("You already have that pet, hatch a different combo.")
+      }
+
+      if(!User.user.items.pets) User.user.items.pets = [];
+      User.user.items.pets.push(pet);
+
+      User.log([
+        { op: 'set', data: {'items.pets': User.user.items.pets} },
+        { op: 'set', data: {'items.eggs': $scope.userEggs} },
+        { op: 'set', data: {'items.hatchingPotions': $scope.userHatchingPotions} }
+      ]);
+
+      alert("Your egg hatched! Visit your stable to equip your pet.");
+
+      $scope.selectedEgg = null;
+      $scope.hatching = false;
+    }
+
   }]);
\ No newline at end of file
diff --git a/views/options/inventory.jade b/views/options/inventory.jade
index 3f0c64e8a3..29eff8dc6d 100644
--- a/views/options/inventory.jade
+++ b/views/options/inventory.jade
@@ -11,14 +11,13 @@
         menu.hatchingPotion-menu(label='Hatching Potions')
           p(ng-show='userHatchingPotions.length < 1') You don't have any hatching potions yet.
           div(ng-repeat='hatchingPotion in userHatchingPotions track by $index')
-            button.customize-option(tooltip='{{hatchingPotion}}', ng-click='chooseHatching(hatchingPotion)', class='Pet_HatchingPotion_{{hatchingPotion}}')
+            button.customize-option(tooltip='{{hatchingPotion}}', class='Pet_HatchingPotion_{{hatchingPotion}}')
             p {{hatchingPotion}}
   .span6(ng-show='hatching')
     h3 Hatch Your Egg
     p(ng-show='userHatchingPotions.length < 1') You don't have any hatching potions yet.
     div(ng-show='userHatchingPotions')
       p Which hatching potion will you pour on your {{_hatchEgg.text}} egg?
-      form(x-bind='submit:hatchEgg')
-        select
-          option(ng-repeat='hatchingPotion in user.items.hatchingPotions track by $index') {{hatchingPotion}}
-        button(type='submit') Pour
+      form
+        select(ng-options='hatchingPotion for hatchingPotion in userHatchingPotions', ng-model="selectedPotion")
+        button(ng-click="pour()") Pour