@mjhls/mjh-framework 1.0.1000 → 1.0.1001-popup-polls

package/dist/esm/getSerializers.js

@@ -1,5 +1,5 @@
 import 'react';
-export { g as default } from './index-3bb56969.js';
+export { g as default } from './index-5d8b0a9d.js';
 import './BlockContent-1e73bd2c.js';
 import './entities-6d9154b4.js';
 import './slicedToArray-6ebcbfea.js';
@@ -9,7 +9,8 @@ import './core.get-iterator-method-ea258bb1.js';
 import 'react-bootstrap';
 import './urlFor.js';
 import './index-3f5c03b2.js';
-import './index-5cc7b406.js';
+import './index-f0fc23eb.js';
+import './events-6c3a7a63.js';
 import 'prop-types';
 import 'next/router';
 import './index-c7e2ac95.js';
@@ -20,7 +21,7 @@ import './asyncToGenerator-958ef5fc.js';
 import './_library-528f1934.js';
 import './_iter-detect-98db3b07.js';
 import './Segment.js';
-import './main-9f6806ea.js';
+import './main-1894c974.js';
 import './extends-6d8e3924.js';
 import './_object-pie-133f504a.js';
 import './urlForFile-b69adffc.js';
@@ -29,6 +30,9 @@ import 'react-dom';
 import './typeof-e9fc0c5d.js';
 import './_is-array-8d21b9e3.js';
 import './brightcove-react-player-loader.es-57a70a56.js';
+import './_object-to-array-2300e51b.js';
+import './keys-31dcdb31.js';
+import './_object-sap-7cee6f84.js';
 import 'react-bootstrap/Modal';
 import 'react-bootstrap/Button';
 import 'react-bootstrap/Form';
@@ -39,7 +43,6 @@ import './moment-bc12cb97.js';
 import './SocialShare.js';
 import 'next/head';
 import 'react-share';
-import './_object-to-array-2300e51b.js';
 import './toConsumableArray-f7074d7c.js';
 import 'react-bootstrap/Pagination';
 import './AdSlot.js';
@@ -49,7 +52,6 @@ import './toNumber-5aeba6e7.js';
 import 'react-bootstrap/Row';
 import 'react-bootstrap/Col';
 import './inherits-a6ba2ec4.js';
-import './_object-sap-7cee6f84.js';
 import './define-property-5f1bda73.js';
 import './index.esm-eb1e8e80.js';
 import './iconBase-ccc56b97.js';

package/dist/esm/{index-3bb56969.js → index-5d8b0a9d.js}

@@ -2,7 +2,7 @@ import React__default, { useState, useEffect, useRef, useLayoutEffect, useCallba
 import { _ as _slicedToArray, a as _getIterator } from './slicedToArray-6ebcbfea.js';
 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-5cc7b406.js';
+import { l as lib_3 } from './index-f0fc23eb.js';
 import Router, { useRouter } from 'next/router';
 import { g as getYoutubeId } from './index-c7e2ac95.js';
 import PropTypes from 'prop-types';
@@ -10,7 +10,7 @@ import { c as createCommonjsModule, u as unwrapExports } from './_commonjsHelper
 import { u as util } from './util-8ed16d48.js';
 import './Beam.js';
 import Segment from './Segment.js';
-import { e as main_18, b as main_42, m as main_43 } from './main-9f6806ea.js';
+import { e as main_18, b as main_42, m as main_43 } from './main-1894c974.js';
 import { B as BlockContent } from './BlockContent-1e73bd2c.js';
 import { _ as _extends, b as _extends$1 } from './extends-6d8e3924.js';
 import { u as urlForFile } from './urlForFile-b69adffc.js';
@@ -19,6 +19,9 @@ import { _ as _asyncToGenerator, r as regenerator } from './asyncToGenerator-958
 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 { _ as _export, a as _core } from './core.get-iterator-method-ea258bb1.js';
+import { _ as _objectToArray } from './_object-to-array-2300e51b.js';
+import { _ as _Object$keys } from './keys-31dcdb31.js';
 import Modal from 'react-bootstrap/Modal';
 import Button from 'react-bootstrap/Button';
 import Form from 'react-bootstrap/Form';
@@ -26,8 +29,6 @@ import ReactGA from 'react-ga';
 import GroupDeck from './GroupDeck.js';
 import { m as moment } from './moment-bc12cb97.js';
 import SocialShare from './SocialShare.js';
-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 { h as html_decode_1 } from './entities-6d9154b4.js';
@@ -1628,11 +1629,13 @@ function shouldUpdateVideo(prevProps, props) {
 
 function filterResetOptions(opts) {
   return _objectSpread(_objectSpread({}, opts), {}, {
-    playerVars: _objectSpread({
+    height: 0,
+    width: 0,
+    playerVars: _objectSpread(_objectSpread({}, opts.playerVars), {}, {
       autoplay: 0,
       start: 0,
       end: 0
-    }, opts.playerVars)
+    })
   });
 }
 /**
@@ -1647,7 +1650,7 @@ function filterResetOptions(opts) {
 
 
 function shouldResetPlayer(prevProps, props) {
-  return !fastDeepEqual(filterResetOptions(prevProps.opts), filterResetOptions(props.opts));
+  return prevProps.videoId !== props.videoId || !fastDeepEqual(filterResetOptions(prevProps.opts), filterResetOptions(props.opts));
 }
 /**
  * Check whether a props change should result in an id or className update.
@@ -1658,7 +1661,7 @@ function shouldResetPlayer(prevProps, props) {
 
 
 function shouldUpdatePlayer(prevProps, props) {
-  return prevProps.id !== props.id || prevProps.className !== props.className;
+  return prevProps.id !== props.id || prevProps.className !== props.className || prevProps.opts.width !== props.opts.width || prevProps.opts.height !== props.opts.height || prevProps.title !== props.title;
 }
 
 var YouTube = /*#__PURE__*/function (_React$Component) {
@@ -1745,6 +1748,9 @@ var YouTube = /*#__PURE__*/function (_React$Component) {
       _this.internalPlayer.getIframe().then(function (iframe) {
         if (_this.props.id) iframe.setAttribute('id', _this.props.id);else iframe.removeAttribute('id');
         if (_this.props.className) iframe.setAttribute('class', _this.props.className);else iframe.removeAttribute('class');
+        if (_this.props.opts && _this.props.opts.width) iframe.setAttribute('width', _this.props.opts.width);else iframe.removeAttribute('width');
+        if (_this.props.opts && _this.props.opts.height) iframe.setAttribute('height', _this.props.opts.height);else iframe.removeAttribute('height');
+        if (typeof _this.props.title === 'string') iframe.setAttribute('title', _this.props.title);else iframe.setAttribute('title', 'YouTube video player');
       });
     });
 
@@ -1843,7 +1849,8 @@ var YouTube = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React__default.createElement("div", {
         id: this.props.id,
         className: this.props.className,
-        ref: this.refContainer
+        ref: this.refContainer,
+        loading: this.props.loading
       }));
     }
   }]);
@@ -1868,6 +1875,10 @@ YouTube.propTypes = {
   className: PropTypes.string,
   // custom class name for player container element
   containerClassName: PropTypes.string,
+  // custom title for the iFrame, see https://www.w3.org/TR/WCAG20-TECHS/H64.html
+  title: PropTypes.string,
+  // custom loading for player element
+  loading: PropTypes.oneOf(['lazy', 'eager', 'auto']),
   // https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player
   opts: PropTypes.objectOf(PropTypes.any),
   // event subscriptions
@@ -1884,6 +1895,7 @@ YouTube.defaultProps = {
   videoId: null,
   id: null,
   className: null,
+  loading: null,
   opts: {},
   containerClassName: '',
   onReady: function onReady() {},
@@ -1893,7 +1905,8 @@ YouTube.defaultProps = {
   onEnd: function onEnd() {},
   onStateChange: function onStateChange() {},
   onPlaybackRateChange: function onPlaybackRateChange() {},
-  onPlaybackQualityChange: function onPlaybackQualityChange() {}
+  onPlaybackQualityChange: function onPlaybackQualityChange() {},
+  title: null
 };
 
 var YouTubePlayer = function YouTubePlayer(_ref) {
@@ -2199,6 +2212,24 @@ var IFrame = function IFrame(_ref) {
   );
 };
 
+// https://github.com/tc39/proposal-object-values-entries
+
+var $values = _objectToArray(false);
+
+_export(_export.S, 'Object', {
+  values: function values(it) {
+    return $values(it);
+  }
+});
+
+var values$1 = _core.Object.values;
+
+var values = createCommonjsModule(function (module) {
+module.exports = { "default": values$1, __esModule: true };
+});
+
+var _Object$values = unwrapExports(values);
+
 var PopupMultiChoice = function PopupMultiChoice(_ref) {
   var question = _ref.question,
       choices = _ref.choices,
@@ -2209,7 +2240,7 @@ var PopupMultiChoice = function PopupMultiChoice(_ref) {
       inline: true,
       label: choice.choiceText,
       value: choice.choiceText,
-      name: 'radioButton',
+      name: question,
       type: 'radio',
       className: 'radioButton',
       onClick: handlePollAnswer
@@ -2279,10 +2310,15 @@ var PopupPollModal = function PopupPollModal(props) {
       pollAnswer = _useState2[0],
       setPollAnswer = _useState2[1];
 
-  var _useState3 = useState(''),
+  var _useState3 = useState({}),
       _useState4 = _slicedToArray(_useState3, 2),
-      textAnswer = _useState4[0],
-      setTextAnswer = _useState4[1];
+      multiItemPollAnswers = _useState4[0],
+      setMultiItemPollAnswers = _useState4[1];
+
+  var _useState5 = useState(''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      textAnswer = _useState6[0],
+      setTextAnswer = _useState6[1];
 
   useEffect(function () {
     var modal = document.getElementById('modalDiv');
@@ -2297,77 +2333,98 @@ var PopupPollModal = function PopupPollModal(props) {
     setPollAnswer(e.target.value);
   };
 
+  var handleMultiItemPollAnswers = function handleMultiItemPollAnswers(e) {
+    var question = e.target.name;
+    var answer = e.target.value;
+    var tempObj = {};
+    tempObj[question] = answer;
+    setMultiItemPollAnswers(function (prev) {
+      return _extends({}, prev, tempObj);
+    });
+  };
+
   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();
+    var formData = {};
+
     pollItems.forEach(function (item) {
-      var submitAnswer = void 0;
-      if (item.format === 'multiChoice') submitAnswer = pollAnswer;
-      if (item.format === 'textInput') submitAnswer = textAnswer;
-      var formData = {
+      formData = {
         uuid: anonymousID,
         url: pollUrl,
         date: currentDate,
-        question: item.question,
-        answer: submitAnswer
+        questionsArray: _Object$keys(multiItemPollAnswers),
+        answersArray: _Object$values(multiItemPollAnswers)
       };
-      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();
-              }
+      item.question ? formData.question = item.question : null;
+      pollAnswer && item.format === 'multiChoice' ? formData.answer = pollAnswer : pollAnswer && item.format === 'textInput' ? formData.answer = textAnswer : null;
+      _Object$keys(multiItemPollAnswers).length > 0 ? formData.multiItemQandA = multiItemPollAnswers : null;
+    });
+    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]]);
-        }));
+          }
+        }, _callee, _this, [[0, 5]]);
+      }));
 
-        return function insertData() {
-          return _ref.apply(this, arguments);
-        };
-      }();
-      console.log('formData', formData);
-      insertData();
-    });
+      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 }));
+    if (!item.atStart) {
+      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 }));
+      }
+    } else {
+      if (item.pollItems[0] && item.pollItems[0].format === 'multiChoice') {
+        pollArray.push(React__default.createElement(PopupMultiChoice, { question: item.pollItems[0].question, choices: item.pollItems[0].choices, handlePollAnswer: handleMultiItemPollAnswers, key: ind }));
+      }
+      if (item.pollItems[0] && item.pollItems[0].format === 'textInput') {
+        pollArray.push(React__default.createElement(PopupPollTextInput, { textInputQuestion: item.pollItems[0].question, textanswer: textAnswer, handleTextAnswer: handleTextAnswer, key: ind }));
+      }
     }
   });
 
@@ -2376,7 +2433,10 @@ var PopupPollModal = function PopupPollModal(props) {
     { className: 'modalDiv', id: 'modalDiv' },
     React__default.createElement(
       Modal.Dialog,
-      null,
+      { className: pollItems.length > 1 ? 'modal-dialog-overflow' : null, scrollable: pollItems.length > 1 },
+      props.closeable && React__default.createElement(Modal.Header, { closeButton: true, onClick: function onClick() {
+          return restartPlayer();
+        } }),
       React__default.createElement(
         Modal.Body,
         null,
@@ -2388,10 +2448,14 @@ var PopupPollModal = function PopupPollModal(props) {
             Button,
             { className: 'submitButton', type: 'submit', variant: 'success', disabled: !textAnswer },
             'Submit'
-          ) : React__default.createElement(
+          ) : !textInputRender && multiChoiceRender ? React__default.createElement(
             Button,
             { className: 'submitButton', type: 'submit', variant: 'success', disabled: !pollAnswer },
             'Submit'
+          ) : React__default.createElement(
+            Button,
+            { className: 'submitButton', type: 'submit', variant: 'success' },
+            'Submit'
           )
         )
       )
@@ -2610,6 +2674,7 @@ var Video = function Video(_ref) {
       experienceID = node.experienceID;
 
   var polls = void 0;
+
   if (node.polls) polls = node.polls;
 
   var _useState = useState(false),
@@ -2654,10 +2719,16 @@ var Video = function Video(_ref) {
     return minutes * 60 + seconds;
   };
   var modalTimes = [];
+  var initPolls = [];
+  var nonInitPolls = [];
   if (polls) {
     polls.forEach(function (pollObj) {
-      return modalTimes.push(convertTime(pollObj.timestamp));
+      return pollObj.timestamp !== '0:00' && pollObj.timestamp !== '00:00' ? modalTimes.push(convertTime(pollObj.timestamp)) : null;
     });
+    polls.forEach(function (pollObj) {
+      return pollObj.atStart ? initPolls.push(pollObj) : nonInitPolls.push(pollObj);
+    });
+    if (nonInitPolls.length > 0) polls = nonInitPolls;
   }
 
   var restartPlayer = function restartPlayer() {
@@ -2732,7 +2803,14 @@ var Video = function Video(_ref) {
           return _ref2.apply(this, arguments);
         };
       }();
-
+      // console.log('initPolls', initPolls)
+      if (initPolls.length > 0) {
+        player.pause();
+        setPollItems(initPolls);
+        setPollUrl(targeting.document_url[0]);
+        setIsPollingTime(true);
+        initPolls = [];
+      }
       if (autoplay) {
         autoPlayVideo();
       }
@@ -2740,20 +2818,15 @@ var Video = function Video(_ref) {
       // 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);
     });
-    // 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) {
+      console.log('in player.on');
       var duration = player.mediainfo.duration;
       var current = player.currentTime();
       var queue = Math.floor(duration / 10);
       var segment = Math.floor(current / queue);
-      if (polls) {
+
+      if (polls && initPolls.length === 0) {
         var vidPlayer = this;
         intId = setInterval(function () {
           var ct = player.currentTime();
@@ -2854,6 +2927,8 @@ var Video = function Video(_ref) {
           , textInputRender: textInputRender
           // eslint-disable-next-line react/jsx-indent-props
           , multiChoiceRender: multiChoiceRender
+          // eslint-disable-next-line react/jsx-indent-props
+          , closeable: node.polls && node.polls[0] ? node.polls[0].closeable : null
         }) : null,
         React__default.createElement(ReactPlayerLoader, {
           onSuccess: onVideoSuccess,
@@ -2886,6 +2961,8 @@ var Video = function Video(_ref) {
           , textInputRender: textInputRender
           // eslint-disable-next-line react/jsx-indent-props
           , multiChoiceRender: multiChoiceRender
+          // eslint-disable-next-line react/jsx-indent-props
+          , closeable: node.polls && node.polls[0] ? node.polls[0].closeable : null
         }) : null,
         React__default.createElement(ReactPlayerLoader, {
           accountId: accountIDs.brightcove.accountId,
@@ -2919,6 +2996,9 @@ var Video = function Video(_ref) {
           , textInputRender: textInputRender
           // eslint-disable-next-line react/jsx-indent-props
           , multiChoiceRender: multiChoiceRender
+          // eslint-disable-next-line react/jsx-indent-props
+          , closeable: node.polls && node.polls[0] ? node.polls[0].closeable : null
+
         }) : null
       );
     }
@@ -8135,24 +8215,6 @@ var Poll$1 = function Poll(_ref) {
   );
 };
 
-// https://github.com/tc39/proposal-object-values-entries
-
-var $values = _objectToArray(false);
-
-_export(_export.S, 'Object', {
-  values: function values(it) {
-    return $values(it);
-  }
-});
-
-var values$1 = _core.Object.values;
-
-var values = createCommonjsModule(function (module) {
-module.exports = { "default": values$1, __esModule: true };
-});
-
-var _Object$values = unwrapExports(values);
-
 var Poll = function Poll(_ref) {
   var node = _ref.node;
       _ref.client;