Upcoming Service Reminders

Web/Content/Site.css

@@ -97,6 +97,11 @@ footer {
     margin-left: 120px;
 }
 
+.qtip-override {
+	max-width: 500px;
+	font-size: 13px;
+}
+
 fieldset legend {
     margin: 0;
     border: 0;

Web/Scripts/Shared/Site.js

@@ -32,7 +32,7 @@ $(function () {
     
     $("input#ModelYear,input#Price,input#VehicleId,input#EndOdometer,input#GasPurchased").numeric();
     
-    $(".report-miles").append('&nbsp;<span class="muted">&#9652;</span>').each(function () {
+    $(".report-miles").append('&nbsp;<span class="muted"><i class="fa fa-caret-down"></i></span>').each(function () {
         var content = $(this).next('.report-calculation');
         $(this).qtip({
             content: content,
@@ -52,14 +52,14 @@ $(function () {
     });
 
     // add popup for span titles
-    $('span[title]').append('&nbsp;<span class="muted">&#9652;</span>').qtip({
+    $('span[title]').append('&nbsp;<span class="muted"><i class="fa fa-caret-down"></i></span>').qtip({
         content: {
             text: false // Use each elements title attribute
         },
         style: { classes: "qtip-light" } // Give it some style
     });
 
-    $(".miles-unknown").addClass('label label-warning').append('&nbsp;<span class="muted">&#9652;</span>')
+	$(".miles-unknown").addClass('label label-warning').append('&nbsp;<span class="muted"><i class="fa fa-caret-down"></i></span>')
         .each(function () {
             $(this).qtip({
                 content: "No previous log for this vehicle",
@@ -179,11 +179,11 @@ $(function() {
 // Add active class to nav
 $(function() {
 	var idNavActiveRegex = {
-		'fuellog-nav': /\/fuellog/i,
         'log-nav': /\/log/i,
-        'vehicle-nav': /\/vehicle|\/servicereminder/i,
+        'vehicle-nav': /\/vehicle|\/servicereminder|\/fuellog/i,
         'user-nav': /\/user/i,
-		'config-nav': /\/City|\/Purpose/i
+		'config-nav': /\/City|\/Purpose/i,
+		'account-nav': /\/Account/i
     };
 	var set = false;
     $.each(idNavActiveRegex, function (id, regex) {
@@ -220,11 +220,11 @@ function addButtonIcons () {
 		'Vehicle': 'car',
 		'Reminder': 'clock-o',
 		'Fuel Logs': 'tachometer',
-		'Users': 'user',
+		'Users': 'users',
 		'Logs': 'road'
 	};
 	$.each(textToIcon, function(text, icon) {
-		$("a:contains('" + text + "'):not(:has(i))")
+		$("a:contains('" + text + "'):not(:has(i:first-child))")
             .prepend('<i class="fa fa-'+ icon +'"></i> ');
 	});
 
@@ -278,7 +278,7 @@ $(function() {
 
         element.click(function() { return false; });
 
-        element.append('&nbsp;<span class="muted">&#9652;</span>');
+        element.append('&nbsp;<span class="muted"><i class="fa fa-caret-down"></i></span>');
 
         element.qtip({
             content: {
@@ -300,6 +300,26 @@ $(function() {
             }
         });
     }
+	
+    $('.qtip-show-next-div').each(function () {
+    	$(this).qtip({
+    		content: {
+    			text: $(this).next('div')
+    		},
+    		hide: {
+    			fixed: true,
+    			delay: 500
+    		},
+    		style: {
+    			classes: 'qtip-light qtip-shadow qtip-override',
+    			width: false
+    		},
+    		position: {
+    			my: 'top left',  // Position my top left...
+    			at: 'bottom left', // at the bottom right of...
+    		}
+    	});
+    });
 });
 
 /*

Web/ViewModels/ServiceReminder/ServiceReminderViewModel.cs

@@ -22,6 +22,10 @@ namespace MileageTraker.Web.ViewModels.ServiceReminder
 		[InputSize("mini")]
 		public string VehicleId { get; set; }
 
+		[HiddenInput(DisplayValue = false)]
+		[DisplayFormat(NullDisplayText = "Unassigned")]
+		public string AssignedDriver { get; set; }
+
 		[HiddenInput(DisplayValue = false)]
 		public int? CurrentOdometer { get; set; }
 
@@ -43,7 +47,8 @@ namespace MileageTraker.Web.ViewModels.ServiceReminder
 			Mapper.CreateMap<ServiceReminderViewModel, Models.ServiceReminder>();
 			Mapper.CreateMap<Models.ServiceReminder, ServiceReminderViewModel>()
 			      .ForMember(dest => dest.VehicleId, opt => opt.MapFrom(src => src.Vehicle.VehicleId))
-			      .ForMember(dest => dest.CurrentOdometer, opt => opt.MapFrom(src => src.Vehicle.CurrentOdometer));
+			      .ForMember(dest => dest.CurrentOdometer, opt => opt.MapFrom(src => src.Vehicle.CurrentOdometer))
+			      .ForMember(dest => dest.AssignedDriver, opt => opt.MapFrom(src => src.Vehicle.Assigned));
 		}
 
 		public ServiceReminderViewModel(Models.ServiceReminder serviceReminder)

Web/Views/Account/Manage.cshtml

@@ -3,15 +3,15 @@
     ViewBag.Title = "Manage Account";
 }
 
-<h2 class="center-content">@ViewBag.Title</h2>
+<h2 class="center-content"><i class="fa fa-user"></i> @ViewBag.Title</h2>
 
 @Html.Partial("_StatusMessage")
 
 <div class="center-content well">
 
-    <p>You're logged in as <strong>@User.Identity.Name</strong>.
+    <p>You're logged in as <strong>@User.Identity.Name</strong>.<br/>
-        Your name is <strong>@Model.FullName</strong> and
+        Your name is <strong>@Model.FullName</strong>.<br/>
-        email is <strong>@Model.Email</strong>.
+        Your email is <strong>@Model.Email</strong>.
     </p>
 
     @Html.Partial("_ChangePasswordPartial")

Web/Views/Log/Index.cshtml

@@ -39,7 +39,7 @@
     @Html.ActionLink("Export", "Export", queryParams, new { @class = "btn" })
     
     <div class="btn-group">
-        <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">Report <span class="caret"></span></a>
+        <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">Report <i class="fa fa-caret-down"></i></a>
         <ul class="dropdown-menu">
             <li>
                 @Html.ActionLink("Vehicle Mileage", "MonthlyVehicleMileage", queryParams)

Web/Views/Shared/_Layout.cshtml

@@ -37,16 +37,16 @@
                             {
                                 <li id="log-nav">@Html.ActionLink("Logs", "Index", "Log")</li>
 								<li id="vehicle-nav" class="dropdown">
-		                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Vehicles <span class="caret"></span></a>
+									<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span>Vehicles</span> <i class="fa fa-caret-down"></i></a>
 		                            <ul class="dropdown-menu">
 			                            <li>@Html.ActionLink("Vehicles", "Index", "Vehicle")</li>
-										<li>@Html.ActionLink("Vehicle Service", "Index", "VehicleService")</li>
+			                            <li>@Html.ActionLink("Vehicle Service", "Index", "VehicleService")</li>
+										<li>@Html.ActionLink("Fuel Logs", "Index", "FuelLog")</li>
 		                            </ul>
 	                            </li>
-								<li id="fuellog-nav">@Html.ActionLink("Fuel Logs", "Index", "FuelLog")</li>
 	                            <li id="user-nav">@Html.ActionLink("Users", "Index", "User")</li>
 	                            <li id="config-nav" class="dropdown">
-		                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Config <span class="caret"></span></a>
+		                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span>Config</span> <i class="fa fa-caret-down"></i></a>
 		                            <ul class="dropdown-menu">
 			                            <li>@Html.ActionLink("Cities", "Index", "City")</li>
 										<li>@Html.ActionLink("Purposes", "Index", "Purpose")</li>

Web/Views/Shared/_NavAccountInfo.cshtml

@@ -1,7 +1,7 @@
 <ul class="nav pull-right">
 @if (Request.IsAuthenticated)
 {
-    <li>
+    <li id="account-nav">
         @Html.ActionLink(User.Identity.Name, "Manage", "Account", null, new {@class = "username", title = "Manage"})
     </li>
     <li>

Web/Views/User/Details.cshtml

@@ -90,7 +90,7 @@
 	@Html.ActionLink("Edit", "Edit", new { id = Model.UserId }, new { @class = "btn" })
 	<div class="btn-group">
 		<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
-			Password <span class="caret"></span>
+			Password <i class="fa fa-caret-down"></i>
 		</a>
 		<ul class="dropdown-menu">
 			<li>

Web/Views/User/Index.cshtml

@@ -8,7 +8,7 @@
     
 @Html.Partial("_StatusMessage")
 
-<h2 id="user-title"><i class="fa fa-user"></i> @ViewBag.Title</h2>
+<h2 id="user-title"><i class="fa fa-users"></i> @ViewBag.Title</h2>
 
 <div class="btn-toolbar pull-right">
     @using (Html.BeginForm("DetailsFullName", "User", FormMethod.Get, new {@class = "navbar-search form-inline" }))

Web/Views/Vehicle/Details.cshtml

@@ -30,7 +30,7 @@
 	}
 	<div class="btn-group">
 		<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
-			Services <span class="caret"></span>
+			Services <i class="fa fa-caret-down"></i>
 		</a>
 		<ul class="dropdown-menu">
 			<li>

Web/Views/VehicleService/Index.cshtml

@@ -26,45 +26,21 @@
 	}
 </div>
 
-<div class="pull-right" style="width:400px">
-	<h4>Upcoming Services</h4>
-	<table class="table table-striped table-bordered table-hover table-condensed">
-		<tr>
-			<th>Vehicle ID</th>
-			<th>ODO</th>
-			<th>Next Service</th>
-			<th>Description</th>
-			<th></th>
-		</tr>
-@foreach (var sr in Model.UpcomingServiceReminders)
-{
-	<tr>
-		<td>@Html.DisplayTextFor(m => sr.VehicleId)</td>
-		<td>@Html.DisplayTextFor(m => sr.CurrentOdometer)</td>
-		<td>@Html.DisplayTextFor(m => sr.TargetOdometer)
-			@if (sr.IsServiceOverdue)
-		    {
-			    <span class="badge badge-warning" title="overdue @(-sr.ServiceDueInMiles) miles">!</span>
-		    }
-		</td>
-		<td>@Html.DisplayTextFor(m => sr.Description)</td>
-		<td>@Html.ActionLink("Add Service", "Create", "VehicleService", new { vehicleId = sr.VehicleId }, new { @class = "btn btn-mini" })</td>
-	</tr>
-}
-	</table>
-</div>
-
 <h2 id="vehicle-title"><i class="fa fa-wrench"></i> @ViewBag.Title</h2>
 
 <div class="btn-toolbar pull-left">
     @Html.ActionLink("Add Service", "Create", null, new { @class = "btn" })
     @Html.ActionLink("Export", "Export", queryParams, new { @class = "btn" })
+	<a class="qtip-show-next-div btn">Upcoming Services <span class="badge">@Model.UpcomingServiceReminders.Count</span></a>
+	<div class="hidden">
+		@Html.Partial("UpcomingServiceReminders", Model.UpcomingServiceReminders)
+	</div>
 </div>
 
 @grid.GetHtml(columns:
 		grid.Columns(
 				grid.Column("InvoiceDate", "Invoice Date", item => item.InvoiceDate.ToString("d")),
-				grid.Column("VehicleID", "Vehicle Id"),
+                grid.Column("VehicleId", "Vehicle ID", item => Html.ActionLink((string)item.VehicleId, "DetailsPartial", "Vehicle", new { id = item.VehicleId }, new { @class = "qtip-modal" })),
 				grid.Column("ServiceCenterName", "Service Center Name"),
 				grid.Column("Price", "Price"),
 				grid.Column("Description", "Description"),

Web/Views/VehicleService/UpcomingServiceReminders.cshtml

@@ -0,0 +1,28 @@
+@model IList<MileageTraker.Web.ViewModels.ServiceReminder.ServiceReminderViewModel>
+
+<table class="table table-striped table-bordered table-hover table-condensed">
+	<tr>
+		<th>Vehicle ID</th>
+		<th>Driver</th>
+		<th>ODO</th>
+		<th>Next Service</th>
+		<th>Description</th>
+		<th></th>
+	</tr>
+@foreach (var sr in Model)
+{
+<tr>
+	<td>@Html.ActionLink(sr.VehicleId, "DetailsPartial", "Vehicle", new { id = sr.VehicleId }, new { @class = "qtip-modal" })</td>
+	<td>@Html.DisplayTextFor(m => sr.AssignedDriver)</td>
+	<td>@Html.DisplayTextFor(m => sr.CurrentOdometer)</td>
+	<td>@Html.DisplayTextFor(m => sr.TargetOdometer)
+		@if (sr.IsServiceOverdue)
+		{
+			<span class="badge badge-warning" title="overdue @(-sr.ServiceDueInMiles) miles">!</span>
+		}
+	</td>
+	<td>@Html.DisplayTextFor(m => sr.Description)</td>
+	<td>@Html.ActionLink("Add Service", "Create", "VehicleService", new { vehicleId = sr.VehicleId }, new { @class = "btn btn-mini" })</td>
+</tr>
+}
+</table>

Web/Views/VehicleService/UpdateServiceReminders.cshtml

@@ -7,7 +7,7 @@
 @Html.Partial("_StatusMessage")
 
 <h2 class="center-content"><i class="fa fa-clock-o"></i> @ViewBag.Title</h2>
-<h5 class="center-content">Add the next service for this vehicle and remove existing reminders.</h5>
+<p class="center-content">Add the next service for this vehicle and remove existing reminders.</p>
 
 @using (Html.BeginForm("UpdateServiceReminders", "VehicleService", FormMethod.Post, new { @class = "form-horizontal well center-content" }))
 {

Web/Web.csproj

@@ -353,6 +353,7 @@
     <Content Include="Views\ServiceReminder\Index.cshtml" />
     <Content Include="Views\ServiceReminder\ServiceReminderViewModel.cshtml" />
     <Content Include="Views\VehicleService\UpdateServiceReminders.cshtml" />
+    <Content Include="Views\VehicleService\UpcomingServiceReminders.cshtml" />
   </ItemGroup>
   <ItemGroup>
     <Content Include="Content\Account.Login.css" />