@jamesrock/rockjs 1.9.0 → 1.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.js +100 -46
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -74,13 +74,43 @@ export const createSelect = (options) => {
|
|
|
74
74
|
return node;
|
|
75
75
|
};
|
|
76
76
|
|
|
77
|
-
const createOption = (label = '{label}', value = 0) => {
|
|
77
|
+
export const createOption = (label = '{label}', value = 0) => {
|
|
78
78
|
const node = createNode('option');
|
|
79
79
|
node.innerText = label;
|
|
80
80
|
node.value = value;
|
|
81
81
|
return node;
|
|
82
82
|
};
|
|
83
83
|
|
|
84
|
+
export const createHeading = (level = 1, label = '{label}') => {
|
|
85
|
+
const node = createNode(`h${level}`);
|
|
86
|
+
node.innerText = label;
|
|
87
|
+
return node;
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
export const makeBitArray = (size) => {
|
|
91
|
+
let bob = 2**size;
|
|
92
|
+
return makeArray(size, () => {
|
|
93
|
+
bob = bob/2;
|
|
94
|
+
return bob;
|
|
95
|
+
});
|
|
96
|
+
};
|
|
97
|
+
|
|
98
|
+
export const makeHexMap = (full = true) => {
|
|
99
|
+
const out = [];
|
|
100
|
+
const hexMap = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];
|
|
101
|
+
if(full) {
|
|
102
|
+
makeArray(hexMap.length).forEach((x) => {
|
|
103
|
+
makeArray(hexMap.length).forEach((y) => {
|
|
104
|
+
out.push(`${hexMap[x]}${hexMap[y]}`);
|
|
105
|
+
});
|
|
106
|
+
});
|
|
107
|
+
}
|
|
108
|
+
else {
|
|
109
|
+
return hexMap;
|
|
110
|
+
};
|
|
111
|
+
return out;
|
|
112
|
+
};
|
|
113
|
+
|
|
84
114
|
export class Storage {
|
|
85
115
|
constructor(namespace) {
|
|
86
116
|
|
|
@@ -235,59 +265,39 @@ export class GameBase extends DisplayObject {
|
|
|
235
265
|
};
|
|
236
266
|
|
|
237
267
|
export class BrickMaker extends DisplayObject {
|
|
238
|
-
constructor(
|
|
268
|
+
constructor({
|
|
269
|
+
size = 4,
|
|
270
|
+
type = 'digits',
|
|
271
|
+
color = 'red',
|
|
272
|
+
scale = 30,
|
|
273
|
+
gap = 1
|
|
274
|
+
} = {}) {
|
|
239
275
|
|
|
240
276
|
super();
|
|
241
277
|
|
|
242
278
|
this.color = color;
|
|
243
279
|
this.size = size;
|
|
280
|
+
this.scale = scale;
|
|
244
281
|
this.type = type;
|
|
282
|
+
this.gap = gap;
|
|
283
|
+
this.hexMap = size*size > 16 ? makeHexMap() : makeHexMap(false);
|
|
284
|
+
this.typeValues = {
|
|
285
|
+
'digits': makeArray(size*size, () => 1),
|
|
286
|
+
'binary': makeBitArray(size)
|
|
287
|
+
};
|
|
245
288
|
|
|
246
289
|
const node = this.node = createNode('div', 'brick-maker');
|
|
247
|
-
const
|
|
248
|
-
|
|
249
|
-
const bits = [];
|
|
250
|
-
const hexMap = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];
|
|
251
|
-
|
|
252
|
-
const calculate = () => {
|
|
253
|
-
let total = null;
|
|
254
|
-
switch(this.type) {
|
|
255
|
-
case 'digits':
|
|
256
|
-
total = makeArray(size*size, () => 0);
|
|
257
|
-
bits.forEach((bit, i) => {
|
|
258
|
-
if(bit.dataset.active==='Y') {
|
|
259
|
-
total[i] = Number(bit.dataset.value);
|
|
260
|
-
};
|
|
261
|
-
});
|
|
262
|
-
this.value = JSON.stringify(total);
|
|
263
|
-
break;
|
|
264
|
-
case 'binary':
|
|
265
|
-
total = makeArray(size, () => 0);
|
|
266
|
-
makeArray(size).forEach((y) => {
|
|
267
|
-
bits.filter((bit) => bit.dataset.y == y).forEach((bit) => {
|
|
268
|
-
if(bit.dataset.active==='Y') {
|
|
269
|
-
total[y] += Number(bit.dataset.value);
|
|
270
|
-
};
|
|
271
|
-
});
|
|
272
|
-
total[y] = hexMap[total[y]];
|
|
273
|
-
});
|
|
274
|
-
this.value = `0x${total.join('')}`;
|
|
275
|
-
break;
|
|
276
|
-
};
|
|
277
|
-
this.dispatchEvent('result');
|
|
278
|
-
};
|
|
279
|
-
|
|
290
|
+
const bits = this.bits = [];
|
|
291
|
+
|
|
280
292
|
node.style.setProperty('--color', this.color);
|
|
281
|
-
|
|
282
|
-
node.style.width = node.style.height = `${bob*size + (gap*(size-1))}px`;
|
|
293
|
+
node.style.width = node.style.height = `${scale*size + (gap*(size-1))}px`;
|
|
283
294
|
node.style.gap = `${gap}px`;
|
|
284
295
|
|
|
285
296
|
makeArray(size).forEach((y) => {
|
|
286
297
|
makeArray(size).forEach((x) => {
|
|
287
298
|
|
|
288
299
|
const bit = createNode('div', 'brick-maker-bit');
|
|
289
|
-
|
|
290
|
-
bit.style.width = bit.style.height = `${bob}px`;
|
|
300
|
+
bit.style.width = bit.style.height = `${scale}px`;
|
|
291
301
|
bit.dataset.x = x;
|
|
292
302
|
bit.dataset.y = y;
|
|
293
303
|
bit.dataset.value = this.typeValues[this.type][x];
|
|
@@ -297,18 +307,62 @@ export class BrickMaker extends DisplayObject {
|
|
|
297
307
|
bits.push(bit);
|
|
298
308
|
|
|
299
309
|
bit.addEventListener('click', () => {
|
|
300
|
-
active =
|
|
301
|
-
|
|
302
|
-
calculate();
|
|
310
|
+
bit.dataset.active = bit.dataset.active === 'Y' ? 'N' : 'Y';
|
|
311
|
+
this.calculate();
|
|
303
312
|
});
|
|
304
313
|
|
|
305
314
|
});
|
|
306
315
|
});
|
|
307
316
|
|
|
308
317
|
};
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
318
|
+
calculate() {
|
|
319
|
+
|
|
320
|
+
let total = null;
|
|
321
|
+
switch(this.type) {
|
|
322
|
+
case 'digits':
|
|
323
|
+
total = makeArray(this.size*this.size, () => 0);
|
|
324
|
+
this.bits.forEach((bit, i) => {
|
|
325
|
+
if(bit.dataset.active==='Y') {
|
|
326
|
+
total[i] = Number(bit.dataset.value);
|
|
327
|
+
};
|
|
328
|
+
});
|
|
329
|
+
this.value = JSON.stringify(total);
|
|
330
|
+
break;
|
|
331
|
+
case 'binary':
|
|
332
|
+
total = makeArray(this.size, () => 0);
|
|
333
|
+
makeArray(this.size).forEach((y) => {
|
|
334
|
+
this.bits.filter((bit) => bit.dataset.y == y).forEach((bit) => {
|
|
335
|
+
if(bit.dataset.active==='Y') {
|
|
336
|
+
total[y] += Number(bit.dataset.value);
|
|
337
|
+
};
|
|
338
|
+
});
|
|
339
|
+
total[y] = this.hexMap[total[y]];
|
|
340
|
+
});
|
|
341
|
+
this.value = `0x${total.join('')}`;
|
|
342
|
+
break;
|
|
343
|
+
};
|
|
344
|
+
this.dispatchEvent('result');
|
|
345
|
+
|
|
346
|
+
};
|
|
347
|
+
invert() {
|
|
348
|
+
|
|
349
|
+
this.bits.forEach((bit) => {
|
|
350
|
+
bit.dataset.active = bit.dataset.active === 'Y' ? 'N' : 'Y';
|
|
351
|
+
});
|
|
352
|
+
this.calculate();
|
|
353
|
+
|
|
354
|
+
return this;
|
|
355
|
+
|
|
356
|
+
};
|
|
357
|
+
randomise() {
|
|
358
|
+
|
|
359
|
+
this.bits.forEach((bit) => {
|
|
360
|
+
bit.dataset.active = getRandom(['Y', 'N']);
|
|
361
|
+
});
|
|
362
|
+
this.calculate();
|
|
363
|
+
|
|
364
|
+
return this;
|
|
365
|
+
|
|
312
366
|
};
|
|
313
367
|
value = null;
|
|
314
|
-
};
|
|
368
|
+
};
|