131 lines
3.5 KiB
JavaScript
131 lines
3.5 KiB
JavaScript
/*
|
|
* Copyright 2016 Google Inc. All Rights Reserved.
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
var Util = require('../util');
|
|
|
|
/**
|
|
* A proxy class for working around the fact that as soon as a video is play()ed
|
|
* on iOS, Safari auto-fullscreens the video.
|
|
*
|
|
* TODO(smus): The entire raison d'etre for this class is to work around this
|
|
* issue. Once Safari implements some way to suppress this fullscreen player, we
|
|
* can remove this code.
|
|
*/
|
|
function VideoProxy(videoElement) {
|
|
this.videoElement = videoElement;
|
|
// True if we're currently manually advancing the playhead (only on iOS).
|
|
this.isFakePlayback = false;
|
|
|
|
// When the video started playing.
|
|
this.startTime = null;
|
|
}
|
|
|
|
VideoProxy.prototype.play = function() {
|
|
if (Util.isIOS9OrLess()) {
|
|
this.startTime = performance.now();
|
|
this.isFakePlayback = true;
|
|
|
|
// Make an audio element to playback just the audio part.
|
|
this.audioElement = new Audio();
|
|
this.audioElement.src = this.videoElement.src;
|
|
this.audioElement.play();
|
|
} else {
|
|
this.videoElement.play().then(function(e) {
|
|
console.log('Playing video.', e);
|
|
});
|
|
}
|
|
};
|
|
|
|
VideoProxy.prototype.pause = function() {
|
|
if (Util.isIOS9OrLess() && this.isFakePlayback) {
|
|
this.isFakePlayback = true;
|
|
|
|
this.audioElement.pause();
|
|
} else {
|
|
this.videoElement.pause();
|
|
}
|
|
};
|
|
|
|
VideoProxy.prototype.setVolume = function(volumeLevel) {
|
|
if (this.videoElement) {
|
|
// On iOS 10, the VideoElement.volume property is read-only. So we special
|
|
// case muting and unmuting.
|
|
if (Util.isIOS()) {
|
|
this.videoElement.muted = (volumeLevel === 0);
|
|
} else {
|
|
this.videoElement.volume = volumeLevel;
|
|
}
|
|
}
|
|
if (this.audioElement) {
|
|
this.audioElement.volume = volumeLevel;
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Set the attribute mute of the elements according with the muteState param.
|
|
*
|
|
* @param bool muteState
|
|
*/
|
|
VideoProxy.prototype.mute = function(muteState) {
|
|
if (this.videoElement) {
|
|
this.videoElement.muted = muteState;
|
|
}
|
|
if (this.audioElement) {
|
|
this.audioElement.muted = muteState;
|
|
}
|
|
};
|
|
|
|
VideoProxy.prototype.getCurrentTime = function() {
|
|
return Util.isIOS9OrLess() ? this.audioElement.currentTime : this.videoElement.currentTime;
|
|
};
|
|
|
|
/**
|
|
*
|
|
* @param {Object} time
|
|
*/
|
|
VideoProxy.prototype.setCurrentTime = function(time) {
|
|
if (this.videoElement) {
|
|
this.videoElement.currentTime = time.currentTime;
|
|
}
|
|
if (this.audioElement) {
|
|
this.audioElement.currentTime = time.currentTime;
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Called on RAF to progress playback.
|
|
*/
|
|
VideoProxy.prototype.update = function() {
|
|
// Fakes playback for iOS only.
|
|
if (!this.isFakePlayback) {
|
|
return;
|
|
}
|
|
var duration = this.videoElement.duration;
|
|
var now = performance.now();
|
|
var delta = now - this.startTime;
|
|
var deltaS = delta / 1000;
|
|
this.videoElement.currentTime = deltaS;
|
|
|
|
// Loop through the video
|
|
if (deltaS > duration) {
|
|
this.startTime = now;
|
|
this.videoElement.currentTime = 0;
|
|
// Also restart the audio.
|
|
this.audioElement.currentTime = 0;
|
|
}
|
|
};
|
|
|
|
module.exports = VideoProxy;
|