Skip to content

Commit 6390d91

Browse files
author
Kenneth Apeland
committed
MS: ferdig med; Backwards, fikse array knapper, flytte hele sub array, sette farge på nodene, og kollisjon
1 parent 89e5fc5 commit 6390d91

File tree

11 files changed

+238
-150
lines changed

11 files changed

+238
-150
lines changed

MergeSort/MergeSort.html

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,6 @@
77
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
88
<link href="css/style.css" rel="stylesheet">
99

10-
<!-- Insert this line above script imports -->
11-
<script>if (typeof module === 'object') {
12-
window.module = module;
13-
module = undefined;
14-
}</script>
15-
1610
<script src="js/jquery.min.js"></script>
1711
<script src="js/jquery-ui-1.12.0/jquery-ui.min.js"></script>
1812
<script src="js/bootstrap.min.js"></script>
@@ -22,19 +16,11 @@
2216
<script src="js/MergeSortAlgorithm.js"></script>
2317
<script src="js/EventManager.js"></script>
2418
<script src="js/InitArray.js"></script>
25-
26-
<!-- For debugging -->
27-
<!-- <script type='text/js' src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script> -->
28-
29-
<!-- Insert this line after script imports -->
30-
<script>if (window.module) module = window.module;</script>
31-
;
3219
</head>
3320

3421

3522
<body>
3623
<div class="container text-center">
37-
<img id="paused" class="pauseIcon" src="assets/pause.png"/>
3824
<h1 id="header">MergeSort</h1>
3925
<div id="array" class="row insertionSort">
4026
<div id="indices"></div>
@@ -57,7 +43,6 @@ <h1 id="header">MergeSort</h1>
5743
<br>
5844

5945
<div class="row">
60-
<!-- TODO: Play if paused -->
6146
<button id="random" class="btn btn-primary" onclick="getArray('random')">Random</button>
6247
<button id="almost" class="btn btn-primary" onclick="getArray('almostSorted')">Almost Sorted</button>
6348
<button id="sorted" class="btn btn-primary" onclick="getArray('sorted')">Sorted</button>

MergeSort/js/EventManager.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ var eventManager = /** @class */ (function () {
2222
};
2323
// Executing the previous event
2424
eventManager.prototype.previous = function () {
25+
this.pause();
2526
if (this.previousEvents.length == 0)
2627
return;
2728
var event = this.previousEvents.pop();

MergeSort/js/EventManager.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ class eventManager {
1717
if (this.nextEvents.length == 0) {
1818
return;
1919
}
20-
var event: FrontendEvent = (<FrontendEvent> this.nextEvents.shift());
20+
let event: FrontendEvent = (<FrontendEvent> this.nextEvents.shift());
2121
event.next();
2222
this.previousEvents.push(event);
2323
if (event.duration == 0)
@@ -26,9 +26,10 @@ class eventManager {
2626

2727
// Executing the previous event
2828
previous() {
29+
this.pause();
2930
if (this.previousEvents.length == 0)
3031
return;
31-
var event: FrontendEvent = (<FrontendEvent> this.previousEvents.pop());
32+
let event: FrontendEvent = (<FrontendEvent> this.previousEvents.pop());
3233
//this.delayTime = 500; //this line set to 0 caused: when resuming all animations are played out. Intention Delay when stepping backwards.
3334
event.previous();
3435
this.nextEvents.unshift(event);
@@ -39,7 +40,7 @@ class eventManager {
3940
}
4041

4142
start() {
42-
var manager = this; // Anonymous functions cannot access this...
43+
let manager = this; // Anonymous functions cannot access this...
4344
this.eventThread = setInterval(function () {
4445
manager.next();
4546
}, manager.delayTime);
@@ -50,7 +51,7 @@ class eventManager {
5051
}
5152

5253
unpause() {
53-
var manager = this;
54+
let manager = this;
5455
this.eventThread = setInterval(function () {
5556
manager.next();
5657
}, manager.delayTime);
@@ -75,7 +76,7 @@ class FrontendEvent {
7576
}
7677
}
7778

78-
var manager: eventManager = new eventManager();
79+
let manager: eventManager = new eventManager();
7980

8081
/*
8182
/** How to add FrontendEvents to manager

MergeSort/js/InitArray.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,7 @@ function returnArray() {
5050
function getArray(ran) {
5151
// Setting Random array
5252
if (ran === "random") {
53-
//array = setRandomMyArray();
54-
array = [4, 1, 10, 7, 3, 5, 20, 15, 2, 21];
53+
array = setRandomMyArray();
5554
}
5655
else if (ran === "sorted") {
5756
array = setSortedArray();

MergeSort/js/InitArray.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,8 +65,7 @@ function returnArray() {
6565
function getArray(ran:string) {
6666
// Setting Random array
6767
if (ran === "random") {
68-
//array = setRandomMyArray();
69-
array = [4, 1, 10, 7, 3, 5, 20, 15, 2, 21];
68+
array = setRandomMyArray();
7069
}
7170
else if (ran === "sorted") {
7271
array = setSortedArray();

MergeSort/js/MergeSortAlgorithm.js

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -29,13 +29,13 @@ function mergesort(array) {
2929
mid = Math.floor(array.length * 0.5);
3030
//viewer.setPivotElement(copyArray.indexOf(array[mid - 1]));
3131
left = array.slice(0, mid);
32-
for (var i = 0; i < left.length; i++) {
33-
viewer.lowerElement(left[i]);
34-
}
32+
viewer.highlightNodes(left);
33+
viewer.lowerElements(left);
34+
viewer.deHighlightNodes(left);
3535
right = array.slice(mid);
36-
for (var i = 0; i < right.length; i++) {
37-
viewer.lowerElement(right[i]);
38-
}
36+
viewer.highlightNodes(right);
37+
viewer.lowerElements(right);
38+
viewer.deHighlightNodes(right);
3939
//Split until there is only 1 element left
4040
return merge(mergesort(left), mergesort(right));
4141
}
@@ -48,17 +48,19 @@ function merge(left, right) {
4848
var counter = copyArray.indexOf(left[0]);
4949
while (tempLeftIndex < left.length && tempRightIndex < right.length) {
5050
//Compare the elements from each array
51-
//viewer.highLightNode(tempLeftIndex)
52-
//viewer.highLightNode(tempRightIndex)
51+
viewer.highlightNode(left[tempLeftIndex]);
52+
viewer.highlightNode(right[tempRightIndex]);
5353
if (left[tempLeftIndex] < right[tempRightIndex]) {
54-
viewer.moveElementToPlace(left[tempLeftIndex], counter * 85);
54+
viewer.moveElementToPlace(left[tempLeftIndex], counter, copyArray.indexOf(left[tempLeftIndex]));
55+
viewer.deHighlightNode(left[tempLeftIndex]);
5556
result.push(left[tempLeftIndex]);
5657
testing[counter] = left[tempLeftIndex];
5758
counter++;
5859
tempLeftIndex++;
5960
}
6061
else {
61-
viewer.moveElementToPlace(right[tempRightIndex], counter * 85);
62+
viewer.moveElementToPlace(right[tempRightIndex], counter, copyArray.indexOf(right[tempRightIndex]));
63+
viewer.deHighlightNode(right[tempRightIndex]);
6264
result.push(right[tempRightIndex]);
6365
testing[counter] = right[tempRightIndex];
6466
counter++;
@@ -67,16 +69,20 @@ function merge(left, right) {
6769
}
6870
if (right.slice(tempRightIndex).length > 0) {
6971
var moreRight = right.slice(tempRightIndex);
72+
viewer.highlightNodes(moreRight);
7073
for (var i = 0; i < moreRight.length; i++) {
71-
viewer.moveElementToPlace(moreRight[i], counter * 85);
74+
viewer.moveElementToPlace(moreRight[i], counter, copyArray.indexOf(moreRight[i]));
75+
viewer.deHighlightNode(moreRight[i]);
7276
testing[counter] = moreRight[i];
7377
counter++;
7478
}
7579
}
7680
if (left.slice(tempLeftIndex).length > 0) {
7781
var moreLeft = left.slice(tempLeftIndex);
82+
viewer.highlightNodes(moreLeft);
7883
for (var i = 0; i < moreLeft.length; i++) {
79-
viewer.moveElementToPlace(moreLeft[i], counter * 85);
84+
viewer.moveElementToPlace(moreLeft[i], counter, copyArray.indexOf(moreLeft[i]));
85+
viewer.deHighlightNode(moreLeft[i]);
8086
testing[counter] = moreLeft[i];
8187
counter++;
8288
}

MergeSort/js/MergeSortAlgorithm.ts

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -38,21 +38,20 @@ function mergesort(array: number[]) {
3838
//viewer.setPivotElement(copyArray.indexOf(array[mid - 1]));
3939

4040
left = array.slice(0, mid);
41-
for (let i = 0; i < left.length; i++) {
42-
viewer.lowerElement(left[i]);
43-
}
41+
viewer.highlightNodes(left);
42+
viewer.lowerElements(left);
43+
viewer.deHighlightNodes(left);
4444

4545
right = array.slice(mid);
46-
for (let i = 0; i < right.length; i++) {
47-
viewer.lowerElement(right[i]);
48-
}
46+
viewer.highlightNodes(right);
47+
viewer.lowerElements(right);
48+
viewer.deHighlightNodes(right);
4949

5050
//Split until there is only 1 element left
5151
return merge(mergesort(left), mergesort(right));
5252
}
5353
}
5454

55-
5655
function merge(left: number[], right: number[]) {
5756
let result: number[] = [];
5857
let testing: number[] = copyArray.slice(0);
@@ -63,11 +62,12 @@ function merge(left: number[], right: number[]) {
6362

6463
while (tempLeftIndex < left.length && tempRightIndex < right.length) {
6564
//Compare the elements from each array
66-
//viewer.highLightNode(tempLeftIndex)
67-
//viewer.highLightNode(tempRightIndex)
65+
viewer.highlightNode(left[tempLeftIndex]);
66+
viewer.highlightNode(right[tempRightIndex]);
6867

6968
if (left[tempLeftIndex] < right[tempRightIndex]) {
70-
viewer.moveElementToPlace(left[tempLeftIndex], counter * 85);
69+
viewer.moveElementToPlace(left[tempLeftIndex], counter, copyArray.indexOf(left[tempLeftIndex]));
70+
viewer.deHighlightNode(left[tempLeftIndex]);
7171

7272
result.push(left[tempLeftIndex]);
7373
testing[counter] = left[tempLeftIndex];
@@ -76,8 +76,8 @@ function merge(left: number[], right: number[]) {
7676
tempLeftIndex++;
7777

7878
} else {
79-
viewer.moveElementToPlace(right[tempRightIndex], counter * 85);
80-
79+
viewer.moveElementToPlace(right[tempRightIndex], counter, copyArray.indexOf(right[tempRightIndex]));
80+
viewer.deHighlightNode(right[tempRightIndex]);
8181
result.push(right[tempRightIndex]);
8282
testing[counter] = right[tempRightIndex];
8383

@@ -88,17 +88,21 @@ function merge(left: number[], right: number[]) {
8888

8989
if (right.slice(tempRightIndex).length > 0) {
9090
let moreRight = right.slice(tempRightIndex);
91+
viewer.highlightNodes(moreRight);
9192
for (let i = 0; i < moreRight.length; i++) {
92-
viewer.moveElementToPlace(moreRight[i], counter * 85);
93+
viewer.moveElementToPlace(moreRight[i], counter, copyArray.indexOf(moreRight[i]));
94+
viewer.deHighlightNode(moreRight[i]);
9395

9496
testing[counter] = moreRight[i];
9597
counter++;
9698
}
9799
}
98100
if (left.slice(tempLeftIndex).length > 0) {
99101
let moreLeft = left.slice(tempLeftIndex);
102+
viewer.highlightNodes(moreLeft);
100103
for (let i = 0; i < moreLeft.length; i++) {
101-
viewer.moveElementToPlace(moreLeft[i], counter * 85);
104+
viewer.moveElementToPlace(moreLeft[i], counter, copyArray.indexOf(moreLeft[i]));
105+
viewer.deHighlightNode(moreLeft[i]);
102106

103107
testing[counter] = moreLeft[i];
104108
counter++;

MergeSort/js/Methods.js

Lines changed: 44 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,21 @@
11
///<reference path="InitArray.ts"/>
22
var insElemNr = "insElemNr";
33
var LEVEL_HEIGHT = 85;
4-
function lowerElement(element) {
5-
var newTop;
6-
var $elem = $("#" + insElemNr + element);
7-
newTop = parseInt($elem.css('top'), 10) + LEVEL_HEIGHT;
8-
$elem.animate({ top: newTop + "px" }, 500);
9-
}
10-
function liftElement(element) {
11-
var $elem = $("#" + insElemNr + element);
12-
if ($elem.offset().top > 170) {
13-
var newTop = parseInt($elem.css('top'), 10) - LEVEL_HEIGHT;
4+
function lowerElements(elements) {
5+
for (var i = 0; i < elements.length; i++) {
6+
var newTop;
7+
var $elem = $("#" + insElemNr + elements[i]);
8+
newTop = parseInt($elem.css('top'), 10) + LEVEL_HEIGHT;
149
$elem.animate({ top: newTop + "px" }, 500);
1510
}
1611
}
17-
function setPauseButtonText(n) {
18-
// console.log("PauseButtonText: " + n);
19-
}
20-
function togglePauseIcon(n) {
21-
if (n == 1) {
22-
$("#paused").addClass("hidden");
23-
}
24-
else {
25-
$("#paused").removeClass("hidden");
12+
function liftElements(elements) {
13+
for (var i = 0; i < elements.length; i++) {
14+
var $elem = $("#" + insElemNr + elements[i]);
15+
if ($elem.offset().top > 170) {
16+
var newTop = parseInt($elem.css('top'), 10) - LEVEL_HEIGHT;
17+
$elem.animate({ top: newTop + "px" }, 500);
18+
}
2619
}
2720
}
2821
function selectPivotElement(index) {
@@ -36,6 +29,16 @@ function highlightNode(index) {
3629
function deHighlightNode(index) {
3730
$("#insElemNr" + index).removeClass("highlightNode");
3831
}
32+
function highlightNodes(index) {
33+
for (var i = 0; i < index.length; i++) {
34+
$("#insElemNr" + index[i]).addClass("highlightNode");
35+
}
36+
}
37+
function deHighlightNodes(index) {
38+
for (var i = 0; i < index.length; i++) {
39+
$("#insElemNr" + index[i]).removeClass("highlightNode");
40+
}
41+
}
3942
function deselectPivotElement(index) {
4043
$("#insElemNr" + index).removeClass("pivot");
4144
$("#insElemNr" + index).children("p").remove();
@@ -44,6 +47,7 @@ function moveElementToPlace(element, px) {
4447
var $elem = $("#" + insElemNr + element);
4548
var moveLeft = $elem.css("left");
4649
var pos = (Number)(moveLeft.substring(0, moveLeft.length - 2));
50+
px = px * 85;
4751
if (pos > px) {
4852
if ($elem.offset().top > 170) {
4953
var newTop = parseInt($elem.css('top'), 10) - LEVEL_HEIGHT;
@@ -59,3 +63,24 @@ function moveElementToPlace(element, px) {
5963
}
6064
}
6165
}
66+
function moveElementBackToPlace(element, px) {
67+
console.log(px + " " + element);
68+
var $elem = $("#" + insElemNr + element);
69+
var moveLeft = $elem.css("left");
70+
var pos = (Number)(moveLeft.substring(0, moveLeft.length - 2));
71+
px = px * 85;
72+
if (pos > px) {
73+
if ($elem.offset().top > 170) {
74+
var newTop = parseInt($elem.css('top'), 10) + LEVEL_HEIGHT;
75+
$elem.animate({ top: newTop + "px" }, 500);
76+
}
77+
$elem.animate({ left: px + "px" }, 1000);
78+
}
79+
else {
80+
$elem.animate({ left: px + "px" }, 1000);
81+
if ($elem.offset().top > 170) {
82+
var newTop = parseInt($elem.css('top'), 10) + LEVEL_HEIGHT;
83+
$elem.animate({ top: newTop + "px" }, 500);
84+
}
85+
}
86+
}

0 commit comments

Comments
 (0)