Add new Javascript object for the policy entity. This will help with databinding for the relevant properties.

updated admin.html to pull in new policy object
updated admin.js to use new observables in the object.

#94

DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/WindowsDataCenter.csproj

@@ -287,6 +287,9 @@
     <Content Include="www\js\marked.min.js">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </Content>
+    <Content Include="www\js\PolicyObject.js">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
     <Content Include="www\spa.css">
       <CopyToOutputDirectory>Always</CopyToOutputDirectory>
     </Content>

DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/Admin.html

@@ -119,7 +119,7 @@
                     <textarea id="policyEditor"></textarea>
                 </div>
                 <div id="preview" class="tab-pane fade in">
-                <div data-bind="html: policyData().Html" class="well-lg"></div>
+                    <div data-bind="html: policyData.html" class="well-lg"></div>
                 </div>
             </div>
             <button class="btn btn-primary pull-right" data-toggle="modal" data-target="#saveDialog">Save</button><!--data-bind="click: $root.policySave"-->
@@ -137,19 +137,19 @@
                     <table class="table">
                         <tr>
                             <th>Change Author</th>
-                        <td ><input class="form-control" id="changeAuthorInput" type="text" data-bind="value: policyData().ChangeAuthor"/></td>
+                            <td><input class="form-control" id="changeAuthorInput" type="text" data-bind="value: policyData.ChangeAuthor" /></td>
                         </tr>
                         <tr>
                             <th>Change Date</th>
-                        <td><input class="form-control" id="changeDatePicker" type="datetime-local" data-bind="value: policyData().ChangeDate"/></td>
+                            <td><input class="form-control" id="changeDatePicker" type="datetime-local" data-bind="value: policyData.ChangeDate" /></td>
                         </tr>
                         <tr>
                             <th>Version</th>
-                        <td ><input class="form-control" id="versionInput" type="text" data-bind="value: policyData().Version"/></td>
+                            <td><input class="form-control" id="versionInput" type="text" data-bind="value: policyData.Version" readonly /></td>
                         </tr>
                         <tr>
                             <th>Change Description</th>
-                        <td><input class="form-control" id="changeDescription" type="text" data-bind="value: policyData().ChangeDescription"/></td>
+                            <td><input class="form-control" id="changeDescription" type="text" data-bind="value: policyData.ChangeDescription" /></td>
                         </tr>
                     </table>
                 </div>
@@ -160,7 +160,7 @@
             </div>
         </div>
     </div>
-
+    <script src="js/PolicyObject.js" type="text/javascript"></script>
     <script src="Helpers.min.js" type="text/javascript"></script>
     <script src="js/easymde.min.js" type="text/javascript"></script>
     <script src="js/highlightjs.min.js" type="text/javascript"></script>

DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/admin.js

@@ -5,7 +5,7 @@
     self.unassignedCardList = ko.observable(null);
     self.helpers = new Helpers();
     self.policyMarkdown = "";
-    self.policyData = ko.observable({ChangeAuthor:"", ChangeDate:moment(), Version:1, ChangeDescription:"", Markdown:"", Html:""});
+    self.policyData = new policy();
     self.renderer = new marked.Renderer();
     self.renderer.blockquote = function(quote) {
         return "<blockquote class=\"blockquote\">" + quote + "</blockquote>";
@@ -66,7 +66,7 @@
     });
     self.editor.codemirror.on("changes",
         function () {
-            self.policyData().Html=self.editor.options.previewRender(self.editor.value());
+            self.policyData.html(self.editor.options.previewRender(self.editor.value()));
         });
     self.uiPages = {
         overview: "overview",
@@ -168,10 +168,10 @@
     };
     self.policySave = function () {
         var url = self.helpers.createRequestUrl(self.apiEndpoints.savePolicy, null, false);
-        self.policyData().Markdown = self.editor.value(); //make sure we update it, as it doesnt push the value back into the variable
+        self.policyData.Markdown(self.editor.value()); //make sure we update it, as it doesnt push the value back into the variable
-        console.log(self.policyData());
+        //console.log(self.policyData());
         $.post(url, self.policyData(), function() {
-        }, "json")
+        }, "json") //todo: check this serialisation as the object is now complex.
             .done(function() {
                 self.policyReload();
             }).fail(function(resp, status, error) {
@@ -183,9 +183,11 @@
         var url = self.helpers.createRequestUrl(self.apiEndpoints.getPolicy,
             [], false, false);
         $.getJSON(url, function (res) {
-            console.log(res);
+            //console.log(res);
             self.editor.value(res.Markdown);
-            self.policyData(res);
+            res.Version = (parseInt(res.Version) + 1).toString();
+            self.policyData.update(res);
+            $('#saveDialog').modal('hide');
         }).fail(function (resp, status, error) {
             console.log("error - policyReload");
             var errObj = self.helpers.processRequestFailure(resp, status, error);

DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/js/PolicyObject.js

@@ -0,0 +1,30 @@
+function policy(data) {
+    var self = this;
+    if (typeof data === "undefined") {
+        data = createDefaultPolicy();
+    }
+    self.changeDate = ko.observable(data.changeDate);
+    self.description = ko.observable(data.description);
+    self.changeAuthor = ko.observable(data.changeAuthor);
+    self.version = ko.observable(data.version);
+    self.markdown = ko.observable(data.markdown);
+    self.html = ko.observable(data.html);
+    function createDefaultPolicy() {
+        return {
+            changeDate: moment().format(),
+            description: "",
+            changeAuthor: "",
+            version: -1,
+            markdown: "",
+            html: ""
+        };
+    }
+    self.update = function(data) {
+        self.changeDate(data.changeDate);
+        self.description(data.description);
+        self.changeAuthor(data.changeAuthor);
+        self.version(data.version);
+        self.markdown(data.markdown);
+        self.html(data.html);
+    }
+}