@makefully/platypus 4.1.4 → 4.1.6

package/src/components/LogicButton.js

@@ -0,0 +1,466 @@
+import AABB from '../AABB.js';
+import Data from '../Data.js';
+import StateMap from '../StateMap.js';
+import createComponentClass from '../factory.js';
+
+export default (function () {
+    return createComponentClass(/** @lends platypus.components.LogicButton.prototype */{
+
+        id: 'LogicButton',
+
+        properties: {
+            /**
+             * The event to trigger when pressed.
+             *
+             * @property onPress
+             * @type String
+             * @default ""
+             */
+            "onPress": "",
+
+            /**
+             * The event to trigger when released.
+             *
+             * @property onRelease
+             * @type String
+             * @default ""
+             */
+            "onRelease": "",
+
+            /**
+             * The event to trigger when cancelled.
+             *
+             * @property onCancel
+             * @type String
+             * @default ""
+             */
+            "onCancel": "",
+
+            /**
+             * The event to trigger when the user mouses over the button
+             *
+             * @property hoverAudio
+             * @type String|String[]|Message[]
+             * @default ""
+             */
+            "onHover": "",
+
+            /**
+             * Whether this button's actions should be limited to the initial press/release.
+             *
+             * @property useOnce
+             * @type Boolean
+             * @default false
+             */
+            "useOnce": false,
+
+            /**
+             * Whether this button should start disabled.
+             *
+             * @property disabled
+             * @type Boolean
+             * @default false
+             */
+            "disabled": false,
+
+            /**
+             * Determines whether this button should behave as a toggle.
+             *
+             * @property toggle
+             * @type Boolean
+             * @default false
+             */
+            "toggle": false,
+
+            /**
+             * Specifies whether the button starts off 'pressed'; typically only useful for toggle buttons.
+             *
+             * @property pressed
+             * @type Boolean
+             * @default false
+             */
+            "pressed": false,
+
+            /**
+             * State that entity match be in for LogicButton to be enabled.
+             * 
+             * @property validState
+             * @type String|StateMap
+             * @default '!disabled'
+             */
+            validState: '!disabled',
+
+            /**
+             * State that parent entity match be in for LogicButton to be enabled. Default is "" unless "baton" is true in which case the default is "!baton"
+             * 
+             * @property validParentState
+             * @type String|StateMap
+             * @default ''
+             */
+            validParentState: '',
+
+            /**
+             * Whether multitouch is disallowed for this button to work: ie no other "baton: true" button may be currently pressed in order for this button to be enabled. This is useful for instances where a button may cause a conflict if another button is also activated.
+             * 
+             * @property baton
+             * @type Boolean
+             * @default false
+             */
+            baton: false
+        },
+
+        publicProperties: {
+            /**
+             * This sets the distance in world units from the bottom of the camera's world viewport. If set, it will override the entity's y coordinate. This property is accessible on the entity as `entity.bottom`.
+             *
+             * @property bottom
+             * @type Number
+             * @default null
+             */
+            "bottom": null,
+
+            /**
+             * This sets the distance in world units from the left of the camera's world viewport. If set, it will override the entity's x coordinate. This property is accessible on the entity as `entity.left`.
+             *
+             * @property left
+             * @type Number
+             * @default null
+             */
+            "left": null,
+
+            /**
+             * This sets the distance in world units from the right of the camera's world viewport. If set, it will override the entity's x coordinate. This property is accessible on the entity as `entity.right`.
+             *
+             * @property right
+             * @type Number
+             * @default null
+             */
+            "right": null,
+
+            /**
+             * This sets the distance in world units from the top of the camera's world viewport. If set, it will override the entity's y coordinate. This property is accessible on the entity as `entity.top`.
+             *
+             * @property top
+             * @type Number
+             * @default null
+             */
+            "top": null
+        },
+
+        /**
+         * Provides button functionality for a RenderSprite component.
+         *
+         * @memberof platypus.components
+         * @uses platypus.Component
+         * @constructs
+         * @listens platypus.Entity#camera-update
+         * @listens platypus.Entity#disable
+         * @listens platypus.Entity#enable
+         * @listens platypus.Entity#handle-logic
+         * @listens platypus.Entity#highlight
+         * @listens platypus.Entity#pointerdown
+         * @listens platypus.Entity#pointerout
+         * @listens platypus.Entity#pointerover
+         * @listens platypus.Entity#pressup
+         * @listens platypus.Entity#toggle-disabled
+         * @listens platypus.Entity#toggle-highlight
+         * @listens platypus.Entity#unhighlight
+         * @fires platypus.Entity#pressed
+         * @fires platypus.Entity#cancelled
+         * @fires platypus.Entity#released
+         */
+        initialize: function () {
+            const
+                {state} = this.owner;
+            
+            this.aabb = AABB.setUp();
+            this.lastBottom = null;
+            this.lastLeft = null;
+            this.lastRight = null;
+            this.lastTop = null;
+
+            this.state = state;
+            state.set('disabled', this.disabled);
+            state.set('released', !this.pressed);
+            state.set('pressed', this.pressed);
+            state.set('highlighted', false);
+            this.validParentState = StateMap.setUp(this.validParentState);
+            this.validState = StateMap.setUp(this.validState);
+            if (this.baton) {
+                this.validParentState.set('baton', false);
+                this.owner.parent.state.set('baton', false);
+                this.batonIsMine = false;
+            }
+            this.owner.container.cursor = this.disabled ? null : 'pointer';
+            this.cancelled = false;
+            this.readyToToggle = false;
+        },
+
+        events: {
+            "handle-logic": function () {
+                const
+                    {bottom, left, right, top} = this;
+
+                if ((this.lastBottom !== bottom) || (this.lastLeft !== left) || (this.lastRight !== right) || (this.lastTop !== top)) {
+                    this.updatePosition(this.aabb);
+                    this.lastBottom = bottom;
+                    this.lastLeft = left;
+                    this.lastRight = right;
+                    this.lastTop = top;
+                }
+            },
+
+            "camera-update": function (camera) {
+                this.aabb.set(camera.viewport);
+                this.updatePosition(this.aabb);
+            },
+
+            "pointerdown": function (eventData) {
+                if (this.checkStateValidity()) {
+                    if (this.toggle) {
+                        this.readyToToggle = true;
+                    } else {
+                        if (this.baton) {
+                            this.batonIsMine = true;
+                            this.owner.parent.state.set('baton', true);
+                        }
+
+                        if (this.onPress) {
+                            this.owner.trigger(this.onPress);
+                        }
+
+                        /**
+                         * This event is triggered when the button is pressed to mimic keypress events. If the button is a toggle button, this only occurs on up-to-down.
+                         *
+                         * @event platypus.Entity#pressed
+                         * @param buttonState {platypus.Data} The state of the button
+                         * @param buttonState.pressed {Boolean} This is `true` for the 'pressed' event.
+                         * @param buttonState.released {Boolean} This is `false` for the 'pressed' event.
+                         * @param buttonState.triggered {Boolean} This is `true` for the 'pressed' event.
+                         * @param buttonState.entity {platypus.Entity} The entity for which the original event occurred.
+                         */
+                        this.updateStateAndTrigger('pressed');
+                        if (eventData && eventData.pixiEvent && eventData.pixiEvent.stopPropagation) { // ensure a properly formed event has been sent
+                            eventData.pixiEvent.stopPropagation();
+                        }
+                    }
+                }
+            },
+
+            "pressup": function (eventData) {
+                const
+                    {state} = this;
+
+                if (this.baton && this.batonIsMine) {
+                    this.batonIsMine = false;
+                    this.owner.parent.state.set('baton', false);
+                }
+                
+                if (this.checkStateValidity()) {
+                    if (this.cancelled) {
+                        if (this.onCancel) {
+                            this.owner.trigger(this.onCancel);
+                        }
+
+                        /**
+                         * This event is triggered when the button is pressed and the mouse/touch is dragged off-target before release.
+                         *
+                         * @event platypus.Entity#cancelled
+                         * @param buttonState {platypus.Data} The state of the button
+                         * @param buttonState.pressed {Boolean} This is `false` for the 'cancelled' event.
+                         * @param buttonState.released {Boolean} This is `true` for the 'cancelled' event.
+                         * @param buttonState.triggered {Boolean} This is `false` for the 'cancelled' event.
+                         * @param buttonState.entity {platypus.Entity} The entity for which the original event occurred.
+                         */
+                        this.updateStateAndTrigger('cancelled');
+                    } else if (this.toggle) {
+                        if (this.readyToToggle) {
+                            if (state.get('pressed')) {
+                                this.updateStateAndTrigger('released');
+                            } else {
+                                this.updateStateAndTrigger('pressed');
+                            }
+                        }
+                    } else {
+                        if (this.onRelease) {
+                            this.owner.trigger(this.onRelease);
+                        }
+
+                        /**
+                         * This event is triggered when the button is released, or on the down-to-up change for toggle buttons.
+                         *
+                         * @event platypus.Entity#released
+                         * @param buttonState {platypus.Data} The state of the button
+                         * @param buttonState.pressed {Boolean} This is `false` for the 'released' event.
+                         * @param buttonState.released {Boolean} This is `true` for the 'released' event.
+                         * @param buttonState.triggered {Boolean} This is `false` for the 'released' event.
+                         * @param buttonState.entity {platypus.Entity} The entity for which the original event occurred.
+                         */
+                        this.updateStateAndTrigger('released');
+                    }
+                    if (eventData && eventData.pixiEvent && eventData.pixiEvent.stopPropagation) { // ensure a properly formed event has been sent
+                        eventData.pixiEvent.stopPropagation();
+                    }
+
+                    // Doing this prevents the call from reccurring.
+                    if (!this.cancelled && this.useOnce && this.removeEventListener) { //Second check is to ensure method exists which won't be the case if a result of the press is the button being destroyed.
+                        this.removeEventListener('pointerdown');
+                        this.removeEventListener('pressup');
+                        this.state.set('disabled', true);
+                        this.owner.container.cursor = null;
+                    }
+                }
+
+                this.cancelled = false;
+                this.readyToToggle = false;
+            },
+
+            "pointerover": function () {
+                if (this.onHover) {
+                    this.owner.trigger(this.onHover);
+                }
+                if (this.state.get('pressed')) {
+                    this.cancelled = false;
+                }
+            },
+
+            "pointerout": function () {
+                if (this.state.get('pressed')) {
+                    this.cancelled = true;
+                }
+            },
+            
+            /**
+             * Disables the entity.
+             *
+             * @event platypus.Entity#disable
+             */
+            "disable": function () {
+                this.state.set('disabled', true);
+                this.owner.container.cursor = null;
+            },
+            
+            /**
+             * Enables the entity.
+             *
+             * @event platypus.Entity#enable
+             */
+            "enable": function () {
+                this.state.set('disabled', false);
+                this.owner.container.cursor = 'pointer';
+            },
+
+            /**
+             * Toggles whether the entity is disabled.
+             *
+             * @event platypus.Entity#toggle-disabled
+             */
+            "toggle-disabled": function () {
+                const
+                    value = this.state.get('disabled');
+                
+                this.owner.container.cursor = value ? 'pointer': null;
+                this.state.set('disabled', !value);
+            },
+            
+            /**
+             * Sets the entity's highlighted state to `true`.
+             *
+             * @event platypus.Entity#highlight
+             */
+            "highlight": function () {
+                this.state.set('highlighted', true);
+            },
+            
+            /**
+             * Sets the entity's highlighted state to `false`.
+             *
+             * @event platypus.Entity#unhighlight
+             */
+            "unhighlight": function () {
+                this.state.set('highlighted', false);
+            },
+            
+            /**
+             * Toggles the entity's highlighted state.
+             *
+             * @event platypus.Entity#toggle-highlight
+             */
+            "toggle-highlight": function () {
+                const
+                    {state} = this;
+
+                state.set('highlighted', !state.get('highlighted'));
+            }
+        },
+        
+        methods: {
+            checkStateValidity () {
+                const
+                    {owner, validParentState, validState} = this;
+
+                return owner.state.includes(validState) && owner.parent.state.includes(validParentState);
+            },
+
+            updatePosition (vp) {
+                const
+                    {bottom, left, owner, right, top} = this;
+
+                if (typeof left === 'number') {
+                    owner.x = vp.left + left;
+                } else if (typeof right === 'number') {
+                    owner.x = vp.right - right;
+                }
+
+                if (typeof top === 'number') {
+                    owner.y = vp.top + top;
+                } else if (typeof bottom === 'number') {
+                    owner.y = vp.bottom - bottom;
+                }
+            },
+
+            updateStateAndTrigger (event) {
+                const
+                    {owner, state} = this,
+                    pressed = state.get('pressed'),
+                    released = state.get('released');
+                let toggled = false;
+                
+                if (released && (event === 'pressed')) {
+                    state.set('pressed', true);
+                    state.set('released', false);
+                    toggled = true;
+                } else if (pressed && ((event === 'released') || (event === 'cancelled'))) {
+                    state.set('pressed', false);
+                    state.set('released', true);
+                    toggled = true;
+                }
+
+                if (toggled) {
+                    const
+                        message = Data.setUp(
+                            'released', pressed,
+                            'pressed', released,
+                            'triggered', released,
+                            'entity', owner
+                        );
+
+                    owner.triggerEvent(event, message);
+                    message.recycle();
+                }
+            },
+
+            destroy: function () {
+                if (this.baton && this.batonIsMine) {
+                    this.batonIsMine = false;
+                    this.owner.parent.state.set('baton', false);
+                }
+
+                this.aabb.recycle();
+                this.aabb = null;
+                this.owner.container.cursor = null;
+                this.state = null;
+            }
+        }
+    });
+}());

package/src/components/LogicCarrier.js

@@ -0,0 +1,39 @@
+/* global platypus */
+import createComponentClass from '../factory.js';
+
+export default createComponentClass(/** @lends platypus.components.LogicCarrier.prototype */{
+    
+    id: 'LogicCarrier',
+    
+    /**
+     * This component allows this entity carry other entities with which it collides. Entities that this component should carry need to have a [[Logic-Portable]] component attached to notify this entity that they are portable.
+     *
+     * @memberof platypus.components
+     * @uses platypus.Component
+     * @constructs
+     * @listens platypus.Entity#load
+     * @listens platypus.Entity#carry-me
+     * @listens platypus.Entity#release-me
+     * @fires platypus.Entity#add-collision-entity
+     * @fires platypus.Entity#remove-collision-entity
+     */
+    initialize: function () {},
+
+    events: {
+        "load": function () {
+            if (!this.owner.triggerEvent('add-collision-entity', this.owner)) {
+                // This message wasn't handled, so add a CollisionGroup component and try again!
+                this.owner.addComponent(new platypus.components.CollisionGroup(this.owner, {}));
+                this.owner.triggerEvent('add-collision-entity', this.owner);
+            }
+        },
+
+        "carry-me": function (resp) {
+            this.owner.triggerEvent('add-collision-entity', resp.entity);
+        },
+
+        "release-me": function (resp) {
+            this.owner.triggerEvent('remove-collision-entity', resp.entity);
+        }
+    }
+});

package/src/components/LogicDestroyMe.js

@@ -0,0 +1,58 @@
+import createComponentClass from '../factory.js';
+
+export default (function () {
+    return createComponentClass(/** @lends platypus.components.LogicDestroyMe.prototype */{
+        id: 'LogicDestroyMe',
+        
+        properties: {
+            /**
+             * Time in milliseconds after the "destroy-me" message is heard before entity should be removed.
+             *
+             * @property delay
+             * @type number
+             * @default 0
+             */
+            delay: 0,
+
+            /**
+             * Whether this entity has been destroyed. Typically `false` until a "destroy-me" event has been triggered.
+             *
+             * @property destroyed
+             * @type boolean
+             * @default false
+             */
+            destroyed: false
+        },
+
+        /**
+         * This component allows an entity to be removed from the stage when "destroy-me" is triggered.
+         *
+         * @memberof platypus.components
+         * @uses platypus.Component
+         * @constructs
+         * @listens platypus.Entity#destroy-me
+         * @listens platypus.Entity#prepare-logic
+         */
+        initialize: function () {},
+        
+        events: {
+            "prepare-logic": function ({delta}) {
+                if (this.destroyed && !this.owner.state.get('paused')) {
+                    this.delay -= delta;
+                    if (this.delay <= 0) {
+                        this.owner.parent.removeEntity(this.owner);
+                    }
+                }
+            },
+            
+            /**
+             * This component will set the entity up for removal on receiving this message.
+             *
+             * @event platypus.Entity#destroy-me
+             */
+            "destroy-me": function () {
+                this.destroyed = true;
+            }                   
+        }
+    });
+}());