0
\$\begingroup\$

I have a problem with rendering the game on mobile platforms (the game is written on the Impact.js), the problem is only with the iOS actually, the screenshot below shows that the characters are rendered on Android, but not on the iOS

Android: Example

iOS: Example

As you can see the minimap also works (top left corner) and shows where the players are, but on iOS we can't see the players.

Code:

main.js

...
const rawResponse3 = await fetch('/getcharacterimage?' + character)
let player1Image = await rawResponse3.blob().catch(err => console.log(err))
const rawResponse4 = await fetch('/getcharacterimage?' + rivalCharacter)
let player2Image = await rawResponse4.blob().catch(err => console.log(err))

let imageCharacterUrl = window.URL ? window.URL.createObjectURL(player1Image): window.webkitURL.createObjectURL(player1Image);
let imageCharacter = new Image();

let imageRivalCharacterUrl = window.URL ? window.URL.createObjectURL(player2Image) : window.webkitURL.createObjectURL(player2Image);
let imageRivalCharacter = new Image();

let isImageCharacterLoaded = false;
let isImageRivalCharacterLoaded = false;

function checkBothImagesLoaded() {
  if (isImageCharacterLoaded && isImageRivalCharacterLoaded) {
    let MyGame = ig.Game.extend({
    ...
      init: function() {
        ...
        this.spawnPlayer();
        ...
      },
      spawnPlayer: function() {
        var spawnPos = this.getRandomSpawnPos();
        this.player = this.spawnEntity(EntityPlayer, spawnPos.x, spawnPos.y, {mapID: MapID, image: imageCharacter.src})
      },
      spawnRemotePlayer: function(user, x, y) {
        this.remotePlayers[user.userId] =
          this.spawnEntity(EntityRemotePlayer, x, y, {image: imageRivalCharacter.src});
        return this.remotePlayers[user.userId];
      },
    ...
    })
    ...
  }
)
imageCharacter.onload = function() {
  isImageCharacterLoaded = true;
  checkBothImagesLoaded();
};

imageRivalCharacter.onload = function() {
  isImageRivalCharacterLoaded = true;
  checkBothImagesLoaded();
};

imageCharacter.src = imageCharacterUrl;
imageRivalCharacter.src = imageRivalCharacterUrl;

player.js

...

EntityPlayer = ig.Entity.extend({
...
    init: async function(x, y, settings) {
      ...
      this.animSheet = new ig.AnimationSheet(settings.image, 152, 152);
      ...
    }

...
})
\$\endgroup\$

0

You must log in to answer this question.