fixing shitty code

zenvisage · Jun 24, 2016 · c6b549d · c6b549d
1 parent b38b152
commit c6b549d
Show file tree

Hide file tree

Showing 5 changed files with 114 additions and 34 deletions.
diff --git a/src/main/webapp/chi-css/custom.css b/src/main/webapp/chi-css/custom.css
@@ -8,6 +8,19 @@ hr {
   margin-bottom: 5px !important;
 }
 
+#representative-table, #outlier-table{
+  width : 50%;
+  float: left;
+}
+
+.representative-results, .outlier-results{
+ width: 200px;
+ height: 85px;
+}
+
+#results-table{
+width: 100%;
+}
 #table-div {
   height: 242px !important;
   overflow-x: auto;

diff --git a/src/main/webapp/chi-index.html b/src/main/webapp/chi-index.html
@@ -213,16 +213,22 @@ <h5><b>Y-axis</b></h5>
           <div id="middle-left" class="col-md-6">
             <h5><b>Results</b></h5>
             <div>
-              <table style="width:100%" id="results-table"></table>
+              <table id="results-table"></table>
             </div>
           </div>
           <div id="middle-right" class="col-md-6">
             <div>
-              <table style="width:100%;" id="representative-outlier-table">
-                <tr id="middle-right-headers">
-                  <td><h5><b>Representative patterns <span data-toggle="modal"class="glyphicon glyphicon-question-sign"></b></h5>
+              <table id="representative-table">
+                <tr class="middle-right-headers">
+                  <td><h5><b>Representative patterns <span data-toggle="modal" class="glyphicon glyphicon-question-sign"></b></h5>
                   </td>
-                  <td><h5><b>Outliers <span data-toggle="modal"class="glyphicon glyphicon-question-sign"></b></h5></td>
+                </tr>
+              </table>
+            </div>
+            <div>
+              <table id="outlier-table">
+                <tr class="middle-right-headers">
+                  <td><h5><b>Outliers <span data-toggle="modal" class="glyphicon glyphicon-question-sign"></b></h5></td>
                 </tr>
               </table>
             </div>

diff --git a/src/main/webapp/chi-js/app.js b/src/main/webapp/chi-js/app.js
@@ -59,9 +59,14 @@ app.factory('plotResults', function() {
 
     }
 
-    plottingService.displayRepresentativeAndOutlierResults = function displayRepresentativeAndOutlierResults( representativePatternResults, outlierResults )
+    plottingService.displayRepresentativeResults = function displayRepresentativeResults( representativePatternResults )
     {
-      displayRepresentativeAndOutlierResultsHelper( representativePatternResults, outlierResults )
+      displayRepresentativeResultsHelper( representativePatternResults )
+    }
+
+    plottingService.displayOutlierResults = function displayOutlierResults( outlierResults )
+    {
+      displayOutlierResultsHelper( outlierResults )
     }
 
     return plottingService;
@@ -105,7 +110,7 @@ app.controller('datasetController', [
     }
 
     // for representative trends
-    function getRepresentativeTrends( getOutlierTrends )
+    function getRepresentativeTrends()
     {
       var q = constructRepresentativeTrendQuery(); //goes to query.js
       var params = {
@@ -118,14 +123,14 @@ app.controller('datasetController', [
       $http.get('/zv/getdata', config).
       success(function(response) {
         console.log("getRepresentativeTrends: success");
-        getOutlierTrends( response.outputCharts );
+        plotResults.displayRepresentativeResults( response.outputCharts );
       }).
       error(function(response) {
         console.log("getRepresentativeTrends: fail");
       });
     }
 
-    function getOutlierTrends( representativeResponse )
+    function getOutlierTrends()
     {
       var q = constructOutlierTrendQuery(); //goes to query.js
       var params = {
@@ -138,7 +143,7 @@ app.controller('datasetController', [
       $http.get('/zv/getdata', config).
       success(function(response) {
         console.log("getOutlierTrends: success");
-        plotResults.displayRepresentativeAndOutlierResults(response.outputCharts , representativeResponse);
+        plotResults.displayOutlierResults( response.outputCharts );
       }).
       error(function(response) {
         console.log("getOutlierTrends: fail");
@@ -162,8 +167,8 @@ app.controller('datasetController', [
       var xData = datasetInfo.getXAxisData()[getSelectedXAxis()]
       var yData = datasetInfo.getYAxisData()[getSelectedYAxis()]
       initializeSketchpadOnDatasetChange(xData, yData, categoryData); //only x and y values?
-      getRepresentativeTrends( getOutlierTrends );
-      //plotResults.displayRepresentativeAndOutlierResults();
+      getRepresentativeTrends();
+      getOutlierTrends();
     };
 
     // when the page first loads, initialize and then set default values
@@ -195,7 +200,8 @@ app.controller('datasetController', [
               response.yAxisColumns[$scope.yAxisItems[0]],
               response.zAxisColumns[$scope.categories[0]]
             );
-        getRepresentativeTrends( getOutlierTrends );
+        getRepresentativeTrends();
+        getOutlierTrends();
       }).
       error(function(response) {
         alert('Request failed: /getformdata');

diff --git a/src/main/webapp/chi-js/draw.js b/src/main/webapp/chi-js/draw.js
@@ -17,10 +17,13 @@ function plotGraph( data )
   sketchpad = new Dygraph(document.getElementById("draw_div"), data,
       {
         valueRange: valueRange,
-        labels: [ xlabel, ylabel ],
+        //labels: [ xlabel, ylabel ],
         //xlabel: xlabel,
         //ylabel: ylabel,
         title: category,
+        axisLabelFontSize: 9,
+        xLabelHeight: 9,
+        titleHeight: 9,
         interactionModel: {
           mousedown: function (event, g, context) {
             // prevents mouse drags from selecting page text.
@@ -74,7 +77,10 @@ function initializeSketchpad(xmin, xmax, ymin, ymax, xlabel, ylabel, category)
         labels: [ xlabel, ylabel ],
         //xlabel: xlabel,
         //ylabel: ylabel,
+        axisLabelFontSize: 9,
+        xLabelHeight: 9,
         title: category,
+        titleHeight: 9,
         interactionModel: {
           mousedown: function (event, g, context) {
             // prevents mouse drags from selecting page text.

diff --git a/src/main/webapp/chi-js/helper.js b/src/main/webapp/chi-js/helper.js
@@ -1,3 +1,4 @@
+//displays user results
 function displayUserQueryResultsHelper( userQueryResults )
 {
   $("#results-table").empty();
@@ -35,34 +36,74 @@ function displayUserQueryResultsHelper( userQueryResults )
       {
         valueRange: valueRange,
         xlabel: xlabel,
+        xLabelHeight: 11,
+        axisLabelWidth: (0,0),
+        axisLabelFontSize: 0,
         ylabel: null,
+        showLabelsOnHighlight: false,
+        highlightCircleSize: 0,
+        interactionModel: {},
       });
   }
 }
 
-// need to fix, shitty design
-function displayRepresentativeAndOutlierResultsHelper( representativePatternResults, outlierResults )
+function displayRepresentativeResultsHelper( representativePatternResults )
 {
-  $("#representative-outlier-table").find('tr').not('#middle-right-headers').remove();
-  var resultsDiv = $("#representative-outlier-table");
-  var current = 0;
-  for(var count = 0; count < 6; count++) //need to fix count
+  $("#representative-table").find('tr').not('.middle-right-headers').remove();
+  var resultsDiv = $("#representative-table");
+  var varFinalArray = []
+  for(var count = 0; count < 4; count++) //need to fix count
   {
-    if (count%2 == 0)
-    {
-      var newRow = resultsDiv.append("<tr id=\"right-row-" + count.toString() + "\"></tr>")
-      current = count;
+    var newRow = resultsDiv.append("<tr id=\"representative-row-" + count.toString() + "\"></tr>")
+    $("#representative-row-" + count.toString()).append("<td><div class=\"representative-results\" id=\"representative-result-" + count.toString() + "\"></div></td>");
+    varFinalArray.push(representativePatternResults[count]);
+  }
+
+  for (var count = 0; count < varFinalArray.length; count++)
+  {
+    var xData = varFinalArray[count]["xData"];
+    var yData = varFinalArray[count]["yData"];
+
+    var xlabel = varFinalArray[count]["xType"];
+    var ylabel = varFinalArray[count]["yType"];
+
+    var xmin = Math.min.apply(Math, xData);
+    var xmax = Math.max.apply(Math, xData);
+    var ymin = Math.min.apply(Math, yData);
+    var ymax = Math.max.apply(Math, yData);
+
+    var data = [];
+    var arrayLength = xData.length;
+    for (var i = 0; i < arrayLength; i++ ) {
+      data.push( [ xData[i], yData[i] ] );
     }
-    $("#right-row-" + current.toString()).append("<td><div id=\"right-result-" + count.toString() + "\" style=\"width: 200px; height: 85px;\"></div></td>");
+    var valueRange = [ymin, ymax];
+    new Dygraph(document.getElementById("representative-result-" + count.toString()), data,
+      {
+        valueRange: valueRange,
+        xlabel: xlabel,
+        xLabelHeight: 11,
+        axisLabelWidth: (0,0),
+        axisLabelFontSize: 0,
+        ylabel: null,
+        showLabelsOnHighlight: false,
+        highlightCircleSize: 0,
+        interactionModel: {},
+      });
   }
+}
 
-  varFinalArray = []
-  varFinalArray.push(representativePatternResults[0]);
-  varFinalArray.push(outlierResults[0]);
-  varFinalArray.push(representativePatternResults[1]);
-  varFinalArray.push(outlierResults[1]);
-  varFinalArray.push(representativePatternResults[2]);
-  varFinalArray.push(outlierResults[2]);
+function displayOutlierResultsHelper( outlierResults )
+{
+  $("#outlier-table").find('tr').not('.middle-right-headers').remove();
+  var resultsDiv = $("#outlier-table");
+  var varFinalArray = [];
+  for(var count = 0; count < 4; count++) //need to fix count
+  {
+    var newRow = resultsDiv.append("<tr id=\"outlier-row-" + count.toString() + "\"></tr>")
+    $("#outlier-row-" + count.toString()).append("<td><div class=\"outlier-results\" id=\"outlier-result-" + count.toString() + "\"></div></td>");
+    varFinalArray.push(outlierResults[count]);
+  }
 
   for (var count = 0; count < varFinalArray.length; count++)
   {
@@ -83,12 +124,20 @@ function displayRepresentativeAndOutlierResultsHelper( representativePatternResu
       data.push( [ xData[i], yData[i] ] );
     }
     var valueRange = [ymin, ymax];
-    new Dygraph(document.getElementById("right-result-" + count.toString()), data,
+    new Dygraph(document.getElementById("outlier-result-" + count.toString()), data,
       {
         valueRange: valueRange,
         xlabel: xlabel,
+        xLabelHeight: 11,
+        axisLabelWidth: (0,0),
+        axisLabelFontSize: 0,
         ylabel: null,
+        showLabelsOnHighlight: false,
+        highlightCircleSize: 0,
+        interactionModel: {},
       });
   }
 }
 
+
+