はじめに

コロナの影響で、オンラインで研修やセミナーを行うことが多くなりました。

その際、Youtubeにある動画の一部分をスマートに流したい。
プロとして再生に手間取るのはかっこわるい。
事前の準備で、再生の頭出しと終わりの事前設定をしておきたい。

そんな人のためのWEBアプリを作りました。

つくりたいイメージ

オンライン研修で3本くらいYoutube動画の頭出しと終了の設定を事前に終えられて、かつ、誰でもその設定が簡単に変えられるものを作ろうと思いました。

１つの動画の頭出しと終了の設定を、
コードの方の数字を変えるだけでできるようになりました。

ただし、動画の下にあるフォームを入力しても、
自動で計算はされるものの、それが動画の頭出しの設定には
変更できません。

ここはできるように改良していきます。

コード内のこの部分の数字を変更してください。
単位は秒で。

playerVars: {
            start: 2, // 動画再生の開始位置
            end: 8 // 動画再生の終了位置

つかったフレームワーク・ライブラリなど
・Youtube Player API
・Vue.js
・Bootstrap

つくりたいものをつくるために様々格闘しましたが、
・Youtube動画を複数設置すると動画が表示されなくなる
・フォームで計算したものを、再生開始時間のところに変数を代入してみるものの、
　うまく設定が変えられない
の課題がクリアできず、ひとまず、現状で公開します。

今後改善していきます。