広告が流れているときは同期をストップ

[atori74]

ホスト側 広告が流れているときは広告のビデオのpositionが取得される なので、サーバーへのplaybackPositionの送信を止める

クライアント側 広告が流れているときは、seekを止める

[atori74]

youtubeで広告が流れているかの判定

var player = document.getElementsByClassName('html5-video-player');
player[0].classList.contains('ad-interrupting'); //true

[atori74]

youtubeの広告スキップ スキップボタンが現れるパターンであれば、スキップボタンが出る前でもスキップボタンの要素にはアクセス可能

document.getElementsByClassName('ytp-ad-skip-button')[0].click()

[atori74]

let adInterrupting = document.getElementsByClassName('html5-video-player')[0].classList.contains('ad-interrupting')
if (adInterrupting) {
    // 広告表示中スキップするなりなんなり
} else {
    // currentTime取得
}

[atori74]

YoutubeSync = class {
    constructor() {
        this.video = document.getElementsByClassName('video-stream html5-main-video')[0];
        this.adInterrupting = false;

        this.video.addEventListener('play', evt => {
            console.log('video started')
        })

        this.video.addEventListener('pause', evt => {
            console.log('video paused')
        })

        this.video.addEventListener('seeked', evt => {
            console.log('video seeked')
        })

        this.observer = new MutationObserver(mutations => {
            mutations.forEach(m => {
                if(this.adInterrupting != m.target.classList.contains('ad-interrupting')) {
                    this.adInterrupting = (this.adInterrupting ? false : true);
                    console.log('ad active/inactive')
                }
            })
        })
    }

    observeVideo() {
        const target = document.getElementsByClassName('html5-video-player')[0];
        this.observer.observe(target, {
            attributes: true,
            attributeOldValue: true,
            attributeFilter: ['class',],
        })
    }

    play() {
        this.video.play();
    }

    pause() {
        this.video.pause();
    }

    seekTo(pb) {
        this.video.currentTime = pb;
    }

    seekAfter(sec) {
        this.video.currentTime += sec;
    }

    sendPlaybackPosition() {
        chrome.runtime.sendMessage({
            type: 'FROM_PAGE',
            command: 'playbackPosition',
            data: {position: this.video.currentTime, currentTime: (new Date()).toISOString()}
        }, undefined);
    }
}