Skip to content

Commit 219e343

Browse files
64json64json
committed
improve coloring
1 parent bfb9c3d commit 219e343

File tree

7 files changed

+93
-109
lines changed

7 files changed

+93
-109
lines changed

‎algorithm/cryptography/affine_cipher/basic/code.js

+56-55
Original file line numberDiff line numberDiff line change
@@ -1,82 +1,83 @@
11
/*
2-
code assumes that plainText contains ONLY LOWER CASE ALPHABETS
3-
*/
2+
code assumes that plainText contains ONLY LOWER CASE ALPHABETS
3+
*/
44

55
Number.prototype.mod = function (n) {
6-
return ((this%n)+n)%n;
6+
return ((this % n) + n) % n;
77
};
88

99
var keys = {a: 5, b: 7},
10-
N = 26;
10+
N = 26;
1111

12-
function encrypt (plainText) {
13-
var cypherText = '';
14-
function cryptAlpha (alpha) {
15-
var index = alpha.charCodeAt (0) - 'a'.charCodeAt (0);
16-
var result = ((keys.a * index) + keys.b).mod (N);
12+
function encrypt(plainText) {
13+
var cypherText = '';
1714

18-
logger._print ('Index of ' + alpha + ' = ' + index);
15+
function cryptAlpha(alpha) {
16+
var index = alpha.charCodeAt(0) - 'a'.charCodeAt(0);
17+
var result = ((keys.a * index) + keys.b).mod(N);
1918

20-
result += 'a'.charCodeAt (0);
21-
return String.fromCharCode (result);
22-
}
19+
logger._print('Index of ' + alpha + ' = ' + index);
2320

24-
logger._print ('Beginning Affine Encryption');
25-
logger._print ('Encryption formula: <b>((keys.a * index_of_alphabet) + keys.b) % N</b>');
26-
logger._print ('keys.a=' + keys.a + ', keys.b=' + keys.b + ', N=' + N);
21+
result += 'a'.charCodeAt(0);
22+
return String.fromCharCode(result);
23+
}
2724

28-
for (var i in plainText) {
29-
ptTracer._select (i)._wait ();
30-
ptTracer._deselect (i)._wait ();
25+
logger._print('Beginning Affine Encryption');
26+
logger._print('Encryption formula: <b>((keys.a * index_of_alphabet) + keys.b) % N</b>');
27+
logger._print('keys.a=' + keys.a + ', keys.b=' + keys.b + ', N=' + N);
3128

32-
cypherText += cryptAlpha (plainText [i]);
29+
for (var i in plainText) {
30+
ptTracer._select(i)._wait();
31+
ptTracer._deselect(i);
3332

34-
ptTracer._notify (i, cypherText.slice (-1))._wait ();
35-
ptTracer._denotify (i)._wait ();
36-
}
33+
cypherText += cryptAlpha(plainText [i]);
3734

38-
return cypherText;
35+
ptTracer._notify(i, cypherText.slice(-1))._wait();
36+
ptTracer._denotify(i);
37+
}
38+
39+
return cypherText;
3940
}
4041

41-
function decrypt (cypherText) {
42-
var plainText = '';
43-
var aInverse = (function () {
44-
for (var i = 1; i < N; i++) {
45-
if ( ((keys.a * i).mod (N)) === 1 ) {
46-
return i;
47-
}
48-
}
49-
}) ();
42+
function decrypt(cypherText) {
43+
var plainText = '';
44+
var aInverse = (function () {
45+
for (var i = 1; i < N; i++) {
46+
if (((keys.a * i).mod(N)) === 1) {
47+
return i;
48+
}
49+
}
50+
})();
5051

51-
logger._print ('a<sup>-1</sup> = ' + aInverse);
52+
logger._print('a<sup>-1</sup> = ' + aInverse);
5253

53-
function decryptAlpha (alpha) {
54-
var index = alpha.charCodeAt (0) - 'a'.charCodeAt (0);
55-
var result = (aInverse * (index - keys.b)).mod (N);
54+
function decryptAlpha(alpha) {
55+
var index = alpha.charCodeAt(0) - 'a'.charCodeAt(0);
56+
var result = (aInverse * (index - keys.b)).mod(N);
5657

57-
logger._print ('Index of ' + alpha + ' = ' + index);
58+
logger._print('Index of ' + alpha + ' = ' + index);
5859

59-
result += 'a'.charCodeAt (0);
60-
return String.fromCharCode (result);
61-
}
60+
result += 'a'.charCodeAt(0);
61+
return String.fromCharCode(result);
62+
}
6263

63-
logger._print ('Beginning Affine Decryption');
64-
logger._print ('Decryption formula: <b>(a<sup>-1</sup> * (index - keys.b)) % N</b>');
65-
logger._print ('keys.b=' + keys.b + ', N=' + N);
64+
logger._print('Beginning Affine Decryption');
65+
logger._print('Decryption formula: <b>(a<sup>-1</sup> * (index - keys.b)) % N</b>');
66+
logger._print('keys.b=' + keys.b + ', N=' + N);
6667

67-
for (var i in cypherText) {
68-
ctTracer._select (i)._wait ();
69-
ctTracer._deselect (i)._wait ();
68+
for (var i in cypherText) {
69+
ctTracer._select(i)._wait();
70+
ctTracer._deselect(i)._wait();
7071

71-
plainText += decryptAlpha (cypherText [i]);
72+
plainText += decryptAlpha(cypherText [i]);
7273

73-
ctTracer._notify (i, plainText.slice (-1))._wait ();
74-
ctTracer._denotify (i)._wait ();
75-
}
74+
ctTracer._notify(i, plainText.slice(-1))._wait();
75+
ctTracer._denotify(i)._wait();
76+
}
7677

77-
return plainText;
78+
return plainText;
7879
}
7980

80-
var cipherText = encrypt (plainText);
81-
ctTracer._setData (cipherText);
82-
decrypt (cipherText);
81+
var cipherText = encrypt(plainText);
82+
ctTracer._setData(cipherText);
83+
decrypt(cipherText);

‎js/module/tracer/array2d.js

+8-16
Original file line numberDiff line numberDiff line change
@@ -14,16 +14,12 @@ class Array2DTracer extends Tracer {
1414
constructor(name) {
1515
super(name);
1616

17-
this.selectColor = '#2962ff';
18-
this.notifyColor = '#c51162';
19-
2017
if (this.isNew) initView(this);
2118
}
2219

2320
_notify(x, y, v) {
2421
this.manager.pushStep(this.capsule, {
2522
type: 'notify',
26-
color: this.notifyColor,
2723
x: x,
2824
y: y,
2925
v: v
@@ -145,8 +141,7 @@ class Array2DTracer extends Tracer {
145141
}
146142
}
147143
var step = {
148-
type: type,
149-
color: this.selectColor
144+
type: type
150145
};
151146
$.extend(step, coord);
152147
this.manager.pushStep(this.capsule, step);
@@ -163,8 +158,8 @@ class Array2DTracer extends Tracer {
163158
case 'denotify':
164159
case 'select':
165160
case 'deselect':
166-
var colorClass = step.color;
167-
var addClass = step.type == 'select' || step.type == 'notify';
161+
var color = step.type == 'select' || step.type == 'deselect' ? this.color.selected : this.color.notified;
162+
var paint = step.type == 'select' || step.type == 'notify';
168163
var sx = step.sx;
169164
var sy = step.sy;
170165
var ex = step.ex;
@@ -173,7 +168,7 @@ class Array2DTracer extends Tracer {
173168
if (sy === undefined) sy = step.y;
174169
if (ex === undefined) ex = step.x;
175170
if (ey === undefined) ey = step.y;
176-
this.paintColor(sx, sy, ex, ey, colorClass, addClass);
171+
this.paintColor(sx, sy, ex, ey, color, paint);
177172
break;
178173
case 'separate':
179174
this.deseparate(step.x, step.y);
@@ -292,22 +287,19 @@ class Array2DTracer extends Tracer {
292287
this.refresh();
293288
}
294289

295-
paintColor(sx, sy, ex, ey, colorClass, addClass) {
290+
paintColor(sx, sy, ex, ey, color, paint) {
296291
for (var i = sx; i <= ex; i++) {
297292
var $row = this.$table.find('.mtbl-row').eq(i);
298293
for (var j = sy; j <= ey; j++) {
299294
var $col = $row.find('.mtbl-col').eq(j);
300-
if(addClass) $col[0].style.backgroundColor = colorClass;
301-
else $col[0].style.backgroundColor = "";
295+
if (paint) $col.css('background', color);
296+
else $col.css('background', '');
302297
}
303298
}
304299
}
305300

306301
clearColor() {
307-
var divs = this.$table.find('.mtbl-col');
308-
for (var i = 0; i < divs.length; i++){
309-
divs[i].style.backgroundColor = "";
310-
}
302+
this.$table.find('.mtbl-col').css('background', '');
311303
}
312304

313305
separate(x, y) {

‎js/module/tracer/chart.js

+3-7
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,6 @@ class ChartTracer extends Tracer {
1010
constructor(name) {
1111
super(name);
1212

13-
this.selectColor = '#2962ff';
14-
this.notifyColor = '#c51162';
15-
this.defaultColor = 'rgb(136, 136, 136)';
16-
1713
if (this.isNew) initView(this);
1814
}
1915

@@ -25,7 +21,7 @@ class ChartTracer extends Tracer {
2521
}
2622

2723
var color = [];
28-
for (var i = 0; i < C.length; i++) color.push(this.defaultColor);
24+
for (var i = 0; i < C.length; i++) color.push(this.color.default);
2925
this.chart.config.data = {
3026
labels: C.map(String),
3127
datasets: [{
@@ -81,7 +77,7 @@ class ChartTracer extends Tracer {
8177
case 'denotify':
8278
case 'select':
8379
case 'deselect':
84-
let color = step.type == 'notify' ? this.notifyColor : step.type == 'select' ? this.selectColor : this.defaultColor;
80+
let color = step.type == 'notify' ? this.color.notified : step.type == 'select' ? this.color.selected : this.color.default;
8581
if (step.e !== undefined)
8682
for (var i = step.s; i <= step.e; i++)
8783
this.chart.config.data.datasets[0].backgroundColor[i] = color;
@@ -107,7 +103,7 @@ class ChartTracer extends Tracer {
107103
if (data.datasets.length) {
108104
const backgroundColor = data.datasets[0].backgroundColor;
109105
for (let i = 0; i < backgroundColor.length; i++) {
110-
backgroundColor[i] = this.defaultColor;
106+
backgroundColor[i] = this.color.default;
111107
}
112108
this.chart.update();
113109
}

‎js/module/tracer/coordinate_system.js

+2-4
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,7 @@ class CoordinateSystemTracer extends DirectedGraphTracer {
2525
x: C[i][0],
2626
y: C[i][1],
2727
label: '' + i,
28-
size: 1,
29-
color: this.defaultColor
28+
size: 1
3029
});
3130
this.graph.read({
3231
nodes: nodes,
@@ -49,7 +48,7 @@ class CoordinateSystemTracer extends DirectedGraphTracer {
4948
case 'leave':
5049
var visit = step.type == 'visit';
5150
var targetNode = this.graph.nodes(this.n(step.target));
52-
var color = visit ? this.visitedColor : this.leftColor;
51+
var color = visit ? this.color.visited : this.color.left;
5352
targetNode.color = color;
5453
if (step.source !== undefined) {
5554
var edgeId = this.e(step.source, step.target);
@@ -62,7 +61,6 @@ class CoordinateSystemTracer extends DirectedGraphTracer {
6261
id: this.e(step.target, step.source),
6362
source: this.n(step.source),
6463
target: this.n(step.target),
65-
color: color,
6664
size: 1
6765
});
6866
}

‎js/module/tracer/directed_graph.js

+6-11
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,6 @@ class DirectedGraphTracer extends Tracer {
1414
constructor(name) {
1515
super(name);
1616

17-
this.selectColor = '#2962ff';
18-
this.visitedColor = '#f50057';
19-
this.leftColor = '#616161';
20-
this.defaultColor = '#bdbdbd';
21-
2217
if (this.isNew) initView(this);
2318
}
2419

@@ -57,7 +52,7 @@ class DirectedGraphTracer extends Tracer {
5752
case 'leave':
5853
var visit = step.type == 'visit';
5954
var targetNode = this.graph.nodes(this.n(step.target));
60-
var color = visit ? this.visitedColor : this.leftColor;
55+
var color = visit ? this.color.visited : this.color.left;
6156
targetNode.color = color;
6257
if (step.source !== undefined) {
6358
var edgeId = this.e(step.source, step.target);
@@ -135,7 +130,7 @@ class DirectedGraphTracer extends Tracer {
135130
x: .5 + Math.sin(currentAngle) / 2,
136131
y: .5 + Math.cos(currentAngle) / 2,
137132
size: 1,
138-
color: this.defaultColor,
133+
color: this.color.default,
139134
weight: 0
140135
});
141136

@@ -147,7 +142,7 @@ class DirectedGraphTracer extends Tracer {
147142
id: this.e(i, j),
148143
source: this.n(i),
149144
target: this.n(j),
150-
color: this.defaultColor,
145+
color: this.color.default,
151146
size: 1,
152147
weight: refineByType(value)
153148
});
@@ -160,7 +155,7 @@ class DirectedGraphTracer extends Tracer {
160155
id: this.e(i, j),
161156
source: this.n(i),
162157
target: this.n(j),
163-
color: this.defaultColor,
158+
color: this.color.default,
164159
size: 1,
165160
weight: refineByType(G[i][j])
166161
});
@@ -208,10 +203,10 @@ class DirectedGraphTracer extends Tracer {
208203
var tracer = this;
209204

210205
this.graph.nodes().forEach(function (node) {
211-
node.color = tracer.defaultColor;
206+
node.color = tracer.color.default;
212207
});
213208
this.graph.edges().forEach(function (edge) {
214-
edge.color = tracer.defaultColor;
209+
edge.color = tracer.color.default;
215210
});
216211
}
217212

‎js/module/tracer/tracer.js

+17-15
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,13 @@ class Tracer {
1515
constructor(name) {
1616
this.module = this.constructor;
1717

18-
this.selectColor;
19-
this.notifyColor;
20-
this.defaultColor;
21-
this.leftColor;
22-
this.visitedColor;
18+
this.color = {
19+
selected: '#2962ff',
20+
notified: '#f50057',
21+
visited: '#f50057',
22+
left: '#616161',
23+
default: '#bdbdbd'
24+
};
2325

2426
this.manager = app.getTracerManager();
2527
this.capsule = this.manager.allocate(this);
@@ -48,24 +50,24 @@ class Tracer {
4850
return this;
4951
}
5052

51-
_setSelectFillColor(c) {
52-
this.selectColor = c;
53+
_setSelectedColor(c) {
54+
this.color.selected = c;
5355
}
5456

55-
_setNotifyFillColor(c) {
56-
this.notifyColor = c;
57+
_setNotifiedColor(c) {
58+
this.color.notified = c;
5759
}
5860

59-
_setDefaultFillColor(c){
60-
this.defaultColor = c;
61+
_setVisitedColor(c) {
62+
this.color.visited = c;
6163
}
6264

63-
_setLeftFillColor(c){
64-
this.leftColor = c;
65+
_setLeftColor(c) {
66+
this.color.left = c;
6567
}
6668

67-
_setVisitedFillColor(c){
68-
this.visitedColor = c;
69+
_setDefaultColor(c) {
70+
this.color.default = c;
6971
}
7072

7173
processStep(step, options) {

0 commit comments

Comments
 (0)