/**
 * The home controller
 * 
 * @param {$scope} $scope The $scope service from angular
 */
mainApp.controller('homeCtrl', [ '$scope', 'Compute', '$rootScope', 'Loading','Identity', 'Image', function ($scope, Compute, $rootScope, Loading, Identity, Image)
{
	console.log("homeCTRl");
	var callMeAfterPullData=function(data){
		$scope.machines=Compute.getData().machines;
			Loading.stop();
	}

	;
	if(Compute.getData().machines == null && Identity.isAlreadyLogin()){
		Loading.start();
		Compute.pullData(callMeAfterPullData);		
	}
	else{
		if(Identity.isAlreadyLogin()){
			callMeAfterPullData();
		}
	}


	Image.getImages(function(){});


	$scope.raiseShowMachineDetailsEvent=function(id){

		var callback=function(){
			Loading.stop();
			var data=Compute.getData();
			$rootScope.$broadcast("showMachineDetailsEvent", data.machines[id], data.axioms);		

		}
		Loading.start();
		Compute.pullMachines(callback);
	}

	//adjacencyList, hard-encoded now but will be the result of a request to the server, format may change
	var vmList = {
		'vms': [
			'VM 1',
			'VM 2',
			'VM 3',
			'VM 4',
			'VM 5',
			'VM 6',
			'VM 7',
			'VM 8',
			'VM 9',
			'VM 10'
		],
		'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)
	});
		
	//Custom view for this element
	joint.shapes.basic.Rect.ElementView = joint.dia.ElementView.extend({

		initialize: function() {
			_.bindAll(this, 'updateBox');
			joint.dia.ElementView.prototype.initialize.apply(this, arguments);

			this.$box = $(_.template(this.model.get('html'))());
			// Prevent paper from handling pointerdown.
			this.$box.find('input,select').on('mousedown click', function(evt) { evt.stopPropagation(); });
			// This is an example of reacting on the input change and storing the input data in the cell model.
			this.$box.find('input').on('change', _.bind(function(evt) {
				this.model.set('input', $(evt.target).val());
			}, this));
			this.$box.find('select').on('change', _.bind(function(evt) {
				this.model.set('select', $(evt.target).val());
			}, this));
			this.$box.find('select').val(this.model.get('select'));
			this.$box.find('.config').on('click', function(){
               $scope.raiseShowMachineDetailsEvent();
            });
			// Update the box position whenever the underlying model changes.
			this.model.on('change', this.updateBox, this);
			// Remove the box when the model gets removed from the graph.
			this.model.on('remove', this.removeBox, this);

			this.updateBox();
		},
		render: function() {
			joint.dia.ElementView.prototype.render.apply(this, arguments);
			this.paper.$el.prepend(this.$box);
			this.updateBox();
			return this;
		},
		updateBox: function() {
			// Set the position and dimension of the box so that it covers the JointJS element.
			var bbox = this.model.getBBox();
			// Example of updating the HTML with a data stored in the cell model.
			this.$box.find('label').text(this.model.get('name'));
			this.$box.find('span').text(this.model.get('select'));
			this.$box.css({ width: bbox.width, height: bbox.height, left: bbox.x, top: bbox.y, transform: 'rotate(' + (this.model.get('angle') || 0) + 'deg)' });
		},
		removeBox: function(evt) {
			this.$box.remove();
		}
	});
	
  
	//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));
		});
		console.log(elements);
		_.each(adjacencyList['links'], function(link) {
			links.push(makeLink(link[0], link[1] , link[2], link[3]));
		});
		console.log(links);
		// 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);
	}
	
	//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(label) {

		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;

		/*return new joint.shapes.html.Element({
            id: label,
			name: label,
            size: { width: width, height: height },

            html: [
				'<div class="html-element">',
				'<img src="./images/ON.png">',
				'<label></label>',
				'<input type="image" src="./images/gear.png" class="config"></button>',
				'</div>'
			].join(''),

            attrs: {
                rect: {
                    fill: '#FE854F',
                    width: width,
                    height: height,
                    rx: 5,
                    ry: 5,
                    stroke: 'none'
                }
            }
        });*/
	    return new joint.shapes.org.Member({
		id: label,
		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 }
		}
	    });
	}
	
	var graph = new joint.dia.Graph;
    var paper = new joint.dia.Paper({
        el: $('#graphHolder'),
        width: $('#graphHolder').width(),
        //height: test.height,
        model: graph,
        gridSize: 1
    });

    var cells = buildGraphFromAdjacencyList(vmList);
    console.log(cells);
    /*graph.resetCells(cells);
    joint.layout.DirectedGraph.layout(graph, {
		setLinkVertices: false,
		//Top to bottom generation
		rankDir: "TB",
		nodeSep: 150,
		edgeSep: 150,
		rankSep: 150
	});*/
    graph.addCells(cells);
    var test = joint.layout.DirectedGraph.layout(graph, {
		setLinkVertices: false,
		//Top to bottom generation
		rankDir: "TB",
		nodeSep: 150,
		edgeSep: 150,
		rankSep: 50
	});
    console.log(test);

    paper.setDimensions(test.width, test.height);

    
    paper.$el.css('pointer-events', 'none');
	

}]);