Как обнаружить видео с ног на голову в Angular - PullRequest
0 голосов
/ 09 января 2020

Я использую Angular 7, и в моем приложении есть видео с камеры. Я использовал Chrome веб-браузер для этого теста. Это код:

[HTML]

<video #videoElement autoplay [ngStyle]="videoStyle"></video>

[TS]

contentMargin: any = { top: 62, right: 0, bottom: 62, left: 0 };`

this.containerWidth = window.innerWidth - this.contentMargin.left - this.contentMargin.right;
this.containerHeight = window.innerHeight - this.contentMargin.top - this.contentMargin.bottom;

this.videoContainerStyle = {
      'width': '100%',
      'height': this.containerHeight + 'px',
      'margin': '0',
      'overflow': 'hidden',
};

this.scaleRatio = Math.max(this.containerWidth / this.videoWidth, this.containerHeight / this.videoHeight);

let transform = 'scale(' + this.scaleRatio + ', ' + this.scaleRatio + ')'; 
var offsetTop = 0;
var offsetLeft = 0;

offsetTop = this.videoHeight * this.scaleRatio / 2 - this.videoHeight / 2;
offsetLeft = this.videoWidth * this.scaleRatio / 2 - this.videoWidth / 2;

this.videoStyle = {
     'height': this.videoHeight + 'px',
     'width': this.videoWidth + 'px',
     'transform-origin': 'center center',
     'transform': transform,
     'overflow': 'hidden',
     'position': 'relative',
     'top': offsetTop + 'px',
     'left': offsetLeft + 'px'
};

Этот код хорошо работает для всех устройств, кроме одна таблетка Когда мое приложение включает камеру для планшетов, это нормально, но когда я поворачиваю планшет (это означает портретный режим), видеоэкран переворачивается. Я думаю, что это проблема с драйвером камеры, потому что он хорошо работает для другого устройства. Я пытался связаться со службой поддержки планшетов, но так и не ответил об этой проблеме, поэтому я хотел бы исправить ее с помощью своего кода. Однако я не знаю, как обнаружить, что видео перевернуто или нет.

Одна странная вещь - этот код хорошо работает для браузера MS Edge. Chrome и Firefox браузер не работает.

Пожалуйста, дайте мне совет для этого.

Буду признателен заранее.

...