bberak / react-native-game-engine-template

React Native Game Engine Template
MIT License
92 stars 20 forks source link

bug when launched #1

Open x5engine opened 5 years ago

x5engine commented 5 years ago

bug when I start the app

Possible Unhandled Promise Rejection (id: 1):
Object {
  "bubbles": false,
  "cancelable": false,
  "currentTarget": XMLHttpRequest {
    "DONE": 4,
    "HEADERS_RECEIVED": 2,
    "LOADING": 3,
    "OPENED": 1,
    "UNSENT": 0,
    "_aborted": false,
    "_cachedResponse": undefined,
    "_hasError": true,
    "_headers": Object {},
    "_incrementalEvents": true,
    "_lowerCaseResponseHeaders": Object {},
    "_method": "GET",
    "_requestId": null,
    "_response": "",
    "_responseType": "arraybuffer",
    "_sent": true,
    "_subscriptions": Array [],
    "_timedOut": false,
    "_trackingName": "unknown",
    "_url": "file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Freact-native-game-engine-template-84bbb24a-c938-4264-8faa-dee7c0874acc/ExponentAsset-096ec86bf44273b6524c161d5cfc9aff.fbx",
    "readyState": 4,
    "responseHeaders": undefined,
    "status": 0,
    "timeout": 0,
    "upload": XMLHttpRequestEventTarget {
      Symbol(listeners): Object {},
    },
    "withCredentials": true,
    Symbol(listeners): Object {
      "abort": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
      "error": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
      "load": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
      "progress": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
    },
  },
  "eventPhase": 2,
  "isTrusted": false,
  "target": XMLHttpRequest {
    "DONE": 4,
    "HEADERS_RECEIVED": 2,
    "LOADING": 3,
    "OPENED": 1,
    "UNSENT": 0,
    "_aborted": false,
    "_cachedResponse": undefined,
    "_hasError": true,
    "_headers": Object {},
    "_incrementalEvents": true,
    "_lowerCaseResponseHeaders": Object {},
    "_method": "GET",
    "_requestId": null,
    "_response": "",
    "_responseType": "arraybuffer",
    "_sent": true,
    "_subscriptions": Array [],
    "_timedOut": false,
    "_trackingName": "unknown",
    "_url": "file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Freact-native-game-engine-template-84bbb24a-c938-4264-8faa-dee7c0874acc/ExponentAsset-096ec86bf44273b6524c161d5cfc9aff.fbx",
    "readyState": 4,
    "responseHeaders": undefined,
    "status": 0,
    "timeout": 0,
    "upload": XMLHttpRequestEventTarget {
      Symbol(listeners): Object {},
    },
    "withCredentials": true,
    Symbol(listeners): Object {
      "abort": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
      "error": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
      "load": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
      "progress": Object {
        "kind": 2,
        "listener": [Function anonymous],
        "next": null,
      },
    },
  },
  "timeStamp": 1571089175148,
  "type": "error",
  Symbol(stop_immediate_propagation_flag): false,
  Symbol(canceled_flag): false,
  Symbol(original_event): Object {
    "type": "error",
  },
}
vitalspace commented 4 years ago

Has anyone been able to solve this?

bberak commented 4 years ago

@HadrienRivere @x5engine

Sorry dudes, not sure how I missed this issue! First time I'm seeing it.

I used the template over the weekend on NodeJS 8.9.4 and NPM 6.9.0, it worked fine.

Can I get the following details of you guys:

vitalspace commented 4 years ago

@HadrienRivere @x5engine

Sorry dudes, not sure how I missed this issue! First time I'm seeing it.

I used the template over the weekend on NodeJS 8.9.4 and NPM 6.9.0, it worked fine.

Can I get the following details of you guys:

  • NodeJS, NPM
  • OS
  • Expo version
  • Simulator + details
  • Device + details
  • DId you make any changes to the template or are you basically running it after cloning?

Hello, thanks for answering.

Here is more details about the problem:

Node Version: v12.8.1 Npm Version: 6.10.2 Os; Windows Expo version: 3.11.3 Simulator : N/A Device: Motorola e5 plus, Basically when we run the npm start and wait for the program to be compiled, the screen in the divice goes dark and on the console throws the message described above. DId you make any changes to the template or are you basically running it after cloning? No.

x5engine commented 4 years ago

just wait another 4 months for a response

bberak commented 4 years ago

Hi @HadrienRivere,

Can you replace game/index.js with:

import React from "react";
import { View } from "react-native";
import { GameEngine } from "react-native-game-engine";

const sys = entities => entities;

function Circle() {
  return <View style={{ backgroundColor: "red", width: 50, height: 50, borderRadius: 50, left: 100, top: 100 }} />
}

class Game extends React.Component {
  render() {
    return (
      <GameEngine
        style={{ backgroundColor: "black" }}
        systems={[sys]}
        entities={{
          test: { renderer: Circle }
        }}
      />
    );
  }
}

export default Game;

I just want to see if anything shows up on the screen. I suspect its a permission thing with downloding .fbx files, or perhaps expo isn't packaging them properly or at all.

I'll hop on my Windows machine after work and give it a shot.

vitalspace commented 4 years ago

Hi @HadrienRivere,

Can you replace game/index.js with:

import React from "react";
import { View } from "react-native";
import { GameEngine } from "react-native-game-engine";

const sys = entities => entities;

function Circle() {
  return <View style={{ backgroundColor: "red", width: 50, height: 50, borderRadius: 50, left: 100, top: 100 }} />
}

class Game extends React.Component {
  render() {
    return (
      <GameEngine
        style={{ backgroundColor: "black" }}
        systems={[sys]}
        entities={{
          test: { renderer: Circle }
        }}
      />
    );
  }
}

export default Game;

I just want to see if anything shows up on the screen. I suspect its a permission thing with downloding .fbx files, or perhaps expo isn't packaging them properly or at all.

I'll hop on my Windows machine after work and give it a shot.

Hi. Now I have the following.

screenshot

Console:

console

bberak commented 4 years ago

Okay, it must be something with .fbx extension. I wouldn't be surprised if the .glb extension also didn't work.. Can you undo what we did abouve ^^ and replace game/entities.js with the following:

import { THREE } from 'expo-three';
import Camera from "./components/camera";
import Cuphead from "./components/cuphead";
import HUD from "./components/hud";
import Turntable from "./components/turntable";
//import Droid from "./components/droid";
import Portal from "./components/portal";
//import Jet from "./components/jet";
import { clear } from "./utils/three";
import * as OIMO from "oimo";

const scene = new THREE.Scene();
const camera = Camera();
const world = new OIMO.World({ 
    timestep: 1 / 60, 
    iterations: 8, 
    broadphase: 2,
    worldscale: 1,
    random: true,
    info: false,
    gravity: [0, -9.8 ,0] 
});

export default async () => {
    clear(scene);
    world.clear();

    const ambient = new THREE.AmbientLight(0xffffff, 1);
    const sunlight = new THREE.DirectionalLight(0xffffff, 0.95);

    sunlight.position.set(50, 50, 50);

    scene.add(ambient);
    scene.add(sunlight);

    camera.position.set(0, 2, 6);
    camera.lookAt(new THREE.Vector3(0, 0, 0));

    const cuphead = await Cuphead({ y: 1 });
    //const droid = await Droid({ y: 1 });
    const portal = await Portal({ y: 1 });
    //const jet = await Jet({ y: 1 });

    const turntable = Turntable({ parent: scene, world, items: [cuphead, portal] });    
    const hud = HUD();

    const entities = {
        scene,
        camera,
        world,
        //droid,
        cuphead,
        portal,
        //jet,
        turntable,
        hud
    }

    return entities;
};
vitalspace commented 4 years ago

Okay, it must be something with .fbx extension. I wouldn't be surprised if the .glb extension also didn't work.. Can you undo what we did abouve ^^ and replace game/entities.js with the following:

import { THREE } from 'expo-three';
import Camera from "./components/camera";
import Cuphead from "./components/cuphead";
import HUD from "./components/hud";
import Turntable from "./components/turntable";
//import Droid from "./components/droid";
import Portal from "./components/portal";
//import Jet from "./components/jet";
import { clear } from "./utils/three";
import * as OIMO from "oimo";

const scene = new THREE.Scene();
const camera = Camera();
const world = new OIMO.World({ 
    timestep: 1 / 60, 
    iterations: 8, 
    broadphase: 2,
    worldscale: 1,
    random: true,
    info: false,
    gravity: [0, -9.8 ,0] 
});

export default async () => {
  clear(scene);
  world.clear();

  const ambient = new THREE.AmbientLight(0xffffff, 1);
  const sunlight = new THREE.DirectionalLight(0xffffff, 0.95);

    sunlight.position.set(50, 50, 50);

    scene.add(ambient);
    scene.add(sunlight);

  camera.position.set(0, 2, 6);
  camera.lookAt(new THREE.Vector3(0, 0, 0));

  const cuphead = await Cuphead({ y: 1 });
  //const droid = await Droid({ y: 1 });
  const portal = await Portal({ y: 1 });
  //const jet = await Jet({ y: 1 });

  const turntable = Turntable({ parent: scene, world, items: [cuphead, portal] });    
  const hud = HUD();

  const entities = {
      scene,
      camera,
      world,
      //droid,
      cuphead,
      portal,
      //jet,
      turntable,
      hud
  }

  return entities;
};

Hi. good morning.

It seems that now everything is going right. now it clearly loads the game. there is only one detail, the cuphead entity is static. it moves under its axis but that does not advance beyond where it is generated.

img

console:

console

bberak commented 4 years ago

Hi @HadrienRivere,

When you swivel the "touch stick" on the left, Cuphead should cyle through some sprite animations. Is that working? If you hit the "a" or "b" buttons some boxes and cylinders will fall from the sky.

Other than that, that's about all it does.. I use this repo as a starter for working with the React Native Game Engine library. It contains a bunch of systems and renderering effects that may be useful to others. But it definitely isn't a playable game.

Cheers.