Не удается обнаружить кнопку ESC на Chrome (пакетном) приложении (в полноэкранном режиме)


Звучит просто, но абсолютно кошмарно. Я не могу обнаружить, что кнопка эвакуации нажата. Мне нужно знать, включен ли полноэкранный режим, так как вы не можете заблокировать кнопку escape от нажатия. Javascript вводится в HTML, который загружается в webview.

$(document).keyup(function(e) {
  if (e.keyCode === 27) {
    console.log("esc pressed")
  }
});

Это работает только тогда, когда вид не является полноэкранным!

Переход на полноэкранный режим:

$('#fullscreen-button').unbind("click").on('click', function(){
  viewer.setFullscreen();
});

setFullscreen: function() {
  if(!viewer.isFullScreen()) {
    console.log("window fullscreen --> ",viewer.isFullScreen());
    document.body.webkitRequestFullscreen();
    $("#presenter, #slide-container .owl-item").addClass('fullscreen tenTwenty');
    $("#viewer-container, #slide-container").addClass('fullscreen thirteenSix');
    $('.fullscreen').width(screen.width);
    $('.fullscreen').height(screen.height);
    $('#slide-container').trigger('refresh.owl.carousel');
  } else {
    document.webkitCancelFullScreen();
    console.log("window fullscreen --> ",viewer.isFullScreen());
    $('.tenTwenty').width(1024); $('.tenTwenty').height(768);
    $('.thirteenSix').width(1366); $('.thirteenSix').height(768);
    $("#presenter, #viewer-container, #slide-container, #slide-container .owl-item").removeClass('fullscreen tenTwenty thirteenSix');
    $('#slide-container').trigger('refresh.owl.carousel');
  }
},

isFullScreen: function(){
  if ( document.webkitFullscreenElement) {
    return true;
  } else {
    return false;
  }
},
1 3

1 ответ:

Поскольку вы используете jQuery,вы можете добавить прослушиватель для проверки изменения полноэкранного режима. Он не говорит вам, открывается или закрывается полноэкранный режим, но вы можете проверить все состояния следующим образом:

// you only need "webkitfullscreenchange" if it's only a chrome app
$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange MSFullscreenChange', function() {
    if(!viewer.isFullScreen()) {
        // you are out of fullscreen
    } else {
        // you are in fullscreen
    }
});

Правка:

Как мы говорим в комментариях, vanilla js идеально подходит:

  document.addEventListener('webkitfullscreenchange', function(e) {});