Как сделать скрипт, который воспроизводит и приостанавливает несколько кадров a-видео - PullRequest
Новая
       14

Как сделать скрипт, который воспроизводит и приостанавливает несколько кадров a-видео

0 голосов
/ 19 июня 2019

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

В моем примере отличается от других ответов о переполнении стека, которые я использовал для успешного выполнения моего кода ниже, это то, что я хочу иметь несколько видео, все из которых контролируются отдельным кликом.Я попытался использовать a-video и класс 'videos': document.querySelector('a-video') // document.querySelector('.videos'), но он все равно не воспроизводится.Вот весь мой код, который работает БОЛЬШОЕ, когда есть одно видео: 

      <script>
      AFRAME.registerComponent('videohandler',{
         init: function(){
         let el = this.el;
         let vid = document.querySelector('#my_vid');
         let playing = false;
         vid.pause();
         el.addEventListener('click',function(){
           if(!playing) {
            vid.play();
         } else {
            vid.pause();
         }
         playing = !playing;
         });
        }
      });</script>

Помимо этого, я приведу в качестве примера: 

<a-plane material="shader: flat; src:#my_vid" raycastable videohandler></a-plane>

Большое спасибо за вашу помощь!

1 Ответ

0 голосов
/ 21 июня 2019

Хорошо, мне удалось выяснить это и выложить этот ответ, так что, возможно, следующий человек сможет найти ответ: 

<script>
      AFRAME.registerComponent('videohandler',{
         schema: {
            src: {type: 'string', default: ''}
          },

         init: function(){
         let el = this.el;
         let vid = document.querySelector(this.data.src);
         let playing = false;
         vid.pause();
         el.addEventListener('click', function(){
           if(!playing) {
            vid.play();
         } else {
            vid.pause();
         }
         playing = !playing;
         });
        }
      });</script>

Чтобы запустить в HTML, вы вызываете его в сущности: 

<a-entity id="videoPlayer" material="src: #my_vid"  geometry="primitive: plane; height: 2; width: 3" videohandler="src: #my_vid"></a-entity>

Ура!

...