diff options
Diffstat (limited to 'client/js/controllers/home/home.js')
| -rwxr-xr-x | client/js/controllers/home/home.js | 392 |
1 files changed, 196 insertions, 196 deletions
diff --git a/client/js/controllers/home/home.js b/client/js/controllers/home/home.js index 47491ff..aeb89e5 100755 --- a/client/js/controllers/home/home.js +++ b/client/js/controllers/home/home.js @@ -4,199 +4,199 @@ * @param {$scope} $scope The $scope service from angular */ mainApp.controller('homeCtrl', ['$scope', 'Compute', '$rootScope', 'Loading', 'Identity', 'Image', function ($scope, Compute, $rootScope, Loading, Identity, Image) -{ - - graph = new joint.dia.Graph; - paper = new joint.dia.Paper({ - el: $('#graphHolder'), - width: $('#graphHolder').width(), - //height: test.height, - model: graph, - gridSize: 1, - eractive: false - }); - - $scope.raiseShowMachineCreationEvent = function () { - $rootScope.$broadcast("showMachineCreationEvent", Compute.getData().axioms); - }; - - var displayMachine = function () { - - var machineNames = []; - var i = 0; - $.each(Compute.getData().machines, function () { - machineNames[i] = [this.name, this.id]; - i++; - }) - var vmList = { - 'vms': machineNames - /*'links': [ - ['VM 1', 'VM 2', '', ''], - ['VM 2', 'VM 3', 'I3', 'I4'], - ['VM 1', 'VM 3', 'I5', 'I6'], - ['VM 2', 'VM 4', 'I5', 'I6'], - ['VM 4', 'VM 5', 'I5', 'I6'], - ['VM 4', 'VM 6', 'I5', 'I6'], - ['VM 4', 'VM 1', 'I5', 'I6'], - ['VM 7', 'VM 4', 'I5', 'I6'], - ['VM 7', 'VM 3', 'I5', 'I6'], - ['VM 6', 'VM 8', 'I5', 'I6'], - ['VM 3', 'VM 9', 'I5', 'I6'], - ['VM 3', 'VM 10', 'I5', 'I6'] - ]*/ - }; - //Custom element for inserting html - joint.shapes.html = {}; - joint.shapes.html.Element = joint.shapes.basic.Rect.extend({ - defaults: joint.util.deepSupplement({ - type: 'html.Element', - attrs: { - rect: {stroke: 'none', 'fill-opacity': 0} - } - }, joint.shapes.basic.Rect.prototype.defaults) - }); - - - this.paper.$el.css('pointer-events', 'none'); - var cells = buildGraphFromAdjacencyList(vmList); - - this.graph.addCells(cells); - console.log(this.graph); - var test = joint.layout.DirectedGraph.layout(this.graph, { - etLinkVertices: false, - //Top to bottom generation - ankDir: "TB", - odeSep: 150, - dgeSep: 150, - ankSep: 50 - }); - - this.paper.setDimensions(test.width, test.height); - - $(".Member").bind('click', function () { - $scope.raiseShowMachineDetailsEvent($(this).attr('model-id')); - }); - } - - // Function to call after pull all data about machines - var callMeAfterPullData = function (data) { - //$scope.machines=Compute.getData().machines; - Loading.stop(); - displayMachine(); - }; - - var tryToRetrieveData = function () { - // If no data retrieve about machine and user is logged - if (Compute.getData().machines == null && Identity.isAlreadyLogin()) { - Loading.start(); // Show loading gif - Compute.pullData(callMeAfterPullData); // Retrieve data and call the callback - } else { - // Else if user is logged and data is already retrieve - // simply display data - if (Identity.isAlreadyLogin()) { - callMeAfterPullData(); // Display data - } - } - }; - - // On user login - $scope.$on('loginEvent', function () { - tryToRetrieveData(); - }); - - // Function to call from view to display the details of a machine - $scope.raiseShowMachineDetailsEvent = function (id) { - - // Stop loading gif and display overlay - var callback = function () { - Loading.stop(); - var data = Compute.getData(); - - $rootScope.$broadcast("showMachineDetailsEvent", data.machines[id], data.axioms); - - }; - Loading.start(); // Show loading gif - Compute.pullMachines(callback); // Retrieve machine info and display overlay - }; - - // Try to retrieve data for the first time - tryToRetrieveData(); - - - - //Read the adjacencyList and build the elements and the links according to it - function buildGraphFromAdjacencyList(adjacencyList) { - - var elements = []; - var links = []; - - _.each(adjacencyList['vms'], function (vm) { - elements.push(makeElement(vm)); - }); - _.each(adjacencyList['links'], function (link) { - links.push(makeLink(link[0], link[1], link[2], link[3])); - }); - // Links must be added after all the elements. This is because when the links - // are added to the graph, link source/target - // elements must be in the graph already. - return elements.concat(links); - } - - // On user login - $scope.$on('updateGraphEvent', function () { - displayMachine(); - - }); - //Return a new link linking the parent and child elements with the interfaces names given in parameters - function makeLink(parentElementLabel, childElementLabel, Iparent, Ichild) { - - return new joint.dia.Link({ - source: {id: parentElementLabel}, - target: {id: childElementLabel}, - labels: [ - {position: 20, attrs: {text: {text: Iparent}}}, - {position: -20, attrs: {text: {text: Ichild}}} - ] - }); - } - - //Return a new element - function makeElement(vm) { - var label = vm[0]; - - var maxLineLength = _.max(label.split('\n'), function (l) { - return l.length; - }).length; - - // Compute width/height of the rectangle based on the number - // of lines in the label and the letter size. 0.6 * letterSize is - // an approximation of the monospace font letter width. - var width = 130; - var height = 80; - var data = Compute.getData(); - - if (data.machines[vm[1]].status == "ACTIVE") { - return new joint.shapes.org.Member({ - id: vm[1], - position: {x: 0, y: 0}, - attrs: { - '.card': {fill: 'blue', stroke: 'none'}, - image: {'xlink:href': './images/ON.png', opacity: 0.7}, - //'.rank': { text: rank, fill: textColor, 'word-spacing': '-5px', 'letter-spacing': 0}, - '.name': {text: label, fill: 'white', 'font-size': 13, 'font-family': 'Arial', 'letter-spacing': 0} - } - }); - } else { - return new joint.shapes.org.Member({ - id: vm[1], - position: {x: 0, y: 0}, - attrs: { - '.card': {fill: 'blue', stroke: 'none'}, - image: {'xlink:href': './images/OFF.png', opacity: 0.7}, - //'.rank': { text: rank, fill: textColor, 'word-spacing': '-5px', 'letter-spacing': 0}, - '.name': {text: label, fill: 'white', 'font-size': 13, 'font-family': 'Arial', 'letter-spacing': 0} - } - }); - } - } -}]);
\ No newline at end of file + { + + graph = new joint.dia.Graph; + paper = new joint.dia.Paper({ + el: $('#graphHolder'), + width: $('#graphHolder').width(), + //height: test.height, + model: graph, + gridSize: 1, + eractive: false + }); + + $scope.raiseShowMachineCreationEvent = function () { + $rootScope.$broadcast("showMachineCreationEvent", Compute.getData().axioms); + }; + + var displayMachine = function () { + + var machineNames = []; + var i = 0; + $.each(Compute.getData().machines, function () { + machineNames[i] = [this.name, this.id]; + i++; + }) + var vmList = { + 'vms': machineNames + /*'links': [ + ['VM 1', 'VM 2', '', ''], + ['VM 2', 'VM 3', 'I3', 'I4'], + ['VM 1', 'VM 3', 'I5', 'I6'], + ['VM 2', 'VM 4', 'I5', 'I6'], + ['VM 4', 'VM 5', 'I5', 'I6'], + ['VM 4', 'VM 6', 'I5', 'I6'], + ['VM 4', 'VM 1', 'I5', 'I6'], + ['VM 7', 'VM 4', 'I5', 'I6'], + ['VM 7', 'VM 3', 'I5', 'I6'], + ['VM 6', 'VM 8', 'I5', 'I6'], + ['VM 3', 'VM 9', 'I5', 'I6'], + ['VM 3', 'VM 10', 'I5', 'I6'] + ]*/ + }; + //Custom element for inserting html + joint.shapes.html = {}; + joint.shapes.html.Element = joint.shapes.basic.Rect.extend({ + defaults: joint.util.deepSupplement({ + type: 'html.Element', + attrs: { + rect: {stroke: 'none', 'fill-opacity': 0} + } + }, joint.shapes.basic.Rect.prototype.defaults) + }); + + + this.paper.$el.css('pointer-events', 'none'); + var cells = buildGraphFromAdjacencyList(vmList); + + this.graph.addCells(cells); + //console.log(this.graph); + var test = joint.layout.DirectedGraph.layout(this.graph, { + etLinkVertices: false, + //Top to bottom generation + ankDir: "TB", + odeSep: 150, + dgeSep: 150, + ankSep: 50 + }); + + this.paper.setDimensions(test.width, test.height); + + $(".Member").bind('click', function () { + $scope.raiseShowMachineDetailsEvent($(this).attr('model-id')); + }); + } + + // Function to call after pull all data about machines + var callMeAfterPullData = function (data) { + //$scope.machines=Compute.getData().machines; + Loading.stop(); + displayMachine(); + }; + + var tryToRetrieveData = function () { + // If no data retrieve about machine and user is logged + if (Compute.getData().machines == null && Identity.isAlreadyLogin()) { + Loading.start(); // Show loading gif + Compute.pullData(callMeAfterPullData); // Retrieve data and call the callback + } else { + // Else if user is logged and data is already retrieve + // simply display data + if (Identity.isAlreadyLogin()) { + callMeAfterPullData(); // Display data + } + } + }; + + // On user login + $scope.$on('loginEvent', function () { + tryToRetrieveData(); + }); + + // Function to call from view to display the details of a machine + $scope.raiseShowMachineDetailsEvent = function (id) { + + // Stop loading gif and display overlay + var callback = function () { + Loading.stop(); + var data = Compute.getData(); + + $rootScope.$broadcast("showMachineDetailsEvent", data.machines[id], data.axioms); + + }; + Loading.start(); // Show loading gif + Compute.pullMachines(callback); // Retrieve machine info and display overlay + }; + + // Try to retrieve data for the first time + tryToRetrieveData(); + + + + //Read the adjacencyList and build the elements and the links according to it + function buildGraphFromAdjacencyList(adjacencyList) { + + var elements = []; + var links = []; + + _.each(adjacencyList['vms'], function (vm) { + elements.push(makeElement(vm)); + }); + _.each(adjacencyList['links'], function (link) { + links.push(makeLink(link[0], link[1], link[2], link[3])); + }); + // Links must be added after all the elements. This is because when the links + // are added to the graph, link source/target + // elements must be in the graph already. + return elements.concat(links); + } + + // On user login + $scope.$on('updateGraphEvent', function () { + displayMachine(); + + }); + //Return a new link linking the parent and child elements with the interfaces names given in parameters + function makeLink(parentElementLabel, childElementLabel, Iparent, Ichild) { + + return new joint.dia.Link({ + source: {id: parentElementLabel}, + target: {id: childElementLabel}, + labels: [ + {position: 20, attrs: {text: {text: Iparent}}}, + {position: -20, attrs: {text: {text: Ichild}}} + ] + }); + } + + //Return a new element + function makeElement(vm) { + var label = vm[0]; + + var maxLineLength = _.max(label.split('\n'), function (l) { + return l.length; + }).length; + + // Compute width/height of the rectangle based on the number + // of lines in the label and the letter size. 0.6 * letterSize is + // an approximation of the monospace font letter width. + var width = 130; + var height = 80; + var data = Compute.getData(); + + if (data.machines[vm[1]].status == "ACTIVE") { + return new joint.shapes.org.Member({ + id: vm[1], + position: {x: 0, y: 0}, + attrs: { + '.card': {fill: 'blue', stroke: 'none'}, + image: {'xlink:href': './images/ON.png', opacity: 0.7}, + //'.rank': { text: rank, fill: textColor, 'word-spacing': '-5px', 'letter-spacing': 0}, + '.name': {text: label, fill: 'white', 'font-size': 13, 'font-family': 'Arial', 'letter-spacing': 0} + } + }); + } else { + return new joint.shapes.org.Member({ + id: vm[1], + position: {x: 0, y: 0}, + attrs: { + '.card': {fill: 'blue', stroke: 'none'}, + image: {'xlink:href': './images/OFF.png', opacity: 0.7}, + //'.rank': { text: rank, fill: textColor, 'word-spacing': '-5px', 'letter-spacing': 0}, + '.name': {text: label, fill: 'white', 'font-size': 13, 'font-family': 'Arial', 'letter-spacing': 0} + } + }); + } + } + }]);
\ No newline at end of file |