Skip to content

Commit 0a1b616

Browse files
committed
Noder kan ikke ligge over hverandre
1 parent 6ada3f3 commit 0a1b616

12 files changed

+174
-162
lines changed

Graphs/DfsBfs.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<meta charset="UTF-8"/>
55
<title>DFS / BFS</title>
66
<link rel="stylesheet" type="text/css" href="css/style.css"/>
7+
78
<script>var algorithm = "DFS/BFS";
89
var collapse = "YES"; </script>
910
<script src="js/jquery.min.js"></script>

Graphs/graphs.html

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,6 @@
55
<title>Graphs</title>
66
<link rel="stylesheet" type="text/css" href="css/style.css"/>
77

8-
<!-- Insert this line above script imports -->
9-
<script>if (typeof module === 'object') {
10-
window.module = module;
11-
module = undefined;
12-
}</script>
13-
148
<script>var algorithm = "Graphs";
159
var collapse = "NO"; </script>
1610
<script src="js/jquery.min.js"></script>

Graphs/js/adjacencyList.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
///<reference path="dfsBfsController.ts"/>
33
declare var $;
44

5-
var adjacencyList: number[][] = [];
5+
let adjacencyList: number[][] = [];
66

77
function addNewAdjList(nodeId: number) {
88
adjacencyList.push([]);

Graphs/js/dfsBfsController.ts

Lines changed: 44 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -4,30 +4,30 @@
44
///<reference path="eventManager.ts"/>
55
///<reference path="visitedArray.ts"/>
66

7-
var visited: boolean [];
8-
var bfsQueue: number [];
9-
var currentNode;
10-
var highlightEventDuration = 0;
11-
var visitEventDuration = 2000;
7+
let visited: boolean [];
8+
let bfsQueue: number [];
9+
let currentNode: number;
10+
let highlightEventDuration = 0;
11+
let visitEventDuration = 2000;
1212

1313
function startBfs(startIndex: number) {
14-
resetVisited(nodes)
15-
bfsQueue = []
14+
resetVisited(nodes);
15+
bfsQueue = [];
1616
currentNode = startIndex;
1717

1818
bfsQueue.push(startIndex);
1919

2020
while (bfsQueue.length != 0) {
21-
var v = bfsQueue.shift();
21+
let v: number = bfsQueue.shift();
2222
popFromBfsQueue(v);
2323
visit(v);
2424

25-
var adjacent = adjacencyList[v];
26-
for (var i = 0; i < adjacent.length; i++) {
27-
var w: number = adjacent[i];
25+
let adjacent = adjacencyList[v];
26+
for (let i = 0; i < adjacent.length; i++) {
27+
let w: number = adjacent[i];
2828
if (!visited[w] && $.inArray(w, bfsQueue)) {
29-
addToBfsQueue(w)
30-
bfsQueue.push(w)
29+
addToBfsQueue(w);
30+
bfsQueue.push(w);
3131
}
3232
}
3333
}
@@ -36,33 +36,33 @@ function startBfs(startIndex: number) {
3636
}
3737

3838
function addToBfsQueue(v: number) {
39-
var forward = function (id) {
39+
let forward = function (id) {
4040
return function () {
4141
addQueueElement(id);
4242
};
43-
}(v)
43+
}(v);
4444

45-
var backwards = function (id) {
45+
let backwards = function (id) {
4646
return function () {
4747
popQueueElement(id);
4848
};
49-
}(v)
49+
}(v);
5050

5151
manager.addEvent(new FrontendEvent(forward, backwards, visitEventDuration))
5252
}
5353

5454
function popFromBfsQueue(v: number) {
55-
var forward = function (id) {
55+
let forward = function (id) {
5656
return function () {
5757
popQueueElement(id);
5858
};
59-
}(v)
59+
}(v);
6060

61-
var backwards = function (id) {
61+
let backwards = function (id) {
6262
return function () {
6363
addQueueElement(id);
6464
};
65-
}(v)
65+
}(v);
6666

6767
manager.addEvent(new FrontendEvent(forward, backwards, visitEventDuration))
6868
}
@@ -78,8 +78,8 @@ function startDfs(startIndex: number) {
7878
function dfs(v: number) {
7979
visit(v);
8080

81-
var adjacent = adjacencyList[v];
82-
for (var i = 0; i < adjacent.length; i++) {
81+
let adjacent = adjacencyList[v];
82+
for (let i = 0; i < adjacent.length; i++) {
8383
if (visited[adjacent[i]]) continue;
8484
setHighlightEdge(getEdgeId(v, adjacent[i]), true);
8585
dfs(adjacent[i]);
@@ -89,7 +89,7 @@ function dfs(v: number) {
8989
}
9090

9191
function setHighlightEdge(edgeId: number, highlight: boolean) {
92-
var forward = function (id, h) {
92+
let forward = function (id, h) {
9393
return function () {
9494
if (h) {
9595
$("#edge" + id).css({"stroke": "rgb(16, 130, 219)", "stroke-width": "6"});
@@ -98,9 +98,9 @@ function setHighlightEdge(edgeId: number, highlight: boolean) {
9898
$("#edge" + id).css({"stroke": "rgb(0, 0, 0)", "stroke-width": "4"});
9999
} //remove highlight
100100
};
101-
}(edgeId, highlight)
101+
}(edgeId, highlight);
102102

103-
var backwards = function (id, h) {
103+
let backwards = function (id, h) {
104104
return function () {
105105
if (h) {
106106
$("#edge" + id).css({"stroke": "rgb(0, 0, 0)", "stroke-width": "4"});
@@ -109,84 +109,84 @@ function setHighlightEdge(edgeId: number, highlight: boolean) {
109109
$("#edge" + id).css({"stroke": "rgb(16, 130, 219)", "stroke-width": "6"});
110110
} // add highlight
111111
};
112-
}(edgeId, highlight)
112+
}(edgeId, highlight);
113113

114114
manager.addEvent(new FrontendEvent(forward, backwards, highlightEventDuration))
115115
}
116116

117117
function visit(id: number) {
118118
visited[id] = true;
119-
var forward = function (v, curr) {
119+
let forward = function (v, curr) {
120120
return function () {
121121
$("#node" + curr).css("border", "6px solid black");
122122
$("#node" + v).css("background-color", "rgb(80, 250, 80)");
123123
$("#node" + v).css("border", "6px solid rgb(16, 130, 219)");
124124
$("#insElemNr" + v).html("<p>" + v + "</p><div> T </div>");
125125
$("#insElemNr" + v).addClass("marked");
126126
};
127-
}(id, currentNode)
127+
}(id, currentNode);
128128

129-
var backwards = function (v, curr) {
129+
let backwards = function (v, curr) {
130130
return function () {
131131
$("#node" + v).css("background-color", "white")
132132
$("#node" + v).css("border", "6px solid black")
133133
$("#node" + curr).css("border", "6px solid rgb(16, 130, 219)")
134134
$("#insElemNr" + v).html("<p>" + v + "</p><div> F </div>");
135135
$("#insElemNr" + v).removeClass("marked");
136136
};
137-
}(id, currentNode)
137+
}(id, currentNode);
138138

139139
manager.addEvent(new FrontendEvent(forward, backwards, visitEventDuration));
140140
currentNode = id;
141141
}
142142

143143
function resetAfterSearch() {
144-
var forward = function (curr) {
144+
let forward = function (curr) {
145145
return function () {
146146
$("#node" + curr).css("border", "6px solid black");
147-
for (var i = 0; i < nodes; i++) {
147+
for (let i = 0; i < nodes; i++) {
148148
$("#node" + i).css("background-color", "white");
149149
}
150150
};
151-
}(currentNode)
151+
}(currentNode);
152152

153-
var backwards = function (curr) {
153+
let backwards = function (curr) {
154154
return function () {
155-
$("#node" + curr).css("border", "6px solid rgb(16, 130, 219)")
156-
for (var i = 0; i < nodes; i++) {
155+
$("#node" + curr).css("border", "6px solid rgb(16, 130, 219)");
156+
for (let i = 0; i < nodes; i++) {
157157
$("#node" + i).css("background-color", "rgb(80, 250, 80)");
158158
}
159159
};
160-
}(currentNode)
160+
}(currentNode);
161161

162162
manager.addEvent(new FrontendEvent(forward, backwards, visitEventDuration));
163163
}
164164

165165
function resetVisited(numNodes: number) {
166166
visited = [];
167-
for (var i = 0; i < numNodes; i++) visited.push(false);
167+
for (let i = 0; i < numNodes; i++) visited.push(false);
168168
setInitialArray();
169169
}
170170

171171
function instantCollapseAll() {
172-
for (var i = 0; i < nodes; i++) {
173-
var width: number = $("#adjList" + i).width();
172+
for (let i = 0; i < nodes; i++) {
173+
let width: number = $("#adjList" + i).width();
174174
$("#adjList" + i).css({left: -width});
175175
}
176176
}
177177

178178
function collapseAdjacencyList(index: number) {
179-
for (var i = 0; i < nodes; i++) {
179+
for (let i = 0; i < nodes; i++) {
180180
$("#adjList" + i).finish();
181181
}
182182

183-
var width: number = $("#adjList" + index).width();
183+
let width: number = $("#adjList" + index).width();
184184
$("#adjList" + index).animate({left: -width});
185185

186186
}
187187

188188
function expandAdjacencyList(index: number) {
189-
for (var i = 0; i < nodes; i++) {
189+
for (let i = 0; i < nodes; i++) {
190190
$("#adjList" + i).finish();
191191
collapseAdjacencyList(i)
192192
}

Graphs/js/eventManager.js

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,43 +5,44 @@
55
/** Manager for events stored in queue. Manager is also responsible for executing events automatically */
66
var eventManager = /** @class */ (function () {
77
function eventManager() {
8-
this.delayTime = 1000;
8+
this.delayTime = 1000; // Original value
99
this.nextEvents = [];
1010
this.previousEvents = [];
11+
this.paused = true;
1112
}
1213
// Executing the next event in the queue, adding it to 'previous'
1314
eventManager.prototype.next = function () {
1415
if (this.nextEvents.length == 0) {
1516
return;
1617
}
1718
var event = this.nextEvents.shift();
18-
console.log(this.nextEvents);
1919
event.next();
20-
console.log(event.next());
2120
this.previousEvents.push(event);
2221
if (event.duration == 0)
2322
this.next();
2423
};
2524
// Executing the previous event
2625
eventManager.prototype.previous = function () {
26+
this.pause();
2727
if (this.previousEvents.length == 0)
2828
return;
2929
var event = this.previousEvents.pop();
30-
this.delayTime = 0; //TODO: Should there be a delay when stepping backwards?
30+
//this.delayTime = 500; //this line set to 0 caused: when resuming all animations are played out. Intention Delay when stepping backwards.
3131
event.previous();
3232
this.nextEvents.unshift(event);
3333
};
3434
eventManager.prototype.addEvent = function (event) {
3535
this.nextEvents.push(event);
3636
};
3737
eventManager.prototype.start = function () {
38-
clearInterval(this.eventThread);
3938
var manager = this; // Anonymous functions cannot access this...
39+
this.paused = false;
4040
this.eventThread = setInterval(function () {
4141
manager.next();
4242
}, manager.delayTime);
4343
};
4444
eventManager.prototype.pause = function () {
45+
this.paused = true;
4546
clearInterval(this.eventThread);
4647
};
4748
return eventManager;

Graphs/js/eventManager.ts

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -7,65 +7,66 @@ declare var $;
77

88
/** Manager for events stored in queue. Manager is also responsible for executing events automatically */
99
class eventManager {
10-
delayTime: number = 1000;
10+
delayTime: number = 1000; // Original value
1111
nextEvents: FrontendEvent[] = [];
1212
previousEvents: FrontendEvent[] = [];
13-
eventThread;
13+
eventThread: number;
14+
paused: boolean = true;
1415

1516
// Executing the next event in the queue, adding it to 'previous'
1617
next() {
1718
if (this.nextEvents.length == 0) {
1819
return;
1920
}
20-
var event = this.nextEvents.shift();
21-
console.log(this.nextEvents);
21+
let event: FrontendEvent = (<FrontendEvent> this.nextEvents.shift());
2222
event.next();
23-
console.log(event.next());
2423
this.previousEvents.push(event);
2524
if (event.duration == 0)
2625
this.next();
2726
}
2827

2928
// Executing the previous event
3029
previous() {
30+
this.pause();
3131
if (this.previousEvents.length == 0)
3232
return;
33-
var event = this.previousEvents.pop();
34-
this.delayTime = 0; //TODO: Should there be a delay when stepping backwards?
33+
let event: FrontendEvent = (<FrontendEvent> this.previousEvents.pop());
34+
//this.delayTime = 500; //this line set to 0 caused: when resuming all animations are played out. Intention Delay when stepping backwards.
3535
event.previous();
3636
this.nextEvents.unshift(event);
3737
}
3838

39-
addEvent(event) {
39+
addEvent(event: FrontendEvent) {
4040
this.nextEvents.push(event);
4141
}
4242

4343
start() {
44-
clearInterval(this.eventThread);
45-
var manager = this; // Anonymous functions cannot access this...
44+
let manager = this; // Anonymous functions cannot access this...
45+
this.paused = false;
4646
this.eventThread = setInterval(function () {
4747
manager.next();
4848
}, manager.delayTime);
4949
}
5050

5151
pause() {
52+
this.paused = true;
5253
clearInterval(this.eventThread);
5354
}
5455
}
5556

5657
class FrontendEvent {
57-
next;
58-
previous;
58+
next: Function;
59+
previous: Function;
5960
duration: number;
6061

61-
constructor(n, p, d: number) {
62+
constructor(n: Function, p: Function, d: number) {
6263
this.next = n;
6364
this.previous = p;
6465
this.duration = d;
6566
}
6667
}
6768

68-
var manager: eventManager = new eventManager();
69+
let manager: eventManager = new eventManager();
6970

7071
/*
7172
/** How to add FrontendEvents to manager

0 commit comments

Comments
 (0)