From be6a529afb59473f8670484d0fe8646f98b2d2a4 Mon Sep 17 00:00:00 2001
From: "Chris.Watts90@outlook.com" <Chris.Watts90@outlook.com>
Date: Mon, 27 Feb 2017 16:53:29 +0000
Subject: [PATCH] Add modal 'about' dialog, databind to appDetails observable.

triggered off an about button in the navbar.
#48
---
 .../WindowsDataCenter/www/index.html          | 32 ++++++++++++++++++-
 1 file changed, 31 insertions(+), 1 deletion(-)

diff --git a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/index.html b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/index.html
index ee92e71..a1ebee3 100644
--- a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/index.html
+++ b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/index.html
@@ -38,6 +38,7 @@
                     </li>
                     <!-- /ko -->
                 </ul>
+                <button type="button" class="btn btn-info pull-right hidden-xs" data-toggle="modal" data-target="#aboutDialog">About</button>
             </div>
         </div>
     </nav>
@@ -125,6 +126,7 @@
             </div>
         </div>
     </div>
+
 </div>
 
 <div class="container" data-bind="with: chosenUserDetails">
@@ -252,7 +254,35 @@
         </div>
     </div>
 </div>
-    
+
+<div id="aboutDialog" class="modal fade" role="dialog" data-bind="with: $root.appDetails">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal">&times;</button>
+                <h4 data-bind="text: ApplicationName"></h4>
+            </div>
+            <div class="modal-body">
+                <table class="table">
+                    <tr>
+                        <th>Version</th>
+                        <td data-bind="text: Version"></td>
+                    </tr>
+                    <tr>
+                        <th>Database Provider</th>
+                        <td data-bind="text: DataBaseProvider"></td>
+                    </tr>
+                </table>
+                <br />
+                <a class="btn btn-default" data-bind="attr:{href:'mailto:'+ErrorEmailAddress}">Submit Error Report</a>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+            </div>
+        </div>
+    </div>
+</div>
+
     <footer data-bind="with: errorData, css: {footer: $root.errorData()!==null}">
         <div class="container">
             <!-- Alert/Error banner-->