Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

glitched-writer

Package Overview
Dependencies
Maintainers
1
Versions
39
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

glitched-writer - npm Package Compare versions

Comparing version 2.0.26 to 2.0.27

30

lib/cjs/index.js

@@ -39,3 +39,3 @@ "use strict";

*/
constructor(htmlElement, options, onStepCallback, onFinishCallback) {
constructor(htmlElement, options, onFinishCallback) {
var _a;

@@ -57,3 +57,5 @@ this.charTable = [];

this.state = new state_1.default(this);
this.emiter = new emiter_1.default(this, onStepCallback, onFinishCallback);
this.emiter = new emiter_1.default(this);
if (onFinishCallback)
this.emiter.addCallback('finish', onFinishCallback);
this.animator = new animator_1.default(this);

@@ -125,2 +127,20 @@ this.string = this.previousString;

}
/**
* Use this to add callback to one of the writer events
*
* save callback in a variable first if you want to remove it later.
* @param type "start" | "step" | "finish"
* @param callback your callback function: (string, writerData) => {}
*/
addCallback(type, callback) {
this.emiter.addCallback(type, callback);
}
/**
* Use this to remove added callback
* @param type "start" | "step" | "finish"
* @param callback variable pointing to your function
*/
removeCallback(type, callback) {
this.emiter.removeCallback(type, callback);
}
// private logCharTable() {

@@ -255,5 +275,5 @@ // console.table(

*/
function glitchWrite(string, htmlElement, options, onStepCallback, onFinishCallback) {
function glitchWrite(string, htmlElement, options, onFinishCallback) {
return __awaiter(this, void 0, void 0, function* () {
const writer = new GlitchedWriter(htmlElement, options, onStepCallback, onFinishCallback);
const writer = new GlitchedWriter(htmlElement, options, onFinishCallback);
return writer.write(string);

@@ -271,3 +291,3 @@ });

*/
const create = (htmlElement, options, onStepCallback, onFinishCallback) => new GlitchedWriter(htmlElement, options, onStepCallback, onFinishCallback);
const create = (htmlElement, options, onFinishCallback) => new GlitchedWriter(htmlElement, options, onFinishCallback);
exports.create = create;

4

lib/cjs/modules/char.js

@@ -137,3 +137,3 @@ "use strict";

(_a = this.els) === null || _a === void 0 ? void 0 : _a.letterEl.classList.add('gw-glitched');
this.l = writer.options.genGhost(this);
this.l = writer.options.getGlyph(this);
}

@@ -151,3 +151,3 @@ }

addGhost() {
const { writer, ghosts } = this, l = writer.options.genGhost(this);
const { writer, ghosts } = this, l = writer.options.getGlyph(this);
writer.state.nGhosts++;

@@ -154,0 +154,0 @@ utils_1.coinFlip() ? insertGhost(ghosts[0], l) : insertGhost(ghosts[1], l);

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const utils_1 = require("../utils");
class default_1 {
constructor(writer, onStepCallback, onFinishCallback) {
this.onStepCallback = onStepCallback;
this.onFinishCallback = onFinishCallback;
class Emiter {
constructor(writer) {
this.callbacks = {
start: [],
step: [],
finish: [],
};
this.writer = writer;
}
addCallback(type, callback) {
this.callbacks[type].push(callback);
}
removeCallback(type, callback) {
const array = this.callbacks[type], i = array.indexOf(callback);
if (i === -1)
return false;
array.splice(i, 1);
return true;
}
callback(type, ...args) {
this.callbacks[type].forEach(cb => cb(...args));
}
call(eventType) {
var _a, _b;
const { writer } = this;

@@ -20,3 +35,3 @@ writer.updateString();

if (eventType === 'step')
return (_a = this.onStepCallback) === null || _a === void 0 ? void 0 : _a.call(this, string, writerData);
return this.callback('step', string, writerData);
// ON FINISH

@@ -27,3 +42,3 @@ writer.state.finish();

return;
(_b = this.onFinishCallback) === null || _b === void 0 ? void 0 : _b.call(this, string, writerData);
this.callback('finish', string, writerData);
this.emitEvent();

@@ -38,2 +53,2 @@ }

}
exports.default = default_1;
exports.default = Emiter;

@@ -55,6 +55,10 @@ "use strict";

}
genGhost(char) {
getGlyph(char) {
const { options } = this;
return options.genGlyph
? options.genGlyph(char, this.baseGetGlyph)
: this.baseGetGlyph();
}
baseGetGlyph() {
var _a;
if (this.options.genGlyph)
return this.options.genGlyph(char, this.writer);
return (_a = utils_1.getRandom(this.charset)) !== null && _a !== void 0 ? _a : '';

@@ -71,5 +75,8 @@ }

return options.genDelay
? options.genDelay(char, this.writer)
: utils_1.getRandomFromRange(options.delay);
? options.genDelay(char, this.baseGetDelay)
: this.baseGetDelay();
}
baseGetDelay() {
return utils_1.getRandomFromRange(this.options.delay);
}
get mode() {

@@ -76,0 +83,0 @@ return this.options.mode;

@@ -45,2 +45,3 @@ "use strict";

this.writer.animator.run();
this.writer.emiter.callback('start', this.writer.goalText, this.writer.writerData);
}

@@ -47,0 +48,0 @@ pause() {

@@ -113,2 +113,14 @@ "use strict";

},
cosmic: {
steps: [0, 1],
interval: 30,
delay: [400, 2400],
ghostChance: 0,
changeChance: 0.3,
maxGhosts: 0,
glyphs: 'QWERTYUIOPASDFGHJKLZXCVBNM',
glyphsFromText: false,
fillSpace: true,
mode: 'erase',
},
};

@@ -5,3 +5,3 @@ import Options from './modules/options';

import Emiter from './modules/emiter';
import { CustomOptions, WriterDataResponse, Callback, HTMLWriterElement } from './types';
import { CustomOptions, WriterDataResponse, Callback, HTMLWriterElement, CallbackType } from './types';
import { wait } from './utils';

@@ -28,3 +28,3 @@ import { presets, glyphs, PresetName } from './presets';

*/
constructor(htmlElement?: HTMLElement | Element | null | string, options?: CustomOptions | PresetName | null, onStepCallback?: Callback, onFinishCallback?: Callback);
constructor(htmlElement?: HTMLElement | Element | null | string, options?: CustomOptions | PresetName | null, onFinishCallback?: Callback);
updateString(): void;

@@ -60,2 +60,16 @@ get previousString(): string;

/**
* Use this to add callback to one of the writer events
*
* save callback in a variable first if you want to remove it later.
* @param type "start" | "step" | "finish"
* @param callback your callback function: (string, writerData) => {}
*/
addCallback(type: CallbackType, callback: Callback): void;
/**
* Use this to remove added callback
* @param type "start" | "step" | "finish"
* @param callback variable pointing to your function
*/
removeCallback(type: CallbackType, callback: Callback): void;
/**
* Resume last writing order.

@@ -85,3 +99,3 @@ * @returns Promise, with writer data result

*/
export declare function glitchWrite(string: string, htmlElement?: HTMLElement | Element | null | string, options?: CustomOptions | PresetName | null, onStepCallback?: Callback, onFinishCallback?: Callback): Promise<WriterDataResponse>;
export declare function glitchWrite(string: string, htmlElement?: HTMLElement | Element | null | string, options?: CustomOptions | PresetName | null, onFinishCallback?: Callback): Promise<WriterDataResponse>;
/**

@@ -95,3 +109,3 @@ * A way to create new Writer without having to rely on defult export.

*/
export declare const create: (htmlElement?: string | Element | HTMLElement | null | undefined, options?: "default" | "encrypted" | Partial<import("./types").AllCustomOptions> | "nier" | "typewriter" | "terminal" | "zalgo" | "neo" | "bitbybit" | null | undefined, onStepCallback?: Callback | undefined, onFinishCallback?: Callback | undefined) => GlitchedWriter;
export declare const create: (htmlElement?: string | Element | HTMLElement | null | undefined, options?: "default" | "encrypted" | Partial<import("./types").AllCustomOptions> | "nier" | "typewriter" | "terminal" | "zalgo" | "neo" | "bitbybit" | "cosmic" | null | undefined, onFinishCallback?: Callback | undefined) => GlitchedWriter;
export { presets, glyphs, wait, CustomOptions, WriterDataResponse, Callback };

@@ -30,3 +30,3 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {

*/
constructor(htmlElement, options, onStepCallback, onFinishCallback) {
constructor(htmlElement, options, onFinishCallback) {
var _a;

@@ -48,3 +48,5 @@ this.charTable = [];

this.state = new State(this);
this.emiter = new Emiter(this, onStepCallback, onFinishCallback);
this.emiter = new Emiter(this);
if (onFinishCallback)
this.emiter.addCallback('finish', onFinishCallback);
this.animator = new Animator(this);

@@ -116,2 +118,20 @@ this.string = this.previousString;

}
/**
* Use this to add callback to one of the writer events
*
* save callback in a variable first if you want to remove it later.
* @param type "start" | "step" | "finish"
* @param callback your callback function: (string, writerData) => {}
*/
addCallback(type, callback) {
this.emiter.addCallback(type, callback);
}
/**
* Use this to remove added callback
* @param type "start" | "step" | "finish"
* @param callback variable pointing to your function
*/
removeCallback(type, callback) {
this.emiter.removeCallback(type, callback);
}
// private logCharTable() {

@@ -245,5 +265,5 @@ // console.table(

*/
export function glitchWrite(string, htmlElement, options, onStepCallback, onFinishCallback) {
export function glitchWrite(string, htmlElement, options, onFinishCallback) {
return __awaiter(this, void 0, void 0, function* () {
const writer = new GlitchedWriter(htmlElement, options, onStepCallback, onFinishCallback);
const writer = new GlitchedWriter(htmlElement, options, onFinishCallback);
return writer.write(string);

@@ -260,3 +280,3 @@ });

*/
export const create = (htmlElement, options, onStepCallback, onFinishCallback) => new GlitchedWriter(htmlElement, options, onStepCallback, onFinishCallback);
export const create = (htmlElement, options, onFinishCallback) => new GlitchedWriter(htmlElement, options, onFinishCallback);
export { presets, glyphs, wait };

@@ -135,3 +135,3 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {

(_a = this.els) === null || _a === void 0 ? void 0 : _a.letterEl.classList.add('gw-glitched');
this.l = writer.options.genGhost(this);
this.l = writer.options.getGlyph(this);
}

@@ -149,3 +149,3 @@ }

addGhost() {
const { writer, ghosts } = this, l = writer.options.genGhost(this);
const { writer, ghosts } = this, l = writer.options.getGlyph(this);
writer.state.nGhosts++;

@@ -152,0 +152,0 @@ coinFlip() ? insertGhost(ghosts[0], l) : insertGhost(ghosts[1], l);

import GlitchedWriter from '../index';
import { Callback } from '../types';
export default class {
import { Callback, CallbackType } from '../types';
export default class Emiter {
writer: GlitchedWriter;
onStepCallback?: Callback;
onFinishCallback?: Callback;
constructor(writer: GlitchedWriter, onStepCallback?: Callback, onFinishCallback?: Callback);
call(eventType: 'step' | 'finish'): any;
callbacks: {
start: Callback[];
step: Callback[];
finish: Callback[];
};
constructor(writer: GlitchedWriter);
addCallback(type: CallbackType, callback: Callback): void;
removeCallback(type: CallbackType, callback: Callback): boolean;
callback(type: CallbackType, ...args: Parameters<Callback>): void;
call(eventType: 'step' | 'finish'): void;
private emitEvent;
}
import { filterHtml } from '../utils';
export default class {
constructor(writer, onStepCallback, onFinishCallback) {
this.onStepCallback = onStepCallback;
this.onFinishCallback = onFinishCallback;
export default class Emiter {
constructor(writer) {
this.callbacks = {
start: [],
step: [],
finish: [],
};
this.writer = writer;
}
addCallback(type, callback) {
this.callbacks[type].push(callback);
}
removeCallback(type, callback) {
const array = this.callbacks[type], i = array.indexOf(callback);
if (i === -1)
return false;
array.splice(i, 1);
return true;
}
callback(type, ...args) {
this.callbacks[type].forEach(cb => cb(...args));
}
call(eventType) {
var _a, _b;
const { writer } = this;

@@ -18,3 +33,3 @@ writer.updateString();

if (eventType === 'step')
return (_a = this.onStepCallback) === null || _a === void 0 ? void 0 : _a.call(this, string, writerData);
return this.callback('step', string, writerData);
// ON FINISH

@@ -25,3 +40,3 @@ writer.state.finish();

return;
(_b = this.onFinishCallback) === null || _b === void 0 ? void 0 : _b.call(this, string, writerData);
this.callback('finish', string, writerData);
this.emitEvent();

@@ -28,0 +43,0 @@ }

@@ -20,6 +20,8 @@ import { CustomOptions, OptionsFields } from '../types';

setMaxGhosts(): void;
genGhost(char: Char): string;
getGlyph(char: Char): string;
private baseGetGlyph;
get steps(): number;
get interval(): number;
getDelay(char: Char): number;
private baseGetDelay;
get mode(): "normal" | "matching" | "erase" | "clear";

@@ -26,0 +28,0 @@ get html(): boolean;

@@ -53,6 +53,10 @@ // eslint-disable-next-line import/no-extraneous-dependencies

}
genGhost(char) {
getGlyph(char) {
const { options } = this;
return options.genGlyph
? options.genGlyph(char, this.baseGetGlyph)
: this.baseGetGlyph();
}
baseGetGlyph() {
var _a;
if (this.options.genGlyph)
return this.options.genGlyph(char, this.writer);
return (_a = getRandom(this.charset)) !== null && _a !== void 0 ? _a : '';

@@ -69,5 +73,8 @@ }

return options.genDelay
? options.genDelay(char, this.writer)
: getRandomFromRange(options.delay);
? options.genDelay(char, this.baseGetDelay)
: this.baseGetDelay();
}
baseGetDelay() {
return getRandomFromRange(this.options.delay);
}
get mode() {

@@ -74,0 +81,0 @@ return this.options.mode;

@@ -43,2 +43,3 @@ import { animateWithClass } from '../utils';

this.writer.animator.run();
this.writer.emiter.callback('start', this.writer.goalText, this.writer.writerData);
}

@@ -45,0 +46,0 @@ pause() {

@@ -36,3 +36,4 @@ import { RangeOrNumber } from './types';

bitbybit: Partial<import("./types").AllCustomOptions>;
cosmic: Partial<import("./types").AllCustomOptions>;
};
export declare type PresetName = keyof typeof presets;

@@ -110,2 +110,14 @@ export const glyphs = {

},
cosmic: {
steps: [0, 1],
interval: 30,
delay: [400, 2400],
ghostChance: 0,
changeChance: 0.3,
maxGhosts: 0,
glyphs: 'QWERTYUIOPASDFGHJKLZXCVBNM',
glyphsFromText: false,
fillSpace: true,
mode: 'erase',
},
};

@@ -26,4 +26,4 @@ import GlitchedWriter from './index';

oneAtATime: OptionsFields['oneAtATime'] | boolean;
genGlyph?: (char: Char, writer: GlitchedWriter) => string;
genDelay?: (char: Char, writer: GlitchedWriter) => number;
genGlyph?: (char: Char, base: () => string) => string;
genDelay?: (char: Char, base: () => number) => number;
}>;

@@ -49,2 +49,3 @@ export declare type CustomOptions = Partial<AllCustomOptions>;

}
export declare type CallbackType = 'start' | 'step' | 'finish';
export declare type Callback = (string: string, writerData: WriterDataResponse) => any;

@@ -1,2 +0,2 @@

!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.GlitchedWriter=e():t.GlitchedWriter=e()}(self,(function(){return(()=>{"use strict";var t={d:(e,s)=>{for(var i in s)t.o(s,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:s[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function s(t,e,s){const i=Math.random()*(e-t)+t;if(s)switch(s){case"floor":return Math.floor(i);case"round":return Math.round(i);case"ceil":return Math.ceil(i)}return i}t.r(e),t.d(e,{create:()=>D,default:()=>R,glitchWrite:()=>F,glyphs:()=>d,presets:()=>f,wait:()=>n});const i=t=>t.splice(s(0,t.length,"floor"),1).length>0,n=t=>new Promise((e=>setTimeout((()=>e(t)),t)));function r(t,e){const s=()=>t()?e().then(s):Promise.resolve();return s()}const o=(t,e)=>new Array(e).fill(t);function h(t,e=!0){return"number"==typeof t?t:s(...t,e?"round":void 0)}const a=(t=.5)=>Math.random()<t,l=t=>({value:t}),c=t=>[...t].map(l),p="(&(?:[a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});)|(<style.+?>.+?</style>|<script.+?>.+?<\/script>|<(?:!|/?[a-zA-Z]+).*?/?>)",u=/(&(?:[a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});)|.\w+,*\.*"*\s?|\s+|\S+/gi;function g(t){const e=new RegExp(p,"g");return t.replace(e,"")}const d={nier:"一二三四五六七八九十百千上下左右中大小月日年早木林山川土空田天生花草虫犬人名女男子目耳口手足見音力気円入出立休先夕本文字学校村町森正水火玉王石竹糸貝車金雨赤青白数多少万半形太細広長点丸交光角計直線矢弱強高同親母父姉兄弟妹自友体毛頭顔首心時曜朝昼夜分週春夏秋冬今新古間方北南東西遠近前後内外場地国園谷野原里市京風雪雲池海岩星室戸家寺通門道話言答声聞語読書記紙画絵図工教晴思考知才理算作元食肉馬牛魚鳥羽鳴麦米茶色黄黒来行帰歩走止活店買売午汽弓回会組船明社切電毎合当台楽公引科歌刀番用何",full:"ABCDĐEFGHIJKLMNOPQRSTUVWXYZabcdđefghijklmnopqrstuvwxyzĄąĆ毿ŹźŃńóŁłАБВГҐДЂЕЁЄЖЗЅИІЇЙЈКЛЉМНЊОПРСТЋУЎФХЦЧЏШЩЪЫЬЭЮЯабвгґдђеёєжзѕиіїйјклљмнњопрстћуўфхцчџшщъыьэюяΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩαβγδεζηθικλμνξοπρστυφχψωάΆέΈέΉίϊΐΊόΌύΰϋΎΫΏĂÂÊÔƠƯăâêôơư一二三四五六七八九十百千上下左右中大小月日年早木林山川土空田天生花草虫犬人名女男子目耳口手足見音力気円入出立休先夕本文字学校村町森正水火玉王石竹糸貝車金雨赤青白数多少万半形太細広長点丸交光角計直線矢弱強高同親母父姉兄弟妹自友体毛頭顔首心時曜朝昼夜分週春夏秋冬今新古間方北南東西遠近前後内外場地国園谷野原里市京風雪雲池海岩星室戸家寺通門道話言答声聞語読書記紙画絵図工教晴思考知才理算作元食肉馬牛魚鳥羽鳴麦米茶色黄黒来行帰歩走止活店買売午汽弓回会組船明社切電毎合当台楽公引科歌刀番用何ĂÂÊÔƠƯăâêôơư1234567890‘?’“!”(%)[#]{@}/\\&<-+÷×=>$€£¥¢:;,.*•°·…±†‡æ«»¦¯—–~˜¨_øÞ¿▬▭▮▯┐└╛░▒▓○‼⁇⁈⁉‽ℴℵℶℷℸℲ℮ℯ⅁⅂⅃⅄₠₡₢₣₤₥₦₧₨₩₪₫€₭₮₯₰₱₲₳₴₵₶₷₸₹₺₻₼₽₾₿ ",letterlike:"ABCDĐEFGHIJKLMNOPQRSTUVWXYZabcdđefghijklmnopqrstuvwxyzĄąĆ毿ŹźŃńóŁłАБВГҐДЂЕЁЄЖЗЅИІЇЙЈКЛЉМНЊОПРСТЋУЎФХЦЧЏШЩЪЫЬЭЮЯабвгґдђеёєжзѕиіїйјклљмнњопрстћуўфхцчџшщъыьэюяΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩαβγδεζηθικλμνξοπρστυφχψωάΆέΈέΉίϊΐΊόΌύΰϋΎΫΏĂÂÊÔƠƯăâêôơưĂÂÊÔƠƯăâêôơư1234567890",numbers:"0123456789",zalgo:"̴̵̶̷̸̡̢̧̨̛̖̗̘̙̜̝̞̟̠̣̤̥̦̩̪̫̬̭̮̯̰̱̲̳̹̺̻̼͇͈͉͍͎̀́̂̃̄̅̆̇̈̉̊̋̌̍̎̏̐̑̒̓̔̽̾̿̀́͂̓̈́͆͊͋͌̕̚ͅ ͓͔͕͖͙͚͐͑͒͗͛ͣͤͥͦͧͨͩͪͫͬͭͮͯ͘͜͟͢͝͞͠͡͏҉",neo:"!<>-_\\/[]{}—=+*^?#________",uppercase:"1234567890QWERTYUIOPASDFGHJKLZXCVBNM#$%"},f={default:{steps:[1,8],interval:[60,170],delay:[0,2e3],changeChance:.6,ghostChance:.2,maxGhosts:.2,oneAtATime:0,glyphs:d.full+d.zalgo,glyphsFromText:!1,fillSpace:!0,mode:"matching",html:!1,letterize:!1,endless:!1,fps:60},nier:{maxGhosts:0,ghostChance:0,changeChance:.8,steps:3,interval:10,delay:0,oneAtATime:1,glyphs:d.nier,fillSpace:!1,glyphsFromText:!0,mode:"clear"},typewriter:{interval:[50,150],delay:0,steps:0,changeChance:0,maxGhosts:0,oneAtATime:1,glyphs:"",glyphsFromText:!1,fillSpace:!1,mode:"erase"},terminal:{interval:[25,30],delay:[0,0],steps:0,changeChance:.5,maxGhosts:0,oneAtATime:1,glyphs:"",fillSpace:!1,glyphsFromText:!1,mode:"clear"},zalgo:{delay:[0,3e3],interval:[10,35],steps:[0,30],maxGhosts:4.6,changeChance:.5,ghostChance:.7,glyphs:d.zalgo,glyphsFromText:!0,fillSpace:!1},neo:{interval:[30,100],delay:[0,1300],steps:[4,7],maxGhosts:0,ghostChance:0,changeChance:1,glyphs:d.neo,mode:"normal"},encrypted:{interval:[50,90],delay:[0,1300],steps:[5,8],maxGhosts:0,ghostChance:0,changeChance:1,glyphs:d.uppercase,fillSpace:!1,mode:"normal"},bitbybit:{interval:[35,65],delay:180,steps:1,maxGhosts:1,ghostChance:.1,changeChance:.7,oneAtATime:"word",glyphs:"",glyphsFromText:!0,fillSpace:!1,mode:"erase"}};class m{constructor(t,e){this.writer=t,this.set(e)}set(t){this.options=Object.assign(Object.assign({},f.default),this.parseOptions(t)),this.updateInternal()}extend(t){this.options=Object.assign(Object.assign({},this.options),this.parseOptions(t)),this.updateInternal()}parseOptions(t){var e;return t?"string"==typeof t?null!==(e=f[t])&&void 0!==e?e:{}:t:{}}updateInternal(){const{options:t}=this;this.glyphs=function(t){let e;return e="string"==typeof t?t:t.length?t.join(""):Array.from(t).join(""),e}(t.glyphs),this.setCharset(),this.space=t.fillSpace?" ":"",Number.isInteger(t.oneAtATime)?this.oneAtATime=t.oneAtATime:"word"===t.oneAtATime?this.oneAtATime="word":this.oneAtATime=t.oneAtATime?1:0}setCharset(){const{writer:t}=this;let{glyphs:e}=this;this.glyphsFromText&&(e+=function(t){const e="string"==typeof t,s=[];return new Set(t).forEach((t=>s.push(t))),e?s.join(""):s}(t.previousString+(this.html?g(t.goalText):t.goalText))),this.charset=[...e].filter((t=>!["\t","\n","\r","\f","\v"].includes(t))),this.setMaxGhosts()}setMaxGhosts(){const{writer:{charTable:t},options:{maxGhosts:e}}=this;Number.isInteger(e)&&(this.maxGhosts=e);const{length:s}=t.filter((t=>"tag"!==t.specialType));this.maxGhosts=Math.round((s||20)*e)}genGhost(t){var e,i;return this.options.genGlyph?this.options.genGlyph(t,this.writer):null!==(e=(i=this.charset)[s(0,i.length,"floor")])&&void 0!==e?e:""}get steps(){return h(this.options.steps)}get interval(){return h(this.options.interval)}getDelay(t){const{options:e}=this;return e.genDelay?e.genDelay(t,this.writer):h(e.delay)}get mode(){return this.options.mode}get html(){return this.options.html}get endless(){return this.options.endless}get fps(){return this.options.fps}get letterize(){return this.options.letterize}get ghostChance(){return this.options.ghostChance}get changeChance(){return this.options.changeChance}get glyphsFromText(){return this.options.glyphsFromText}}class v{constructor(t){this.nGhosts=0,this.progress={percent:0,done:0,todo:0,increase(){this.done++,this.percent=this.done/this.todo},reset(t){this.percent=0,this.done=0,this.todo=t},finish(){this.done=this.todo,this.percent=1}},this.isTyping=!1,this.isPaused=!1,this.finished=!0,this.erasing=!1,this.writer=t,this.maxGhosts=this.writer.options.maxGhosts}get ghostsInLimit(){return this.nGhosts<this.maxGhosts}play(){this.isTyping=!0,this.isPaused=!1,this.finished=!1,this.toggleClass(!0),this.maxGhosts=this.writer.options.maxGhosts,this.writer.animator.run()}pause(){this.isTyping=!1,this.isPaused=!0,this.toggleClass(!1)}finish(){this.progress.finish(),this.isTyping=!1,this.finished=!0,this.toggleClass(!1)}toggleClass(t){const e=this.writer.htmlElement,s="gw-writing";t?((t,e)=>{t.classList.remove(e),t.offsetWidth,t.classList.add(e)})(e,s):e.classList.remove(s)}}var y=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function o(t){try{a(i.next(t))}catch(t){r(t)}}function h(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(o,h)}a((i=i.apply(t,e||[])).next())}))};class w{constructor(t,e,s,i="",n,r){this.ghosts=[[],[]],this.stop=!1,this.afterGlitchChance=0,this.writer=t,this.setProps(e,s,i,n,r),t.options.letterize&&(this.els={ghostsBeforeEl:document.createElement("span"),letterEl:document.createElement("span"),ghostsAfterEl:document.createElement("span")},this.els.ghostsBeforeEl.className="gw-ghosts",this.els.ghostsAfterEl.className="gw-ghosts",this.els.letterEl.className="gw-letter")}setProps(t,e,s="",i,n){const{options:r}=this.writer;this.index=n,this.l=t,this.gl=e,this.specialType=i,this.ghosts[0]=[...s],this.writer.state.nGhosts+=s.length,this.stepsLeft=r.steps,"tag"===i?this.stepsLeft=0:(t=>["\t","\n","\r","\f","\v",""," "].includes(t))(e)&&(this.specialType="whitespace"),this.afterGlitchChance=(r.ghostChance+r.changeChance)/3.7}reset(t,e,s="",i,n){this.setProps(t,e,s,i,n),this.els&&(this.els.letterEl.className="gw-letter")}get string(){const{l:t,ghosts:e}=this;return e[0].join("")+t+e[1].join("")}get finished(){const{l:t,gl:e,ghosts:s}=this;return t===e&&0===s[0].length&&0===s[1].length||"tag"===this.specialType}get interval(){let{interval:t}=this.writer.options;return"whitespace"===this.specialType&&(t/=1.8),t}writeToElement(){if(!this.els)return;const{ghostsBeforeEl:t,ghostsAfterEl:e,letterEl:s}=this.els;s.innerHTML=this.l,t.textContent=this.ghosts[0].join(""),e.textContent=this.ghosts[1].join("")}set spanElement(t){this.els&&(this.els.charEl=t,this.appendChildren())}appendChildren(){var t,e;null===(e=null===(t=this.els)||void 0===t?void 0:t.charEl)||void 0===e||e.append(this.els.ghostsBeforeEl,this.els.letterEl,this.els.ghostsAfterEl),this.writeToElement()}type(){var t,e,s;return y(this,void 0,void 0,(function*(){const{writer:i}=this;return"tag"===this.specialType?(this.l=this.gl,i.emiter.call("step"),i.state.progress.increase(),!0):(yield n(i.options.getDelay(this)),yield r((()=>(!this.finished||i.options.endless)&&!i.state.isPaused&&!this.stop),(()=>y(this,void 0,void 0,(function*(){yield n(this.interval);const t=this.string;this.step(),t!==this.string&&(i.emiter.call("step"),this.writeToElement()),!i.options.endless&&this.stepsLeft--})))),this.finished&&(i.state.progress.increase(),null===(e=null===(t=this.els)||void 0===t?void 0:t.charEl)||void 0===e||e.classList.add("gw-finished"),null===(s=this.els)||void 0===s||s.letterEl.classList.remove("gw-glitched")),this.finished)}))}step(){var t,e;const{writer:s}=this;if(this.stepsLeft>0&&this.l!==this.gl||a(this.afterGlitchChance)&&"whitespace"!==this.specialType||s.options.endless){const{ghostChance:e,changeChance:i}=s.options;a(e)&&(s.state.ghostsInLimit?this.addGhost():this.removeGhost()),a(i)&&(null===(t=this.els)||void 0===t||t.letterEl.classList.add("gw-glitched"),this.l=s.options.genGhost(this))}else this.finished||(null===(e=this.els)||void 0===e||e.letterEl.classList.remove("gw-glitched"),this.l=this.gl,this.removeGhost())}addGhost(){const{writer:t,ghosts:e}=this,s=t.options.genGhost(this);t.state.nGhosts++,a()?T(e[0],s):T(e[1],s)}removeGhost(){const{writer:t,ghosts:e}=this;(a()&&e[0].length>0?i(e[0]):i(e[1]))&&t.state.nGhosts--}}function T(t,e){const{length:i}=t;t.splice(s(0,i,"floor"),0,e)}function x(){const t="clear"===this.options.mode&&this.state.finished?"":this.previousString;"matching"===this.options.mode?E.call(this,t):A.call(this,t)}function E(t){const e=Math.min(Math.ceil(this.options.maxGhosts/2),5),s=C.call(this,t);let i=-1;s.forEach(((s,n)=>{if(i++,"tag"===s.type)return i--,void b.call(this,n,"",s);const r=""!==s.value?t.indexOf(s.value,i):-1;if(-1!==r&&r-i<=e){const e=t.substring(i,r);b.call(this,n,s.value,s,e),i=r}else b.call(this,n,t[i],s)})),G(this.charTable,s.length)}function A(t){const e=C.call(this,t);let s=-1;e.forEach(((e,i)=>{if(s++,"tag"===e.type)return s--,void b.call(this,i,"",e);b.call(this,i,t[s],e)})),G(this.charTable,e.length)}function C(t){const{options:e,goalText:s}=this,i=e.html?function(t){const e=new RegExp(p,"gi"),s=[];let i,n=0;for(;i=e.exec(t);){const r=i.index,o=e.lastIndex,h=t.slice(n,r);n=o,h&&s.push(...c(h));const a={value:i[0],type:void 0!==i[1]?"html_entity":"tag"};s.push(a)}return t.length>n&&s.push(...c(t.slice(n))),s}(s):c(s),n=Math.max(0,t.length-i.length);if(this.options.oneAtATime)return i.concat(c(o("",n)));const r=Math.ceil(n/2),h=Math.floor(n/2);return c(o("",r)).concat(i,c(o("",h)))}function b(t,e,s,i){const{charTable:n,options:r}=this,o=n[t];o?o.reset(null!=e?e:"",s.value||r.space,i,s.type,t):n.push(new w(this,null!=e?e:"",s.value||r.space,i,s.type,t))}function G(t,e){t.splice(e,t.length-e)}function S(){if(!this.options.letterize)return;const t=this.charTable.map((({specialType:t,gl:e})=>"tag"===t?e:'<span class="gw-char"></span>')).join("");this.htmlElement.innerHTML=t;const e=this.htmlElement.querySelectorAll("span.gw-char");let s=0;this.charTable.forEach((t=>{"tag"!==t.specialType&&(t.spanElement=e[s],s++)}))}var P=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function o(t){try{a(i.next(t))}catch(t){r(t)}}function h(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(o,h)}a((i=i.apply(t,e||[])).next())}))};function j(t){const{charTable:e,state:s}=this,i=[];let n;n=e.filter(((t,e)=>"tag"!==t.specialType&&"html_entity"!==t.specialType&&(i.push(e),!0))).map((t=>t.gl)).join("").match(u);const o=[];{let t=-1,s=-1,r=-1;const h=()=>o[o.length-1];null==n||n.forEach((n=>{o.push([]),[...n].forEach((()=>{if(t++,s=i[t],r++,r!==s){for(let t=r;t<s;t++)h().push(e[t]);r=s}h().push(e[s])}))})),o.length||o.push([]);for(let t=s+1;t<e.length;t++)h().push(e[t])}o.reverse();let h=!0,a=!1;const l=()=>P(this,void 0,void 0,(function*(){var t;const e=o.pop();if(!e)return a=!0;const s=e.map((t=>t.type()));h=null!==(t=(yield Promise.all(s)).every((t=>t)))&&void 0!==t&&t}));t.push((()=>P(this,void 0,void 0,(function*(){return yield r((()=>!a&&h&&!s.isPaused),l),a&&h&&!s.isPaused})))())}var M=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function o(t){try{a(i.next(t))}catch(t){r(t)}}function h(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(o,h)}a((i=i.apply(t,e||[])).next())}))};function O(t,e){var s;const{charTable:i,state:n,options:o}=this,h=null!==(s=null==e?void 0:e.reverse)&&void 0!==s&&s?[...i]:[...i].reverse(),a=()=>M(this,void 0,void 0,(function*(){let t=!0,e=!1;return yield r((()=>!e&&t&&!n.isPaused),(()=>M(this,void 0,void 0,(function*(){var s;const i=h.pop();i?t=null!==(s=yield i.type())&&void 0!==s&&s:e=!0})))),e&&t&&!n.isPaused}));for(let e=0;e<o.oneAtATime;e++)t.push(a())}class W{constructor(t){this.last=0,this.rate=16,this.running=!1,this.writer=t}run(){this.running||this.writer.options.letterize||(this.rate=Math.floor(1e3/this.writer.options.fps),this.running=!0,requestAnimationFrame(this.frame.bind(this)))}frame(t){return this.writer.state.isTyping?(this.last||(this.last=t),t-this.last<this.rate||(this.animate.call(this),this.last=t),requestAnimationFrame(this.frame.bind(this))):(this.animate.call(this),this.running=!1)}animate(){const{htmlElement:t,string:e}=this.writer;this.writer.options.html?t.innerHTML=e:t.textContent=e,t.setAttribute("data-gw-string",this.writer.options.html?g(e):e)}}var L=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function o(t){try{a(i.next(t))}catch(t){r(t)}}function h(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(o,h)}a((i=i.apply(t,e||[])).next())}))};class R{constructor(t,e,s,i){var n;this.charTable=[],this.goalText="",this.lastText="",this.string="",this.htmlElement=t?"string"==typeof t?null!==(n=document.querySelector(t))&&void 0!==n?n:document.createElement("span"):t:document.createElement("span"),this.htmlElement.$writer=this,this.options=new m(this,e),this.state=new v(this),this.emiter=new class{constructor(t,e,s){this.onStepCallback=e,this.onFinishCallback=s,this.writer=t}call(t){var e,s;const{writer:i}=this;i.updateString();const{writerData:n,string:r}=i;if(i.options.letterize&&i.htmlElement.setAttribute("data-gw-string",i.options.html?g(r):r),"step"===t)return null===(e=this.onStepCallback)||void 0===e?void 0:e.call(this,r,n);i.state.finish(),i.state.erasing||(null===(s=this.onFinishCallback)||void 0===s||s.call(this,r,n),this.emitEvent())}emitEvent(){const{htmlElement:t,writerData:e}=this.writer;"undefined"!=typeof CustomEvent&&t.dispatchEvent(new CustomEvent("gw-finished",{detail:e}))}}(this,s,i),this.animator=new W(this),this.string=this.previousString}updateString(){this.string=this.charTable.map((t=>t.string)).join("")}get previousString(){let t=this.htmlElement.textContent;return"string"!=typeof t&&(t=this.options.html?g(this.string):this.string),t=t.trim(),t}get writerData(){const{options:t,state:e,string:s}=this;return{string:s,writer:this,options:t,state:e}}write(t){return L(this,void 0,void 0,(function*(){return this.manageWriting(t)}))}add(t){return L(this,void 0,void 0,(function*(){const{previousString:e}=this;return this.write(e+t)}))}remove(t){return L(this,void 0,void 0,(function*(){const{previousString:e}=this,s=Array.from(e);return s.splice(-t),this.write(s.join(""))}))}endless(t){this.options.extend({endless:t})}play(){return L(this,void 0,void 0,(function*(){return this.manageWriting(null)}))}pause(){this.state.pause()}manageWriting(t){return L(this,void 0,void 0,(function*(){if(null!==t&&(this.lastText=t),"erase"===this.options.mode&&(this.state.finished||this.state.erasing)){this.state.erasing=!0;const t=this.genGoalStringToErase(this.lastText);if(this.preparePropertiesBeforeWrite(t),yield this.playChT({reverse:0!==this.options.oneAtATime}),!this.state.finished)return this.getWriterData("ERROR","Erasing did not finish.");this.state.erasing=!1}return this.preparePropertiesBeforeWrite(this.lastText),this.pause(),this.playChT()}))}preparePropertiesBeforeWrite(t){this.goalText=t,this.state.nGhosts=0,this.options.setCharset(),x.call(this),this.state.progress.reset(this.charTable.length),S.call(this)}playChT(t){return L(this,void 0,void 0,(function*(){const e=[],{charTable:s,state:i,options:n}=this;if(i.isTyping)return this.getWriterData("ERROR","The writer is already typing.");i.play(),n.oneAtATime>0?O.call(this,e,t):"word"===n.oneAtATime?j.call(this,e):s.forEach((t=>e.push(t.type())));try{const t=(yield Promise.all(e)).every((t=>t));return this.returnResult(t)}catch(t){return this.getWriterData("ERROR","Writer encountered an error.",t)}}))}returnResult(t){return t?this.emiter.call("finish"):this.emiter.call("step"),t?this.getWriterData("SUCCESS","The writer finished typing."):this.getWriterData("ERROR","Writer failed to finish typing.")}getWriterData(t,e,s){const{writerData:i}=this;return Object.assign(Object.assign({},i),{status:t,message:e,error:s})}genGoalStringToErase(t){var e;const{previousString:s}=this;let i="";for(let n=0;n<t.length;n++){const r=t[n],o=null!==(e=s[n])&&void 0!==e?e:"";if(r!==o)break;i+=o}const n=Math.max(t.length-i.length,0);return n>0&&" "===this.options.space&&(i=i.padEnd(n+i.length," ")),i}}function F(t,e,s,i,n){return L(this,void 0,void 0,(function*(){return new R(e,s,i,n).write(t)}))}const D=(t,e,s,i)=>new R(t,e,s,i);return e})()}));
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.GlitchedWriter=e():t.GlitchedWriter=e()}(self,(function(){return(()=>{"use strict";var t={d:(e,s)=>{for(var i in s)t.o(s,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:s[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function s(t,e,s){const i=Math.random()*(e-t)+t;if(s)switch(s){case"floor":return Math.floor(i);case"round":return Math.round(i);case"ceil":return Math.ceil(i)}return i}t.r(e),t.d(e,{create:()=>F,default:()=>R,glitchWrite:()=>k,glyphs:()=>d,presets:()=>f,wait:()=>n});const i=t=>t.splice(s(0,t.length,"floor"),1).length>0,n=t=>new Promise((e=>setTimeout((()=>e(t)),t)));function r(t,e){const s=()=>t()?e().then(s):Promise.resolve();return s()}const h=(t,e)=>new Array(e).fill(t);function o(t,e=!0){return"number"==typeof t?t:s(...t,e?"round":void 0)}const a=(t=.5)=>Math.random()<t,l=t=>({value:t}),c=t=>[...t].map(l),p="(&(?:[a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});)|(<style.+?>.+?</style>|<script.+?>.+?<\/script>|<(?:!|/?[a-zA-Z]+).*?/?>)",u=/(&(?:[a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});)|.\w+,*\.*"*\s?|\s+|\S+/gi;function g(t){const e=new RegExp(p,"g");return t.replace(e,"")}const d={nier:"一二三四五六七八九十百千上下左右中大小月日年早木林山川土空田天生花草虫犬人名女男子目耳口手足見音力気円入出立休先夕本文字学校村町森正水火玉王石竹糸貝車金雨赤青白数多少万半形太細広長点丸交光角計直線矢弱強高同親母父姉兄弟妹自友体毛頭顔首心時曜朝昼夜分週春夏秋冬今新古間方北南東西遠近前後内外場地国園谷野原里市京風雪雲池海岩星室戸家寺通門道話言答声聞語読書記紙画絵図工教晴思考知才理算作元食肉馬牛魚鳥羽鳴麦米茶色黄黒来行帰歩走止活店買売午汽弓回会組船明社切電毎合当台楽公引科歌刀番用何",full:"ABCDĐEFGHIJKLMNOPQRSTUVWXYZabcdđefghijklmnopqrstuvwxyzĄąĆ毿ŹźŃńóŁłАБВГҐДЂЕЁЄЖЗЅИІЇЙЈКЛЉМНЊОПРСТЋУЎФХЦЧЏШЩЪЫЬЭЮЯабвгґдђеёєжзѕиіїйјклљмнњопрстћуўфхцчџшщъыьэюяΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩαβγδεζηθικλμνξοπρστυφχψωάΆέΈέΉίϊΐΊόΌύΰϋΎΫΏĂÂÊÔƠƯăâêôơư一二三四五六七八九十百千上下左右中大小月日年早木林山川土空田天生花草虫犬人名女男子目耳口手足見音力気円入出立休先夕本文字学校村町森正水火玉王石竹糸貝車金雨赤青白数多少万半形太細広長点丸交光角計直線矢弱強高同親母父姉兄弟妹自友体毛頭顔首心時曜朝昼夜分週春夏秋冬今新古間方北南東西遠近前後内外場地国園谷野原里市京風雪雲池海岩星室戸家寺通門道話言答声聞語読書記紙画絵図工教晴思考知才理算作元食肉馬牛魚鳥羽鳴麦米茶色黄黒来行帰歩走止活店買売午汽弓回会組船明社切電毎合当台楽公引科歌刀番用何ĂÂÊÔƠƯăâêôơư1234567890‘?’“!”(%)[#]{@}/\\&<-+÷×=>$€£¥¢:;,.*•°·…±†‡æ«»¦¯—–~˜¨_øÞ¿▬▭▮▯┐└╛░▒▓○‼⁇⁈⁉‽ℴℵℶℷℸℲ℮ℯ⅁⅂⅃⅄₠₡₢₣₤₥₦₧₨₩₪₫€₭₮₯₰₱₲₳₴₵₶₷₸₹₺₻₼₽₾₿ ",letterlike:"ABCDĐEFGHIJKLMNOPQRSTUVWXYZabcdđefghijklmnopqrstuvwxyzĄąĆ毿ŹźŃńóŁłАБВГҐДЂЕЁЄЖЗЅИІЇЙЈКЛЉМНЊОПРСТЋУЎФХЦЧЏШЩЪЫЬЭЮЯабвгґдђеёєжзѕиіїйјклљмнњопрстћуўфхцчџшщъыьэюяΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩαβγδεζηθικλμνξοπρστυφχψωάΆέΈέΉίϊΐΊόΌύΰϋΎΫΏĂÂÊÔƠƯăâêôơưĂÂÊÔƠƯăâêôơư1234567890",numbers:"0123456789",zalgo:"̴̵̶̷̸̡̢̧̨̛̖̗̘̙̜̝̞̟̠̣̤̥̦̩̪̫̬̭̮̯̰̱̲̳̹̺̻̼͇͈͉͍͎̀́̂̃̄̅̆̇̈̉̊̋̌̍̎̏̐̑̒̓̔̽̾̿̀́͂̓̈́͆͊͋͌̕̚ͅ ͓͔͕͖͙͚͐͑͒͗͛ͣͤͥͦͧͨͩͪͫͬͭͮͯ͘͜͟͢͝͞͠͡͏҉",neo:"!<>-_\\/[]{}—=+*^?#________",uppercase:"1234567890QWERTYUIOPASDFGHJKLZXCVBNM#$%"},f={default:{steps:[1,8],interval:[60,170],delay:[0,2e3],changeChance:.6,ghostChance:.2,maxGhosts:.2,oneAtATime:0,glyphs:d.full+d.zalgo,glyphsFromText:!1,fillSpace:!0,mode:"matching",html:!1,letterize:!1,endless:!1,fps:60},nier:{maxGhosts:0,ghostChance:0,changeChance:.8,steps:3,interval:10,delay:0,oneAtATime:1,glyphs:d.nier,fillSpace:!1,glyphsFromText:!0,mode:"clear"},typewriter:{interval:[50,150],delay:0,steps:0,changeChance:0,maxGhosts:0,oneAtATime:1,glyphs:"",glyphsFromText:!1,fillSpace:!1,mode:"erase"},terminal:{interval:[25,30],delay:[0,0],steps:0,changeChance:.5,maxGhosts:0,oneAtATime:1,glyphs:"",fillSpace:!1,glyphsFromText:!1,mode:"clear"},zalgo:{delay:[0,3e3],interval:[10,35],steps:[0,30],maxGhosts:4.6,changeChance:.5,ghostChance:.7,glyphs:d.zalgo,glyphsFromText:!0,fillSpace:!1},neo:{interval:[30,100],delay:[0,1300],steps:[4,7],maxGhosts:0,ghostChance:0,changeChance:1,glyphs:d.neo,mode:"normal"},encrypted:{interval:[50,90],delay:[0,1300],steps:[5,8],maxGhosts:0,ghostChance:0,changeChance:1,glyphs:d.uppercase,fillSpace:!1,mode:"normal"},bitbybit:{interval:[35,65],delay:180,steps:1,maxGhosts:1,ghostChance:.1,changeChance:.7,oneAtATime:"word",glyphs:"",glyphsFromText:!0,fillSpace:!1,mode:"erase"},cosmic:{steps:[0,1],interval:30,delay:[400,2400],ghostChance:0,changeChance:.3,maxGhosts:0,glyphs:"QWERTYUIOPASDFGHJKLZXCVBNM",glyphsFromText:!1,fillSpace:!0,mode:"erase"}};class m{constructor(t,e){this.writer=t,this.set(e)}set(t){this.options=Object.assign(Object.assign({},f.default),this.parseOptions(t)),this.updateInternal()}extend(t){this.options=Object.assign(Object.assign({},this.options),this.parseOptions(t)),this.updateInternal()}parseOptions(t){var e;return t?"string"==typeof t?null!==(e=f[t])&&void 0!==e?e:{}:t:{}}updateInternal(){const{options:t}=this;this.glyphs=function(t){let e;return e="string"==typeof t?t:t.length?t.join(""):Array.from(t).join(""),e}(t.glyphs),this.setCharset(),this.space=t.fillSpace?" ":"",Number.isInteger(t.oneAtATime)?this.oneAtATime=t.oneAtATime:"word"===t.oneAtATime?this.oneAtATime="word":this.oneAtATime=t.oneAtATime?1:0}setCharset(){const{writer:t}=this;let{glyphs:e}=this;this.glyphsFromText&&(e+=function(t){const e="string"==typeof t,s=[];return new Set(t).forEach((t=>s.push(t))),e?s.join(""):s}(t.previousString+(this.html?g(t.goalText):t.goalText))),this.charset=[...e].filter((t=>!["\t","\n","\r","\f","\v"].includes(t))),this.setMaxGhosts()}setMaxGhosts(){const{writer:{charTable:t},options:{maxGhosts:e}}=this;Number.isInteger(e)&&(this.maxGhosts=e);const{length:s}=t.filter((t=>"tag"!==t.specialType));this.maxGhosts=Math.round((s||20)*e)}getGlyph(t){const{options:e}=this;return e.genGlyph?e.genGlyph(t,this.baseGetGlyph):this.baseGetGlyph()}baseGetGlyph(){var t,e;return null!==(t=(e=this.charset)[s(0,e.length,"floor")])&&void 0!==t?t:""}get steps(){return o(this.options.steps)}get interval(){return o(this.options.interval)}getDelay(t){const{options:e}=this;return e.genDelay?e.genDelay(t,this.baseGetDelay):this.baseGetDelay()}baseGetDelay(){return o(this.options.delay)}get mode(){return this.options.mode}get html(){return this.options.html}get endless(){return this.options.endless}get fps(){return this.options.fps}get letterize(){return this.options.letterize}get ghostChance(){return this.options.ghostChance}get changeChance(){return this.options.changeChance}get glyphsFromText(){return this.options.glyphsFromText}}class y{constructor(t){this.nGhosts=0,this.progress={percent:0,done:0,todo:0,increase(){this.done++,this.percent=this.done/this.todo},reset(t){this.percent=0,this.done=0,this.todo=t},finish(){this.done=this.todo,this.percent=1}},this.isTyping=!1,this.isPaused=!1,this.finished=!0,this.erasing=!1,this.writer=t,this.maxGhosts=this.writer.options.maxGhosts}get ghostsInLimit(){return this.nGhosts<this.maxGhosts}play(){this.isTyping=!0,this.isPaused=!1,this.finished=!1,this.toggleClass(!0),this.maxGhosts=this.writer.options.maxGhosts,this.writer.animator.run(),this.writer.emiter.callback("start",this.writer.goalText,this.writer.writerData)}pause(){this.isTyping=!1,this.isPaused=!0,this.toggleClass(!1)}finish(){this.progress.finish(),this.isTyping=!1,this.finished=!0,this.toggleClass(!1)}toggleClass(t){const e=this.writer.htmlElement,s="gw-writing";t?((t,e)=>{t.classList.remove(e),t.offsetWidth,t.classList.add(e)})(e,s):e.classList.remove(s)}}class v{constructor(t){this.callbacks={start:[],step:[],finish:[]},this.writer=t}addCallback(t,e){this.callbacks[t].push(e)}removeCallback(t,e){const s=this.callbacks[t],i=s.indexOf(e);return-1!==i&&(s.splice(i,1),!0)}callback(t,...e){this.callbacks[t].forEach((t=>t(...e)))}call(t){const{writer:e}=this;e.updateString();const{writerData:s,string:i}=e;if(e.options.letterize&&e.htmlElement.setAttribute("data-gw-string",e.options.html?g(i):i),"step"===t)return this.callback("step",i,s);e.state.finish(),e.state.erasing||(this.callback("finish",i,s),this.emitEvent())}emitEvent(){const{htmlElement:t,writerData:e}=this.writer;"undefined"!=typeof CustomEvent&&t.dispatchEvent(new CustomEvent("gw-finished",{detail:e}))}}var w=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function h(t){try{a(i.next(t))}catch(t){r(t)}}function o(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(h,o)}a((i=i.apply(t,e||[])).next())}))};class T{constructor(t,e,s,i="",n,r){this.ghosts=[[],[]],this.stop=!1,this.afterGlitchChance=0,this.writer=t,this.setProps(e,s,i,n,r),t.options.letterize&&(this.els={ghostsBeforeEl:document.createElement("span"),letterEl:document.createElement("span"),ghostsAfterEl:document.createElement("span")},this.els.ghostsBeforeEl.className="gw-ghosts",this.els.ghostsAfterEl.className="gw-ghosts",this.els.letterEl.className="gw-letter")}setProps(t,e,s="",i,n){const{options:r}=this.writer;this.index=n,this.l=t,this.gl=e,this.specialType=i,this.ghosts[0]=[...s],this.writer.state.nGhosts+=s.length,this.stepsLeft=r.steps,"tag"===i?this.stepsLeft=0:(t=>["\t","\n","\r","\f","\v",""," "].includes(t))(e)&&(this.specialType="whitespace"),this.afterGlitchChance=(r.ghostChance+r.changeChance)/3.7}reset(t,e,s="",i,n){this.setProps(t,e,s,i,n),this.els&&(this.els.letterEl.className="gw-letter")}get string(){const{l:t,ghosts:e}=this;return e[0].join("")+t+e[1].join("")}get finished(){const{l:t,gl:e,ghosts:s}=this;return t===e&&0===s[0].length&&0===s[1].length||"tag"===this.specialType}get interval(){let{interval:t}=this.writer.options;return"whitespace"===this.specialType&&(t/=1.8),t}writeToElement(){if(!this.els)return;const{ghostsBeforeEl:t,ghostsAfterEl:e,letterEl:s}=this.els;s.innerHTML=this.l,t.textContent=this.ghosts[0].join(""),e.textContent=this.ghosts[1].join("")}set spanElement(t){this.els&&(this.els.charEl=t,this.appendChildren())}appendChildren(){var t,e;null===(e=null===(t=this.els)||void 0===t?void 0:t.charEl)||void 0===e||e.append(this.els.ghostsBeforeEl,this.els.letterEl,this.els.ghostsAfterEl),this.writeToElement()}type(){var t,e,s;return w(this,void 0,void 0,(function*(){const{writer:i}=this;return"tag"===this.specialType?(this.l=this.gl,i.emiter.call("step"),i.state.progress.increase(),!0):(yield n(i.options.getDelay(this)),yield r((()=>(!this.finished||i.options.endless)&&!i.state.isPaused&&!this.stop),(()=>w(this,void 0,void 0,(function*(){yield n(this.interval);const t=this.string;this.step(),t!==this.string&&(i.emiter.call("step"),this.writeToElement()),!i.options.endless&&this.stepsLeft--})))),this.finished&&(i.state.progress.increase(),null===(e=null===(t=this.els)||void 0===t?void 0:t.charEl)||void 0===e||e.classList.add("gw-finished"),null===(s=this.els)||void 0===s||s.letterEl.classList.remove("gw-glitched")),this.finished)}))}step(){var t,e;const{writer:s}=this;if(this.stepsLeft>0&&this.l!==this.gl||a(this.afterGlitchChance)&&"whitespace"!==this.specialType||s.options.endless){const{ghostChance:e,changeChance:i}=s.options;a(e)&&(s.state.ghostsInLimit?this.addGhost():this.removeGhost()),a(i)&&(null===(t=this.els)||void 0===t||t.letterEl.classList.add("gw-glitched"),this.l=s.options.getGlyph(this))}else this.finished||(null===(e=this.els)||void 0===e||e.letterEl.classList.remove("gw-glitched"),this.l=this.gl,this.removeGhost())}addGhost(){const{writer:t,ghosts:e}=this,s=t.options.getGlyph(this);t.state.nGhosts++,a()?x(e[0],s):x(e[1],s)}removeGhost(){const{writer:t,ghosts:e}=this;(a()&&e[0].length>0?i(e[0]):i(e[1]))&&t.state.nGhosts--}}function x(t,e){const{length:i}=t;t.splice(s(0,i,"floor"),0,e)}function E(){const t="clear"===this.options.mode&&this.state.finished?"":this.previousString;"matching"===this.options.mode?b.call(this,t):C.call(this,t)}function b(t){const e=Math.min(Math.ceil(this.options.maxGhosts/2),5),s=G.call(this,t);let i=-1;s.forEach(((s,n)=>{if(i++,"tag"===s.type)return i--,void A.call(this,n,"",s);const r=""!==s.value?t.indexOf(s.value,i):-1;if(-1!==r&&r-i<=e){const e=t.substring(i,r);A.call(this,n,s.value,s,e),i=r}else A.call(this,n,t[i],s)})),S(this.charTable,s.length)}function C(t){const e=G.call(this,t);let s=-1;e.forEach(((e,i)=>{if(s++,"tag"===e.type)return s--,void A.call(this,i,"",e);A.call(this,i,t[s],e)})),S(this.charTable,e.length)}function G(t){const{options:e,goalText:s}=this,i=e.html?function(t){const e=new RegExp(p,"gi"),s=[];let i,n=0;for(;i=e.exec(t);){const r=i.index,h=e.lastIndex,o=t.slice(n,r);n=h,o&&s.push(...c(o));const a={value:i[0],type:void 0!==i[1]?"html_entity":"tag"};s.push(a)}return t.length>n&&s.push(...c(t.slice(n))),s}(s):c(s),n=Math.max(0,t.length-i.length);if(this.options.oneAtATime)return i.concat(c(h("",n)));const r=Math.ceil(n/2),o=Math.floor(n/2);return c(h("",r)).concat(i,c(h("",o)))}function A(t,e,s,i){const{charTable:n,options:r}=this,h=n[t];h?h.reset(null!=e?e:"",s.value||r.space,i,s.type,t):n.push(new T(this,null!=e?e:"",s.value||r.space,i,s.type,t))}function S(t,e){t.splice(e,t.length-e)}function P(){if(!this.options.letterize)return;const t=this.charTable.map((({specialType:t,gl:e})=>"tag"===t?e:'<span class="gw-char"></span>')).join("");this.htmlElement.innerHTML=t;const e=this.htmlElement.querySelectorAll("span.gw-char");let s=0;this.charTable.forEach((t=>{"tag"!==t.specialType&&(t.spanElement=e[s],s++)}))}var j=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function h(t){try{a(i.next(t))}catch(t){r(t)}}function o(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(h,o)}a((i=i.apply(t,e||[])).next())}))};function M(t){const{charTable:e,state:s}=this,i=[];let n;n=e.filter(((t,e)=>"tag"!==t.specialType&&"html_entity"!==t.specialType&&(i.push(e),!0))).map((t=>t.gl)).join("").match(u);const h=[];{let t=-1,s=-1,r=-1;const o=()=>h[h.length-1];null==n||n.forEach((n=>{h.push([]),[...n].forEach((()=>{if(t++,s=i[t],r++,r!==s){for(let t=r;t<s;t++)o().push(e[t]);r=s}o().push(e[s])}))})),h.length||h.push([]);for(let t=s+1;t<e.length;t++)o().push(e[t])}h.reverse();let o=!0,a=!1;const l=()=>j(this,void 0,void 0,(function*(){var t;const e=h.pop();if(!e)return a=!0;const s=e.map((t=>t.type()));o=null!==(t=(yield Promise.all(s)).every((t=>t)))&&void 0!==t&&t}));t.push((()=>j(this,void 0,void 0,(function*(){return yield r((()=>!a&&o&&!s.isPaused),l),a&&o&&!s.isPaused})))())}var O=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function h(t){try{a(i.next(t))}catch(t){r(t)}}function o(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(h,o)}a((i=i.apply(t,e||[])).next())}))};function D(t,e){var s;const{charTable:i,state:n,options:h}=this,o=null!==(s=null==e?void 0:e.reverse)&&void 0!==s&&s?[...i]:[...i].reverse(),a=()=>O(this,void 0,void 0,(function*(){let t=!0,e=!1;return yield r((()=>!e&&t&&!n.isPaused),(()=>O(this,void 0,void 0,(function*(){var s;const i=o.pop();i?t=null!==(s=yield i.type())&&void 0!==s&&s:e=!0})))),e&&t&&!n.isPaused}));for(let e=0;e<h.oneAtATime;e++)t.push(a())}class W{constructor(t){this.last=0,this.rate=16,this.running=!1,this.writer=t}run(){this.running||this.writer.options.letterize||(this.rate=Math.floor(1e3/this.writer.options.fps),this.running=!0,requestAnimationFrame(this.frame.bind(this)))}frame(t){return this.writer.state.isTyping?(this.last||(this.last=t),t-this.last<this.rate||(this.animate.call(this),this.last=t),requestAnimationFrame(this.frame.bind(this))):(this.animate.call(this),this.running=!1)}animate(){const{htmlElement:t,string:e}=this.writer;this.writer.options.html?t.innerHTML=e:t.textContent=e,t.setAttribute("data-gw-string",this.writer.options.html?g(e):e)}}var L=function(t,e,s,i){return new(s||(s=Promise))((function(n,r){function h(t){try{a(i.next(t))}catch(t){r(t)}}function o(t){try{a(i.throw(t))}catch(t){r(t)}}function a(t){var e;t.done?n(t.value):(e=t.value,e instanceof s?e:new s((function(t){t(e)}))).then(h,o)}a((i=i.apply(t,e||[])).next())}))};class R{constructor(t,e,s){var i;this.charTable=[],this.goalText="",this.lastText="",this.string="",this.htmlElement=t?"string"==typeof t?null!==(i=document.querySelector(t))&&void 0!==i?i:document.createElement("span"):t:document.createElement("span"),this.htmlElement.$writer=this,this.options=new m(this,e),this.state=new y(this),this.emiter=new v(this),s&&this.emiter.addCallback("finish",s),this.animator=new W(this),this.string=this.previousString}updateString(){this.string=this.charTable.map((t=>t.string)).join("")}get previousString(){let t=this.htmlElement.textContent;return"string"!=typeof t&&(t=this.options.html?g(this.string):this.string),t=t.trim(),t}get writerData(){const{options:t,state:e,string:s}=this;return{string:s,writer:this,options:t,state:e}}write(t){return L(this,void 0,void 0,(function*(){return this.manageWriting(t)}))}add(t){return L(this,void 0,void 0,(function*(){const{previousString:e}=this;return this.write(e+t)}))}remove(t){return L(this,void 0,void 0,(function*(){const{previousString:e}=this,s=Array.from(e);return s.splice(-t),this.write(s.join(""))}))}endless(t){this.options.extend({endless:t})}addCallback(t,e){this.emiter.addCallback(t,e)}removeCallback(t,e){this.emiter.removeCallback(t,e)}play(){return L(this,void 0,void 0,(function*(){return this.manageWriting(null)}))}pause(){this.state.pause()}manageWriting(t){return L(this,void 0,void 0,(function*(){if(null!==t&&(this.lastText=t),"erase"===this.options.mode&&(this.state.finished||this.state.erasing)){this.state.erasing=!0;const t=this.genGoalStringToErase(this.lastText);if(this.preparePropertiesBeforeWrite(t),yield this.playChT({reverse:0!==this.options.oneAtATime}),!this.state.finished)return this.getWriterData("ERROR","Erasing did not finish.");this.state.erasing=!1}return this.preparePropertiesBeforeWrite(this.lastText),this.pause(),this.playChT()}))}preparePropertiesBeforeWrite(t){this.goalText=t,this.state.nGhosts=0,this.options.setCharset(),E.call(this),this.state.progress.reset(this.charTable.length),P.call(this)}playChT(t){return L(this,void 0,void 0,(function*(){const e=[],{charTable:s,state:i,options:n}=this;if(i.isTyping)return this.getWriterData("ERROR","The writer is already typing.");i.play(),n.oneAtATime>0?D.call(this,e,t):"word"===n.oneAtATime?M.call(this,e):s.forEach((t=>e.push(t.type())));try{const t=(yield Promise.all(e)).every((t=>t));return this.returnResult(t)}catch(t){return this.getWriterData("ERROR","Writer encountered an error.",t)}}))}returnResult(t){return t?this.emiter.call("finish"):this.emiter.call("step"),t?this.getWriterData("SUCCESS","The writer finished typing."):this.getWriterData("ERROR","Writer failed to finish typing.")}getWriterData(t,e,s){const{writerData:i}=this;return Object.assign(Object.assign({},i),{status:t,message:e,error:s})}genGoalStringToErase(t){var e;const{previousString:s}=this;let i="";for(let n=0;n<t.length;n++){const r=t[n],h=null!==(e=s[n])&&void 0!==e?e:"";if(r!==h)break;i+=h}const n=Math.max(t.length-i.length,0);return n>0&&" "===this.options.space&&(i=i.padEnd(n+i.length," ")),i}}function k(t,e,s,i){return L(this,void 0,void 0,(function*(){return new R(e,s,i).write(t)}))}const F=(t,e,s)=>new R(t,e,s);return e})()}));
//# sourceMappingURL=index.min.map
{
"name": "glitched-writer",
"version": "2.0.26",
"version": "2.0.27",
"description": "Glitched, text writing module. Highly customizable settings. Decoding, decrypting, scrambling, or simply spelling out text.",

@@ -5,0 +5,0 @@ "author": "Damian Tarnawski @thetarnav <gthetarnav@gmail.com>",

@@ -18,3 +18,3 @@ # Glitched Writer

- Callback functions firing on finish and every step.
- Adding Callback functions to fire on writer events (start, step, finish).

@@ -29,3 +29,3 @@ - Custom Event **gw-finished** will be dispatched on the HTML Element.

- Written fully in **Typescript**.
- Written in **Typescript**.

@@ -47,3 +47,3 @@ ---

- [On Text Input](#on-text-input)
- [Listening For Events](#listening-for-events)
- [Callbacks | Events](#callbacks-|-events)
- [Add & Remove](#add--remove)

@@ -108,3 +108,2 @@ - [Writing HTML](#writing-html)

options, // {...} / Preset name / undefined
onStepCallback, // (string, data) => {} / undefined
onFinishCallback, // (string, data) => {} / undefined

@@ -120,3 +119,3 @@ )

// On-step-callback added:
// On-finish-callback added:
const Writer = new GlitchedWriter(htmlElement, {}, (string, writerData) => {

@@ -187,9 +186,22 @@ console.log(`Current string: ${string}`)

### Listening For Events
### Callbacks | Events
```js
// html element that you passed in writer constructor.
// your html element:
textHtmlElement.addEventListener('gw-finished', e =>
console.log('finished writing:', e.detail.string),
)
/**
* Adding callbacks: writer.addCallback(type, callback)
*
* @param type "start" | "step" | "finish"
* @param callback your callback function: (string, writerData) => {}
*/
const startCB = string => console.log('Started writing:', string)
// add
writer.addCallback('start', startCB)
// remove
writer.removeCallback('start', startCB)
```

@@ -332,3 +344,3 @@

To use one of the available presets, You can simply write it's name when creating writer, in the place of options.
Available presets as for now:
Available presets, as for now:

@@ -351,2 +363,4 @@ - **[default](https://codepen.io/thetarnav/pen/MWWyPzY)** - Loaded automatically, featured on the GIF up top.

- **[cosmic](https://codepen.io/thetarnav/pen/ExWgYer)** - Text slowly appears from and vanishes to the hollowness of space. Use with preserved sequences of white space _(white-space: pre-wrap;)_
```js

@@ -448,3 +462,3 @@ new GlitchedWriter(htmlElement, 'terminal')

- **endless** - It will make the animation endless. _But why?_ Well, you can disable this option while the animation is running _(writer.options.endless = false)_ and finish the animation when you want.
- **endless** - It will make the animation endless. _But why?_ Well, you can disable this option while the animation is running _( writer.endless(false) )_ and finish the animation when you want.

@@ -457,6 +471,13 @@ - **fps** - Animation loop is done using requestAnimationFrame, with fps you can controll the maximum framerate of writing animation. Only actually matters for high refresh monitors. _(! wont have an effect with letterize enabled !_)

```ts
/**
* @param char - Char for which to generate value
* @param base - default function generating that value
*/
```
- **genGlyph** - function that will be used to generate a ghost/glitched char. Can be used to control which and when different characters will be used, instead of it being a random sample from glyphs list. _E.g. numbers "9" to "1" depending on writing progress._
```ts
genGlyph?: (char: Char, writer: GlitchedWriter) => string
genGlyph?: (char: Char, base: Function) => string
```

@@ -467,3 +488,3 @@

```ts
genDelay?: (char: Char, writer: GlitchedWriter) => number // [ms]
genDelay?: (char: Char, base: Function) => number // [ms]
```

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc