Skip to content

Commit e187686

Browse files
lee-naishlee-naish
committed
Colors for arrays improved + other bits
1 parent 40f5d6a commit e187686

File tree

20 files changed

+236
-143
lines changed

20 files changed

+236
-143
lines changed

‎src/algorithms/controllers/AStar.js‎

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -132,6 +132,7 @@ export default {
132132
vis.graph.weighted(true);
133133
vis.graph.moveNodeFn(moveNode);
134134
vis.graph.set(edgeArray, Array.from({ length: numVertices }, (v, k) => (k + 1)),coordsArray);
135+
vis.graph.setSize(0.7); // more room for arrays
135136
},
136137
[E, coords]
137138
);
@@ -155,18 +156,12 @@ export default {
155156
finalCosts.push(dashStr);
156157
}
157158

158-
// XXX would be nice to make the size of the table a bit smaller by
159-
// default, and a bit higher up. How to do it is a mystery to me.
160-
// vis.array.getRendererClass().zoom can be set but does nothing
161-
// but in src/components/DataStructures/Array/Array2DRenderer/index.js
162-
// you can change scale(${this.zoom}) to scale(0.8), for example,
163-
// but then you can't change the zoom (seems like this.zoom may be
164-
// null/undefined by default)
159+
// XXX fitting arrays is a bit of a squeeze
165160
chunker.add(
166161
5,
167162
(vis, v) => {
168163
vis.array.set(v, algNameStr);
169-
vis.array.setZoom(0.8);
164+
vis.array.setZoom(0.95);
170165
},
171166
[[nodes, heuristics, minCosts, parents, finalCosts], 0]
172167
);

‎src/algorithms/controllers/dijkstra.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,7 @@ export default {
117117
vis.graph.weighted(true);
118118
vis.graph.moveNodeFn(moveNode);
119119
vis.graph.set(edgeArray, Array.from({ length: numVertices }, (v, k) => (k + 1)),coordsArray);
120+
vis.graph.setSize(0.8); // more room for arrays
120121
},
121122
[E, coords]
122123
);

‎src/algorithms/controllers/graphSearchColours.js‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import {colors as globalColors} from '../../components/DataStructures/colors';
2+
13
// Colors for array (..._A), graph nodes (..._N), graph edges (..._E)
24
// for graph search/traversal algorithms (+ Prim's eventually)
35
//
@@ -9,16 +11,20 @@
911
// XXX not sure how this interacts with color perception options -
1012
// doesn't seem to work like this - should figure out how it's done if
1113
// it's still supported
14+
// Moving towars something less crazy. Arrays now accept integers (and
15+
// strings) plus we import some global color names; not consistent for graphs
16+
// yet.
1217
export const colors = {
13-
FRONTIER_A: '0', // Blue
18+
// FRONTIER_A: '0', // Blue
19+
FRONTIER_A: globalColors.sky,
1420
FRONTIER_N: 4, // Blue
1521
FRONTIER_E: 4, // Blue
16-
N_M_E: 2, // edge between n and m
17-
FINALISED_A: '1', // Green
22+
N_M_E: 3, // edge between n and m
23+
FINALISED_A: globalColors.leaf,
1824
FINALISED_N: 1, // Green
1925
FINALISED_E: 1,
20-
PQ_MIN_A: '1', // XXX poor color but setting colors is a mystery
26+
PQ_MIN_A: globalColors.peach,
2127
// if we find a path to end node:
22-
SUCCESS_A: '1', // Green
28+
SUCCESS_A: globalColors.leaf,
2329
SUCCESS_E: 3,
2430
}

‎src/algorithms/controllers/heapSort.js‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,15 @@
1616
//
1717
// One thing that could make the code here more readable is to use
1818
// meaningful strings for bookmarks rather than numbers.
19+
// The way colors are done could also be improved - currently moving to
20+
// a less insane scheme so there is some consistency between colors for
21+
// array elements and tree/graph nodes.
1922

2023
/* eslint-disable no-multi-spaces,indent,prefer-destructuring,brace-style */
2124
import GraphTracer from '../../components/DataStructures/Graph/GraphTracer';
2225
import ArrayTracer from '../../components/DataStructures/Array/Array1DTracer';
2326
import {areExpanded} from './collapseChunkPlugin';
27+
import {colors} from '../../components/DataStructures/colors';
2428

2529
// k displayed only if first BuildHeap is expanded
2630
// Note: This is only needed in the last chunk of BuildHeap. The code
@@ -83,21 +87,21 @@ export default {
8387
const highlight = (vis, index, primaryColor = true) => {
8488
if (primaryColor) {
8589
vis.heap.visit(index + 1);
86-
vis.array.select(index);
90+
vis.array.selectColor(index, colors.apple);
8791
} else {
8892
vis.heap.select(index + 1);
89-
vis.array.patch(index);
93+
vis.array.selectColor(index, colors.sky);
94+
// vis.array.patch(index);
9095
}
9196
};
9297

9398
const unhighlight = (vis, index, primaryColor = true) => {
9499
if (primaryColor) {
95100
vis.heap.leave(index + 1);
96-
vis.array.deselect(index);
97101
} else {
98102
vis.heap.deselect(index + 1);
99-
vis.array.depatch(index);
100103
}
104+
vis.array.deselect(index);
101105
};
102106

103107
const swapAction = (b, n1, n2) => {

‎src/algorithms/controllers/msort_arr_bup.js‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
import { msort_arr_bup } from '../explanations';
55
import ArrayTracer from '../../components/DataStructures/Array/Array1DTracer';
6+
import {colors} from '../../components/DataStructures/colors';
67

78

89
import {
@@ -23,11 +24,11 @@ import {
2324

2425
const run = run_msort();
2526

26-
const apColor = "green"; // replace with red
27-
const runAColor = "red"; // replace with orange
28-
const runBColor = "green"; // replace with blue
29-
const runCColor = "red"; // replace all instances of runCColor with runBColor
30-
const sortColor = "green";
27+
const apColor = colors.apple;
28+
const runAColor = colors.peach;
29+
const runBColor = colors.sky;
30+
const runCColor = colors.sky; // replace all instances of runCColor with runBColor
31+
const sortColor = colors.leaf;
3132

3233

3334
export default {
@@ -174,6 +175,7 @@ export function run_msort() {
174175
if (isMergeExpanded()) {
175176
assignVarToA(vis, 'left', undefined, size); // ap1 replaces left
176177
assignVarToA(vis, 'ap1', c_ap1, size);
178+
highlight(vis, c_ap1, apColor);
177179
assignVarToA(vis, 'mid', c_mid, size);
178180
assignVarToA(vis, 'right', c_right, size);
179181
}
@@ -187,6 +189,7 @@ export function run_msort() {
187189
chunker.add('ap2', (vis, c_ap2) => {
188190
if (isMergeExpanded()) {
189191
assignVarToA(vis, 'ap2', c_ap2, size);
192+
highlight(vis, c_ap2, apColor);
190193
}
191194
}, [ap2]);
192195
chunker.add('max2', (vis, c_max2, c) => {
@@ -204,16 +207,15 @@ export function run_msort() {
204207
// while (ap1 <= max1 && ap2 <= max2)
205208
/* eslint-disable no-constant-condition */
206209
while (true) {
207-
if (!(ap1 <= max1 && ap2 <= max2)) break;
208-
209210
chunker.add('MergeWhile', (vis, c_ap1, c_max1, c_ap2, c_max2) => {
210211
highlightAPointers(vis, c_ap1, c_max1, c_ap2, c_max2, apColor);
211212
}, [ap1, max1, ap2, max2]);
213+
if (!(ap1 <= max1 && ap2 <= max2)) break;
212214

215+
chunker.add('findSmaller', () => {
216+
// no animation
217+
}, []);
213218
if (A[ap1] < A[ap2]) {
214-
chunker.add('findSmaller', () => {
215-
// no animation
216-
}, []);
217219
B[bp] = A[ap1];
218220
A[ap1] = undefined;
219221
chunker.add('copyap1', (vis, a, b, c_ap1, c_max1, c_ap2, c_max2, c_bp, c_left, c_right, c_mid, c_rlength) => {
@@ -238,9 +240,9 @@ export function run_msort() {
238240
}
239241

240242
else {
241-
chunker.add('findSmallerB', () => {
243+
// chunker.add('findSmallerB', () => {
242244
// no animation
243-
}, []);
245+
// }, []);
244246
B[bp] = A[ap2];
245247
A[ap2] = undefined;
246248
chunker.add('copyap2', (vis, a, b, c_ap1, c_ap2, c_bp, c_max1, c_max2, c_left, c_right, c_mid, c_rlength) => {

‎src/algorithms/controllers/msort_arr_nat.js‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
import { msort_arr_nat } from '../explanations';
55
import ArrayTracer from '../../components/DataStructures/Array/Array1DTracer';
6+
import {colors} from '../../components/DataStructures/colors';
67

78
import {
89
isMergeCopyExpanded,
@@ -20,11 +21,11 @@ import {
2021

2122
const run = run_msort();
2223

23-
const apColor = "green"; // replace with red
24-
const runAColor = "red"; // replace with orange
25-
const runBColor = "green"; // replace with blue
26-
const runCColor = "red"; // replace all instances with runBColor
27-
const sortColor = "green";
24+
const apColor = colors.apple;
25+
const runAColor = colors.peach;
26+
const runBColor = colors.sky;
27+
const runCColor = colors.sky; // replace all instances of runCColor with runBColor
28+
const sortColor = colors.leaf;
2829

2930
export default {
3031
explanation: msort_arr_nat,
@@ -218,6 +219,7 @@ export function run_msort() {
218219
if (isMergeExpanded()) {
219220
assignVarToA(vis, 'left', undefined, size); // ap1 replaces left
220221
assignVarToA(vis, 'ap1', c_ap1, size);
222+
highlight(vis, c_ap1, apColor);
221223
}
222224
}, [ap1]);
223225
chunker.add('max1', (vis, c_max1) => {
@@ -229,6 +231,7 @@ export function run_msort() {
229231
chunker.add('ap2', (vis, c_ap2) => {
230232
if (isMergeExpanded()) {
231233
assignVarToA(vis, 'ap2', c_ap2, size);
234+
highlight(vis, c_ap2, apColor);
232235
}
233236
}, [ap2]);
234237
chunker.add('max2', (vis, c_max2) => {
@@ -247,16 +250,15 @@ export function run_msort() {
247250
// compare ap1 with ap2
248251
/* eslint-disable no-constant-condition */
249252
while (true) {
250-
if (!(ap1 <= max1 && ap2 <= max2)) break;
251-
252253
chunker.add('MergeWhile', (vis, c_ap1, c_max1, c_ap2, c_max2) => {
253254
highlightAPointers(vis, c_ap1, c_max1, c_ap2, c_max2, apColor);
254255
}, [ap1, max1, ap2, max2]);
256+
if (!(ap1 <= max1 && ap2 <= max2)) break;
255257

258+
chunker.add('findSmaller', () => {
259+
// no animation
260+
}, []);
256261
if (A[ap1] < A[ap2]) {
257-
chunker.add('findSmaller', () => {
258-
// no animation
259-
}, []);
260262
B[bp] = A[ap1];
261263
A[ap1] = undefined;
262264
chunker.add('copyap1', (vis, a, b, c_ap1, c_max1, c_ap2, c_max2, c_bp, c_left, c_right, c_mid, c_rcount) => {
@@ -283,9 +285,9 @@ export function run_msort() {
283285
}
284286

285287
else {
286-
chunker.add('findSmallerB', () => {
288+
// chunker.add('findSmallerB', () => {
287289
//no animation
288-
}, []);
290+
// }, []);
289291
B[bp] = A[ap2];
290292
A[ap2] = undefined;
291293
chunker.add('copyap2', (vis, a, b, c_ap1, c_ap2, c_bp, c_max1, c_max2, c_left, c_right, c_mid, c_rcount) => {

0 commit comments

Comments
 (0)