@makefully/platypus 4.1.4 → 4.1.6

package/src/mixins/PIXI.Graphics.js

@@ -0,0 +1,41 @@
+/**
+ * This adds support for a tiny API to PIXI.Graphics similar to the CreateJS Graphics API. This is used for backwards support for RenderSprite masks.
+ */
+import {Graphics} from 'pixi.js';
+
+export default (function () {
+    const gfx = Graphics.prototype;
+    
+    gfx.a  = gfx.a  || gfx.arc;
+    gfx.at = gfx.at || gfx.arcTo;
+    gfx.bt = gfx.bt || gfx.bezierCurveTo;
+    gfx.c  = gfx.c  || gfx.clear;
+    gfx.dc = gfx.dc || gfx.circle;
+    gfx.de = gfx.de || gfx.ellipse;
+    gfx.dr = gfx.dr || gfx.rect;
+    gfx.ef = gfx.ef || gfx.endFill;
+    gfx.f  = gfx.f  || gfx.beginFill;
+    gfx.lt = gfx.lt || gfx.lineTo;
+    gfx.mt = gfx.mt || gfx.moveTo;
+    gfx.qt = gfx.qt || gfx.quadraticCurveTo;
+    gfx.r  = gfx.r  || gfx.rect;
+    gfx.rr = gfx.rr || gfx.roundRect;
+    
+    /* Other CreateJS shortcuts that are unsupported by PIXI
+    gfx.cp
+    gfx.lf
+    gfx.rf
+    gfx.bf
+    gfx.ss
+    gfx.sd
+    gfx.s
+    gfx.ls
+    gfx.rs
+    gfx.bs
+    gfx.es
+    gfx.rc
+    gfx.dp
+    gfx.p
+    */
+    
+} ());

package/src/platypus.css

@@ -0,0 +1,68 @@
+div#captions {
+    user-select: none;
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    -webkit-touch-callout: none;
+}
+
+canvas.platypus-canvas {
+    height: 100%;
+    position: relative;
+    width: 100%;
+
+    user-select: none;
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    -webkit-touch-callout: none;
+}
+
+.platypus-debugging {
+    position: fixed;
+    pointer-events: none;
+    color: #fff;
+    font-size: 12px;
+    padding: 5px;
+    background: rgba(0, 0, 0, 0.4);
+    z-index: 2;
+    font-family: "Lucida Console", Monaco, monospace;
+    -webkit-touch-callout: none;
+    user-select: none;
+    cursor: default;
+    margin: 0;
+    line-height: 1.5em;
+}
+
+#framerate {
+    top: 0;
+    left: 0;
+}
+
+#platypus-logging {
+    top: 0;
+    right: 0;
+    max-width: 40%;
+    max-height: 40%;
+    overflow-x: auto;
+}
+
+#platypus-logging .general {color: lightgreen;}
+#platypus-logging .log {color: white;}
+#platypus-logging .warn {color: yellow;}
+#platypus-logging .debug {color: lightblue;}
+#platypus-logging .error {color: lightcoral;}
+#platypus-logging span {padding-right: 1.5em;}
+
+#toggle-platypus-debugging {
+    position: fixed;
+    top: 0;
+    right: 0;
+    font-size: 12px;
+    padding: 5px;
+    background: rgba(0, 0, 0, 0.4);
+    font-family: "Lucida Console", Monaco, monospace;
+    border: none;
+    color: white;
+    z-index: 3;
+}

package/src/sayHello.js

@@ -0,0 +1,50 @@
+/* global console, document, platypus */
+import {VERSION as pixiVersion} from 'pixi.js';
+import {arrayCache} from './utils/array.js';
+
+const
+    getPortion = (num, min, max) => Math.floor(num * min / max),
+    getStyle = (title, version) => {
+        const
+            min = 204,
+            A = 65,
+            v = version?.split?.('.'),
+            useVersion = v?.length >= 3,
+            r = useVersion ? parseInt(v[0], 10) : (title.charCodeAt(0) || A) - A,
+            g = useVersion ? parseInt(v[1], 10) : (title.charCodeAt(1) || A) - A,
+            b = useVersion ? parseInt(v[2], 10) : (title.charCodeAt(2) || A) - A,
+            max = Math.max(r, g, b, 1);
+
+        return `color: #ffffff; line-height: 1.5em; border-radius: 6px; background-color: rgb(${getPortion(r, min, max)},${getPortion(g, min, max)},${getPortion(b, min, max)});`;
+    },
+    getVersions = (arr) => arr.reduce((arr, str) => {
+        arr.push(getStyle(str, str.substr(str.lastIndexOf(' ') - str.length + 1)), 'line-height: 1.5em;');
+        return arr;
+    }, []);
+
+export default function (app) {
+    const
+        {options = {}} = app,
+        {version = '(?)'} = options,
+        docAuth = document.getElementsByName('author')?.[0]?.getAttribute('content') ?? '',
+        author = docAuth ? `by ${docAuth}` : '',
+        title = `${options.name ?? app.name ?? document.title ?? ''}${version ? ` ${version}` : ''}`,
+        using = arrayCache.setUp(),
+        {springroll, supports} = platypus;
+    
+    if (springroll) {
+        using.push('SpringRoll ' + springroll.version);
+    }
+    
+    using.push('Pixi.js ' + pixiVersion);
+    
+    if (supports.firefox || supports.chrome) {
+        console.log(`%c ${title} %c ${author}`, getStyle(title, title.substr(title.lastIndexOf(' ') - title.length + 1)), 'line-height: 1.5em;');
+        using.push(`Platypus ${platypus.version}`);
+        console.log(`Using %c ${using.join(' %c %c ')} %c `, ...getVersions(using));
+    } else {
+        console.log(`--- "${title}" ${author} - Using ${using.join(', ')}, and Platypus ${platypus.version} ---`);
+    }
+
+    arrayCache.recycle(using);
+};

package/src/shapes/Capsule.js

@@ -0,0 +1,74 @@
+import adjustedXY from "./adjustedXY";
+import Circle from "./Circle";
+import Rectangle from "./Rectangle";
+import Segment from "./Segment";
+
+const
+    axisInfo = {
+        x: {
+            axis: 'x',
+            alt: 'y',
+            length: 'width',
+            breadth: 'height'
+        },
+        y: {
+            axis: 'y',
+            alt: 'x',
+            length: 'height',
+            breadth: 'width' 
+        }
+    };
+
+export default class Capsule extends Segment {
+    constructor (...args) {
+        super(...args);
+        this.type = 'capsule';
+    }
+
+    initialize (options) {
+        if (!options.points && (!options.a || !options.b) && options.width && options.height) {
+            const
+                {alt, axis, breadth, length} = axisInfo[options.width > options.height ? 'x' : 'y'],
+                radius = options[breadth] / 2,
+                len = options[length] - 2 * radius,
+                hl = len / 2;
+
+            super.initialize({
+                ...options,
+                a: {
+                    [axis]: -hl,
+                    [alt]: 0
+                },
+                b: {
+                    [axis]: hl,
+                    [alt]: 0
+                }
+            });
+            this.radius = radius;
+        } else {
+            super.initialize(options);
+            this.radius = options.radius ?? 0;
+        }
+    }
+
+    duplicate () {
+        return new Capsule(this);
+    }
+
+    toObject (options) {
+        const
+            {a, b, radius, type} = this,
+            {scale = 1} = options;
+
+        return {
+            a: adjustedXY(a, options),
+            b: adjustedXY(b, options),
+            radius: radius * scale,
+            type
+        };
+    }
+
+    static validateDefinition (definition) {
+        return Rectangle.validateDefinition(definition) || (Circle.validateDefinition(definition) && Segment.validateDefinition(definition));
+    }
+}

package/src/shapes/Circle.js

@@ -0,0 +1,43 @@
+import adjustedXY from "./adjustedXY";
+import Point from "./Point";
+
+export default class Circle extends Point {
+    constructor (...args) {
+        super(...args);
+        this.type = 'circle';
+    }
+
+    initialize (options) {
+        super.initialize(options);
+        this.radius = options.radius ?? 0;
+    }
+
+    duplicate () {
+        return new Circle(this);
+    }
+
+    isPointInside ({x, y}, epsilon = 1e-6) {
+        const
+            {registration} = this,
+            dx = x - registration.x,
+            dy = y - registration.y;
+
+        return (dx * dx + dy * dy) <= (this.radius + epsilon) ** 2;
+    }
+
+    toObject (options) {
+        const
+            {radius, type} = this,
+            {scale = 1} = options;
+
+        return {
+            radius: radius * scale,
+            type,
+            ...adjustedXY(this, options)
+        };
+    }
+
+    static validateDefinition ({radius} = {}) {
+        return typeof radius === 'number' && radius > 0;
+    }
+}

package/src/shapes/Ellipse.js

@@ -0,0 +1,117 @@
+import adjustedXY from "./adjustedXY";
+import Capsule from "./Capsule";
+import Rectangle from "./Rectangle";
+import Segment from "./Segment";
+
+export default class Ellipse extends Segment {
+    constructor (...args) {
+        super(...args);
+        this.type = 'ellipse';
+    }
+
+    get halfHeight () {
+        return this.height / 2;
+    }
+
+    set halfHeight (hh) {
+        this.height = hh * 2;
+    }
+
+    get halfWidth () {
+        return this.width / 2;
+    }
+    
+    set halfWidth (hw) {
+        this.width = hw * 2;
+    }
+
+    initialize (options) {
+        const
+            {a, b, height, points, width} = options;
+
+        if (!points && !(a && b)) {
+            const
+                hw = width / 2,
+                hh = height / 2;
+                
+            if (width > height) {
+                const
+                    c = Math.sqrt(hw * hw - hh * hh);
+
+                super.initialize({
+                    ...options,
+                    a: {x: -c, y: 0},
+                    b: {x: c, y: 0}
+                });
+            } else {
+                const
+                    c = Math.sqrt(hh * hh - hw * hw);
+
+                super.initialize({
+                    ...options,
+                    a: {x: 0, y: -c},
+                    b: {x: 0, y: c}
+                });
+            }
+        } else {
+            super.initialize(options);
+        }
+        this.height = height;
+        this.width = width;
+        Object.defineProperties(this, {
+            constantSumOfDistances: {
+                get () {
+                    return Math.max(this.width, this.height);
+                }
+            }
+        });
+
+        //TODO: accept rotation
+    }
+
+    toCapsule () {
+        const
+            {a, b, constantSumOfDistances, width, height} = this,
+            hw = width / 2,
+            hh = height / 2,
+            radius = (width > height) ? hh : hw,
+            eOffset = this.getLength(),
+            cOffset = constantSumOfDistances - radius - radius,
+            ratio = cOffset / eOffset;
+
+        return new Capsule({
+            a: {
+                x: a.x * ratio,
+                y: a.y * ratio
+            },
+            b: {
+                x: b.x * ratio,
+                y: b.y * ratio
+            },
+            radius
+        });
+    }
+
+    duplicate () {
+        return new Ellipse(this);
+    }
+
+    toObject (options) {
+        const
+            {a, b, height, radius, type, width} = this,
+            {scale = 1} = options;
+
+        return {
+            a: adjustedXY(a, options),
+            b: adjustedXY(b, options),
+            height: height * scale,
+            radius: radius * scale,
+            type,
+            width: width * scale
+        };
+    }
+
+    static validateDefinition (definition) {
+        return Rectangle.validateDefinition(definition);
+    }
+}

package/src/shapes/Point.js

@@ -0,0 +1,191 @@
+/* global platypus */
+import Vector from '../Vector';
+import checkPointsMap from './checkPointsMap';
+import adjustedXY from './adjustedXY';
+import castToPixiShape from './castToPixiShape';
+import castToPixiGraphics from './castToPixiGraphics';
+import castToBox2D from './castToBox2D';
+
+const
+    PI2 = Math.PI * 2;
+
+export default class Point {
+    constructor (options) {
+        this.type = 'point';
+        this.registration = new Vector();
+        this.initialize(options);
+    }
+
+    get rotation () {
+        return (this.revolutions * PI2) % PI2;
+    }
+
+    set rotation (rotation) {
+        this.revolutions = rotation / PI2;
+    }
+
+    get x () {
+        return this.registration.x;
+    }
+
+    set x (x) {
+        this.moveX(x);
+    }
+
+    get y () {
+        return this.registration.y;
+    }
+
+    set y (y) {
+        this.moveY(y);
+    }
+
+    initialize ({revolutions, rotation = 0, x = 0, y = 0}) {
+        this.moveX(x);
+        this.moveY(y);
+        this.revolutions = revolutions ?? (rotation / PI2);
+    }
+
+    // "to" castings (toObject must be defined by inheriting classes)
+
+    toBox2D (...args) {
+        return castToBox2D(this, ...args);
+    }
+
+    toJSON (options, ...args) {
+        return JSON.stringify(this.toObject(options), ...args);
+    }
+
+    toObject (options) {
+        const
+            {type} = this;
+
+        return {
+            type,
+            ...adjustedXY(this, options)
+        };
+    }
+
+    toPixiShape (...args) {
+        return castToPixiShape(this, ...args);
+    }
+
+    toPixiGraphics (...args) {
+        return castToPixiGraphics(this, ...args);
+    }
+
+    move ({x, y}) {
+        this.moveX(x);
+        this.moveY(y);
+    }
+
+    moveX (x) {
+        this.registration.x = x;
+    }
+
+    moveY (y) {
+        this.registration.y = y;
+    }
+
+    shift ({x, y}) {
+        this.shiftX(x);
+        this.shiftY(y);
+    }
+
+    shiftX (x) {
+        this.moveX(this.x + x);
+    }
+
+    shiftY (y) {
+        this.moveY(this.y + y);
+    }
+
+    checkVisibility (shapes) {
+        const
+            segments = shapes.reduce((list, shape) => {
+                const
+                    {segments} = shape;
+
+                if (segments) {
+                    list.push(...segments);
+                } else {
+                    list.push(shape)
+                }
+
+                return list;
+            }, []);
+
+        return segments.filter((seg) => {
+            // Midpoint of segment
+            const
+                mid = seg.a && seg.b ? {
+                    x: (seg.a.x + seg.b.x) / 2,
+                    y: (seg.a.y + seg.b.y) / 2
+                } : seg;
+
+            return !segments.some((blocker) => (seg !== blocker) && blocker.intersects?.({a: this, b: mid}));
+        });
+    }
+
+    getClosestPoints (shape, offset) {
+        let
+            closestPoints = null;
+
+        if (offset?.x ?? offset?.y) {
+            const
+                offsetShape = shape.duplicate();
+
+            offsetShape.shift(offset);
+            closestPoints = checkPointsMap[offsetShape.type]?.[this.type]?.(offsetShape, this) ?? null;
+            //TODO: discard/recycle shape
+        } else {
+            closestPoints = checkPointsMap[shape.type]?.[this.type]?.(shape, this) ?? null;
+        }
+
+        if (!closestPoints) {
+            platypus.debug.warn(`No closest point support for "${checkPointsMap[shape.type] ? this.type : shape.type}" shapes.`);
+        }
+
+        return closestPoints;
+    }
+
+    duplicate () {
+        return new Point(this);
+    }
+
+    getRadians () {
+        return this.revolutions * PI2;
+    }
+
+    getDegrees () {
+        return this.revolutions * 360;
+    }
+
+    getSinCos () {
+        const
+            {rotation} = this;
+
+        return {
+            sin: Math.sin(rotation),
+            cos: Math.cos(rotation)
+        };
+    }
+
+    toArray (local = false) {
+        if (local) {
+            const
+                {registration: {x, y}} = this;
+
+            return [x, y];
+        } else {
+            const
+                {x, y} = this;
+
+            return [x, y];
+        }
+    }
+
+    static validateDefinition ({x, y} = {}) {
+        return typeof x === 'number' && typeof y === 'number' && !isNaN(x) && !isNaN(y);
+    }
+}

package/src/shapes/Polygon.js

@@ -0,0 +1,112 @@
+/* global platypus */
+import Polyline from "./Polyline";
+
+const
+    MIN_VERTICES = 3,
+    MAX_VERTICES = 8,
+    SHARED_VERTICES = 2;
+
+export default class Polygon extends Polyline {
+    constructor (...args) {
+        super(...args);
+        this.type = 'polygon';
+    }
+
+    get loop () {
+        return true; // Unlike Polyline, this can never not be a loop.
+    }
+
+    set loop (value) {
+        if (!value) {
+            throw new Error('Polygon shapes are comprised of a loop of segments.');
+        }
+    }
+
+    initialize (options) {
+        super.initialize(options);
+        this._loop = true;
+    }
+
+    isPointInside ({x, y}) {
+        const
+            {points} = this;
+        let inside = false;
+
+        for (let i = 0, j = points.length - 1; i < points.length; j = i++) {
+            const
+                a = points[i],
+                b = points[j];
+
+            if ((a.y > y) !== (b.y > y) && x < (b.x - a.x) * (y - a.y) / (b.y - a.y) + a.x) {
+                inside = !inside;
+            }
+        }
+        return inside;
+    }
+
+    duplicate () {
+        return new Polygon(this);
+    }
+
+    decompose () {
+        const
+            decomp = platypus.game.options.modules?.['poly-decomp'],
+            polygon = this.toArray2D(true);
+
+        if (decomp?.isSimple(polygon)) {
+            return decomp.quickDecomp(polygon).map((points) => new Polygon({
+                points
+            }));
+        }
+
+        return null;
+    }
+
+    split (min = MIN_VERTICES, max = MAX_VERTICES) {
+        const
+            breakAtMaxSize = min + max - SHARED_VERTICES,
+            arr = [],
+            convexPolygons = this.decompose() ?? [this]; // break into convex polygons if not already, since splitting a concave polygon could create polygon comprised of non-matching shapes.
+        let altSide = 0;
+
+        convexPolygons.forEach((polygon) => {
+            const
+                points = [...polygon.points];
+            let {length} = points;
+            
+            while (length > max) {
+                const
+                    count = (length >= breakAtMaxSize) ? max : Math.ceil(length / 2),
+                    deleteCount = count - SHARED_VERTICES,
+                    breakOff = points.splice((altSide - 1) * deleteCount, altSide ? deleteCount : Infinity);
+
+                breakOff.push(points[points.length - 1], points[0]);
+                
+                arr.push(new Polygon({
+                    points: breakOff
+                }));
+
+                altSide = 1 - altSide;
+                length = points.length;
+            }
+
+            arr.push(new Polygon({
+                points
+            }));
+        });
+
+        return arr;
+    }
+
+    static validateDefinition (definition = {}) {
+        const
+            {points} = definition,
+            {length = 0} = points ?? [];
+
+        if (length < 3) {
+            return false;
+        } else {
+            return Polyline.validateDefinition(definition);
+        }
+    }
+}