@icvdeveloper/common-module 0.0.97 → 0.0.99

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "v3plus-common-module",
   "configKey": "v3plusCommonModule",
-  "version": "0.0.97"
+  "version": "0.0.99"
 }

package/dist/runtime/components/auth/Ucc.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { toRefs, onMounted } from "vue";
+import { toRefs, computed, onMounted } from "vue";
 import { useUcc } from "../../composables/useUcc";
 import { Conference } from "../../models/conference";
 import { useConferencesStore } from "../../store/conferences";
@@ -15,6 +15,7 @@ interface Props {
 }
 
 const props = withDefaults(defineProps<Props>(), {
+  eventPathPrefix: "",
   classObject: () => {
     return {
       container: ""
@@ -23,6 +24,7 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 const {
+  eventPathPrefix,
   classObject,
 } = toRefs(props);
 
@@ -32,50 +34,91 @@ const { classBinding } = useClassBinding();
 // reactive data
 const { conference } = toRefs(props);
 
+// methods
 const submitLogin = () => {
   let email = document.getElementById('uccEmail').value;
   loginV3({email: email});
 };
 
+// computed
+const loginHeader = computed(() => {
+  return (conference.value.state == "live")
+    ? "Live Web Event Streaming Now"
+    : (conference.value.state == "archive")
+      ? "Enter your email address to view event recording"
+      : "Join us for a Free Live Web Event"; // fallback (handled by UCC)
+});
+
+const buttonText = computed(() => {
+  return (conference.value.state == "live")
+    ? "Join the Livestream"
+    : (conference.value.state == "archive")
+      ? "View Event"
+      : "Register"; // fallback (handled by UCC)
+});
+
+const buttonColorClass = computed(() => {
+  return (conference.value.state == "live")
+    ? "v3-ucc-btn-black"
+    : "ucc-btn-primary";
+});
+
 // on mount
 onMounted(() => {
-  loadUccScript(props.conference, "/events/");
+  loadUccScript(props.conference, props.eventPathPrefix);
 });
 
 </script>
 
 <template>
-  <div id="uccTarget"
-  :class="
-    classBinding(
-      classObject,
-      'container',
-      'p-0 m-0 w-full'
-    )
-  "
-  style="display:block;"
-  >
-    <div id="uccEmailForm" class="ucc-form-container ucc-widgets-events" :class="(conference.state == 'live') ? 'block' : 'hidden'">
+  <div>
+    <!-- UCC Widget -->
+    <div id="uccTarget"
+    :class="
+      classBinding(
+        classObject,
+        'container',
+        'p-0 m-0 w-full'
+      )
+    "
+    style="display:block;"
+    >
+    </div>
+    <!-- V3 email login form -->
+    <div id="uccEmailForm"
+      class="ucc-form-container ucc-widgets-events"
+      :class="(conference.state == 'live' || conference.state == 'archive') ? 'block' : 'hidden'"
+      style="padding-bottom: 0px"
+    >
       <div>
-        <h1 class="scala-bold text-red-500 text-xl mb-0">
-          Live Web Event Streaming Now
+        <h1 class="scala-bold text-red-500 text-xl text-center mb-0">
+          {{ loginHeader }}
         </h1>
       </div>
-      <div id="uccEmailFormInputs">
+      <div class="text-center">
           <div class="ucc-form-field">
             <div class="ucc-form-field-descr"></div>
-            <div class="ucc-input-wrapper required filled"><label for="uccEmail"
-                class="ucc-label ucc-label-active">Email Address</label><input id="uccEmail" name="uccEmail"
-                class="ucc-input" type="text" placeholder="Email Address" autocomplete="off" maxlength="70"
-                fdprocessedid="tkt2jv">
-              <div data-lastpass-icon-root="true"
-                style="position: relative !important; height: 0px !important; width: 0px !important; float: left !important;">
-              </div>
+            <div class="ucc-input-wrapper required">
+              <input id="uccEmail" name="uccEmail" class="ucc-input" type="text" placeholder="Enter Email Address" autocomplete="off" maxlength="70">
             </div>
             <div class="ucc-error"></div>
           </div>
-          <div class="ucc-form-field ucc-form-btn-row" style="margin-bottom: 0x; margin-top: 0px;"><a @click="submitLogin" class="ucc-btn ucc-btn-primary" style="margin-top: 0px;"><span class="btn-text">Join the Livestream</span></a></div>
+          <div class="ucc-form-field ucc-form-btn-row" style="margin-bottom: 0x; margin-top: 0px;">
+            <a
+              @click="submitLogin"
+              class="ucc-btn"
+              :class="buttonColorClass"
+              style="margin-top: 0px;"><span class="btn-text">{{ buttonText }}</span></a>
+          </div>
       </div>
     </div>
   </div>
 </template>
+
+<style scoped>
+.v3-ucc-btn-black {
+  background-color: #000;
+  border: 1px solid #000;
+  color: #fff;
+}
+</style>

package/dist/runtime/composables/useUcc.d.ts

@@ -5,9 +5,9 @@ export type UccFunctions = {
      */
     loadUccScript: (conference: Conference, eventPathPrefix: string) => void;
     /**
-     * redirect to webcast
+     * redirect after successful login or registration
      */
-    redirectToWebcast: () => void;
+    postAuthRedirect: () => void;
     /**
      * show UCC Event Sign Up
      */

package/dist/runtime/composables/useUcc.mjs

@@ -8,6 +8,7 @@ import { useConferenceHelpers } from "../composables/useConferenceHelpers.mjs";
 export const useUcc = () => {
   const { globalConfigValue } = useTemplateConfigsStore();
   const { user, isLoggedIn } = storeToRefs(useAuthStore());
+  const { setUser } = useAuthStore();
   const router = useRouter();
   const loadUccScript = (conference, eventPathPrefix) => {
     console.log("conference", conference);
@@ -21,16 +22,21 @@ export const useUcc = () => {
         state: conference.state,
         brandCode
       };
-      window.uccMixin.webcastUrl = getConferenceWebcastUrl(conference, "/events/");
-      window.uccMixin.redirectToWebcast = redirectToWebcast;
+      window.uccMixin.webcastUrl = getConferenceWebcastUrl(conference, eventPathPrefix);
+      window.uccMixin.postAuthRedirect = postAuthRedirect;
       window.uccMixin.uccShowEventSignUp = uccShowEventSignUp;
       window.uccMixin.handleUCCCallback = handleUCCCallback;
       let ucc = document.createElement("script");
       ucc.setAttribute("src", globalConfigValue("ucc_url"));
       ucc.onload = () => {
         console.log("UCC onload");
-        if (window.uccMixin.conference) {
-          if (window.uccMixin.conference.state !== "live") {
+        console.log("isLoggedIn", isLoggedIn.value);
+        if (isLoggedIn.value) {
+          console.log("onload auth user.value", user.value);
+          let hasAccess = find(get(user, "value.conferences", []), { id: window.uccMixin.conference.id });
+          toggleEmailFormDisplay(!hasAccess);
+        } else if (window.uccMixin.conference) {
+          if (window.uccMixin.conference.state == "upcoming") {
             window.uccMixin.uccShowEventSignUp();
           }
         }
@@ -45,16 +51,13 @@ export const useUcc = () => {
           },
           onLoginSuccess: function(ssoEvent) {
             console.log("UCC login success");
-            window.uccMixin.handleUCCCallback(ssoEvent);
           },
           onAuthStateReady: function(ssoEvent) {
             console.log("UCC auth state ready");
           },
           onRegistrationSuccess: function(ssoEvent) {
             console.log("UCC reg success");
-            if (window.uccMixin.conference.state == "live") {
-              window.uccMixin.redirectToWebcast();
-            }
+            postAuthRedirect();
           },
           onLogoutSuccess: function(ssoEvent) {
             console.log("UCC logout success");
@@ -64,8 +67,12 @@ export const useUcc = () => {
       document.head.appendChild(ucc);
     }
   };
-  const redirectToWebcast = () => {
-    router.push(window.uccMixin.webcastUrl);
+  const postAuthRedirect = () => {
+    if (window.uccMixin.conference.state == "live") {
+      router.push(window.uccMixin.webcastUrl);
+    } else if (window.uccMixin.conference.state == "archive") {
+      window.location.reload();
+    }
   };
   const uccShowEventSignUp = (email) => {
     let _conference = window.uccMixin.conference;
@@ -74,8 +81,8 @@ export const useUcc = () => {
     let emailStr = email ? email : "";
     console.log("uccShowEventSignUp _conference", _conference);
     console.log("user", user);
-    console.log("isLoggedIn", isLoggedIn);
-    document.getElementById("uccTarget").innerHTML = "";
+    console.log("isLoggedIn", isLoggedIn.value);
+    toggleEmailFormDisplay(false);
     if (_conference.brandCode) {
       let mmsResponse = window.mmsWidgets.showEventsSignUp(
         "#uccTarget",
@@ -97,11 +104,12 @@ export const useUcc = () => {
     let hasAccess = find(conferences, { id: _conference.id });
     console.log("hasAccess", hasAccess);
     if (hasAccess) {
-      console.log("isLoggedIn", isLoggedIn);
-      redirectToWebcast();
+      console.log("isLoggedIn", isLoggedIn.value);
+      setUser(response.data);
+      console.log("auth user", user);
+      console.log("isLoggedIn", isLoggedIn.value);
+      postAuthRedirect();
     } else {
-      toggleEmailFormDisplay(false);
-      console.log("showing reg?");
       uccShowEventSignUp(email);
     }
   };
@@ -119,8 +127,6 @@ export const useUcc = () => {
   };
   const handleUCCCallback = (ssoEvent) => {
     console.log("ssoEvent", ssoEvent);
-    if (!ssoEvent.profile) {
-    }
     var options = {
       email: ssoEvent.profile.email,
       ucid: ssoEvent.profile.ucid
@@ -132,13 +138,9 @@ export const useUcc = () => {
   const toggleEmailFormDisplay = (show) => {
     document.getElementById("uccEmailForm").style.display = show ? "block" : "none";
   };
-  const toggleEmailFormInputsDisplay = (show) => {
-    document.getElementsByClassName("ucc-placeholder-spinner")[0].style.display = show ? "none" : "block";
-    document.getElementById("uccEmailFormInputs").style.display = show ? "block" : "none";
-  };
   return {
     loadUccScript,
-    redirectToWebcast,
+    postAuthRedirect,
     uccShowEventSignUp,
     handleLoginV3Response,
     loginV3,

package/dist/runtime/models/conference.d.ts

@@ -71,6 +71,7 @@ export type Presentation = {
     portal_id?: number;
     type?: PresentationType;
     video_url?: string | null;
+    photo?: string | boolean;
     visible?: boolean;
     zoom_meeting_id?: string | null;
     zoom_meeting_password?: string | null;

package/dist/runtime/store/auth.d.ts

@@ -10,6 +10,7 @@ export type LoginParams = {
 export declare const useAuthStore: import("pinia").StoreDefinition<"auth", AuthStoreState, {
     isLoggedIn: (state: AuthStoreState) => boolean;
 }, {
+    setUser(data: object): void;
     login(params: LoginParams): Promise<AuthUser>;
     logout(): Promise<void>;
     update(data: AuthUser): Promise<void>;

package/dist/runtime/store/auth.mjs

@@ -7,10 +7,15 @@ export const useAuthStore = defineStore("auth", {
   }),
   getters: {
     isLoggedIn: (state) => {
+      console.log("isLoggedIn method state", state);
       return state.user !== null;
     }
   },
   actions: {
+    setUser(data) {
+      console.log("setting user", data);
+      this.user = data;
+    },
     login(params) {
       return new Promise((resolve, reject) => {
         const request = useApi();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@icvdeveloper/common-module",
-  "version": "0.0.97",
+  "version": "0.0.99",
   "license": "MIT",
   "type": "module",
   "exports": {