Skip to content

GWT guide

Mk5 edited this page Feb 18, 2019 · 2 revisions

GDX Fireapp GWT Api makes available following modules:

  • Realtime Database
  • Storage
  • Authorization

Others modules like Firebase Analytics is only for mobile purpose so when you calls some of these methods on GWT platform - nothing will happen.

Configuration

Gradle dependencies:

compile "pl.mk5.gdx-fireapp:gdx-fireapp-html:$gdxFireappVersion"
compile "pl.mk5.gdx-fireapp:gdx-fireapp-core:$gdxFireappVersion:sources"

First of all you need to put firebase web config inside your app. To do that please create following .html file inside your assets directory: android/assets/firebase-config.html and copy&paste configuration from firebase console. It should looks like this:

<script src="https://www.gstatic.com/firebasejs/4.4.0/firebase.js"></script>
<script>
  // Initialize Firebase
  var config = {
    apiKey: "",
    authDomain: "",
    databaseURL: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: ""
  };
  firebase.initializeApp(config);
</script>

You need to add GdxDefinition.gwt.xml file also:

 <inherits name='gdxfireapp_gwt'/>

Reflection

GWT can make many problems with reflection. When you can't run your application in superDev mode because of reflection - try to use latest libgdx version for ex. 1.9.7-SNAPSHOT, if that does not help try to compile your app by:

./gradlew html:dist

html:dist is also only way to look at IReflectionCache erros in LibGDX. (as far as i know). Reflection errors looks like this:

Can't find type xxx for name "mk.gdx.firebase.xxx"

Database

Because of reflection every callback should be separated class and should be added to reflection cache inside yours .gwt.xml configuration file.

Here is example of valid declaration:

public class MyCallback implements DataCallback<List<User>>{
    @MapConversion(User.class)
    @Override public void onData(List<User> data)
    {
        // do some stuff
    }
    // ...
}

.gwt.xml file:

<extend-configuration-property name="gdx.reflect.include" value="com.somepacakge.MyCallback" />
<extend-configuration-property name="gdx.reflect.include" value="com.somepacakge.User" />

Storage

First of all check if your Firebase storage allows downloading resources from not-browser origin. To allow it you need to add cors.json configuration to your bucket. You can read more here: https://firebase.google.com/docs/storage/web/download-files#cors_configuration .

In short:

  1. Download/setup gsutils (if you do not have it)

  2. Create following cors.json file:

    [
      {
        "origin": ["*"],
        "method": ["GET"],
        "maxAgeSeconds": 3600
      }
    ]
  3. Open terminal in directory where you created cors.json.

    gsutil config -b # here it'll open browser and will ask you for authorization
    # then creates .boto file with required credentials
    gsutil cors set cors.json gs://your-bucket.appspot.com # here you should replace your-bucket.appspot.com with your bucket url, you can find it in firebase configuration
Downloading image

Because GWT has some limitation in Pixmap api it is not possible to create image by:

ImageHelper.createTextureFromBytes(byte[] bytes)

You should use method downloadImage instead:

GdxFIRStorage.instance().downloadImage(String path, final DownloadCallback<TextureRegion> callback)

or directly through: ImageHelper.createTextureFromBytes(byte[] bytes, Consumer<TextureRegion>)

Clone this wiki locally