Merge pull request #203 from spasovski/qfixes

fix query versions logic after move to internal array

Author: spasovski

client/app/pages/queries/compare-query-dialog.html

@@ -9,10 +9,10 @@ <h4 class="modal-title">Compare Query</h4>
         <div class="compare-query-version">
             <span>Compare current version to</span>
             <select id="version-choice" ng-model="compareQueryVersion" ng-change="$ctrl.compareQueries()">
-                <option ng-repeat="version in $ctrl.versions" value="{{version.object_version}}">Version {{version.object_version}}</option>
+                <option ng-repeat="version in $ctrl.versions.slice(0, $ctrl.versions.length-1)" value="{{version.object_version}}">Version {{version.object_version}}</option>
             </select>
         </div>
-        <div class="compare-query-revert-wrapper hidden"><a ng-click="$ctrl.revertQuery()" class="btn btn-default">Revert to version {{$ctrl.previousQueryVersion}}</a></div>
+        <div class="compare-query-revert-wrapper hidden"><a ng-click="$ctrl.revertQuery()" class="btn btn-default">Revert to version {{$ctrl.previousQueryVersion + 1}}</a></div>
     </div>
     <div>
         <h5>Current Version {{$ctrl.currentQuery.version}}</h5>
@@ -25,13 +25,9 @@ <h5>Current Version {{$ctrl.currentQuery.version}}</h5>
         </div>
     </div>
     <div>
-        <h5>Previous Version {{$ctrl.previousQueryVersion}}</h5>
+        <h5>Previous Version {{$ctrl.previousQueryVersion + 1}}</h5>
         <div class="diff-content">
-            <p id="previous-query-diff">
-                <span ng-class="{'diff-added': part.added, 'diff-removed': part.removed}" ng-repeat="part in $ctrl.previousDiff">
-                    {{part.value}}
-                </span>
-            </p>
+            <p>{{$ctrl.previousQuery}}</p>
         </div>
     </div>
 </div>

client/app/pages/queries/compare-query-dialog.js

@@ -6,24 +6,24 @@ const CompareQueryDialog = {
   controller: ['clientConfig', '$http', function doCompare(clientConfig, $http) {
     this.currentQuery = this.resolve.query;
 
-    let previousQuery = '';
+    this.previousQuery = '';
     this.currentDiff = [];
     this.previousDiff = [];
     this.versions = [];
-    this.previousQueryVersion = this.currentQuery.version - 1;
+    this.previousQueryVersion = this.currentQuery.version - 2; // due to 0-indexed versions[]
 
-    this.compareQueries = () => {
-      this.previousQueryVersion = document.getElementById('version-choice').value ||
-                                  this.previousQueryVersion;
+    this.compareQueries = (isInitialLoad) => {
+      if (!isInitialLoad) {
+        this.previousQueryVersion = document.getElementById('version-choice').value - 1; // due to 0-indexed versions[]
+      }
 
-      previousQuery = this.versions[this.previousQueryVersion].change.query.current;
-      this.currentDiff = jsDiff.diffChars(previousQuery, this.currentQuery.query);
-      this.previousDiff = jsDiff.diffChars(this.currentQuery.query, previousQuery);
+      this.previousQuery = this.versions[this.previousQueryVersion].change.query.current;
+      this.currentDiff = jsDiff.diffChars(this.previousQuery, this.currentQuery.query);
       document.querySelector('.compare-query-revert-wrapper').classList.remove('hidden');
     };
 
     this.revertQuery = () => {
-      this.resolve.query.query = previousQuery;
+      this.resolve.query.query = this.previousQuery;
       this.resolve.saveQuery();
 
       // Close modal.
@@ -32,6 +32,7 @@ const CompareQueryDialog = {
 
     $http.get(`/api/queries/${this.currentQuery.id}/version`).then((response) => {
       this.versions = response.data;
+      this.compareQueries(true);
     });
   }],
   scope: {