Initial version, basic interactions such as 'push' and 'you'. Emergent...

Initial version, basic interactions such as 'push' and 'you'. Emergent features implemented such as noun 'is' noun

src/game/Noun.js

+// @flow
+
+import Adjective from './Adjective'
+
+export type ImageOptions = {
+    text: string,
+    entity?: string,
+}
+
+export default class Noun {
+    adjectives: Set<Adjective>
+
+    textImage: string
+    entityImage: string
+
+    meta = {}
+
+    static async createDefaultTextNoun() {
+        const text = new Noun({ text: '/text-text.png' })
+        const pushData = await Adjective.resolveInteractionSource({ type: 'internal', data: 'adjectives/push' })
+        const push = new Adjective('push', pushData)
+        text.adjectives.add(push)
+        text.meta.defaultTextNoun = true
+        return text
+    }
+
+    constructor(images: ImageOptions) {
+        this.textImage = images.text
+        this.entityImage = images.entity
+        this.adjectives = new Set()
+    }
+
+    async interact(otherNoun: Noun, ownLocation: [number, number], previousLocation: [number, number]) {
+        const otherAdjectives = otherNoun.adjectives
+        console.log(this.adjectives)
+        outer: for (const adjective of this.adjectives) {
+            for (const other of otherAdjectives) {
+                console.log(adjective)
+                const outcome = await adjective.interact(other, ownLocation, previousLocation)
+                return outcome
+                //
+                // console.log(adjective.id, other.id, outcome)
+                // switch (outcome) {
+                //     case "stop":
+                //         break outer
+                //     case "destroy-self":
+                //         console.log("DESTROY_SELF")
+                //         break outer
+                //     case "destroy-other":
+                //         console.log("DESTORY_OTHER")
+                //         break outer
+                //     case "destroy-both":
+                //         console.log("DESTROY_BOTH")
+                //         break outer
+                //     case "is-moved":
+                //         console.log("MOVE_BOTH")
+                //         break outer
+                // }
+            }
+        }
+    }
+
+    clear() {
+        this.set([])
+    }
+
+    set(adjectives) {
+        this.adjectives = new Set(adjectives)
+    }
+
+    add(adjective) {
+        this.adjectives.add(adjective)
+    }
+}
\ No newline at end of file

src/render/Level.js

+import React from 'react'
+import LevelData, { Inputs } from '../game/Level'
+
+function* __rangeInner(start, end, step) {
+    let c = start
+    while (c < end) {
+        yield c
+        c += step
+    }
+}
+
+function range(...args) {
+    if (args.length === 1) {
+        const [end] = args
+        return __rangeInner(0, end, 1)
+    }
+    if (args.length === 2) {
+        const [start, end] = args
+        return __rangeInner(start, end, 1)
+    }
+    if (args.length === 3) {
+        const [start, end, step] = args
+        return __rangeInner(start, end, step)
+    }
+    throw new TypeError('Invalid number of arguments')
+}
+
+type Props = {
+    scale?: number,
+    size?: number,
+    margin?: number,
+    level: LevelData,
+}
+
+export default class Level extends React.Component<Props> {
+    static defaultProps = {
+        scale: 1,
+        size: 32,
+        margin: 1,
+        active: false,
+    }
+
+
+    state = {
+        nonce: Math.random(),
+    }
+
+
+    componentDidMount(): void {
+        window.addEventListener('keyup', this.handleKeyPress)
+    }
+
+    handleKeyPress = async e => {
+        e.preventDefault()
+        if (this.state.active > 0) {
+            return
+        }
+        const { key } = e
+        let input = null
+        switch (key.toLowerCase()) {
+            case 'arrowleft':
+            case 'a':
+                input = Inputs.Controls.Left
+                break
+            case 'arrowright':
+            case 'd':
+                input = Inputs.Controls.Right
+                break
+            case 'arrowdown':
+            case 's':
+                input = Inputs.Controls.Down
+                break
+            case 'arrowup':
+            case 'w':
+                input = Inputs.Controls.Up
+                break
+            case ' ':
+                input = Inputs.Actions.Wait
+                break
+        }
+
+        if (input) {
+            this.setState(s => ({ active: s.active + 1 }))
+            await this.props.level.processInput(input)
+            this.setState(s => ({ nonce: Math.random(), active: s.active - 1 }))
+        }
+    }
+
+    render() {
+        const {scale, size, margin, level} = this.props
+        const {width, height} = level
+        return (
+            <div className="level-container">
+                {[...range(width)].map(x =>
+                    [...range(height)].map(y => (
+                        <div className="level-tile" style={{
+                            left: (margin * x) + (x * 32 * scale),
+                            top: (margin * y) + (y * 32 * scale),
+                            width: size * scale,
+                            height: size * scale
+                        }}/>
+                    ))
+                ).reduce((a, c) => (a || []).concat(c))}
+                {level.entities.map(entity => {
+                    const {x, y, image} = entity.renderProps
+                    const left = (margin * x) + (x * 32 * scale)
+                    const top = (margin * y) + (y * 32 * scale)
+
+                    return (
+                        <img className="level-entity" src={image} style={{
+                            left,
+                            top,
+                            width: size * scale,
+                            height: size * scale
+                        }}/>
+                    )
+                })}
+                {level.connectors.map(connector => {
+                    const {x, y, type: cType} = connector
+                    const left = (margin * x) + (x * 32 * scale)
+                    const top = (margin * y) + (y * 32 * scale)
+
+                    return (
+                        <img className="level-entity" src={`/${ cType }-text.png`} style={{
+                            left,
+                            top,
+                            width: size * scale,
+                            height: size * scale
+                        }}/>
+                    )
+                })}
+            </div>
+        )
+    }
+
+}
\ No newline at end of file

src/store/level/reducer.js

+
+const initial = {
+    entities: [],
+}
\ No newline at end of file

src/store/reducers.js

+import { combineReducers } from "redux";
+import level from './level/reducer'
+
+export default combineReducers({
+    level,
+})
\ No newline at end of file

src/store/store.js

+import {createStore} from "redux"
+import reducers from './reducers'
+
+const store = createStore(reducers)
+
+window._s = store
+
+export default store