Fix #9

Author: jlcanovas

jsondiscoverer.web/WebContent/app/controllers/composition.js

@@ -5,10 +5,12 @@ angular.module("jsonDiscoverer").controller("CompositionCtrl", ["$scope", "$wind
         $scope.name = "";
         $scope.graph = "";
 
+        $scope.layoutPosible = false;
         $scope.sigmaGraph = new sigma('sigma-container');
         $scope.layoutButton = "Start Layout";
         $scope.layoutRunning = false;
 
+        $scope.pathPosible = false;
         $scope.sourcePath = {};
         $scope.sourcePreviousColor = "";
         $scope.targetPath = {};
@@ -83,50 +85,14 @@ angular.module("jsonDiscoverer").controller("CompositionCtrl", ["$scope", "$wind
                         })
                     }
                     $scope.sigmaGraph.refresh();
-
+                    $scope.layoutPosible = true;
                 },
                 function(data, status, headers, config) {
                     $scope.alertsGeneral.push({ type: 'error', msg: 'Oops, we found an error in the composition discovery process. Could you check your JSON and try again?' });
                 }
             );
         };
 
-        $scope.test = function() {
-            $scope.sigmaGraph.graph.clear();
-            $scope.sigmaGraph.graph.addNode({
-                id : "A",
-                label : "labelA",
-                x : Math.random(),
-                y : Math.random(),
-                size : 1,
-                color : '#f00'
-            }).addNode({
-                id : "B",
-                label : "labelB",
-                x : Math.random(),
-                y : Math.random(),
-                size : 1,
-                color : '#f00'
-            }).addNode({
-                id : "C",
-                label : "labelC",
-                x : Math.random(),
-                y : Math.random(),
-                size : 1,
-                color : '#f00'
-            }).addEdge({
-                id : "EAB",
-                source : "A",
-                target : "B"
-            }).addEdge({
-                id : "EBC",
-                source : "B",
-                target : "C"
-            });
-            $scope.sigmaGraph.refresh();
-        };
-
-
         $scope.updateCompositionPosible = function() {
             if(typeof defs === "undefined") $scope.compositionPosible = false;
             for(def in $scope.defs) {
@@ -157,6 +123,7 @@ angular.module("jsonDiscoverer").controller("CompositionCtrl", ["$scope", "$wind
                 $scope.targetPath.color = $scope.targetPreviousColor;
                 $scope.sourcePath = null;
                 $scope.targetPath = null;
+                $scope.pathPosible = false;
             }
 
             if($scope.sourcePath === null){
@@ -165,6 +132,7 @@ angular.module("jsonDiscoverer").controller("CompositionCtrl", ["$scope", "$wind
             } else {
                 $scope.targetPreviousColor = event.data.node.color;
                 $scope.targetPath = event.data.node;
+                $scope.pathPosible = true;
             }
             event.data.node.color = '#000';
             $scope.sigmaGraph.refresh();

jsondiscoverer.web/WebContent/app/partials/composition.html

@@ -94,7 +94,7 @@ <h3 class="modal-title">Provide your JSON for your {{json.name}} source</h3>
 
             <h4 style="padding-top: 20px;">Step 3. Composition Graph </h4>
             <div style="float:right;">
-                <button style="margin-top: -10px;"class="btn" ng-click="layout()">{{layoutButton}}</button>
+                <button style="margin-top: -10px;"class="btn" ng-disabled="!layoutPosible" ng-click="layout()">{{layoutButton}}</button>
             </div>
             <p>Same-colored nodes represent concepts of an API. White nodes represent attributes of the concepts while red nodes represent input concepts</p>
             <p class="text-center">
@@ -114,7 +114,7 @@ <h4 style="padding-top: 20px;">Step 4. Calculate a Path</h4>
                 <div class="col-md-2">
                     <input type="text" class="form-control" id="targetNode" placeholder="Select a target node" ng-model="targetPath.label" readonly>
                 </div>
-                <button class="btn col-md-3 col-md-offset-1" ng-click="calculatePath()">Calculate</button>
+                <button class="btn col-md-3 col-md-offset-1" ng-disabled="!pathPosible" ng-click="calculatePath()">Calculate</button>
             </form>
 		</div>