hashify diff
38 removals
Words removed | 39 |
Total words | 1002 |
Words removed (%) | 3.89 |
296 lines
17 additions
Words added | 27 |
Total words | 990 |
Words added (%) | 2.73 |
277 lines
// we define a 'polyfill' BigInt so we can support Firefox 62 and above instead of 68+
// we define a 'polyfill' BigInt so we can support Firefox 62 and above instead of 68+
try {
try {
BigInt(1);
BigInt(1);
Remainder = (a, b) => { return a % b };
Remainder = (a, b) => { return a % b };
Add = (a, b) => { return a + b };
Add = (a, b) => { return a + b };
} catch (e) {
} catch (e) {
BigInt = JSBI.BigInt;
BigInt = JSBI.BigInt;
Remainder = JSBI.remainder;
Remainder = JSBI.remainder;
Add = JSBI.ADD;
Add = JSBI.ADD;
}
}
const COLORS = {
const COLORS = {
white: '#ffffff',
white: '#ffffff',
black: '#000000',
black: '#000000',
green: '#49F2CC',
green: '#49F2CC',
lightGrey: '#ddd',
lightGrey: '#ddd',
grey: '#29363B',
grey: '#29363B',
cyan: 'cyan',
cyan: 'cyan',
yellow: '#FFE202',
yellow: '#FFE202',
hotpink: 'deeppink',
hotpink: 'deeppink',
};
};
function getChar(opts, char, x, y, randomOpts = {}) {
function getChar(opts, char, x, y, randomOpts = {}) {
var char_shape = new mojs.Shape({
var char_shape = new mojs.Shape({
...opts,
...opts,
...getStdOpts(char, opts.baseCharSize),
...getStdOpts(char, opts.baseCharSize),
x: x,
x: x,
y: y,
y: y,
...randomOpts,
...randomOpts,
});
});
return char_shape;
return char_shape;
}
}
function getText(text, x, y, baseOptions) {
function getText(text, x, y, baseOptions) {
let charSize = baseOptions.baseCharSize;
let charSize = baseOptions.baseCharSize;
let opts = { ...baseOptions };
let opts = { ...baseOptions };
xStep = opts.xTxtSpacing;
xStep = opts.xTxtSpacing;
shapes = [];
shapes = [];
cX = x;
cX = x;
chars = text.split('');
chars = text.split('');
for (c of chars) {
for (c of chars) {
if (c === ' ') {
if (c === ' ') {
cX += xStep;
cX += xStep;
continue;
continue;
}
}
opts.radius = charSize;
opts.radius = charSize;
var rdnOpts = {}
var rdnOpts = {}
if (opts.animate) {
if (opts.animate) {
rdnOpts.radius = {};
rdnOpts.radius = {};
rdnOpts.radius[charSize] = charSize * 1.1; // {charSize: charSize*1.1}
rdnOpts.radius[charSize] = charSize * 1.1; // {charSize: charSize*1.1}
}
}
if (c <= 9 && c >= 0)
if (c <= 9 && c >= 0)
rdnOpts.fill = COLORS.white;
rdnOpts.fill = COLORS.white;
var cShape = getChar(opts, c, cX, y, rdnOpts)
var cShape = getChar(opts, c, cX, y, rdnOpts)
shapes = shapes.concat(cShape);
shapes = shapes.concat(cShape);
cX += xStep;
cX += xStep;
}
}
return shapes;
return shapes;
}
}
function addText(text, timeline, x, y, options) {
function addText(text, timeline, x, y, options) {
var shapes = getText(text, x, y, options);
var shapes = getText(text, x, y, options);
for (s of shapes)
for (s of shapes)
timeline.add(s);
timeline.add(s);
}
}
AVAILABLE_CHARS = ['B', 'C', 'D', 'E', 'F', 'G', 'H', 'J',
AVAILABLE_CHARS = ['B', 'C', 'D', 'E', 'F', 'G', 'H', 'J',
'K', 'L', 'M', 'N', 'O', 'P', 'R', 'S', 'T', 'U', 'V', 'W',
'K', 'L', 'M', 'N', 'O', 'P', 'R', 'S', 'T', 'U', 'V', 'W',
'X', 'Y', 'Z', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
'X', 'Y', 'Z', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
let defaultBaseCharSize = 25;
let defaultBaseCharSize = 20;
let defaultBaseIconSize = 50;
let defaultBaseIconSize = 40;
DEFAULT_OPTS = {
DEFAULT_OPTS = {
x: 0,
x: 0,
y: 0,
y: 0,
yTxtSpacing: 2.3 * defaultBaseCharSize,
yTxtSpacing: 2.3 * defaultBaseCharSize,
xTxtSpacing: 2.3 * defaultBaseCharSize,
xTxtSpacing: 2.3 * defaultBaseCharSize,
baseCharSize: defaultBaseCharSize,
baseCharSize: defaultBaseCharSize,
baseIconSize: defaultBaseIconSize,
baseIconSize: defaultBaseIconSize,
iconCharSpacing: 1 + Math.max(defaultBaseIconSize, defaultBaseCharSize) - Math.min(defaultBaseIconSize, defaultBaseCharSize),
iconCharSpacing: 1 + Math.max(defaultBaseIconSize, defaultBaseCharSize) - Math.min(defaultBaseIconSize, defaultBaseCharSize),
yIconSpacing: 2.3 * defaultBaseIconSize,
yIconSpacing: 2.3 * defaultBaseIconSize,
xIconSpacing: 2.3 * defaultBaseIconSize,
xIconSpacing: 2.3 * defaultBaseIconSize,
icon_generators: ICON_GENERATORS,
icon_generators: ICON_GENERATORS,
extraNumbersGenerated: 16,
extraNumbersGenerated: 16,
masks: {
masks: {
animate: true,
animate: true,
thinLine: false,
thinLine: false,
movingLine: true
movingLine: true
}
}
}
}
class hashify {
class hashify {
constructor(generator) {
constructor(generator) {
this.generator = generator();
this.generator = generator();
}
}
/**
/**
* Defines an object with a hashing generator. Example: hashify.seed("1212")
* Defines an object with a hashing generator. Example: hashify.seed("1212")
* @param {string} hash Hex string of the starting hash
* @param {string} hash Hex string of the starting hash
* @param {string} salt Text of the salt
* @param {string} salt Text of the salt
* @param {string} hashalg SHA variant. Valid options: "SHA-1", "SHA-256", "SHA-512"
* @param {string} hashalg SHA variant. Valid options: "SHA-1", "SHA-256", "SHA-512"
*/
*/
static seed(hash, salt = "", hashalg = "SHA-256") {
static seed(hash, salt = "", hashAlgorithm = "SHA-256", hashFormat = "HEX", saltFormat = "TEXT") {
var sha_gen = function* () {
const shaGenerator = function* () {
var saltHasher = new jsSHA(
const saltHasher = new jsSHA(hashAlgorithm, saltFormat);
hashalg,
"TEXT"
);
saltHasher.update(salt);
saltHasher.update(salt);
let saltHex = saltHasher.getHash("HEX");
const saltHex = saltHasher.getHash("HEX");
let hashObject;
var hashObj = new jsSHA(
let currentState = hash;
hashalg,
"HEX"
);
// we set the initial state
//hashObj.update(hash);
let current_state = hash;
while (true) {
while (true) {
var hashObj = new jsSHA(
hashObject = new jsSHA(hashAlgorithm, hashFormat);
hashalg,
hashObject.update(currentState + saltHex);
"HEX"
currentState = hashObject.getHash("HEX");
);
yield BigInt("0x" + currentState);
hashObj.update(current_state + saltHex);
current_state = hashObj.getHash("HEX");
yield BigInt("0x" + current_state);
}
}
}
}
return new hashify(shaGenerator);
return new hashify(sha_gen);
}
}
/**
/**
* Generates an object with a custom generator. Example: hashify.custom([1,2,3])
* Generates an object with a custom generator. Example: hashify.custom([1,2,3])
* @param {Array} custom_values Array of integers or BigIntegers
* @param {Array} custom_values Array of integers or BigIntegers
* @param {boolean} cycle If true, repeat the values upon reaching the end
* @param {boolean} cycle If true, repeat the values upon reaching the end
*/
*/
static custom(custom_values, cycle = true) {
static custom(custom_values, cycle = true) {
var custom_gen = function* () {
var custom_gen = function* () {
var internal_vals = custom_values;
var internal_vals = custom_values;
let i = 0;
let i = 0;
while (i < internal_vals.length) {
while (i < internal_vals.length) {
yield internal_vals[i];
yield internal_vals[i];
i++;
i++;
if (i >= internal_vals.length) {
if (i >= internal_vals.length) {
if (cycle)
if (cycle)
i = 0;
i = 0;
else
else
return;
return;
}
}
}
}
}
}
return new hashify(custom_gen);
return new hashify(custom_gen);
}
}
/**
/**
* Generates an animations in the parent element
* Generates an animations in the parent element
* @param {Array} letters_grid Define the size grid of letters
* @param {Array} letters_grid Define the size grid of letters
* @param {Array} images_grid Define the size of the grid of images
* @param {Array} images_grid Define the size of the grid of images
* @param {string} parent Id of parent element
* @param {string} parent Id of parent element
* @param {Object} options Customizable options, like position
* @param {Object} options Customizable options, like position
*/
*/
prepAnimation(parent, letters_grid = [1, 4], images_grid = [2, 2], options = DEFAULT_OPTS) {
prepAnimation(parent, letters_grid = [1, 4], images_grid = [2, 2], options = DEFAULT_OPTS) {
// Verifying that everything whe need is ok
// Verifying that everything whe need is ok
try {
try {
BigInt(1);
BigInt(1);
} catch (e) {
} catch (e) {
throw "BigInt support is needed";
throw "BigInt support is needed";
}
}
// We clean the element
// We clean the element
$(parent).empty();
$(parent).empty();
// We create a new timeline
// We create a new timeline
var timeline = this.getNewTimeline(options);
var timeline = this.getNewTimeline(options);
let availableIcons = Object.keys(options.icon_generators);
let availableIcons = Object.keys(options.icon_generators);
let optsWithParent = { ...options, parent: parent };
let optsWithParent = { ...options, parent: parent };
// We move the first icons back a bit, to better center the whole hash seal
// We move the first icons back a bit, to better center the whole hash seal
let deltaY = -1 * ((
let deltaY = -1 * ((
(letters_grid[0] - 1) * options.yTxtSpacing + options.baseCharSize +
(letters_grid[0] - 1) * options.yTxtSpacing + options.baseCharSize +
(images_grid[0] - 1) * options.yIconSpacing + options.baseIconSize +
(images_grid[0] - 1) * options.yIconSpacing + options.baseIconSize +
options.iconCharSpacing
options.iconCharSpacing
) / 2);
) / 2);
// Generating the letters
// Generating the letters
const availableCharsLength = BigInt(AVAILABLE_CHARS.length);
const availableCharsLength = BigInt(AVAILABLE_CHARS.length);
for (var i = 0; i < letters_grid[0]; i++) {
for (var i = 0; i < letters_grid[0]; i++) {
let deltaX = -1 * (letters_grid[1] - 1) * options.xTxtSpacing / 2; // center this char line
let deltaX = -1 * (letters_grid[1] - 1) * options.xTxtSpacing / 2; // center this char line
for (var j = 0; j < letters_grid[1]; j++) {
for (var j = 0; j < letters_grid[1]; j++) {
let n = Remainder(this.generator.next().value, availableCharsLength);
let n = Remainder(this.generator.next().value, availableCharsLength);
addText(AVAILABLE_CHARS[n], timeline, options.x + deltaX, options.y + deltaY,
addText(AVAILABLE_CHARS[n], timeline, options.x + deltaX, options.y + deltaY,
{
{
...optsWithParent,
...optsWithParent,
...this.getRandomLetterOptions(options.extraNumbersGenerated, options.masks)
...this.getRandomLetterOptions(options.extraNumbersGenerated, options.masks)
});
});
deltaX += options.xTxtSpacing;
deltaX += options.xTxtSpacing;
}
}
deltaY += options.yTxtSpacing;
deltaY += options.yTxtSpacing;
}
}
// There needs to be a bit of separation between the letters and icons
// There needs to be a bit of separation between the letters and icons
deltaY += options.iconCharSpacing;
deltaY += options.iconCharSpacing;
// Generating the icons
// Generating the icons
let availableIconsLength = BigInt(availableIcons.length);
let availableIconsLength = BigInt(availableIcons.length);
for (var i = 0; i < images_grid[0]; i++) {
for (var i = 0; i < images_grid[0]; i++) {
let deltaX = -1 * (images_grid[1] - 1) * options.xIconSpacing / 2; // center this icon line
let deltaX = -1 * (images_grid[1] - 1) * options.xIconSpacing / 2; // center this icon line
for (var j = 0; j < images_grid[1]; j++) {
for (var j = 0; j < images_grid[1]; j++) {
// Select a value from the generator and take the modulo of the available icons
// Select a value from the generator and take the modulo of the available icons
let n = Remainder(this.generator.next().value, availableIconsLength);
let n = Remainder(this.generator.next().value, availableIconsLength);
// Generate all "random" options
// Generate all "random" options
let rdn_opts = this.getRandomIconOptions(options.extraNumbersGenerated, options.masks);
let rdn_opts = this.getRandomIconOptions(options.extraNumbersGenerated, options.masks);
// Select the generator function
// Select the generator function
let icon_generator = options.icon_generators[availableIcons[n]];
let icon_generator = options.icon_generators[availableIcons[n]];
// Calling the function that creates the icon in the new position
// Calling the function that creates the icon in the new position
icon_generator(timeline, options.x + deltaX, options.y + deltaY,
icon_generator(timeline, options.x + deltaX, options.y + deltaY,
{ ...optsWithParent, ...rdn_opts });
{ ...optsWithParent, ...rdn_opts });
deltaX += options.xIconSpacing;
deltaX += options.xIconSpacing;
}
}
deltaY += options.yIconSpacing;
deltaY += options.yIconSpacing;
}
}
this.timeline = timeline;
this.timeline = timeline;
}
}
animate() {
animate() {
this.timeline.play();
this.timeline.play();
}
}
getRandomLetterOptions(generatorSpacing, masks) {
getRandomLetterOptions(generatorSpacing, masks) {
var rdnBaseNumbers = Array
var rdnBaseNumbers = Array
.from(Array(generatorSpacing))
.from(Array(generatorSpacing))
.map(() => this.generator.next().value);
.map(() => this.generator.next().value);
return {};
return {};
}
}
getRandomIconOptions(generatorSpacing, masks) {
getRandomIconOptions(generatorSpacing, masks) {
var rdnBaseNumbers = Array
var rdnBaseNumbers = Array
.from(Array(generatorSpacing))
.from(Array(generatorSpacing))
.map(() => this.generator.next().value);
.map(() => this.generator.next().value);
let animateBool = masks.animate && Remainder(rdnBaseNumbers[0], BigInt(2)) == 0;
let animateBool = masks.animate && Remainder(rdnBaseNumbers[0], BigInt(2)) == 0;
let thinLineBool = masks.thinLine && Remainder(rdnBaseNumbers[1], BigInt(2)) == 0;
let thinLineBool = masks.thinLine && Remainder(rdnBaseNumbers[1], BigInt(2)) == 0;
let movingLineBool = masks.movingLine && Remainder(rdnBaseNumbers[2], BigInt(2)) == 0;
let movingLineBool = masks.movingLine && Remainder(rdnBaseNumbers[2], BigInt(2)) == 0;
let dashArrayOffset = masks.movingLine && Add(Remainder(rdnBaseNumbers[2], BigInt(100)), BigInt(100));
let dashArrayOffset = masks.movingLine && Add(Remainder(rdnBaseNumbers[2], BigInt(100)), BigInt(100));
let rdn_opts = {
let rdn_opts = {
animate: animateBool, thinLine: thinLineBool,
animate: animateBool, thinLine: thinLineBool,
movingLine: movingLineBool, customDashArrayOffset: dashArrayOffset
movingLine: movingLineBool, customDashArrayOffset: dashArrayOffset
};
};
return rdn_opts;
return rdn_opts;
}
}
getNewTimeline(options) {
getNewTimeline(options) {
if (options.loop == 0) {
if (options.loop == 0) {
var timeline = new mojs.Timeline({
var timeline = new mojs.Timeline({
onComplete() {
onComplete() {
this.replay(0); // create an infinite loop
this.replay(0); // create an infinite loop
}
}
});
});
}
}
else {
else {
var timeline = new mojs.Timeline();
var timeline = new mojs.Timeline();
}
}
return timeline;
return timeline;
}
}
}
}
//a = hashify.seed("121213").animate("#svgDiv", letters_grid = [2, 5], images_grid = [5, 5]);
//a = hashify.seed("121213").animate("#svgDiv", letters_grid = [2, 5], images_grid = [5, 5]);
//a = hashify.seed("121213").animate("#svgDiv");
//a = hashify.seed("121213").animate("#svgDiv");