@makefully/platypus 4.1.5 → 4.1.8

package/src/components/XHR.js

@@ -0,0 +1,129 @@
+/* global window */
+import createComponentClass from '../factory.js';
+
+const
+    XMLHttpRequest = window.XMLHttpRequest;
+
+export default createComponentClass(/** @lends platypus.components.XHR.prototype */{
+    id: 'XHR',
+    
+    properties: {
+        /**
+         * Sets the XHR method to use.
+         *
+         * @property method
+         * @type String
+         * @default "GET"
+         */
+        method: "GET",
+        
+        /**
+         * Sets the path to connect to the server.
+         *
+         * @property path
+         * @type String
+         * @default ""
+         */
+        path: "",
+        
+        /**
+         * Sets the XHR response type.
+         *
+         * @property responseType
+         * @type String
+         * @default "text"
+         */
+        responseType: "text",
+        
+        /**
+         * Whether cookies should be retained on cross-domain calls.
+         *
+         * @property withCredentials
+         * @type boolean
+         * @default false
+         */
+        withCredentials: false
+    },
+    
+    /**
+     * This component provides component-based XHR communication with a server.
+     *
+     * @memberof platypus.components
+     * @uses platypus.Component
+     * @constructs
+     * @param {*} definition 
+     * @listens platypus.Entity#request
+     * @fires platypus.Entity#response
+     */
+    initialize: function (definition) {
+        this.setProperties(definition);
+    },
+
+    events: {// These are messages that this component listens for
+        /**
+         * On receiving this message, this component makes a request from the server using the provided information. Note that properties set here will reset the properties set by this component's JSON definition.
+         *
+         * @event platypus.Entity#request
+         * @property {Object} message
+         * @property {String} message.method XHR method to use: must be "GET" or "POST".
+         * @property {String} message.path The path to the server resource.
+         * @property {String} [message.responseType="text"] Response type expected.
+         * @property {Object} [message.data] An object of string key/value pairs to be transmitted to the server.
+         * @property {Function} message.onload A function that should be run on receiving a response from the server. This defaults to triggering a "response" message containing the responseText value.
+         */
+        "request": function (resp) {
+            this.setProperties(resp);
+            
+            if (this.method === "GET") {
+                this.get();
+            } else if (this.method === "POST") {
+                this.post();
+            } else {
+                throw "Method must be GET or POST";
+            }
+        }
+    },
+    
+    methods: {// These are methods that are called on the component
+        setProperties: function (props = {}) {
+            this.method = props.method ?? this.method ?? "GET";
+            this.path = props.path ?? this.path ?? null;
+            this.responseType = props.responseType ?? this.responseType ?? "text";
+            this.withCredentials = props.withCredentials ?? this.withCredentials ?? false;
+            this.data = props.data ? (new URLSearchParams(props.data)).toString() : '';
+            this.onload = props.onload ?? this.onload ?? (() => {
+                if (this.status === 200) {
+                    /**
+                     * This message is triggered on receiving a response from the server (if "onload" is not set by the original "request" message).
+                     *
+                     * @event platypus.Entity#response
+                     * @param message {String} The message contains the responseText returned by the server.
+                     */
+                    this.owner.triggerEvent('response', this.responseText);
+                }
+            });
+        },
+        get: function () {
+            const
+                xhr  = new XMLHttpRequest(),
+                path = this.data ? `${this.path}?${this.data}` : this.path;
+            
+            xhr.open(this.method, path, true);
+            xhr.withCredentials = this.withCredentials;
+            xhr.responseType = this.responseType;
+            xhr.onload = this.onload;
+            xhr.send();
+        },
+        post: function () {
+            const
+                xhr = new XMLHttpRequest();
+            
+            xhr.open(this.method, this.path, true);
+            xhr.withCredentials = this.withCredentials;
+            xhr.responseType = this.responseType;
+            xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+            xhr.onload = this.onload;
+            xhr.send(this.data);
+        }
+    }
+});

package/src/components/index.js

@@ -0,0 +1,79 @@
+/**
+ * @namespace platypus.components
+ * @memberof platypus
+ */
+export {default as Interactive} from "./Interactive.js";
+export {default as AIChaser} from "./AIChaser.js";
+export {default as AIPacer} from "./AIPacer.js";
+export {default as AudioMusic} from "./AudioMusic.js";
+export {default as AudioSFX} from "./AudioSFX.js";
+export {default as AudioVO} from "./AudioVO.js";
+export {default as Camera} from "./HandlerCamera.js";
+export {default as HandlerCamera} from "./HandlerCamera.js";
+export {default as EntityCamera} from "./EntityCamera.js";
+export {default as CollisionBasic} from "./CollisionBasic.js";
+export {default as CollisionFilter} from "./CollisionFilter.js";
+export {default as CollisionGroup} from "./CollisionGroup.js";
+export {default as CollisionTiles} from "./CollisionTiles.js";
+export {default as ComponentSwitcher} from "./ComponentSwitcher.js";
+export {default as ControllerInput} from "./ControllerInput.js";
+export {default as Counter} from "./Counter.js";
+export {default as EntityContainer} from "./EntityContainer.js";
+export {default as EntityController} from "./EntityController.js";
+export {default as HandlerCollision} from "./HandlerCollision.js";
+export {default as HandlerController} from "./HandlerController.js";
+export {default as HandlerLogic} from "./HandlerLogic.js";
+export {default as HandlerRender} from "./HandlerRender.js";
+export {default as LevelBuilder} from "./LevelBuilder.js";
+export {default as LogicAngularMovement} from "./LogicAngularMovement.js";
+export {default as LogicAttachment} from "./LogicAttachment.js";
+export {default as LogicButton} from "./LogicButton.js";
+export {default as LogicCarrier} from "./LogicCarrier.js";
+export {default as LogicDestroyMe} from "./LogicDestroyMe.js";
+export {default as LogicDirectionalMovement} from "./LogicDirectionalMovement.js";
+export {default as LogicDragDrop} from "./LogicDragDrop.js";
+export {default as LogicImpactLaunch} from "./LogicImpactLaunch.js";
+export {default as LogicPacingPlatform} from "./LogicPacingPlatform.js";
+export {default as LogicPortable} from "./LogicPortable.js";
+export {default as LogicPortal} from "./LogicPortal.js";
+export {default as LogicPushable} from "./LogicPushable.js";
+export {default as LogicRebounder} from "./LogicRebounder.js";
+export {default as LogicRegionSpawner} from "./LogicRegionSpawner.js";
+export {default as LogicRotationalMovement} from "./LogicRotationalMovement.js";
+export {default as LogicSpawner} from "./LogicSpawner.js";
+export {default as LogicStateMachine} from "./LogicStateMachine.js";
+export {default as LogicSwitch} from "./LogicSwitch.js";
+export {default as LogicTeleportee} from "./LogicTeleportee.js";
+export {default as LogicTeleporter} from "./LogicTeleporter.js";
+export {default as LogicTimer} from "./LogicTimer.js";
+export {default as LogicWindUpRacer} from "./LogicWindUpRacer.js";
+export {default as Motion} from "./Motion.js";
+export {default as Mover} from "./Mover.js";
+export {default as Node} from "./Node.js";
+export {default as NodeMap} from "./NodeMap.js";
+export {default as NodeResident} from "./NodeResident.js";
+export {default as Orientation} from "./Orientation.js";
+export {default as RandomEvents} from "./RandomEvents.js";
+export {default as RelativePosition} from "./RelativePosition.js";
+export {default as RelayFamily} from "./RelayFamily.js";
+export {default as RelayGame} from "./RelayGame.js";
+export {default as RelayLinker} from "./RelayLinker.js";
+export {default as RelayParent} from "./RelayParent.js";
+export {default as RelaySelf} from "./RelaySelf.js";
+export {default as Render} from "./Render.js";
+export {default as RenderAnimator} from "./RenderAnimator.js";
+export {default as RenderContainer} from "./RenderContainer.js";
+export {default as RenderDebug} from "./RenderDebug.js";
+export {default as RenderDestroyMe} from "./RenderDestroyMe.js";
+export {default as RenderProgress} from "./RenderProgress.js";
+export {default as RenderSpine} from "./RenderSpine.js";
+export {default as RenderSprite} from "./RenderSprite.js";
+export {default as RenderText} from "./RenderText.js";
+export {default as RenderTiles} from "./RenderTiles.js";
+export {default as SceneChanger} from "./SceneChanger.js";
+export {default as TiledLoader} from "./TiledLoader.js";
+export {default as Timeline} from "./Timeline.js";
+export {default as Tutorial} from "./Tutorial.js";
+export {default as Tween} from "./Tween.js";
+export {default as VoiceOver} from "./VoiceOver.js";
+export {default as XHR} from "./XHR.js";

package/src/factory.js

@@ -0,0 +1,305 @@
+/**
+ * The component factory takes in component definitions and creates component classes that can be used to create components by entities.  It adds properties and methods that are common to all components so that component definitions can focus on unique properties and methods.
+ *
+ * To create an extended component class, use the following syntax:
+ *
+ *      platypus.createComponentClass(componentDefinition);
+ *
+ *  * `componentDefinition` is list of key/value pairs that describe the component's behavior.
+ *
+ * See ComponentExample.js for an example componentDefinition that can be sent into this component class factory.
+ *
+ */
+/* global platypus */
+import {arrayCache, greenSlice} from './utils/array.js';
+import Component from './Component.js';
+
+const
+    getId = (type) => {
+        if (typeof ids[type] === 'number') {
+            ids[type] += 1;
+        } else {
+            ids[type] = 0;
+        }
+        return `${type}-${ids[type]}`;
+    };
+let ids = {};
+
+export default function (componentDefinition = {}) {
+    const
+        {events, getAssetList, id, initialize, methods, properties, publicMethods, publicProperties} = componentDefinition,
+
+        // Not sure if this is future-proof, but putting in object to create dynamic name.
+        NewComponent = ({[id]: class extends Component {
+            constructor (owner, definition = {}, callback) {
+                const
+                    {aliases, id: componentId = getId(id)} = definition;
+
+                super(id, owner, componentId);
+    
+                // Set up properties, prioritizing component settings, entity settings, and finally defaults.
+                if (properties) {
+                    const
+                        keys = Object.keys(properties),
+                        {length} = keys;
+
+                    for (let i = 0; i < length; i++) {
+                        const
+                            key = keys[i];
+
+                        this[key] = definition[key] ?? owner[key] ?? properties[key];
+                    }
+                }
+    
+                // These component properties are equivalent with `entity.property`
+                if (publicProperties) {
+                    const
+                        keys = Object.keys(publicProperties),
+                        {length} = keys;
+
+                    for (let i = 0; i < length; i++) {
+                        const
+                            key = keys[i];
+
+                        Object.defineProperty(this, key, {
+                            get: function () {
+                                return owner[key];
+                            },
+                            set: function (value) {
+                                owner[key] = value;
+                            },
+                            enumerable: true
+                        });
+                        this[key] = definition[key] ?? owner[key] ?? publicProperties[key];
+                    }
+                }
+    
+                if (events) {
+                    const
+                        keys = Object.keys(events),
+                        {length} = keys;
+
+                    for (let i = 0; i < length; i++) {
+                        const
+                            key = keys[i];
+
+                        this.addEventListener(key, events[key]);
+                        if (aliases) {
+                            const
+                                aliasKeys = Object.keys(aliases),
+                                {length} = aliasKeys;
+        
+                            for (let j = 0; j < length; j++) {
+                                const
+                                    alias = aliasKeys[j];
+        
+                                if (aliases[alias] === key) {
+                                    this.addEventListener(alias, events[key]);
+                                }
+                            }
+                        }
+                    }
+                }
+    
+                if (publicMethods) {
+                    const
+                        keys = Object.keys(publicMethods),
+                        {length} = keys;
+
+                    for (let i = 0; i < length; i++) {
+                        const
+                            key = keys[i];
+                        let name = key;
+
+                        if (aliases) {
+                            const
+                                aliasKeys = Object.keys(aliases),
+                                {length} = aliasKeys;
+        
+                            for (let j = 0; j < length; j++) {
+                                const
+                                    alias = aliasKeys[j];
+        
+                                if (aliases[alias] === key) {
+                                    name = alias;
+                                }
+                            }
+                        }
+                        this.addMethod(name, publicMethods[key]);
+                    }
+                }
+    
+                if (!this.initialize(definition, callback) && callback) { // whether the callback will be used; if not, we run immediately.
+                    callback();
+                }
+            }
+        }})[id],
+        proto = NewComponent.prototype;
+
+    if (initialize) {
+        proto.initialize = initialize;
+    }
+    
+    /**
+     * Returns a JSON structure describing this componet. This can be overridden by a "toJSON" method in the component definition. This is by design.
+     * 
+     * @method toJSON
+     * @return {Object}
+     */
+    proto.toJSON = (function () {
+        const
+            valid = function (value, depthArray) {
+                const
+                    type = typeof value;
+                let depth = null,
+                    root = false,
+                    invalid = false;
+                
+                if (!validating) { // prevents endless validation during recursion.
+                    validating = true;
+                    root = true;
+                }
+
+                if (type === 'function') {
+                    invalid = true;
+                } else if ((type === 'object') && (value !== null)) {
+                    if (value.toJSON) { // We know it's valid but we run this for the depth check to make sure that there is no recursion.
+                        depth = depthArray ? greenSlice(depthArray) : arrayCache.setUp();
+                        depth.push(value);
+                        if (!valid(value.toJSON(), depth)) {
+                            invalid = true;
+                        }
+                    } else if (Array.isArray(value)) {
+                        let i = value.length;
+
+                        while (i--) {
+                            const
+                                propValue = value[i];
+
+                            if (depthArray && depthArray.indexOf(propValue) >= 0) {
+                                invalid = true;
+                                break;
+                            }
+                            depth = depthArray ? greenSlice(depthArray) : arrayCache.setUp();
+                            depth.push(propValue);
+                            if (!valid(propValue, depth)) {
+                                invalid = true;
+                                break;
+                            }
+                        }
+                    } else {
+                        const
+                            keys = Object.keys(value),
+                            {length} = keys;
+
+                        for (let i = 0; i < length; i++) {
+                            const
+                                propValue = value[keys[i]];
+
+                            if (depthArray && depthArray.indexOf(propValue) >= 0) {
+                                invalid = true;
+                                break;
+                            }
+                            depth = depthArray ? greenSlice(depthArray) : arrayCache.setUp();
+                            depth.push(propValue);
+                            if (!valid(propValue, depth)) {
+                                invalid = true;
+                                break;
+                            }
+                        }
+                    }
+                }
+
+                if (depthArray) {
+                    arrayCache.recycle(depthArray);
+                }
+
+                if (root) {
+                    validating = false;
+                }
+
+                return !invalid;
+            };
+        let validating = false;
+
+        return function (propertiesDefinition, debug) {
+            const
+                component = {
+                    type: this.type
+                };
+            
+            if (properties) {
+                const
+                    keys = Object.keys(properties),
+                    {length} = keys;
+
+                for (let i = 0; i < length; i++) {
+                    const
+                        key = keys[i];
+
+                    if (properties[key] !== this[key]) {
+                        if (debug && !validating && !valid(this[key])) {
+                            platypus.debug.warn('Component "' + this.type + '" includes a non-JSON property value for "' + key + '" (type "' + (typeof this[key]) + '"). You may want to create a custom `toJSON` method for this component.', this[key]);
+                        }
+                        component[key] = this[key];
+                    }
+                }
+            }
+
+            if (publicProperties) {
+                const
+                    keys = Object.keys(publicProperties),
+                    {length} = keys;
+
+                for (let i = 0; i < length; i++) {
+                    const
+                        key = keys[i];
+
+                    if ((publicProperties[key] !== this.owner[key]) && (typeof propertiesDefinition[key] === 'undefined')) {
+                        if (debug && !validating && !valid(this.owner[key])) {
+                            platypus.debug.warn('Component "' + this.type + '" includes a non-JSON public property value for "' + key + '" (type "' + (typeof this.owner[key]) + '"). You may want to create a custom `toJSON` method for this component.', this.owner[key]);
+                        }
+                        propertiesDefinition[key] = this.owner[key];
+                    }
+                }
+            }
+
+            return component;
+        };
+    }());
+
+    if (methods) {
+        const
+            keys = Object.keys(methods),
+            {length} = keys;
+
+        for (let i = 0; i < length; i++) {
+            const
+                key = keys[i];
+
+            if (key === 'destroy') {
+                proto._destroy = methods[key];
+            } else {
+                proto[key] = methods[key];
+            }
+        }
+    }
+    if (publicMethods) {
+        const
+            keys = Object.keys(publicMethods),
+            {length} = keys;
+
+        for (let i = 0; i < length; i++) {
+            const
+                key = keys[i];
+
+            proto[key] = publicMethods[key];
+        }
+    }
+
+    if (getAssetList) {
+        NewComponent.getAssetList = getAssetList;
+    }
+
+    return NewComponent;
+};

package/src/index.js

@@ -0,0 +1,159 @@
+/* eslint-disable sort-imports */
+/**
+ * @namespace window
+ */
+/**
+ * @namespace platypus
+ */
+/* global global, navigator, window */
+
+import AssetManager from './AssetManager.js';
+import {Debugger} from 'springroll';
+import Game from './Game.js';
+import createComponentClass from './factory.js';
+import pkg from '../package.json';
+import * as components from './components/index.js';
+
+export * from './utils/array.js';
+export * from './utils/string.js';
+export {default as recycle} from 'recycle';
+
+// Classes
+export {default as AABB} from './AABB.js';
+export {default as ActionState} from './ActionState.js';
+export {Application as Application} from 'springroll';
+export {default as CollisionData} from './CollisionData.js';
+export {default as CollisionDataContainer} from './CollisionDataContainer.js';
+export {default as CollisionShape} from './CollisionShape.js';
+export {default as Component} from './Component.js';
+export {default as Data} from './Data.js';
+export {default as DataMap} from './DataMap.js';
+export {default as Entity} from './Entity.js';
+export {default as Game} from './Game.js';
+export {default as Messenger} from './Messenger.js';
+export {default as PIXIAnimation} from './PIXIAnimation.js';
+export {default as RandomSet} from './RandomSet.js';
+export {default as StateMap} from './StateMap.js';
+export {default as Vector} from './Vector.js';
+export * from './shapes/index.js';
+
+// Component creator
+export {default as createComponentClass} from './factory.js';
+
+const
+    platypus = global.platypus = {
+        createComponentClass,
+        components
+    },
+    uagent    = navigator.userAgent.toLowerCase(),
+    isEdge    = (uagent.search('edge')    > -1),
+    isIPod    = (uagent.search('ipod')    > -1),
+    isIPhone  = (uagent.search('iphone')  > -1),
+    isIPad    = (uagent.search('ipad')    > -1) || (uagent.search('mac') > -1 && navigator.maxTouchPoints > 2 && !isIPhone),
+    isAndroid = (uagent.search('android') > -1),
+    isSilk    = (uagent.search('silk')    > -1),
+    isIOS     = isIPod || isIPhone  || isIPad,
+    isMobile  = isIOS  || isAndroid || isSilk,
+    logToDiv = isMobile ? (() => {
+        const
+            logDiv = document.createElement('ul'),
+            toggleLogDiv = document.createElement('button');
+        let firstTime = true;
+
+        logDiv.style.display = 'none';
+        logDiv.id = "platypus-logging";
+        logDiv.classList.add('platypus-debugging');
+        document.body.appendChild(logDiv);
+
+        toggleLogDiv.style.display = 'none';
+        toggleLogDiv.id = 'toggle-platypus-debugging';
+        toggleLogDiv.innerText = 'log';
+        toggleLogDiv.addEventListener('click', () => {
+            if (logDiv.style.display === 'none') {
+                logDiv.style.display = 'block';
+                toggleLogDiv.innerText = 'X';
+            } else {
+                logDiv.style.display = 'none';
+                toggleLogDiv.innerText = 'log';
+            }
+        });
+        document.body.appendChild(toggleLogDiv);
+
+        return (method, ...args) => {
+            const
+                newLog = document.createElement('li');
+
+            newLog.classList.add(method);
+            args.forEach((arg) => {
+                const
+                    newArg = document.createElement('span');
+
+                newArg.innerText = arg;
+                newLog.appendChild(newArg);
+            });
+
+            logDiv.appendChild(newLog);
+
+            if (firstTime) {
+                firstTime = false;
+                toggleLogDiv.style.display = 'block';
+            }
+        };
+    })() : () => {},
+    debugWrapper = function (method, ...args) {
+        if (platypus.game?.settings?.debug) {
+            Debugger.log(method, ...args);
+            logToDiv(method, ...args);
+        }
+    };
+
+/**
+ * This is an object of boolean key/value pairs describing the current browser's properties.
+ * @property supports
+ * @type Object
+ **/
+platypus.supports = {
+    touch: (window.ontouchstart !== 'undefined'),
+    edge: isEdge,
+    iPod: isIPod,
+    iPhone: isIPhone,
+    iPad: isIPad,
+    safari: (uagent.search('safari') > -1) && !isEdge,
+    ie: (uagent.search('msie') > -1) || (uagent.search('trident') > -1),
+    firefox: (uagent.search('firefox') > -1),
+    android: isAndroid,
+    chrome: (uagent.search('chrome') > -1) && !isEdge,
+    silk: isSilk,
+    iOS: isIOS,
+    mobile: isMobile,
+    desktop: !isMobile
+};
+
+/**
+ * This method defines platypus.debug and uses springroll.Debug if available. If springroll.Debug is not loaded, platypus.debug provides inactive stubs for console methods.
+ *
+ * @property debug
+ * @type Object
+ */
+platypus.debug = {
+    general: debugWrapper.bind(null, 'log'),
+    log: debugWrapper.bind(null, 'log'),
+    warn: debugWrapper.bind(null, 'warn'),
+    debug: debugWrapper.bind(null, 'debug'),
+    error: debugWrapper.bind(null, 'error')
+};
+
+platypus.assetCache = new AssetManager();
+
+/**
+ * The version string for this release.
+ * @property version
+ * @type String
+ * @static
+ **/
+platypus.version = pkg.version;
+
+platypus.Game = Game;
+
+export {components};
+export default platypus;