AB.headerRHS(); 

AB.newDiv("selectdiv");
$("#selectdiv").css({ "margin": "30" });
$("#selectdiv").html("Pick an actor: <span id='actorlist'></span>");

function Graph() {
    this.graph = {};
    this.nodes = [];
    this.start = null;
    this.end = null;
}

Graph.prototype.setStart = function(node) {
    this.start = node;
}

Graph.prototype.setEnd = function(node) {
    this.end = node;
}

Graph.prototype.addNode = function(label) {
    var node = new Node(label);
    this.graph[label] = node;
    this.nodes.push(node);
    return node;
}

Graph.prototype.clear = function() {
    for (var i = 0; i < this.nodes.length; i++) {
        this.nodes[i].searched = false;
        this.nodes[i].parent = null;
    }
}

function Node(label) {
    this.label = label;
    this.edges = [];
    this.parent = null;
    this.searched = false;
}

Node.prototype.connect = function(neighbor) {
    for (var i = 0; i < arguments.length; i++) {
        this.edges.push(arguments[i]);
        arguments[i].edges.push(this);
    }
}

var data;
var graph;
var actors;
var actorlist;

function preload() {
    data = loadJSON('/uploads/drummk2/movie_list.json');
}

function setup() {
    noCanvas();
    
    graph = new Graph();
    actors = {};
    var movies = data.movies;
  
    for (var i = 0; i < movies.length; i++) {
        var movie = movies[i].title;
        var cast = movies[i].cast;
        var movieNode = graph.addNode(movie);
        
        for (var j = 0; j < cast.length; j++) {
            var name = cast[j];
            var actorNode;
      
            if (actors[name]) actorNode = actors[name];
            else {
                actorNode = graph.addNode(name);
                actors[name] = actorNode;
            }
      
            movieNode.connect(actorNode);
        }
    }
    
    actorlist = createSelect();
    actorlist.parent('actorlist');
    var allactors = Object.keys(actors).sort();
  
    for (var i = 0; i < allactors.length; i++) {
        actorlist.option(allactors[i]);
    }
    
    actorlist.changed(findbacon);
}

function findbacon() {
    graph.clear();
    var start = actors[actorlist.value()];
    var end = actors['Kevin Bacon'];
    graph.setStart(start);
    graph.setEnd(end);
    bfs();
}

function bfs() 
{
    var goalFound = false;
    var queue = [];
    var path = [];

    queue.push(graph.start);

    while (queue.length > 0 && !goalFound) {
        var node = queue.shift();
        console.log("======");
        console.log("Start of search of " + node.label);
        
        if (node == graph.end) {
            goalFound = true;
        } else {
            console.log("Checking neighbours of " + node.label);
            var next = node.edges;
      
            for (var i = 0; i < next.length; i++) {
                var neighbor = next[i];
                if (!neighbor.searched) {
                    if (!queue.includes(neighbor)) {
                        console.log("Adding unsearched neighbour " + neighbor.label + " to queue");
                        queue.push(neighbor);
                        neighbor.parent = node;
                        if (neighbor == graph.end) {
                            node = neighbor;
                            goalFound = true;
                            break;
                        }
                    } else {
                        console.log("Queue already contains node: " + neighbor.label);
                    }
                }
            }
            
            node.searched = true;
            console.log("End of search of " + node.label);
        }
    }
    
    if (goalFound) {
        console.log ("Found goal node");
        path.push(node);
        var next = node.parent;
        
        while (next) {
            path.push(next);
            next = next.parent;
        }
    }
    
    console.log('Finished search for path');
  
    var s = '<h1> Path length ' + path.length + '</h1>';
  
    if (path.length > 0) {
        for (var i = path.length-1; i >= 0; i--) {
            if (actors[path[i].label]) {
                s += '<p style="color: green">' + path[i].label + "<br>";
            } else {
                s += '<p style="color: red">' + path[i].label + "<br>";
            }
        }
    } else {
        s += "No path found" + "<br>";
    }
  
    AB.newDiv("theoutput");
  
    $("#theoutput").css({
        "margin": "30",
        "padding": "30",
        "display": "inline-block",
        "border": "1px solid black"
    });

    $("#theoutput").html(s);
}