@openeventkit/event-site 1.0.43 → 1.0.46

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openeventkit/event-site",
   "description": "Event Site",
-  "version": "1.0.43",
+  "version": "1.0.46",
   "author": "Tipit LLC",
   "dependencies": {
     "@mui/base": "^5.0.0-alpha.114",

package/src/cms/config/collections/defaultPagesCollection/lobbyPage/typeDefs.js

@@ -19,6 +19,6 @@ module.exports = `
   type LobbyPageJson implements Node {
     hero: LobbyPageHero
     centerColumn: LobbyPageCenterColumn
-    liveNowFeaturedEventId: Int
+    liveNowFeaturedEventId: String
   }
 `;

package/src/components/AttendeeToAttendeeWidgetComponent.js

@@ -199,7 +199,7 @@ const AccessTracker = ({ user, isLoggedUser, summitPhase }) => {
     return user.isAuthorized;
   };
 
-  // if summit_phase wasn't initialized yet (eg: due to a delay in the reducer), 
+  // if summitPhase wasn't initialized yet (eg: due to a delay in the reducer), 
   // this render shouldn't continue
   if (summitPhase === null) return null;
 

package/src/components/VideoComponent.js

@@ -17,6 +17,10 @@ const checkVimeoVideo = (url) => {
     return url.match(/https:\/\/(www\.)?(player\.)?vimeo.com\/(.*)/);
 };
 
+function checkYouTubeVideo(url) {
+    return url.match(/^(?:https?:\/\/)?(?:m\.|www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/);
+}
+
 const VideoComponent = ({ url, title, namespace, firstHalf, autoPlay, start }) => {
     console.log({ url, title, namespace, firstHalf, autoPlay, start });
     if (url) {
@@ -54,6 +58,23 @@ const VideoComponent = ({ url, title, namespace, firstHalf, autoPlay, start }) =
                 <VideoJSPlayer title={title} namespace={namespace} firstHalf={firstHalf} {...videoJsOptions} />
             );
         };
+
+        const customOptions = checkYouTubeVideo(url) ? {
+            techOrder: ["youtube"],
+            sources: [{
+                type: "video/youtube",
+                src: url
+            }],
+            youtube: {
+                ytControls: 0,
+                iv_load_policy: 1
+            },
+        }: {
+            sources: [{
+                src: url
+            }],
+        };
+
         const videoJsOptions = {
             autoplay: autoPlay,
             /*
@@ -64,17 +85,10 @@ const VideoComponent = ({ url, title, namespace, firstHalf, autoPlay, start }) =
             muted: !!autoPlay,
             controls: true,
             fluid: true,
-            techOrder: ["youtube"],
-            sources: [{
-                type: "video/youtube",
-                src: url
-            }],
-            youtube: {
-                ytControls: 0,
-                iv_load_policy: 1
-            },
             playsInline: true,
+            ...customOptions
         };
+
         return (
             <VideoJSPlayer title={title} namespace={namespace} {...videoJsOptions} />
         );

package/src/pages/a/[...].js

@@ -1,16 +1,15 @@
 import * as React from "react";
 import { Router, Location } from "@reach/router";
 import { connect } from "react-redux";
-import LobbyPage from "../../templates/lobby-page";
 import EventPage from "../../templates/event-page";
 import PostersPage from "../../templates/posters-page";
 import SchedulePage from "../../templates/schedule-page";
-import SponsorPage from "../../templates/sponsor-page"
-import ExpoHallPage from "../../templates/expo-hall-page"
-import FullProfilePage from "../../templates/full-profile-page"
-import WithAuthzRoute from "../../routes/WithAuthzRoute"
+import SponsorPage from "../../templates/sponsor-page";
+import ExpoHallPage from "../../templates/expo-hall-page";
+import FullProfilePage from "../../templates/full-profile-page";
+import WithAuthzRoute from "../../routes/WithAuthzRoute";
 import WithAuthRoute from "../../routes/WithAuthRoute";
-import ExtraQuestionsPage from "../../templates/extra-questions-page"
+import ExtraQuestionsPage from "../../templates/extra-questions-page";
 import ShowOpenRoute from "../../routes/ShowOpenRoute";
 import WithBadgeRoute from "../../routes/WithBadgeRoute";
 import PosterDetailPage from "../../templates/poster-detail-page";
@@ -22,7 +21,7 @@ import Seo from "../../components/Seo";
 import Link from "../../components/Link";
 import { titleFromPathname } from "../../utils/urlFormating";
 
-const App = ({ isLoggedUser, user, summit_phase, allowClick = true }) => {
+const App = ({ isLoggedUser, user, summitPhase, allowClick = true }) => {
   return (
     <Location>
       {({ location }) => (
@@ -38,18 +37,18 @@ const App = ({ isLoggedUser, user, summit_phase, allowClick = true }) => {
           />
           <WithAuthRoute path="/" isLoggedIn={isLoggedUser} location={location}>
             <MyTicketsPage path="/my-tickets" isLoggedIn={isLoggedUser} user={user} location={location} />
-            <FullProfilePage path="/profile" summit_phase={summit_phase} isLoggedIn={isLoggedUser} user={user} location={location} />
+            <FullProfilePage path="/profile" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location} />
             <WithTicketRoute path="/extra-questions" location={location}>
                 <ExtraQuestionsPage path="/" isLoggedIn={isLoggedUser} user={user} location={location} />
             </WithTicketRoute>
-            <WithAuthzRoute path="/" summit_phase={summit_phase} isLoggedIn={isLoggedUser} user={user} location={location}>
+            <WithAuthzRoute path="/" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location}>
                 <PostersPage path="/posters" trackGroupId={0} location={location} />
                 <PostersPage path="/posters/:trackGroupId" location={location} />
                 <PosterDetailPage path="/poster/:presentationId/" isLoggedIn={isLoggedUser} user={user} location={location} />
                 <SchedulePage
                   path="/my-schedule"
                   location={location}
-                  summit_phase={summit_phase}
+                  summitPhase={summitPhase}
                   isLoggedIn={isLoggedUser}
                   user={user}
                   scheduleProps={{
@@ -60,13 +59,12 @@ const App = ({ isLoggedUser, user, summit_phase, allowClick = true }) => {
                   schedKey="my-schedule-main"
                   allowClick={allowClick}
                 />
-                <ShowOpenRoute path="/" summit_phase={summit_phase} isLoggedIn={isLoggedUser} user={user} location={location}>
-                  <WithBadgeRoute path="/event/:eventId" summit_phase={summit_phase} isLoggedIn={isLoggedUser} user={user} location={location}>
-                    <EventPage path="/" summit_phase={summit_phase} isLoggedIn={isLoggedUser} user={user} location={location} />
+                <ShowOpenRoute path="/" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location}>
+                  <WithBadgeRoute path="/event/:eventId" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location}>
+                    <EventPage path="/" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location} />
                   </WithBadgeRoute>
-                  <LobbyPage path="/" isLoggedIn={isLoggedUser} user={user} location={location} />
-                  <SponsorPage path="/sponsor/:sponsorId" summit_phase={summit_phase} isLoggedIn={isLoggedUser} user={user} location={location} />
-                  <ExpoHallPage path="/sponsors/" summit_phase={summit_phase} isLoggedIn={isLoggedUser} user={user} location={location} />
+                  <SponsorPage path="/sponsor/:sponsorId" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location} />
+                  <ExpoHallPage path="/sponsors/" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location} />
                 </ShowOpenRoute>
             </WithAuthzRoute>
           </WithAuthRoute>
@@ -78,7 +76,7 @@ const App = ({ isLoggedUser, user, summit_phase, allowClick = true }) => {
 
 const mapStateToProps = ({ loggedUserState, userState, clockState, settingState, summitState }) => ({
   isLoggedUser: loggedUserState.isLoggedUser,
-  summit_phase: clockState.summit_phase,
+  summitPhase: clockState.summit_phase,
   user: userState,
   summitId: summitState?.summit?.id,
   lastBuild: settingState.lastBuild,

package/src/pages/a/index.js

@@ -0,0 +1,75 @@
+import * as React from "react";
+import { graphql } from "gatsby";
+import { Router, Location } from "@reach/router";
+import { connect } from "react-redux";
+import LobbyPage from "../../templates/lobby-page";
+import WithAuthzRoute from "../../routes/WithAuthzRoute";
+import WithAuthRoute from "../../routes/WithAuthRoute";
+import ShowOpenRoute from "../../routes/ShowOpenRoute";
+import withRealTimeUpdates from "../../utils/real_time_updates/withRealTimeUpdates";
+import withFeedsWorker from "../../utils/withFeedsWorker";
+import Seo from "../../components/Seo";
+
+export const lobbyPageQuery = graphql`
+  query {
+    lobbyPageJson {
+      hero {
+        title
+        subTitle
+        background {
+          src {
+            childImageSharp {
+              gatsbyImageData (
+                quality: 100
+                placeholder: BLURRED
+              )
+            }
+          }
+          alt
+        }
+      }
+      centerColumn {
+        speakers {
+          showTodaySpeakers
+          showFeatureSpeakers
+        }
+      }
+      liveNowFeaturedEventId
+    }
+  }
+`;
+
+const App = ({ data, isLoggedUser, user, summitPhase }) => {
+  return (
+    <Location>
+      {({ location }) => (
+        <Router basepath="/a" >
+          <WithAuthRoute path="/" isLoggedIn={isLoggedUser} location={location}>
+            <WithAuthzRoute path="/" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location}>
+              <ShowOpenRoute path="/" summitPhase={summitPhase} isLoggedIn={isLoggedUser} user={user} location={location}>
+                <LobbyPage path="/" data={data} isLoggedIn={isLoggedUser} user={user} location={location} />
+              </ShowOpenRoute>
+            </WithAuthzRoute>
+          </WithAuthRoute>
+        </Router>
+      )}
+    </Location>
+  );
+};
+
+const mapStateToProps = ({ loggedUserState, userState, clockState }) => ({
+  isLoggedUser: loggedUserState.isLoggedUser,
+  summitPhase: clockState.summit_phase,
+  user: userState
+});
+
+export default connect(mapStateToProps, {})(withFeedsWorker(withRealTimeUpdates(App)));
+
+export const Head = ({
+  location
+}) => (
+  <Seo
+    title={"Lobby"}
+    pathname={location.pathname}
+  />
+);

package/src/reducers/setting-reducer.js

@@ -5,7 +5,6 @@ import { RESET_STATE, SYNC_DATA, UPDATE_LAST_CHECK_FOR_NOVELTIES } from "../acti
 import colors from "data/colors.json";
 // TODO: dont store build timestamps in site-settings, use another file
 import settings from "content/site-settings/index.json";
-import lobbyPageSettings from "content/lobby-page/index.json";
 // TODO: should this live in reducer or should be accessed though graphql?
 import marketingPageSettings from "content/marketing-page/index.json";
 import postersPages from "content/posters-pages.json";
@@ -20,7 +19,6 @@ const DEFAULT_STATE = {
   widgets: settings.widgets,
   colorSettings: colors,
   marketingPageSettings: marketingPageSettings,
-  lobbyPageSettings: lobbyPageSettings,
   posterPagesSettings: postersPages,
   // this keeps tracks of last data synch
   lastDataSync: settings.lastBuild,

package/src/routes/ShowOpenRoute.js

@@ -11,7 +11,7 @@ import moment from "moment-timezone";
  *
  * @param children
  * @param isAuthorized
- * @param summit_phase
+ * @param summitPhase
  * @param requireExtraQuestions
  * @param hasTicket
  * @param userProfile
@@ -22,7 +22,7 @@ import moment from "moment-timezone";
 const ShowOpenRoute = ({
   children,
   isAuthorized,
-  summit_phase,
+  summitPhase,
   requireExtraQuestions,
   hasTicket,
   userProfile,
@@ -31,21 +31,21 @@ const ShowOpenRoute = ({
 
   // if we are at show time, and we have an attendee, perform virtual check-in
   useEffect(() => {
-    if(hasTicket && summit_phase === PHASES.DURING){
+    if(hasTicket && summitPhase === PHASES.DURING){
       // verify if we have an attendee , and if so do the virtual check in
       let attendee = userProfile?.summit_tickets[0]?.owner || null;
       if(attendee)
         doVirtualCheckIn(attendee);
     }
-  },[summit_phase, hasTicket, userProfile, doVirtualCheckIn]);
+  },[summitPhase, hasTicket, userProfile, doVirtualCheckIn]);
 
   const userCanByPassAuthz = () => {
     return isAuthorized;
   };
 
-  // if summit_phase wasn't initialized yet (eg: due to a delay in the reducer), 
+  // if summitPhase wasn't initialized yet (eg: due to a delay in the reducer), 
   // this render shouldn't continue
-  if (summit_phase === null) return null;
+  if (summitPhase === null) return null;
 
   // if we are providing the now fragment param then let the clock
   // component set it, so we need to bypass this next check
@@ -60,7 +60,7 @@ const ShowOpenRoute = ({
   }
 
   // if summit didnt started yet ...
-  if (!shouldBypassCheck && !userCanByPassAuthz() && summit_phase === PHASES.BEFORE) {
+  if (!shouldBypassCheck && !userCanByPassAuthz() && summitPhase === PHASES.BEFORE) {
     return <HeroComponent title="You are now logged in. Additional event info is now available on the website." redirectTo="/" />;
   }
 

package/src/templates/lobby-page.js

@@ -1,6 +1,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 import { navigate } from "gatsby";
+import { getSrc } from "gatsby-plugin-image";
 import { connect } from "react-redux";
 
 import Layout from "../components/Layout";
@@ -41,13 +42,15 @@ export const LobbyPageTemplate = class extends React.Component {
     const {
       user,
       summit,
-      lobbyPageSettings: {
-        hero,
-        centerColumn,
-        liveNowFeaturedEventId
+      data: {
+        lobbyPageJson: {
+          hero,
+          centerColumn,
+          liveNowFeaturedEventId
+        }
       },
       lastDataSync
-  } = this.props;
+    } = this.props;
 
     return (
       <>
@@ -55,7 +58,7 @@ export const LobbyPageTemplate = class extends React.Component {
         <PageHeader
           title={hero.title}
           subtitle={hero.subTitle}
-          backgroundImageSrc={hero.background?.src}
+          backgroundImageSrc={hero.background ? getSrc(hero.background.src) : null}
         />
         }
         <div className="px-5 py-5 mb-6">
@@ -139,31 +142,33 @@ const OrchestedTemplate = withOrchestra(LobbyPageTemplate);
 const LobbyPage = (
   {
     location,
+    data,
     user,
     getUserProfile,
     summit,
-    lastDataSync,
-    lobbyPageSettings
+    lastDataSync
   }
 ) => (
   <Layout location={location}>
     <AttendanceTrackerComponent sourceName="LOBBY"/>
     <OrchestedTemplate
       user={user}
+      data={data}
       getUserProfile={getUserProfile}
       summit={summit}
       lastDataSync={lastDataSync}
-      lobbyPageSettings={lobbyPageSettings}
     />
   </Layout>
 );
 
 LobbyPage.propTypes = {
+  data: PropTypes.object,
   user: PropTypes.object,
   getUserProfile: PropTypes.func
 };
 
 LobbyPageTemplate.propTypes = {
+  data: PropTypes.object,
   user: PropTypes.object,
   getUserProfile: PropTypes.func
 };
@@ -171,8 +176,7 @@ LobbyPageTemplate.propTypes = {
 const mapStateToProps = ({userState, summitState, settingState}) => ({
   user: userState,
   summit: summitState.summit,
-  lastDataSync: settingState.lastDataSync,
-  lobbyPageSettings: settingState.lobbyPageSettings,
+  lastDataSync: settingState.lastDataSync
 });
 
 export default connect(mapStateToProps, {getUserProfile})(LobbyPage);

package/src/content/lobby-page/index.json

@@ -1 +0,0 @@
-{}