• Jump To … +
    ./source/asset-management/image-asset.js ./source/asset-management/noise-asset.js ./source/asset-management/raw-asset.js ./source/asset-management/reaction-diffusion-asset.js ./source/asset-management/sprite-asset.js ./source/asset-management/video-asset.js ./source/core/animation-loop.js ./source/core/display-cycle.js ./source/core/document.js ./source/core/events.js ./source/core/init.js ./source/core/library.js ./source/core/snippets.js ./source/core/user-interaction.js ./source/factory/action.js ./source/factory/anchor.js ./source/factory/animation.js ./source/factory/bezier.js ./source/factory/block.js ./source/factory/button.js ./source/factory/canvas.js ./source/factory/cell.js ./source/factory/cog.js ./source/factory/color.js ./source/factory/conic-gradient.js ./source/factory/crescent.js ./source/factory/element.js ./source/factory/emitter.js ./source/factory/enhanced-label.js ./source/factory/filter.js ./source/factory/gradient.js ./source/factory/grid.js ./source/factory/group.js ./source/factory/label.js ./source/factory/line-spiral.js ./source/factory/line.js ./source/factory/loom.js ./source/factory/mesh.js ./source/factory/net.js ./source/factory/oval.js ./source/factory/particle-force.js ./source/factory/particle-spring.js ./source/factory/particle-world.js ./source/factory/particle.js ./source/factory/pattern.js ./source/factory/picture.js ./source/factory/polygon.js ./source/factory/polyline.js ./source/factory/quadratic.js ./source/factory/radial-gradient.js ./source/factory/rectangle.js ./source/factory/render-animation.js ./source/factory/shape.js ./source/factory/spiral.js ./source/factory/stack.js ./source/factory/star.js ./source/factory/tetragon.js ./source/factory/ticker.js ./source/factory/tracer.js ./source/factory/tween.js ./source/factory/unstacked-element.js ./source/factory/wheel.js ./source/helper/array-pool.js ./source/helper/color-engine.js ./source/helper/document-root-elements.js ./source/helper/filter-engine-bluenoise-data.js ./source/helper/filter-engine.js ./source/helper/random-seed.js ./source/helper/shape-path-calculation.js ./source/helper/shared-vars.js ./source/helper/system-flags.js ./source/helper/utilities.js ./source/helper/workstore.js ./source/mixin/anchor.js ./source/mixin/asset-advanced-functionality.js ./source/mixin/asset-consumer.js ./source/mixin/asset.js ./source/mixin/base.js ./source/mixin/button.js ./source/mixin/cascade.js ./source/mixin/cell-key-functions.js ./source/mixin/delta.js ./source/mixin/display-shape.js ./source/mixin/dom.js ./source/mixin/entity.js ./source/mixin/filter.js ./source/mixin/hidden-dom-elements.js ./source/mixin/mimic.js ./source/mixin/path.js ./source/mixin/pattern.js ./source/mixin/pivot.js ./source/mixin/position.js ./source/mixin/shape-basic.js ./source/mixin/shape-curve.js ./source/mixin/styles.js ./source/mixin/text.js ./source/mixin/tween.js ./source/scrawl.js ./source/untracked-factory/cell-fragment.js ./source/untracked-factory/coordinate.js ./source/untracked-factory/drag-zone.js ./source/untracked-factory/keyboard-zone.js ./source/untracked-factory/observe-update.js ./source/untracked-factory/palette.js ./source/untracked-factory/particle-history.js ./source/untracked-factory/quaternion.js ./source/untracked-factory/state.js ./source/untracked-factory/text-style.js ./source/untracked-factory/vector.js
  • §

    Shared variables

    export const _abs = Math.abs;
    export const _assign = Object.assign;
    export const _acos = Math.acos;
    export const _atan2 = Math.atan2;
    export const _ceil = Math.ceil;
    export const _computed = window.getComputedStyle;
    export const _cos = Math.cos;
    export const _create = Object.create;
    export const _entries = Object.entries;
    export const _floor = Math.floor;
  • §

    Note that, when developing in files that imports arrays from this file, those arrays should be frozen - Object.freeze([...etc]). This is to prevent any code adding attributes to it (`Object.seal({}) would also do the job). Sadly, Object freezing (and sealing) has a slight detriment to performance as the JS engine may perform additional checks when encountering frozen objects/arrays which are not required when we already know the code does not add any attributes to it

    export const _freeze = Object.freeze; export const _seal = Object.seal;

    export const _hypot = Math.hypot;
    export const _isArray = Array.isArray;
    export const _isFinite = Number.isFinite;
    export const _keys = Object.keys;
    export const _max = Math.max;
    export const _min = Math.min;
    export const _now = Date.now;
    export const _parse = JSON.parse;
    export const _piDouble = Math.PI * 2;
    export const _piHalf = Math.PI * 0.5;
    export const _pow = Math.pow;
    export const _radian = Math.PI / 180;
    export const _random = Math.random;
    export const _round = Math.round;
    export const _setPrototypeOf = Object.setPrototypeOf;
    export const _sin = Math.sin;
    export const _sqrt = Math.sqrt;
    export const _tan = Math.tan;
    export const _tick = 16 / 1000;
    export const _values = Object.values;
    
    export const $BODY = 'BODY';
    export const $IMAGE = 'image_';
    export const $VIDEO = 'video_';
    export const _2D = '2d';
    export const ABSOLUTE = 'absolute';
    export const ACCEPTED_WRAPPERS = ['Canvas', 'Stack'];
    export const ADD_EVENT_LISTENER = 'addEventListener';
    export const ALPHA_TO_CHANNELS = 'alpha-to-channels';
    export const ALPHA_TO_LUMINANCE = 'alpha-to-luminance';
    export const ALPHABETIC = 'alphabetic';
    export const ANCHOR = 'anchor';
    export const ANIMATION = 'animation';
    export const ANONYMOUS = 'anonymous';
    export const AREA_ALPHA = 'area-alpha';
    export const ARG_SPLITTER = ',';
    export const ARIA_HIDDEN = 'aria-hidden';
    export const ARIA_LIVE = 'aria-live';
    export const ASSET = 'asset';
    export const ASSET_IMPORT_REGEX = /.*\/(.*?)\./;
    export const AUTO = 'auto';
    export const AUTOFOCUS = 'autofocus';
    export const AVERAGE_CHANNELS = 'average-channels';
    export const BEZIER = 'bezier';
    export const BLACK = 'rgb(0 0 0 / 1)';
    export const BLACK_WHITE = 'black-white';
    export const BLANK = 'rgb(0 0 0 / 0)';
    export const BLEND = 'blend';
    export const BLOCK = 'block';
    export const BLUENOISE = 'bluenoise';
    export const BLUR = 'blur';
    export const BLUR_ACTION = 'blurAction';
    export const BORDER_BOX = 'border-box';
    export const BOTTOM = 'bottom';
    export const CANVAS = 'canvas';
    export const CENTER = 'center';
    export const CHANNELS_TO_ALPHA = 'channels-to-alpha';
    export const CHROMA = 'chroma';
    export const CLAMP_CHANNELS = 'clamp-channels';
    export const CLAMP_VALUES = ['down', 'round', 'up'];
    export const CLEAR = 'clear';
    export const CLICK = 'click';
    export const CLICK_ACTION = 'clickAction';
    export const CLOSE = 'close';
    export const COLOR = 'color';
    export const COLORS_TO_ALPHA = 'colors-to-alpha';
    export const COMPOSE = 'compose';
    export const CONTROL = 'control';
    export const COORD = 'coord';
    export const CORNER_LABELS = ['topLeft', 'topRight', 'bottomRight', 'bottomLeft'];
    export const CORNER_SELECTOR = '[data-scrawl-corner-div="sc"]';
    export const CORRODE = 'corrode';
    export const DATA_SCRAWL_GROUP = 'data-scrawl-group';
    export const DATA_TAB_ORDER = 'data-tab-order';
    export const DEFAULT_FONT = '12px sans-serif';
    export const DEFAULT_SEED = 'any_random_string_will_do';
    export const DESCRIPTION = 'description';
    export const DESTINATION_OUT = 'destination-out';
    export const DESTINATION_OVER = 'destination-over';
    export const DIMENSIONS = 'dimensions';
    export const DISABLED = 'disabled';
    export const DISPLACE = 'displace';
    export const DISPLAY_P3 = 'display-p3';
    export const DIV = 'div';
    export const DOWN = 'down';
    export const DOWNLOAD = 'download';
    export const ELEMENT = 'element';
    export const EMBOSS = 'emboss';
    export const END = 'end';
    export const END_CONTROL = 'endControl';
    export const ENTER = 'enter';
    export const ENTITY = 'entity';
    export const EULER = 'euler';
    export const FILL = 'fill';
    export const FILTER = 'filter';
    export const FLOOD = 'flood';
    export const FOCUS = 'focus';
    export const FOCUS_ACTION = 'focusAction';
    export const FONT_USERS = ['Label', 'EnhancedLabel'];
    export const FORM = 'form';
    export const FUNCTION = 'function';
    export const GAUSSIAN_BLUR = 'gaussian-blur';
    export const GLITCH = 'glitch';
    export const GOOD_HOST = ['Cell', 'CellFragment'];
    export const GRAYSCALE = 'grayscale';
    export const GREEN = 'green';
    export const HANGING = 'hanging';
    export const HEIGHT = 'height';
    export const HIGH = 'high';
    export const HREF = 'href';
    export const HREFLANG = 'hreflang';
    export const IDEOGRAPHIC = 'ideographic';
    export const IMG = 'img';
    export const INT_COLOR_SPACES = ['rgb', 'hsl', 'hwb', 'xyz', 'lab', 'lch', 'oklab', 'oklch'];
    export const INVERT_CHANNELS = 'invert-channels';
    export const LEAVE = 'leave';
    export const LEFT = 'left';
    export const LINE_DASH = 'lineDash';
    export const LINEAR = 'linear';
    export const LOCK_CHANNELS_TO_LEVELS = 'lock-channels-to-levels';
    export const LTR = 'ltr';
    export const LUMINANCE_TO_ALPHA = 'luminance-to-alpha';
    export const MAP_TO_GRADIENT = 'map-to-gradient';
    export const MATRIX = 'matrix';
    export const MEAN = 'mean';
    export const MIMIC = 'mimic';
    export const MIDDLE = 'middle';
    export const MODIFY_OK_CHANNELS = 'modify-ok-channels';
    export const MODULATE_CHANNELS = 'modulate-channels';
    export const MODULATE_OK_CHANNELS = 'modulate-ok-channels';
    export const MOUSE = 'mouse';
    export const MOUSE_DOWN = 'mousedown';
    export const MOUSE_ENTER = 'mouseenter';
    export const MOUSE_LEAVE = 'mouseleave';
    export const MOUSE_MOVE = 'mousemove';
    export const MOUSE_UP = 'mouseup';
    export const MOVE = 'move';
    export const MULTIPLY = 'multiply';
    export const NAME = 'name';
    export const NEGATIVE = 'negative';
    export const NEWSPRINT = 'newsprint';
    export const NONE = 'none';
    export const NORMAL = 'normal';
    export const OFFSET = 'offset';
    export const PARTICLE = 'particle';
    export const PATH = 'path';
    export const PC = '%';
    export const PC0 = '0%';
    export const PC100 = '100%';
    export const PC50 = '50%';
    export const PING = 'ping';
    export const PIVOT = 'pivot';
    export const PIXELATE = 'pixelate';
    export const POINTER_DOWN = 'pointerdown';
    export const POINTER_ENTER = 'pointerenter';
    export const POINTER_LEAVE = 'pointerleave';
    export const POINTER_MOVE = 'pointermove';
    export const POINTER_UP = 'pointerup';
    export const POLITE = 'polite';
    export const PROCESS_IMAGE = 'process-image';
    export const PX0 = '0px';
    export const QUADRATIC = 'quadratic';
    export const RADIUS_X = ['radiusX'];
    export const RADIUS_XY = ['radiusX', 'radiusY'];
    export const RADIUS_Y = ['radiusY'];
    export const RANDOM = 'random';
    export const RANDOM_NOISE = 'random-noise';
    export const RECT = 'rect';
    export const RECTANGLE = 'rectangle';
    export const RED = 'red';
    export const REDUCE_PALETTE = 'reduce-palette';
    export const REFERRERPOLICY = 'referrerpolicy';
    export const REL = 'rel';
    export const RELATIVE = 'relative';
    export const REMOVE_EVENT_LISTENER = 'removeEventListener';
    export const REVERSE_BY_DELTA = 'reverseByDelta';
    export const RGB = 'rgb';
    export const RIGHT = 'right';
    export const ROLE = 'role';
    export const ROOT = 'root';
    export const ROTATE_HUE = 'rotate-hue';
    export const ROUND = 'round';
    export const SET_CHANNEL_TO_LEVEL = 'set-channel-to-level';
    export const SOURCE = 'source';
    export const SOURCE_IN = 'source-in';
    export const SOURCE_OUT = 'source-out';
    export const SOURCE_OVER = 'source-over';
    export const SPACE = ' ';
    export const SRGB = 'srgb';
    export const START = 'start';
    export const START_CONTROL = 'startControl';
    export const STATE_ALL_KEYS = ['direction', 'fillStyle', 'filter', 'font', 'fontKerning', 'fontStretch', 'fontVariantCaps', 'globalAlpha', 'globalCompositeOperation', 'imageSmoothingEnabled', 'imageSmoothingQuality', 'letterSpacing', 'lineCap', 'lineDash', 'lineDashOffset', 'lineJoin', 'lineWidth', 'miterLimit', 'shadowBlur', 'shadowColor', 'shadowOffsetX', 'shadowOffsetY', 'strokeStyle', 'textAlign', 'textBaseline', 'textRendering', 'wordSpacing'];
    export const STATE_KEYS = ['fillStyle', 'filter', 'globalAlpha', 'globalCompositeOperation', 'imageSmoothingEnabled', 'imageSmoothingQuality', 'lineCap', 'lineDash', 'lineDashOffset', 'lineJoin', 'lineWidth', 'miterLimit', 'shadowBlur', 'shadowColor', 'shadowOffsetX', 'shadowOffsetY', 'strokeStyle'];
    export const STATE_LABEL_KEYS = ['direction', 'font', 'fontKerning', 'fontStretch', 'fontVariantCaps', 'letterSpacing', 'textRendering', 'wordSpacing'];
    export const STEP_CHANNELS = 'step-channels';
    export const STYLES = 'styles';
    export const SUBSCRIBE = 'subscribe';
    export const SWIRL = 'swirl';
    export const T_ACTION = 'Action';
    export const T_BEZIER = 'Bezier';
    export const T_CANVAS = 'Canvas';
    export const T_CELL = 'Cell';
    export const T_COLOR = 'Color';
    export const T_COORDINATE = 'Coordinate';
    export const T_ENHANCED_LABEL = 'EnhancedLabel';
    export const T_FILTER = 'Filter';
    export const T_GRID = 'Grid';
    export const T_GROUP = 'Group';
    export const T_IMAGE = 'Image';
    export const T_LABEL = 'Label';
    export const T_LINE = 'Line';
    export const T_NET = 'Net';
    export const T_NOISE = 'Noise';
    export const T_COLOR_ENGINE = 'ColorEngine';
    export const T_PALETTE = 'Palette';
    export const T_PARTICLE = 'Particle';
    export const T_PICTURE = 'Picture';
    export const T_POLYLINE = 'Polyline';
    export const T_QUADRATIC = 'Quadratic';
    export const T_QUATERNION = 'Quaternion';
    export const T_RAW_ASSET = 'RawAsset';
    export const T_RD_ASSET = 'RdAsset';
    export const T_RENDER_ANIMATION = 'RenderAnimation';
    export const T_SPRITE = 'Sprite';
    export const T_STACK = 'Stack';
    export const T_TICKER = 'Ticker';
    export const T_TWEEN = 'Tween';
    export const T_VECTOR = 'Vector';
    export const T_VIDEO = 'Video';
    export const T_WORLD = 'World';
    export const TAB_ORDER = 'tabOrder';
    export const TARGET = 'target';
    export const THRESHOLD = 'threshold';
    export const TILE_MODES = ['rect', 'hex', 'random', 'points'];
    export const TILES = 'tiles';
    export const TINT_CHANNELS = 'tint-channels';
    export const TOP = 'top';
    export const TOUCH_CANCEL = 'touchcancel';
    export const TOUCH_END = 'touchend';
    export const TOUCH_MOVE = 'touchmove';
    export const TOUCH_START = 'touchstart';
    export const TRUE = 'true';
    export const TWEEN = 'tween';
    export const TYPE = 'type';
    export const UNDEF = 'undefined';
    export const UNKNOWN = 'unknown';
    export const UP = 'up';
    export const UPDATE_BY_DELTA = 'updateByDelta';
    export const USER_DEFINED_LEGACY = 'user-defined-legacy';
    export const VALUE = 'value';
    export const VARY_CHANNELS_BY_WEIGHTS = 'vary-channels-by-weights';
    export const VIDEO = 'video';
    export const WHITE = 'rgb(255 255 255 / 1)';
    export const WIDTH = 'width';
    export const ZERO_PATH = 'M0,0';
    export const ZERO_STR = '';