From 77337a1fce693b574b660b0370e870866f664642 Mon Sep 17 00:00:00 2001
From: "Nguyen Anh Tuan, Tony" <tuanngda@gmail.com>
Date: Fri, 6 Feb 2015 23:50:50 +0800
Subject: [PATCH] Tony: Implements Owners, Vets, Pets for Dashboard

---
 .../webapp/components/dashboard/_owners.html  | 14 +++----
 .../webapp/components/dashboard/_pets.html    | 40 +++----------------
 .../webapp/components/dashboard/_vets.html    | 10 ++---
 3 files changed, 17 insertions(+), 47 deletions(-)

diff --git a/src/main/webapp/components/dashboard/_owners.html b/src/main/webapp/components/dashboard/_owners.html
index fc30e9a63..1cf81d769 100644
--- a/src/main/webapp/components/dashboard/_owners.html
+++ b/src/main/webapp/components/dashboard/_owners.html
@@ -1,19 +1,19 @@
-<section id="owners" class="sections sections-narrow">
+<section id="owners" class="sections sections-narrow" data-ng-controller="OwnerController">
   <div class="container">
     <h2 class="sub-header">Owners</h2>
     <div class="row thumbnail-wrapper">
-      <div class="col-md-3" ng-repeat="x in [1,2,3,4,5,6,7,8]">
+      <div class="col-md-3" ng-repeat="owner in owners | limitTo : 8">
         <div class="thumbnail">
-          <a href="#"><img src="images/owner-default.png" class="img-circle" alt="Generic placeholder image"></a>
+          <a href="#"><img data-ng-src="images/avatars/owner{{owner.id}}.jpg" class="img-circle" alt="Generic placeholder image"></a>
           <div class="caption">
-            <h3 class="caption-heading"><a href="#">Eduardo Rodriguez</a></h3>
-            <p class="caption-meta">2693 Commerce St., McFarland</p>
-            <p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p>
+            <h3 class="caption-heading"><a href="#" data-ng-bind="owner.firstName + ' ' +owner.lastName"></a></h3>
+            <p class="caption-meta" data-ng-bind="owner.city"></p>
+            <p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> <span data-ng-bind="owner.telephone"></span></p>
           </div>
           <div class="action-bar">
             <ul>
               <li>
-                <a href="#"><img src="images/pet-small.png" class="img-circle img-circle-small" alt="Generic placeholder image" height="30" width="30"></a>
+                <a href="#"><img data-ng-src="images/pets/pet{{owner.id}}.jpg"  class="img-circle img-circle-small" alt="Generic placeholder image" height="30" width="30"></a>
               </li>
               <li>
                 <a href="#" class="btn-add-pet"><span class="glyphicon glyphicon-plus"></span></a>
diff --git a/src/main/webapp/components/dashboard/_pets.html b/src/main/webapp/components/dashboard/_pets.html
index cf1931913..d29621561 100644
--- a/src/main/webapp/components/dashboard/_pets.html
+++ b/src/main/webapp/components/dashboard/_pets.html
@@ -1,44 +1,14 @@
-<section id="pets" class="sections sections-narrow">
+<section id="pets" class="sections sections-narrow" data-ng-controller="PetController">
   <div class="container">
     <h2 class="sub-header">Pets</h2>
     <div class="row thumbnail-wrapper">
-      <div class="col-md-3">
+      <div class="col-md-3" ng-repeat="pet in pets | limitTo : 4">
         <div class="thumbnail">
-          <img src="images/pets/pet1.jpg" class="img-circle" alt="Generic placeholder image">
+          <img data-ng-src="images/pets/pet{{pet.id % 10 + 1}}.jpg" class="img-circle" alt="Generic placeholder image">
           <div class="caption">
-            <h3 class="caption-heading">Basil</h3>
+            <h3 class="caption-heading" data-ng-bind="pet.name"></h3>
             <p class="caption-meta">08 August 2012</p>
-            <p class="caption-meta"><span class="caption-label">Hamster</span></p>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-3">
-        <div class="thumbnail">
-          <img src="images/pets/pet2.jpg" class="img-circle" alt="Generic placeholder image">
-          <div class="caption">
-            <h3 class="caption-heading">Basil</h3>
-            <p class="caption-meta">08 August 2012</p>
-            <p class="caption-meta"><span class="caption-label">Hamster</span></p>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-3">
-        <div class="thumbnail">
-          <img src="images/pets/pet3.jpg" class="img-circle" alt="Generic placeholder image">
-          <div class="caption">
-            <h3 class="caption-heading">Basil</h3>
-            <p class="caption-meta">08 August 2012</p>
-            <p class="caption-meta"><span class="caption-label">Hamster</span></p>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-3">
-        <div class="thumbnail">
-          <img src="images/pets/pet4.jpg" class="img-circle" alt="Generic placeholder image">
-          <div class="caption">
-            <h3 class="caption-heading">Basil</h3>
-            <p class="caption-meta">08 August 2012</p>
-            <p class="caption-meta"><span class="caption-label">Hamster</span></p>
+            <p class="caption-meta"><span class="caption-label" data-ng-bind="pet.type.name"></span></p>
           </div>
         </div>
       </div>
diff --git a/src/main/webapp/components/dashboard/_vets.html b/src/main/webapp/components/dashboard/_vets.html
index 1cb54d2da..c875bfed3 100644
--- a/src/main/webapp/components/dashboard/_vets.html
+++ b/src/main/webapp/components/dashboard/_vets.html
@@ -1,14 +1,14 @@
-<section id="vets" class="sections sections-narrow">
+<section id="vets" class="sections sections-narrow" data-ng-controller="VeterinarianController">
   <div class="container">
     <h2 class="sub-header">Veterinarians</h2>
     <div class="row thumbnail-wrapper">
-      <div class="col-md-3" ng-repeat="x in [1,2,3,4,5,6,7,8]">
+      <div class="col-md-3" data-ng-repeat="vet in vets | limitTo : 8">
         <div class="thumbnail">
-          <img src="images/veterinarian-default.jpg" class="img-circle" alt="Generic placeholder image">
+          <img data-ng-src="images/avatars/vet{{vet.id%4 + 1}}.jpg" class="img-circle" alt="Generic placeholder image">
           <div class="caption">
-            <h3 class="caption-heading">Helen Leary</h3>
+            <h3 class="caption-heading" data-ng-bind="'Dr. ' + vet.firstName + ' ' + vet.lastName"></h3>
             <p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p>
-            <p class="caption-meta"><span class="caption-label">Surgery</span></p>
+            <p class="caption-meta"><span class="caption-label" data-ng-repeat="specialty in vet.specialties"><span data-ng-bind="specialty.name">Surgery</span></span></p>
           </div>
         </div>
       </div>