@mjhls/mjh-framework 1.0.929 → 1.0.930

package/dist/esm/{index-c071590e.js → index-fa71969f.js}

@@ -1,7 +1,7 @@
 import { _ as _extends, b as _extends$1 } from './extends-6d8e3924.js';
 import React__default, { useState, useEffect, useRef, useLayoutEffect, useCallback } from 'react';
 import { _ as _slicedToArray, a as _getIterator } from './slicedToArray-6ebcbfea.js';
-import { Carousel, Table, Figure as Figure$1, Card, Row, Col, Button, ProgressBar } from 'react-bootstrap';
+import { Carousel, Table, Figure as Figure$1, Card, Row, Col, Button as Button$1, ProgressBar } from 'react-bootstrap';
 import urlFor from './urlFor.js';
 import { l as lib_3 } from './index-f0fc23eb.js';
 import Router, { useRouter } from 'next/router';
@@ -18,6 +18,10 @@ import { L as LazyLoad } from './index-755f2cc2.js';
 import { _ as _asyncToGenerator, r as regenerator } from './asyncToGenerator-958ef5fc.js';
 import { _ as _typeof$1 } from './typeof-e9fc0c5d.js';
 import { R as ReactPlayerLoader } from './brightcove-react-player-loader.es-57a70a56.js';
+import { _ as _JSON$stringify } from './stringify-2b084bee.js';
+import Modal from 'react-bootstrap/Modal';
+import Button from 'react-bootstrap/Button';
+import Form from 'react-bootstrap/Form';
 import GroupDeck from './GroupDeck.js';
 import { m as moment } from './moment-bc12cb97.js';
 import SocialShare from './SocialShare.js';
@@ -25,7 +29,6 @@ import { _ as _export, a as _core } from './core.get-iterator-method-ea258bb1.js
 import { _ as _objectToArray } from './_object-to-array-2300e51b.js';
 import { a as _Array$from, _ as _toConsumableArray } from './toConsumableArray-f7074d7c.js';
 import Pagination from 'react-bootstrap/Pagination';
-import Button$1 from 'react-bootstrap/Button';
 import { h as html_decode_1 } from './entities-6d9154b4.js';
 import DFPAdSlot from './AdSlot.js';
 import Row$1 from 'react-bootstrap/Row';
@@ -2194,10 +2197,239 @@ var IFrame = function IFrame(_ref) {
   );
 };
 
+var PopupMultiChoice = function PopupMultiChoice(_ref) {
+  var question = _ref.question,
+      choices = _ref.choices,
+      handlePollAnswer = _ref.handlePollAnswer;
+
+  var choiceArray = choices.map(function (choice) {
+    return React__default.createElement(Form.Check, {
+      inline: true,
+      label: choice.choiceText,
+      value: choice.choiceText,
+      name: 'radioButton',
+      type: 'radio',
+      className: 'radioButton',
+      onClick: handlePollAnswer
+    });
+  });
+  return React__default.createElement(
+    'div',
+    {
+      key: 'inline-radio',
+      className: 'mb-3' },
+    React__default.createElement(
+      'h2',
+      {
+        className: 'radioLabelText'
+      },
+      question
+    ),
+    React__default.createElement(
+      'div',
+      {
+        className: 'multiChoiceDiv'
+      },
+      choiceArray
+    )
+  );
+};
+
+var PopupPollTextInput = function PopupPollTextInput(_ref) {
+  var textInputQuestion = _ref.textInputQuestion,
+      textAnswer = _ref.textAnswer,
+      handleTextAnswer = _ref.handleTextAnswer;
+
+  return React__default.createElement(
+    'div',
+    {
+      className: 'textInputDiv'
+    },
+    React__default.createElement(
+      'h2',
+      {
+        className: 'textInputQuestion'
+      },
+      textInputQuestion
+    ),
+    React__default.createElement(Form.Control, {
+      type: 'text',
+      className: 'textInput',
+      value: textAnswer,
+      placeholder: 'Your response',
+      onChange: handleTextAnswer
+    })
+  );
+};
+
+var _this = undefined;
+var fetch = require('node-fetch');
+
+var PopupPollModal = function PopupPollModal(props) {
+  var pollItems = props.pollItems,
+      pollUrl = props.pollUrl,
+      restartPlayer = props.restartPlayer,
+      multiChoiceRender = props.multiChoiceRender,
+      textInputRender = props.textInputRender;
+
+  var _useState = useState(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      pollAnswer = _useState2[0],
+      setPollAnswer = _useState2[1];
+
+  var _useState3 = useState(''),
+      _useState4 = _slicedToArray(_useState3, 2),
+      textAnswer = _useState4[0],
+      setTextAnswer = _useState4[1];
+
+  useEffect(function () {
+    var modal = document.getElementById('modalDiv');
+    modal.style.visibility = 'visible';
+  }, []);
+
+  var handleTextAnswer = function handleTextAnswer(e) {
+    setTextAnswer(e.target.value);
+  };
+
+  var handlePollAnswer = function handlePollAnswer(e) {
+    setPollAnswer(e.target.value);
+  };
+
+  var handleSubmit = function handleSubmit(e) {
+    var currentDate = new Date(Date.now()).toUTCString();
+    // eslint-disable-next-line no-undef
+    var anonymousID = typeof analytics !== 'undefined' && typeof analytics.user === 'function' && analytics.user() && analytics.user().anonymousId();
+    pollItems.forEach(function (item) {
+      var submitAnswer = void 0;
+      if (item.format === 'multiChoice') submitAnswer = pollAnswer;
+      if (item.format === 'textInput') submitAnswer = textAnswer;
+      var formData = {
+        uuid: anonymousID,
+        url: pollUrl,
+        date: currentDate,
+        question: item.question,
+        answer: submitAnswer
+      };
+      var requestOptions = {
+        method: 'POST',
+        headers: { 'content-type': 'application/json' },
+        body: _JSON$stringify({ data: formData })
+      };
+      var insertData = function () {
+        var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() {
+          return regenerator.wrap(function _callee$(_context) {
+            while (1) {
+              switch (_context.prev = _context.next) {
+                case 0:
+                  _context.prev = 0;
+                  _context.next = 3;
+                  return fetch('/api/popup_polls', requestOptions).then(function (res) {
+                    return res.json();
+                  }).then(function (res) {
+                    return console.log(res);
+                  });
+
+                case 3:
+                  _context.next = 8;
+                  break;
+
+                case 5:
+                  _context.prev = 5;
+                  _context.t0 = _context['catch'](0);
+
+                  if (_context.t0) console.log('There was an error in insertData in PopupPollModal.js: ' + _context.t0);
+
+                case 8:
+                case 'end':
+                  return _context.stop();
+              }
+            }
+          }, _callee, _this, [[0, 5]]);
+        }));
+
+        return function insertData() {
+          return _ref.apply(this, arguments);
+        };
+      }();
+      console.log('formData', formData);
+      insertData();
+    });
+    restartPlayer();
+    // setIsPollingTime(false)
+    e.preventDefault();
+  };
+
+  var pollArray = [];
+  pollItems.forEach(function (item, ind) {
+    if (item.format === 'multiChoice') {
+      pollArray.push(React__default.createElement(PopupMultiChoice, {
+        question: item.question,
+        choices: item.choices,
+        handlePollAnswer: handlePollAnswer,
+        key: ind
+      }));
+    }
+    if (item.format === 'textInput') {
+      pollArray.push(React__default.createElement(PopupPollTextInput, {
+        textInputQuestion: item.question,
+        textanswer: textAnswer,
+        handleTextAnswer: handleTextAnswer,
+        key: ind
+      }));
+    }
+  });
+
+  return React__default.createElement(
+    'div',
+    {
+      className: 'modalDiv',
+      id: 'modalDiv'
+    },
+    React__default.createElement(
+      Modal.Dialog,
+      null,
+      React__default.createElement(
+        Modal.Body,
+        null,
+        React__default.createElement(
+          Form,
+          {
+            onSubmit: handleSubmit,
+            className: 'modalForm'
+          },
+          pollArray,
+          textInputRender && !multiChoiceRender ? React__default.createElement(
+            Button,
+            {
+              className: 'submitButton',
+              type: 'submit',
+              variant: 'success',
+              disabled: !textAnswer
+            },
+            'Submit'
+          ) : React__default.createElement(
+            Button,
+            {
+              className: 'submitButton',
+              type: 'submit',
+              variant: 'success',
+              disabled: !pollAnswer
+            },
+            'Submit'
+          )
+        )
+      )
+    )
+  );
+};
+
 var VideoMp4 = function VideoMp4(_ref) {
   var url = _ref.url,
       thumbnail = _ref.thumbnail,
-      vidLoaded = _ref.vidLoaded;
+      vidLoaded = _ref.vidLoaded,
+      polls = _ref.polls,
+      modalTimes = _ref.modalTimes,
+      targetingUrl = _ref.targetingUrl;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -2214,7 +2446,43 @@ var VideoMp4 = function VideoMp4(_ref) {
       intervalID = _useState6[0],
       setIntervalID = _useState6[1];
 
+  var _useState7 = useState(false),
+      _useState8 = _slicedToArray(_useState7, 2),
+      isPollingTime = _useState8[0],
+      setIsPollingTime = _useState8[1];
+
+  var _useState9 = useState([]),
+      _useState10 = _slicedToArray(_useState9, 2),
+      pollItems = _useState10[0],
+      setPollItems = _useState10[1];
+
+  var _useState11 = useState(''),
+      _useState12 = _slicedToArray(_useState11, 2),
+      pollUrl = _useState12[0],
+      setPollUrl = _useState12[1];
+
+  var _useState13 = useState(false),
+      _useState14 = _slicedToArray(_useState13, 2),
+      multiChoiceRender = _useState14[0],
+      setMultiChoiceRender = _useState14[1];
+
+  var _useState15 = useState(false),
+      _useState16 = _slicedToArray(_useState15, 2),
+      textInputRender = _useState16[0],
+      setTextInputRender = _useState16[1];
+
+  var _useState17 = useState(),
+      _useState18 = _slicedToArray(_useState17, 2),
+      videoPlayer = _useState18[0],
+      setVideoPlayer = _useState18[1];
+
   var queueProgress = [];
+  var intId = void 0;
+
+  var restartPlayer = function restartPlayer() {
+    setIsPollingTime(false);
+    videoPlayer.play();
+  };
 
   var handleOnReady = function handleOnReady(event) {
     event.target.muted = true;
@@ -2224,7 +2492,7 @@ var VideoMp4 = function VideoMp4(_ref) {
     var duration = player.duration;
     var queue = Math.floor(duration / 10);
     var segment = Math.floor(current / queue);
-    //Beam.report_beam_video('Ready', deviceType, duration, current, segment, 'MP4')
+    // Beam.report_beam_video('Ready', deviceType, duration, current, segment, 'MP4')
     Segment.report_video_event('Video Ready', main_18, duration, current, segment, 'MP4');
   };
 
@@ -2234,7 +2502,7 @@ var VideoMp4 = function VideoMp4(_ref) {
     var queue = Math.floor(duration / 10);
     var segment = Math.floor(current / queue);
     if (!queueProgress.includes(segment)) {
-      //Beam.report_beam_video('Segment', deviceType, duration, current, segment, 'MP4')
+      // Beam.report_beam_video('Segment', deviceType, duration, current, segment, 'MP4')
       Segment.report_video_event('Video Segment', main_18, duration, current, segment, 'MP4');
       queueProgress.push(segment);
     }
@@ -2247,9 +2515,8 @@ var VideoMp4 = function VideoMp4(_ref) {
     var duration = player.duration;
     var queue = Math.floor(duration / 10);
     var segment = Math.floor(current / queue);
-    //Beam.report_beam_video('Play', deviceType, duration, current, segment, 'MP4')
+    // Beam.report_beam_video('Play', deviceType, duration, current, segment, 'MP4')
     Segment.report_video_event('Video Play', main_18, duration, current, segment, 'MP4');
-
     if (!playReported) {
       event.persist();
       setPlayReported(true);
@@ -2258,6 +2525,29 @@ var VideoMp4 = function VideoMp4(_ref) {
       }, 1000);
       setIntervalID(_intervalID);
     }
+    if (polls) {
+      event.persist();
+      setVideoPlayer(event.target);
+      intId = setInterval(function () {
+        var ct = player.currentTime;
+        console.log('videoPlayer in Interval', videoPlayer);
+        if (intId) console.log('interval ID is ' + intId);
+        modalTimes.forEach(function (modalTime, ind) {
+          if (Math.floor(ct) === modalTime) {
+            console.log('clearing interval: ' + intId);
+            clearInterval(intId);
+            setPollItems(polls[ind].pollItems);
+            setPollUrl(targetingUrl);
+            setIsPollingTime(true);
+            polls[ind].pollItems.forEach(function (item) {
+              if (item.format === 'multiChoice') setMultiChoiceRender(true);
+              if (item.format === 'textInput') setTextInputRender(true);
+            });
+            event.target.pause();
+          }
+        });
+      }, 1000);
+    }
   };
 
   var handleOnEnd = function handleOnEnd(event) {
@@ -2267,8 +2557,8 @@ var VideoMp4 = function VideoMp4(_ref) {
       var duration = player.duration;
       var queue = Math.floor(duration / 10);
       var segment = Math.floor(current / queue);
-
-      //Beam.report_beam_video('End', deviceType, duration, current, segment, 'MP4')
+      clearInterval(intId);
+      // Beam.report_beam_video('End', deviceType, duration, current, segment, 'MP4')
       Segment.report_video_event('Video End', main_18, duration, current, segment, 'MP4');
       setEndReported(true);
       clearInterval(intervalID);
@@ -2281,13 +2571,28 @@ var VideoMp4 = function VideoMp4(_ref) {
     var duration = player.duration - current;
     var queue = Math.floor(duration / 10);
     var segment = Math.floor(current / queue);
-    //Beam.report_beam_video('Pause', deviceType, duration, current, segment, 'MP4')
+    clearInterval(intId);
+    // Beam.report_beam_video('Pause', deviceType, duration, current, segment, 'MP4')
     Segment.report_video_event('Video Pause', main_18, duration, current, segment, 'MP4');
   };
 
   return React__default.createElement(
     'div',
     null,
+    isPollingTime ? React__default.createElement(PopupPollModal
+    // eslint-disable-next-line react/jsx-indent-props
+    , { pollItems: pollItems
+      // eslint-disable-next-line react/jsx-indent-props
+      , pollUrl: pollUrl
+      // eslint-disable-next-line react/jsx-indent-props
+      , isPollingTime: isPollingTime
+      // eslint-disable-next-line react/jsx-indent-props
+      , restartPlayer: restartPlayer
+      // eslint-disable-next-line react/jsx-indent-props
+      , textInputRender: textInputRender
+      // eslint-disable-next-line react/jsx-indent-props
+      , multiChoiceRender: multiChoiceRender
+    }) : null,
     vidLoaded && React__default.createElement(
       'video',
       {
@@ -2328,14 +2633,63 @@ var Video = function Video(_ref) {
       playlistID = node.playlistID,
       experienceID = node.experienceID;
 
+  var polls = void 0;
+  if (node.polls) polls = node.polls;
+
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
       videoLoaded = _useState2[0],
       setVideoLoaded = _useState2[1];
 
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      isPollingTime = _useState4[0],
+      setIsPollingTime = _useState4[1];
+
+  var _useState5 = useState([]),
+      _useState6 = _slicedToArray(_useState5, 2),
+      pollItems = _useState6[0],
+      setPollItems = _useState6[1];
+
+  var _useState7 = useState(''),
+      _useState8 = _slicedToArray(_useState7, 2),
+      pollUrl = _useState8[0],
+      setPollUrl = _useState8[1];
+
+  var _useState9 = useState(),
+      _useState10 = _slicedToArray(_useState9, 2),
+      videoPlayer = _useState10[0],
+      setVideoPlayer = _useState10[1];
+
+  var _useState11 = useState(false),
+      _useState12 = _slicedToArray(_useState11, 2),
+      multiChoiceRender = _useState12[0],
+      setMultiChoiceRender = _useState12[1];
+
+  var _useState13 = useState(false),
+      _useState14 = _slicedToArray(_useState13, 2),
+      textInputRender = _useState14[0],
+      setTextInputRender = _useState14[1];
+
+  var intId = void 0;
+  var convertTime = function convertTime(timeStr) {
+    var minutes = parseInt(timeStr.slice(0, 2));
+    var seconds = parseInt(timeStr.slice(3));
+    return minutes * 60 + seconds;
+  };
+  var modalTimes = [];
+  polls.forEach(function (pollObj) {
+    return modalTimes.push(convertTime(pollObj.timestamp));
+  });
+
+  var restartPlayer = function restartPlayer() {
+    setIsPollingTime(false);
+    videoPlayer.play();
+  };
+
   useEffect(function () {
     if (!videoLoaded && experienceID) {
-      //To load Experience Player JS
+      // To load Experience Player JS
       var experiencePlayerScript = document.createElement('script');
       experiencePlayerScript.src = 'https://players.brightcove.net/' + accountIDs.brightcove.accountId + '/experience_' + experienceID + '/live.js';
       document.body.appendChild(experiencePlayerScript);
@@ -2348,8 +2702,9 @@ var Video = function Video(_ref) {
   };
 
   var onVideoSuccess = function onVideoSuccess(success) {
-    //console.log('success:', success.ref)
+    // console.log('success:', success)
     var player = success.ref;
+    setVideoPlayer(player);
     if (_typeof$1(player.ima3) === 'object' && player.ima3.settings && player.ima3.settings.serverUrl && targeting !== null) {
       player.ima3.settings.debug = true;
       if (targeting.content_placement && targeting.document_url) {
@@ -2360,7 +2715,7 @@ var Video = function Video(_ref) {
     player.on('loadedmetadata', function (evt) {
       var _this = this;
 
-      //console.log('loadedmetadata:', evt)
+      // console.log('loadedmetadata:', evt)
       console.log('mediainfo:', player.mediainfo); // get the duration from here
       var duration = player.mediainfo.duration;
       var current = player.currentTime();
@@ -2404,17 +2759,42 @@ var Video = function Video(_ref) {
         autoPlayVideo();
       }
 
-      //Beam.report_beam_video('Ready', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
+      // Beam.report_beam_video('Ready', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
       Segment.report_video_event('Video Ready', main_18, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID);
     });
-
-    // play
+    // let intId
+    // const convertTime = (timeStr) => {
+    //   const minutes = parseInt(timeStr.slice(0, 2))
+    //   const seconds = parseInt(timeStr.slice(3))
+    //   return minutes * 60 + seconds
+    // }
+    // const modalTimes = []
+    // polls.forEach(pollObj => modalTimes.push(convertTime(pollObj.timestamp)))
     player.on('play', function (evt) {
       var duration = player.mediainfo.duration;
       var current = player.currentTime();
       var queue = Math.floor(duration / 10);
       var segment = Math.floor(current / queue);
-      //Beam.report_beam_video('Play', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
+      if (polls) {
+        var vidPlayer = this;
+        intId = setInterval(function () {
+          var ct = player.currentTime();
+          if (intId) console.log('interval ID is ' + intId);
+          modalTimes.forEach(function (modalTime, ind) {
+            if (Math.floor(ct) === modalTime) {
+              setPollItems(polls[ind].pollItems);
+              setPollUrl(targeting.document_url[0]);
+              setIsPollingTime(true);
+              polls[ind].pollItems.forEach(function (item) {
+                if (item.format === 'multiChoice') setMultiChoiceRender(true);
+                if (item.format === 'textInput') setTextInputRender(true);
+              });
+              vidPlayer.pause();
+            }
+          });
+        }, 1000);
+      }
+      // Beam.report_beam_video('Play', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
       Segment.report_video_event('Video Play', main_18, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID);
     });
 
@@ -2424,7 +2804,8 @@ var Video = function Video(_ref) {
       var current = player.currentTime();
       var queue = Math.floor(duration / 10);
       var segment = Math.floor(current / queue);
-      //Beam.report_beam_video('Pause', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
+      clearInterval(intId);
+      // Beam.report_beam_video('Pause', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
       Segment.report_video_event('Video Pause', main_18, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID);
     });
 
@@ -2434,9 +2815,10 @@ var Video = function Video(_ref) {
       var current = player.currentTime();
       var queue = Math.floor(duration / 10);
       var segment = Math.floor(current / queue);
-      //Beam.report_beam_video('End', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
+      clearInterval(intId);
+      // Beam.report_beam_video('End', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
       Segment.report_video_event('Video End', main_18, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID);
-      //This is for old series format
+      // This is for old series format
       autoplayNextVideo(evt);
       if (nextVideo) {
         window.location.href = '/view/' + nextVideo;
@@ -2450,7 +2832,7 @@ var Video = function Video(_ref) {
       var queue = Math.floor(duration / 10);
       var segment = Math.floor(current / queue);
       if (!queueProgress.includes(segment)) {
-        //Beam.report_beam_video('Segment', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
+        // Beam.report_beam_video('Segment', deviceType, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID)
         Segment.report_video_event('Video Segment', main_18, duration, current, segment, 'BrightCove', accountIDs.brightcove.playerId, accountIDs.brightcove.accountId, videoID);
         queueProgress.push(segment);
       }
@@ -2459,19 +2841,19 @@ var Video = function Video(_ref) {
     // ad impression
     player.on('ads-ad-started', function (evt) {
       var duration = player.ads.ad.duration;
-      player.ads.ad.id;
+      // const id = player.ads.ad.id
       var adType = 'Bright Cove: ' + player.ads.ad.type;
 
-      //Beam.report_beam_ad('AD Started', deviceType, '', '', '', '', '', adType, duration, id)
+      // Beam.report_beam_ad('AD Started', deviceType, '', '', '', '', '', adType, duration, id)
       Segment.report_ad_event('Video Ad Started', main_18, duration, adType, accountIDs.brightcove.playerId, accountIDs.brightcove.accountId);
     });
 
     // ad ended
     player.on('ads-ad-ended', function (evt) {
       var duration = player.ads.ad.duration;
-      player.ads.ad.id;
+      // const id = player.ads.ad.id
       var adType = 'Bright Cove: ' + player.ads.ad.type;
-      //Beam.report_beam_ad('AD Ended', deviceType, '', '', '', '', '', adType, duration, id)
+      // Beam.report_beam_ad('AD Ended', deviceType, '', '', '', '', '', adType, duration, id)
       Segment.report_ad_event('Video Ad Ended', main_18, duration, adType, accountIDs.brightcove.playerId, accountIDs.brightcove.accountId);
     });
   };
@@ -2481,6 +2863,20 @@ var Video = function Video(_ref) {
       return React__default.createElement(
         'div',
         null,
+        isPollingTime ? React__default.createElement(PopupPollModal
+        // eslint-disable-next-line react/jsx-indent-props
+        , { pollItems: pollItems
+          // eslint-disable-next-line react/jsx-indent-props
+          , pollUrl: pollUrl
+          // eslint-disable-next-line react/jsx-indent-props
+          , isPollingTime: isPollingTime
+          // eslint-disable-next-line react/jsx-indent-props
+          , restartPlayer: restartPlayer
+          // eslint-disable-next-line react/jsx-indent-props
+          , textInputRender: textInputRender
+          // eslint-disable-next-line react/jsx-indent-props
+          , multiChoiceRender: multiChoiceRender
+        }) : null,
         React__default.createElement(ReactPlayerLoader, {
           onSuccess: onVideoSuccess,
           onFailure: onVideoFailure,
@@ -2499,6 +2895,20 @@ var Video = function Video(_ref) {
       return React__default.createElement(
         'div',
         null,
+        isPollingTime ? React__default.createElement(PopupPollModal
+        // eslint-disable-next-line react/jsx-indent-props
+        , { pollItems: pollItems
+          // eslint-disable-next-line react/jsx-indent-props
+          , pollUrl: pollUrl
+          // eslint-disable-next-line react/jsx-indent-props
+          , isPollingTime: isPollingTime
+          // eslint-disable-next-line react/jsx-indent-props
+          , restartPlayer: restartPlayer
+          // eslint-disable-next-line react/jsx-indent-props
+          , textInputRender: textInputRender
+          // eslint-disable-next-line react/jsx-indent-props
+          , multiChoiceRender: multiChoiceRender
+        }) : null,
         React__default.createElement(ReactPlayerLoader, {
           accountId: accountIDs.brightcove.accountId,
           playlistId: playlistID,
@@ -2517,16 +2927,30 @@ var Video = function Video(_ref) {
       return React__default.createElement(
         'div',
         { className: 'brightcove-playlist', style: { position: 'relative', display: 'block', margin: '0px auto' } },
-        videoLoaded && React__default.createElement('div', { 'data-experience': experienceID })
+        isPollingTime ? React__default.createElement(PopupPollModal
+        // eslint-disable-next-line react/jsx-indent-props
+        , { pollItems: pollItems
+          // eslint-disable-next-line react/jsx-indent-props
+          , pollUrl: pollUrl
+          // eslint-disable-next-line react/jsx-indent-props
+          , isPollingTime: isPollingTime
+          // eslint-disable-next-line react/jsx-indent-props
+          , restartPlayer: restartPlayer
+          // eslint-disable-next-line react/jsx-indent-props
+          , textInputRender: textInputRender
+          // eslint-disable-next-line react/jsx-indent-props
+          , multiChoiceRender: multiChoiceRender
+        }) : null
       );
     }
     return null;
   }
+
   if (source === 'mp4') {
     return React__default.createElement(
       'div',
       null,
-      React__default.createElement(VideoMp4, { url: node.mp4url, thumbnail: null, vidLoaded: true })
+      React__default.createElement(VideoMp4, { url: node.mp4url, thumbnail: null, vidLoaded: true, polls: polls, modalTimes: modalTimes, targetingUrl: targeting.document_url[0] })
     );
   }
 
@@ -7629,7 +8053,7 @@ var Poll$1 = function Poll(_ref) {
         );
       }),
       React__default.createElement(
-        Button,
+        Button$1,
         { disabled: !selectedChoice, type: 'submit' },
         'Vote'
       )
@@ -7806,7 +8230,7 @@ var Poll = function Poll(_ref) {
         );
       }),
       React__default.createElement(
-        Button,
+        Button$1,
         { disabled: !selectedChoice, type: 'submit' },
         'Vote'
       )
@@ -8119,7 +8543,7 @@ var Quiz = function Quiz(_ref) {
       )
     ),
     !showAnswer && React__default.createElement(
-      Button$1,
+      Button,
       { onClick: function onClick() {
           return checkAnswers();
         }, variant: 'info', block: true },