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

package/dist/cjs/{index-e4f1fe32.js → index-19fbbcea.js}

@@ -4,7 +4,7 @@ var React = require('react');
 var slicedToArray = require('./slicedToArray-067dd3bc.js');
 var reactBootstrap = require('react-bootstrap');
 var urlFor = require('./urlFor.js');
-var index = require('./index-7435b964.js');
+var index = require('./index-d2a6ef75.js');
 var Router = require('next/router');
 var index$1 = require('./index-187c967e.js');
 var PropTypes = require('prop-types');
@@ -12,7 +12,7 @@ var _commonjsHelpers = require('./_commonjsHelpers-06173234.js');
 var util = require('./util-93a37fd0.js');
 require('./Beam.js');
 var Segment = require('./Segment.js');
-var main = require('./main-6054981e.js');
+var main = require('./main-3643d499.js');
 var BlockContent = require('./BlockContent-96b44364.js');
 var _extends = require('./extends-7c86182f.js');
 var urlForFile = require('./urlForFile-29d3815a.js');
@@ -21,6 +21,9 @@ var asyncToGenerator = require('./asyncToGenerator-77821af0.js');
 var _typeof$1 = require('./typeof-567e31ff.js');
 var brightcoveReactPlayerLoader_es = require('./brightcove-react-player-loader.es-4c7825a1.js');
 var stringify = require('./stringify-f7a37a8d.js');
+var core_getIteratorMethod = require('./core.get-iterator-method-5643aa10.js');
+var _objectToArray = require('./_object-to-array-ce86cae7.js');
+var keys = require('./keys-e982b3fa.js');
 var Modal = require('react-bootstrap/Modal');
 var Button = require('react-bootstrap/Button');
 var Form = require('react-bootstrap/Form');
@@ -28,8 +31,6 @@ var ReactGA = require('react-ga');
 var GroupDeck = require('./GroupDeck.js');
 var moment = require('./moment-aca40de1.js');
 var SocialShare = require('./SocialShare.js');
-var core_getIteratorMethod = require('./core.get-iterator-method-5643aa10.js');
-var _objectToArray = require('./_object-to-array-ce86cae7.js');
 var toConsumableArray = require('./toConsumableArray-d7797c2b.js');
 var Pagination = require('react-bootstrap/Pagination');
 var entities = require('./entities-df1aed86.js');
@@ -1648,11 +1649,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)
+    })
   });
 }
 /**
@@ -1667,7 +1670,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.
@@ -1678,7 +1681,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) {
@@ -1765,6 +1768,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');
       });
     });
 
@@ -1863,7 +1869,8 @@ var YouTube = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         id: this.props.id,
         className: this.props.className,
-        ref: this.refContainer
+        ref: this.refContainer,
+        loading: this.props.loading
       }));
     }
   }]);
@@ -1888,6 +1895,10 @@ YouTube.propTypes = {
   className: PropTypes__default["default"].string,
   // custom class name for player container element
   containerClassName: PropTypes__default["default"].string,
+  // custom title for the iFrame, see https://www.w3.org/TR/WCAG20-TECHS/H64.html
+  title: PropTypes__default["default"].string,
+  // custom loading for player element
+  loading: PropTypes__default["default"].oneOf(['lazy', 'eager', 'auto']),
   // https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player
   opts: PropTypes__default["default"].objectOf(PropTypes__default["default"].any),
   // event subscriptions
@@ -1904,6 +1915,7 @@ YouTube.defaultProps = {
   videoId: null,
   id: null,
   className: null,
+  loading: null,
   opts: {},
   containerClassName: '',
   onReady: function onReady() {},
@@ -1913,7 +1925,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) {
@@ -2219,6 +2232,24 @@ var IFrame = function IFrame(_ref) {
   );
 };
 
+// https://github.com/tc39/proposal-object-values-entries
+
+var $values = _objectToArray._objectToArray(false);
+
+core_getIteratorMethod._export(core_getIteratorMethod._export.S, 'Object', {
+  values: function values(it) {
+    return $values(it);
+  }
+});
+
+var values$1 = core_getIteratorMethod._core.Object.values;
+
+var values = _commonjsHelpers.createCommonjsModule(function (module) {
+module.exports = { "default": values$1, __esModule: true };
+});
+
+var _Object$values = _commonjsHelpers.unwrapExports(values);
+
 var PopupMultiChoice = function PopupMultiChoice(_ref) {
   var question = _ref.question,
       choices = _ref.choices,
@@ -2229,7 +2260,7 @@ var PopupMultiChoice = function PopupMultiChoice(_ref) {
       inline: true,
       label: choice.choiceText,
       value: choice.choiceText,
-      name: 'radioButton',
+      name: question,
       type: 'radio',
       className: 'radioButton',
       onClick: handlePollAnswer
@@ -2299,10 +2330,15 @@ var PopupPollModal = function PopupPollModal(props) {
       pollAnswer = _useState2[0],
       setPollAnswer = _useState2[1];
 
-  var _useState3 = React.useState(''),
+  var _useState3 = React.useState({}),
       _useState4 = slicedToArray._slicedToArray(_useState3, 2),
-      textAnswer = _useState4[0],
-      setTextAnswer = _useState4[1];
+      multiItemPollAnswers = _useState4[0],
+      setMultiItemPollAnswers = _useState4[1];
+
+  var _useState5 = React.useState(''),
+      _useState6 = slicedToArray._slicedToArray(_useState5, 2),
+      textAnswer = _useState6[0],
+      setTextAnswer = _useState6[1];
 
   React.useEffect(function () {
     var modal = document.getElementById('modalDiv');
@@ -2317,77 +2353,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._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: keys._Object$keys(multiItemPollAnswers),
+        answersArray: _Object$values(multiItemPollAnswers)
       };
-      var requestOptions = {
-        method: 'POST',
-        headers: { 'content-type': 'application/json' },
-        body: stringify._JSON$stringify({ data: formData })
-      };
-      var insertData = function () {
-        var _ref = asyncToGenerator._asyncToGenerator( /*#__PURE__*/asyncToGenerator.regenerator.mark(function _callee() {
-          return asyncToGenerator.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;
+      keys._Object$keys(multiItemPollAnswers).length > 0 ? formData.multiItemQandA = multiItemPollAnswers : null;
+    });
+    var requestOptions = {
+      method: 'POST',
+      headers: { 'content-type': 'application/json' },
+      body: stringify._JSON$stringify({ data: formData })
+    };
+    var insertData = function () {
+      var _ref = asyncToGenerator._asyncToGenerator( /*#__PURE__*/asyncToGenerator.regenerator.mark(function _callee() {
+        return asyncToGenerator.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["default"].createElement(PopupMultiChoice, { question: item.question, choices: item.choices, handlePollAnswer: handlePollAnswer, key: ind }));
-    }
-    if (item.format === 'textInput') {
-      pollArray.push(React__default["default"].createElement(PopupPollTextInput, { textInputQuestion: item.question, textanswer: textAnswer, handleTextAnswer: handleTextAnswer, key: ind }));
+    if (!item.atStart) {
+      if (item.format === 'multiChoice') {
+        pollArray.push(React__default["default"].createElement(PopupMultiChoice, { question: item.question, choices: item.choices, handlePollAnswer: handlePollAnswer, key: ind }));
+      }
+      if (item.format === 'textInput') {
+        pollArray.push(React__default["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["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["default"].createElement(PopupPollTextInput, { textInputQuestion: item.pollItems[0].question, textanswer: textAnswer, handleTextAnswer: handleTextAnswer, key: ind }));
+      }
     }
   });
 
@@ -2396,7 +2453,10 @@ var PopupPollModal = function PopupPollModal(props) {
     { className: 'modalDiv', id: 'modalDiv' },
     React__default["default"].createElement(
       Modal__default["default"].Dialog,
-      null,
+      { className: pollItems.length > 1 ? 'modal-dialog-overflow' : null, scrollable: pollItems.length > 1 },
+      props.closeable && React__default["default"].createElement(Modal__default["default"].Header, { closeButton: true, onClick: function onClick() {
+          return restartPlayer();
+        } }),
       React__default["default"].createElement(
         Modal__default["default"].Body,
         null,
@@ -2408,10 +2468,14 @@ var PopupPollModal = function PopupPollModal(props) {
             Button__default["default"],
             { className: 'submitButton', type: 'submit', variant: 'success', disabled: !textAnswer },
             'Submit'
-          ) : React__default["default"].createElement(
+          ) : !textInputRender && multiChoiceRender ? React__default["default"].createElement(
             Button__default["default"],
             { className: 'submitButton', type: 'submit', variant: 'success', disabled: !pollAnswer },
             'Submit'
+          ) : React__default["default"].createElement(
+            Button__default["default"],
+            { className: 'submitButton', type: 'submit', variant: 'success' },
+            'Submit'
           )
         )
       )
@@ -2630,6 +2694,7 @@ var Video = function Video(_ref) {
       experienceID = node.experienceID;
 
   var polls = void 0;
+
   if (node.polls) polls = node.polls;
 
   var _useState = React.useState(false),
@@ -2674,10 +2739,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() {
@@ -2752,7 +2823,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();
       }
@@ -2760,20 +2838,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.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();
@@ -2874,6 +2947,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["default"].createElement(brightcoveReactPlayerLoader_es.ReactPlayerLoader, {
           onSuccess: onVideoSuccess,
@@ -2906,6 +2981,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["default"].createElement(brightcoveReactPlayerLoader_es.ReactPlayerLoader, {
           accountId: accountIDs.brightcove.accountId,
@@ -2939,6 +3016,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
       );
     }
@@ -8155,24 +8235,6 @@ var Poll$1 = function Poll(_ref) {
   );
 };
 
-// https://github.com/tc39/proposal-object-values-entries
-
-var $values = _objectToArray._objectToArray(false);
-
-core_getIteratorMethod._export(core_getIteratorMethod._export.S, 'Object', {
-  values: function values(it) {
-    return $values(it);
-  }
-});
-
-var values$1 = core_getIteratorMethod._core.Object.values;
-
-var values = _commonjsHelpers.createCommonjsModule(function (module) {
-module.exports = { "default": values$1, __esModule: true };
-});
-
-var _Object$values = _commonjsHelpers.unwrapExports(values);
-
 var Poll = function Poll(_ref) {
   var node = _ref.node;
       _ref.client;

package/dist/cjs/index-50be6759.js

@@ -0,0 +1,105 @@
+'use strict';
+
+var _commonjsHelpers = require('./_commonjsHelpers-06173234.js');
+
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+
+  return target;
+}
+
+function _setPrototypeOf(o, p) {
+  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+    o.__proto__ = p;
+    return o;
+  };
+
+  return _setPrototypeOf(o, p);
+}
+
+var classnames = _commonjsHelpers.createCommonjsModule(function (module) {
+/*!
+  Copyright (c) 2018 Jed Watson.
+  Licensed under the MIT License (MIT), see
+  http://jedwatson.github.io/classnames
+*/
+/* global define */
+
+(function () {
+
+	var hasOwn = {}.hasOwnProperty;
+
+	function classNames() {
+		var classes = [];
+
+		for (var i = 0; i < arguments.length; i++) {
+			var arg = arguments[i];
+			if (!arg) continue;
+
+			var argType = typeof arg;
+
+			if (argType === 'string' || argType === 'number') {
+				classes.push(arg);
+			} else if (Array.isArray(arg)) {
+				if (arg.length) {
+					var inner = classNames.apply(null, arg);
+					if (inner) {
+						classes.push(inner);
+					}
+				}
+			} else if (argType === 'object') {
+				if (arg.toString === Object.prototype.toString) {
+					for (var key in arg) {
+						if (hasOwn.call(arg, key) && arg[key]) {
+							classes.push(key);
+						}
+					}
+				} else {
+					classes.push(arg.toString());
+				}
+			}
+		}
+
+		return classes.join(' ');
+	}
+
+	if (module.exports) {
+		classNames.default = classNames;
+		module.exports = classNames;
+	} else {
+		window.classNames = classNames;
+	}
+}());
+});
+
+exports._extends = _extends;
+exports._objectWithoutPropertiesLoose = _objectWithoutPropertiesLoose;
+exports._setPrototypeOf = _setPrototypeOf;
+exports.classnames = classnames;