Изменение размера игры в браузере

У меня проблема с изменением размера окна игры. Я читал различные сообщения на форуме, но я не мог получить правильное изменение размера изображения в игре.

Если повернуть размер экрана устройства, то хотелось бы, чтобы игра адаптировалась к ширине/высоте дисплея устройства как по горизонтали, так и по вертикали. Когда игра запустилась, она правильно масштабируется, просто включение масштабирования вашего устройства обмена неверно. Вернувшись к предыдущей ориентации экрана, устройство сохраняет свои пропорции.

В html шаблона добавляю:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Первый скрипт:

function preload() {
	...
	Global.game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;              
	Global.game.scale.pageAlignHorizontally = true;                   
	Global.game.scale.pageAlignVertically = true;
	Global.game.scale.forceOrientation(true, false);
	Global.game.scale.setMaximum();
	Global.game.scale.setScreenSize(true);
	...
}

function resize() {
	Global.game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
	Global.game.scale.pageAlignHorizontally = true;
	Global.game.scale.pageAlignVertically = true;
	Global.game.scale.forceOrientation(true, true);
	Global.game.scale.setShowAll();
	Global.game.scale.refresh();
}

Когда я использую этот код, масштаб игры корректируется при запуске игры. Когда в устройстве:

• изменить положение с горизонтального на вертикальное, игра большая и показать прокрутку

• изменить положение с вертикального на горизонтальное, игра плоская

Второй скрипт:

function preload() {
...
Global.game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
Global.game.scale.parentIsWindow = true;
...
}
 
 
function resize () {
Global.game.scale.refresh();
} 

Когда я использую этот код, масштаб игры корректируется при запуске игры. Когда в устройстве: 1. изменить положение с горизонтального на вертикальное, игра масштабируется, но слева и справа виден белый фон 2. изменить положение с вертикального на горизонтальное, игра масштабируется, но внизу я вижу белый фон

Я использую Фазер 2.3.

Кто-нибудь знает решение моей проблемы?

Спасибо =)

ЛУЧШЕЕ РЕШЕНИЕ

В Phaser 2.3 есть ошибка - не меняется ресайз сайта. Качаю версию 2.4.3.

Я добавил функции, загружаемые в начале, которые охраняют изменение разрешения.

    var attacks.base.x = 110;
    var attacks.base.y = 190;

    $(document).ready(function () {
       handleScreenResize(); 
    });

function handleScreenResize() {
        $(window).resize(function () {
            clearTimeout(timeoutResize);
            timeoutResize = setTimeout(function () {
            var xButtonBase;
            var yButtonBase;

            /* resize game */
            game.scale.scaleMode = Phaser.ScaleManager.RESIZE;
            game.scale.pageAlignHorizontally = true;
            game.scale.pageAlignVertically = true;
            game.scale.forceLandscape = true;
            game.scale.parentIsWindow = true;
            game.scale.refresh();

            /* get new width and height*/
            var gameWidth = game.width < game.world.width ? game.width : game.world.width;

            /** If you have static button you have change position use "cameraOffset.x" and "cameraOffset.y" set new position*/
            /* change position buttons attack */
            if(settings.control_option === 'RIGHTHAND') {
                xButtonBase = attacks.base.x;
                yButtonBase = game.height - attacks.base.y;
            } else {
                xButtonBase = gameWidth - attacks.base.x;
                yButtonBase = game.height - attacks.base.y;
            }

            /** set position buttons with attack and assist (down screen)*/
            attacks.base.button.cameraOffset.x = xButtonBase;
            attacks.base.button.cameraOffset.y = yButtonBase;

            }, 1000);
        });
    }

В preload добавить этот скрипт

 function preload() {
    ...
    Global.game.scale.scaleMode = Phaser.ScaleManager.RESIZE;
    Global.game.scale.pageAlignHorizontally = true;
    Global.game.scale.pageAlignVertically = true;
    Global.game.scale.forceLandscape = true;
    Global.game.scale.parentIsWindow = true;
    Global.game.scale.refresh();
    ...
}