rizzo-next
Version:
The next generation of Lonely Planet's style guide and pattern library.
899 lines (789 loc) • 29.4 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
var _video_player = require("./video_player");
var _video_player2 = _interopRequireDefault(_video_player);
var _mobile_util = require("../../core/mobile_util");
var _mobile_util2 = _interopRequireDefault(_mobile_util);
var _lodash = require("lodash");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* global videojs */
var _ = { get: _lodash.get };
var bcPlayerIds = {
default: "default",
background: "BJputewob",
bestintravel: "HkJcclwoZ",
destination: "HkPdqeDiZ",
test: "H1SwHfqIM"
};
var Brightcove = function (_VideoPlayer) {
_inherits(Brightcove, _VideoPlayer);
function Brightcove() {
_classCallCheck(this, Brightcove);
return _possibleConstructorReturn(this, (Brightcove.__proto__ || Object.getPrototypeOf(Brightcove)).apply(this, arguments));
}
_createClass(Brightcove, [{
key: "initialize",
value: function initialize() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
// Playlist props
this.videos = [];
this.currentVideoIndex = null;
// Brightcove props
this.player = null;
this.bcAccountId = "5104226627001";
this.bcEmbedId = "default";
this.bcPlayerId = bcPlayerIds[options.playerName];
// Whether the player is within the viewport or not
this.inView = this.isInView();
// Popout props
this.popoutEnabled = false; // overrides this.popout (ex. player won't popout if it's not current playing)
this.isPoppedOut = false; // whether the player is poppout out currently or not
this.popoutOutOfViewTimeoutId = null;
this.popoutInViewTimeoutId = null;
/*
This is populated every time a text track's oncuechange event is fired.
We can compare this to what it was previously to determine whether it's
the first time seeing an active cue or not (so we can call onPlayerCuePoint).
*/
this.activeCues = [];
// These flags control whether certain UI elements should automatically
// become visible while an ad or video are playing, and should be hidden otherwise.
this.showCaptions = false;
this.showMutedOverlay = false;
_get(Brightcove.prototype.__proto__ || Object.getPrototypeOf(Brightcove.prototype), "initialize", this).call(this, options);
this.events["click .video-js"] = "onClickVideo";
window.addEventListener("scroll", this.onWindowScroll.bind(this));
}
}, {
key: "set",
value: function set(options) {
this.autoplay = _.get(options, "autoplay", this.autoplay);
this.playWhenInView = _.get(options, "playWhenInView", this.playWhenInView);
var videoId = _.get(options, "videoId", null);
if (videoId) {
this.loadVideo(videoId);
}
}
}, {
key: "onWindowScroll",
value: function onWindowScroll() {
var inView = this.isInView();
if (!this.inView && inView) {
this.onInView();
} else if (this.inView && !inView) {
this.onOutOfView();
}
this.inView = inView;
}
}, {
key: "updatePopout",
value: function updatePopout() {
if (this.popoutEnabled && this.isAboveViewport()) {
this.showPopout();
} else {
this.hidePopout();
}
}
}, {
key: "showPopout",
value: function showPopout() {
var _this2 = this;
if (!this.popout || this.isPoppedOut) {
return;
}
this.isPoppedOut = true;
var popoutInner = this.$el.find(".video__popout-inner");
clearInterval(this.popoutInViewTimeoutId);
this.popoutInViewTimeoutId = null;
if (!this.popoutOutOfViewTimeoutId) {
popoutInner.removeClass("video__popout-inner-visible");
if (this.hasLPUIPlugin()) {
this.player.lp().props({
popoutHandler: this.onClickPopoutOverlay.bind(this)
});
}
this.popoutOutOfViewTimeoutId = setTimeout(function () {
popoutInner.addClass("video__popout-inner-poppedout").addClass("video__popout-inner-visible");
_this2.popoutOutOfViewTimeoutId = null;
}, 200);
}
}
}, {
key: "hidePopout",
value: function hidePopout() {
var _this3 = this;
if (!this.popout || !this.isPoppedOut) {
return;
}
this.isPoppedOut = false;
var popoutInner = this.$el.find(".video__popout-inner");
clearInterval(this.popoutOutOfViewTimeoutId);
this.popoutOutOfViewTimeoutId = null;
if (!this.popoutInViewTimeoutId) {
popoutInner.removeClass("video__popout-inner-visible");
if (this.hasLPUIPlugin()) {
this.player.lp().hidePopout();
}
this.popoutInViewTimeoutId = setTimeout(function () {
popoutInner.removeClass("video__popout-inner-poppedout").addClass("video__popout-inner-visible");
_this3.popoutInViewTimeoutId = null;
}, 200);
}
}
}, {
key: "hasLPUIPlugin",
value: function hasLPUIPlugin() {
return this.player && this.player.lp && this.player.lp() && this.player.lp().props;
}
}, {
key: "onInView",
value: function onInView() {
this.updatePopout();
if (this.player && this.playWhenInView) {
this.showMutedOverlay = true;
this.showCaptions = true;
this.player.muted(true);
this.play();
}
}
}, {
key: "onOutOfView",
value: function onOutOfView() {
this.updatePopout();
if (this.pauseWhenOutOfView) {
this.pause();
}
}
}, {
key: "isInView",
value: function isInView() {
return !this.isAboveViewport() && !this.isBelowViewport();
}
}, {
key: "isBelowViewport",
value: function isBelowViewport() {
var bounds = this.el.getBoundingClientRect();
var containerHeightThreshold = bounds.height * this.outOfViewThreshold;
var windowHeight = window.innerHeight;
return bounds.top > windowHeight - containerHeightThreshold;
}
}, {
key: "isAboveViewport",
value: function isAboveViewport() {
var bounds = this.el.getBoundingClientRect();
var containerHeightThreshold = bounds.height * this.outOfViewThreshold;
return bounds.top < -containerHeightThreshold;
}
}, {
key: "onClickVideo",
value: function onClickVideo(event) {
/*
Prevent event from bubbling into the UI
when the user interacts with the video.
This was originally put it for our "Video Poster Button" component
(which isn't currently used anymore and didn't use our videojs-lp plugin).
Stopping event propagation breaks our videojs-lp plugin though, so check for it here.
*/
if (!this.hasLPUIPlugin()) {
event.stopPropagation();
}
}
}, {
key: "play",
value: function play() {
_get(Brightcove.prototype.__proto__ || Object.getPrototypeOf(Brightcove.prototype), "play", this).call(this);
this.autoplay = true;
if (this.player) {
var promise = this.player.play();
if (promise) {
promise.catch(function (reason) {
return console.log("VIDEOJS:", reason);
}).then(function () {});
}
}
}
}, {
key: "pause",
value: function pause() {
_get(Brightcove.prototype.__proto__ || Object.getPrototypeOf(Brightcove.prototype), "pause", this).call(this);
this.autoplay = false;
if (this.player) {
this.player.pause();
}
}
}, {
key: "start",
value: function start() {
this.currentVideoIndex = null;
this.autoplay = true;
this.loadNextVideo();
}
}, {
key: "setup",
value: function setup() {
if (!this.videoEl) {
var html = "\n <div class=\"video__popout " + (_mobile_util2.default.isMobile() ? "video__popout-mobile" : "") + "\">\n <div class=\"video__popout-inner video__popout-inner-visible " + (this.cover ? "video__cover--container" : "") + "\">\n " + (this.popout ? "<div id='" + this.getPopoutOverlayId() + "' class='video__popout-overlay icon-close-small'></div>" : "") + "\n <video\n " + (this.videoId ? "data-video-id='" + this.videoId + "'" : "") + "\n " + (this.playsInline ? "playsinline webkit-playsinline" : "") + "\n data-account=\"" + this.bcAccountId + "\"\n data-player=\"" + this.bcPlayerId + "\"\n data-embed=\"" + this.bcEmbedId + "\"\n data-application-id class=\"video-js\" ></video>\n <div class='video__muted-overlay'><span class='vjs-icon-volume-high' /></div>\n </div>\n </div>";
this.el.innerHTML = html;
// Bind hover class as we style various things under this class
// and :hover doesn't bubble
this.$el.find(".video__popout-inner").mouseenter(function () {
$(this).addClass("video__popout-inner-hover");
}).mouseleave(function () {
$(this).removeClass("video__popout-inner-hover");
});
// Bind click handler to X button for popout
this.$el.find("#" + this.getPopoutOverlayId()).click(this.onClickPopoutOverlay.bind(this));
// Bind click handler to muted button
this.$el.find(".video__muted-overlay").click(this.onClickMutedOverlay.bind(this));
// Insert script to initialize brightcove player
var scriptId = this.getPlayerScriptId();
var scriptSrc = "https://players.brightcove.net/" + this.bcAccountId + "/" + this.bcPlayerId + "_" + this.bcEmbedId + "/index.min.js";
var script = document.createElement("script");
script.id = scriptId;
script.src = scriptSrc;
script.onload = this.onLoadSetupScript.bind(this);
document.body.appendChild(script);
} else if (!this.player) {
this.player = videojs(this.videoEl);
this.player.controls(this.controls);
this.player.playsinline(this.playsInline);
this.player.muted(this.muted);
this.player.on("loadstart", this.onPlayerLoadStart.bind(this));
this.player.on("playing", this.onPlayerPlaying.bind(this));
this.player.on("pause", this.onPlayerPause.bind(this));
this.player.on("ended", this.onPlayerEnded.bind(this));
this.player.on("ads-play", this.onAdPlay.bind(this));
this.player.on("ads-pause", this.onAdPause.bind(this));
this.player.on("ads-ad-started", this.onAdStarted.bind(this));
this.player.on("ads-ad-ended", this.onAdEnded.bind(this));
this.player.ready(this.onPlayerReady.bind(this));
}
}
}, {
key: "dispose",
value: function dispose() {
var scriptId = this.getPlayerScriptId();
var script = document.getElementById(scriptId);
if (script) {
script.remove();
}
if (this.player) {
this.player.dispose();
this.player = null;
}
this.$el.html("");
this.trigger("disposed", this);
}
}, {
key: "getPlayerScriptId",
value: function getPlayerScriptId() {
return "video__initialize-" + this.playerId;
}
}, {
key: "onLoadSetupScript",
value: function onLoadSetupScript() {
this.setup();
}
}, {
key: "onPlayerReady",
value: function onPlayerReady() {
this.currentVideoIndex = null;
this.loadNextVideo();
this.trigger("ready");
/*
We weren't able to detect whether the videojs-lp plugin
is loaded until now, so disable redundant UI here
*/
if (this.hasLPUIPlugin()) {
this.$el.find("#" + this.getPopoutOverlayId()).hide();
}
if (this.isInView() && this.playWhenInView) {
this.showMutedOverlay = true;
this.showCaptions = true;
this.player.muted(true);
this.play();
}
if (!this.isInView() && this.pauseWhenOutOfView) {
this.pause();
}
}
}, {
key: "enableCaptions",
value: function enableCaptions() {
if (!this.player) {
return;
}
var controls = this.player.controls();
var enableCaptionsButton = this.$el.find(".vjs-captions-menu-item");
if (enableCaptionsButton.length) {
if (controls) {
this.player.controls(false);
}
enableCaptionsButton.click();
if (controls) {
this.player.controls(true);
}
}
}
}, {
key: "disableCaptions",
value: function disableCaptions() {
if (!this.player) {
return;
}
var controls = this.player.controls();
var enableCaptionsButton = this.$el.find(".vjs-captions-menu-item");
if (enableCaptionsButton.length) {
var disableCaptionsButton = enableCaptionsButton.prev();
if (disableCaptionsButton.length) {
if (controls) {
this.player.controls(false);
}
disableCaptionsButton.click();
if (controls) {
this.player.controls(true);
}
}
}
}
}, {
key: "getActiveCues",
value: function getActiveCues() {
var activeCues = [];
this.player.textTracks().tracks_.forEach(function (tt) {
tt.activeCues_.forEach(function (c) {
activeCues.push(c);
});
});
return activeCues;
}
}, {
key: "onPlayerCueChange",
value: function onPlayerCueChange() {
var activeCues = this.getActiveCues();
var cuePointCue = activeCues.find(function (c) {
return c.text === "CODE" && c.originalCuePoint;
});
if (cuePointCue) {
var cue = cuePointCue.originalCuePoint;
var cueAlreadyExisted = this.activeCues.find(function (c) {
return c.originalCuePoint && c.originalCuePoint.id === cue.id;
});
if (!cueAlreadyExisted) {
this.onPlayerCuePoint(cue);
}
}
this.activeCues = activeCues;
}
}, {
key: "onPlayerCuePoint",
value: function onPlayerCuePoint(cue) {
var overlayElementId = "ad-lowerthird-" + this.playerId + "-" + cue.id;
var element = document.getElementById(overlayElementId);
if (!element) {
return;
}
var cueIndex = this.player.mediainfo.cuePoints.findIndex(function (c) {
return c.id === cue.id;
});
if (cueIndex === -1) {
return;
}
window.lp.analytics.dfp.video.lowerThird(cueIndex + 1, overlayElementId);
}
}, {
key: "onPlayerLoadStart",
value: function onPlayerLoadStart() {
var _this4 = this;
if (!this.hasLPUIPlugin()) {
// We don't listen to oncuechange events if videojs-lp is registered
// as it will take care of any cue-based logic we want.
this.player.textTracks().tracks_.forEach(function (tt) {
tt.oncuechange = _this4.onPlayerCueChange.bind(_this4);
});
}
this.renderPixel();
this.renderSEOMarkup();
this.updateDataLayer();
this.configureOverlays();
this.trigger("loadstart");
if (this.autoplay) {
this.play();
}
}
}, {
key: "onPlayerPlaying",
value: function onPlayerPlaying() {
if (this.showCaptions) {
this.enableCaptions();
}
if (this.showMutedOverlay) {
this.enableMutedOverlay();
}
this.updateDataLayer();
this.disableAdOverlay();
this.popoutEnabled = true;
this.updatePopout();
this.$el.removeClass("video__adplaying");
this.trigger("started");
}
}, {
key: "onPlayerPause",
value: function onPlayerPause() {
if (this.isInView()) {
this.popoutEnabled = false;
this.updatePopout();
}
}
}, {
key: "onPlayerEnded",
value: function onPlayerEnded() {
this.disableMutedOverlay();
if (this.currentVideoIndex >= this.videos.length - 1) {
this.trigger("ended");
} else {
this.loadNextVideo();
}
}
}, {
key: "onAdPlay",
value: function onAdPlay() {
this.popoutEnabled = true;
this.updatePopout();
this.$el.addClass("video__adplaying");
}
}, {
key: "onAdPause",
value: function onAdPause() {
if (this.isInView()) {
this.popoutEnabled = false;
this.updatePopout();
}
this.$el.removeClass("video__adplaying");
}
}, {
key: "onAdStarted",
value: function onAdStarted() {
if (this.showCaptions) {
this.enableCaptions();
}
/*
Ads aren't programmatically unmutable in most cases
so don't cover the ad and don't make the user think
they can unmute it using our overlay.
*/
this.disableMutedOverlay();
this.enableAdOverlay();
this.popoutEnabled = true;
this.updatePopout();
this.$el.addClass("video__adplaying");
this.trigger("started");
}
}, {
key: "onAdEnded",
value: function onAdEnded() {
this.disableAdOverlay();
this.$el.removeClass("video__adplaying");
}
}, {
key: "onClickPopoutOverlay",
value: function onClickPopoutOverlay() {
this.pause();
this.popoutEnabled = false;
this.updatePopout();
}
}, {
key: "onClickMutedOverlay",
value: function onClickMutedOverlay() {
if (!this.player) {
return;
}
this.showCaptions = false;
this.showMutedOverlay = false;
this.player.muted(false);
this.disableCaptions();
this.disableMutedOverlay();
}
}, {
key: "enableAdOverlay",
value: function enableAdOverlay() {
var adOverlay = this.$el.find("#" + this.getAdOverlayId());
adOverlay.css("display", "inline-block");
}
}, {
key: "disableAdOverlay",
value: function disableAdOverlay() {
var adOverlay = this.$el.find("#" + this.getAdOverlayId());
adOverlay.css("display", "none");
}
}, {
key: "enableMutedOverlay",
value: function enableMutedOverlay() {
var _this5 = this;
if (!this.player || _mobile_util2.default.isMobile()) {
return;
}
if (this.hasLPUIPlugin()) {
this.player.lp().props({
mutedOverlayHandler: function mutedOverlayHandler() {
_this5.showCaptions = false;
_this5.showMutedOverlay = false;
_this5.player.lp().props({ mutedOverlayHandler: null });
}
});
} else {
var mutedOverlay = this.$el.find(".video__muted-overlay");
mutedOverlay.css({ display: "flex" });
this.player.controls(false);
this.$el.find("#" + this.getPopoutOverlayId()).hide();
}
}
}, {
key: "disableMutedOverlay",
value: function disableMutedOverlay() {
if (!this.player || this.hasLPUIPlugin()) {
return;
}
var mutedOverlay = this.$el.find(".video__muted-overlay");
mutedOverlay.hide();
this.player.controls(true);
this.$el.find("#" + this.getPopoutOverlayId()).show();
}
}, {
key: "fetchVideos",
value: function fetchVideos(referenceId) {
var _this6 = this;
if (!referenceId) {
try {
referenceId = "dest_" + window.lp.place.atlasId;
} catch (e) {
return Promise.resolve(false);
}
}
var apiURL = "https://www.lonelyplanet.com/video/api/";
return new Promise(function (resolve) {
$.ajax({
url: apiURL + "playlists.json?reference_id=" + referenceId
}).done(function (data, status, response) {
if (response.status === 200 && data && data.length) {
_this6.videos = data[0].playlistitems.map(function (item) {
return item.video;
});
}
if (_this6.videos.length) {
_this6.loadNextVideo();
resolve(true);
} else {
$.ajax({
url: apiURL + "video.json?reference_id=" + referenceId
}).done(function (data, status, response) {
if (response.status === 200 && data && data.length) {
_this6.videos = data;
}
if (_this6.videos.length) {
_this6.loadNextVideo();
resolve(true);
} else {
resolve(false);
}
});
}
});
});
}
}, {
key: "loadVideo",
value: function loadVideo(videoId) {
var _this7 = this;
if (!this.player) {
this.videoId = videoId;
this.setup();
} else if (!this.player.mediainfo || this.player.mediainfo.id !== videoId) {
// Do not load a video that is already loaded
// (brightcove's engagement score metrics will break)
this.player.catalog.getVideo(videoId, function (error, video) {
if (!error) {
_this7.player.catalog.load(video);
}
});
} else if (this.autoplay) {
this.play();
}
}
}, {
key: "loadNextVideo",
value: function loadNextVideo() {
if (!this.videos.length) {
return;
}
this.currentVideoIndex = this.currentVideoIndex === null ? 0 : this.currentVideoIndex + 1;
this.currentVideoIndex = this.currentVideoIndex > this.videos.length - 1 ? 0 : this.currentVideoIndex;
var video = this.videos[this.currentVideoIndex];
this.loadVideo(video.provider_id);
}
/**
* Gets the ideal dimensions of the video, considering it's aspect ratio.
* @param {number} maxw - (required) Maximum width to return (pixels)
* @param {number} maxh - (optional) Maximum height to return (pixels)
* @return {Object} object with 'width' and 'height' attributes
*/
}, {
key: "getIdealDimensions",
value: function getIdealDimensions(maxw, maxh) {
var ratio = this.defaultAspectRatio;
// If we have video data, use the aspect ratio of the
// video as the width-height ratio value
try {
var source = this.player.mediainfo.rawSources[0];
ratio = source.width / source.height;
} catch (e) {}
var width = maxw;
var height = maxw / ratio;
if (typeof maxh != "undefined" && height > maxh) {
height = maxh;
width = height * ratio;
}
return { width: width, height: height };
}
}, {
key: "getAdOverlayId",
value: function getAdOverlayId() {
return "ad-overlay-" + this.playerId;
}
}, {
key: "getPopoutOverlayId",
value: function getPopoutOverlayId() {
return "popout-overlay-" + this.playerId;
}
}, {
key: "configureOverlays",
value: function configureOverlays() {
var _this8 = this;
if (!this.player || !this.player.overlay || this.hasLPUIPlugin()) {
// We can't configure the overlays if there is no player or not overlays plugin registered.
// Don't configure overlays if the videojs-lp-ui plugin is registered as it takes care of the overlys for us.
return;
}
var overlayCuePoints = this.player.mediainfo.cuePoints.filter(function (cuePoint) {
return cuePoint.type === "CODE";
}).filter(function (cuePoint) {
return cuePoint.name !== "preview start" && cuePoint.name !== "preview end";
});
var overlays = overlayCuePoints.map(function (cuePoint) {
var defaultEnd = cuePoint.startTime + 15;
var end = defaultEnd < cuePoint.endTime ? defaultEnd : cuePoint.endTime;
var cueElementId = "ad-lowerthird-" + _this8.playerId + "-" + cuePoint.id;
return {
content: "<div id=\"" + cueElementId + "\" class=\"video__lowerthird-overlay\" />",
align: "bottom",
start: cuePoint.startTime,
end: end
};
});
overlays.push({
content: "<div id=\"" + this.getAdOverlayId() + "\" class=\"video__ad-overlay\">Advertisement</div>",
align: "top-left",
start: "ads-ad-started",
end: "playing"
});
this.player.overlay({
content: "",
overlays: overlays,
showBackground: false,
attachToControlBar: true,
debug: false
});
}
/**
* Retrieves metadata from the currently loaded video
* @param {string} name - The metadata attribute to retrieve a value for
* @returns The metadata value, or undefined if unable to retrieve the value
*/
}, {
key: "getVideoProperty",
value: function getVideoProperty(name) {
if (!this.player || !this.player.mediainfo) {
return;
}
return this.player.mediainfo[name];
}
}, {
key: "updateDataLayer",
value: function updateDataLayer() {
Object.assign(window.lp.analytics.dataLayer[0], {
brightcoveID: this.getVideoProperty("id"),
brightcoveTitle: this.getVideoProperty("name"),
brightcoveDescription: this.getVideoProperty("description")
});
}
}, {
key: "renderPixel",
value: function renderPixel() {
var customFields = this.getVideoProperty("customFields");
if (this.insertPixel && customFields && customFields.pixel) {
var pixel = customFields.pixel.replace("[timestamp]", new Date().getTime());
this.$el.after(pixel);
}
}
/**
* Uses the currently loaded video data to build a block of
* LD-JSON Schema.org markup and appends it to the "head" tag
*
* This is run automatically when any video is loaded.
*/
}, {
key: "renderSEOMarkup",
value: function renderSEOMarkup() {
if (!this.seo || !this.player || !this.player.mediainfo) {
return;
}
var videoId = this.getVideoProperty("id");
var scriptId = "ldjson-video-" + videoId;
var script = document.getElementById(scriptId);
if (script) {
return;
}
var defaultDescription = "";
try {
defaultDescription = window.lp.place.name;
} catch (e) {}
// Duration must be in ISO 8601 format
// https://en.wikipedia.org/wiki/ISO_8601#Durations
// Brightcove returns the number of seconds (ex. 161.685)
var seconds = Math.ceil(this.getVideoProperty("duration"));
var duration = "PT" + seconds + "S";
var embedUrl = "https://players.brightcove.net/" + this.bcAccountId + "/default_" + this.bcEmbedId + "/index.html?videoId=" + videoId;
var data = {
"@context": "http://schema.org",
"@type": "VideoObject",
"name": this.getVideoProperty("name") || defaultDescription,
"description": this.getVideoProperty("description") || defaultDescription,
"thumbnailURL": this.getVideoProperty("poster"),
"embedURL": embedUrl,
"duration": duration,
"uploadDate": this.getVideoProperty("createdAt")
};
script = document.createElement("script");
script.id = scriptId;
script.type = "application/ld+json";
script.innerHTML = JSON.stringify(data);
document.getElementsByTagName("head")[0].appendChild(script);
}
}, {
key: "videoEl",
get: function get() {
if (this.$el.hasClass("video-js")) {
return this.el;
}
return this.$el.find(".video-js")[0];
}
}]);
return Brightcove;
}(_video_player2.default);
exports.default = Brightcove;