@icvdeveloper/common-module 0.0.122 → 0.0.124

package/dist/runtime/components/media/components/MediaContainer.vue

@@ -1,65 +1,65 @@
-<script lang="ts" setup>
-import { ref, toRefs } from "vue";
-import { Conference, Presentation } from "../../../models/conference";
-import {
-  MediaContainerClassObj,
-  MediaContainerCompObj,
-  WebcastPlayerClassObj,
-} from "../../../@types/components";
-import { useStream } from "../../../composables/useStream";
-import { useClassBinding } from "../../../composables/useClassBinding";
-import { useRuntimeConfig } from "#app";
-
-const config = useRuntimeConfig();
-
-type Props = {
-  webcastConference: Conference;
-  classObject?: MediaContainerClassObj;
-};
-
-const props = withDefaults(defineProps<Props>(), {
-  classObject: () => {
-    return {
-      container: "",
-      components: ref<MediaContainerCompObj>({
-        webcastPlayer: ref<WebcastPlayerClassObj>({}),
-      }),
-    };
-  },
-});
-
-const { webcastConference } = toRefs(props);
-
-const { classBinding } = useClassBinding();
-
-// emits
-const emit = defineEmits<{
-  (event: string, value: Presentation): void;
-}>();
-
-console.log(
-  config.public.awsDefaultRegion + ", " + config.public.resourcePrefix
-);
-
-const { currentStreamData, currentPresentation } = useStream(
-  config.public.awsDefaultRegion,
-  config.public.resourcePrefix,
-  Number(webcastConference.value.id),
-  emit
-);
-</script>
-
-<template>
-  <div :class="classBinding(classObject, 'container', 'media-container')">
-    <CommonWebcastVideoPlayer
-      ref="mediaPlayer"
-      :stream="currentStreamData"
-      :presentation="currentPresentation"
-      :class-object="classObject.components.webcastPlayer"
-    ></CommonWebcastVideoPlayer>
-  </div>
-</template>
-
+<script lang="ts" setup>
+import { ref, toRefs } from "vue";
+import { Conference, Presentation } from "../../../models/conference";
+import {
+  MediaContainerClassObj,
+  MediaContainerCompObj,
+  WebcastPlayerClassObj,
+} from "../../../@types/components";
+import { useStream } from "../../../composables/useStream";
+import { useClassBinding } from "../../../composables/useClassBinding";
+import { useRuntimeConfig } from "#app";
+
+const config = useRuntimeConfig();
+
+type Props = {
+  webcastConference: Conference;
+  classObject?: MediaContainerClassObj;
+};
+
+const props = withDefaults(defineProps<Props>(), {
+  classObject: () => {
+    return {
+      container: "",
+      components: ref<MediaContainerCompObj>({
+        webcastPlayer: ref<WebcastPlayerClassObj>({}),
+      }),
+    };
+  },
+});
+
+const { webcastConference } = toRefs(props);
+
+const { classBinding } = useClassBinding();
+
+// emits
+const emit = defineEmits<{
+  (event: string, value: Presentation): void;
+}>();
+
+console.log(
+  config.public.awsDefaultRegion + ", " + config.public.resourcePrefix
+);
+
+const { currentStreamData, currentPresentation } = useStream(
+  config.public.awsDefaultRegion,
+  config.public.resourcePrefix,
+  Number(webcastConference.value.id),
+  emit
+);
+</script>
+
+<template>
+  <div :class="classBinding(classObject, 'container', 'media-container')">
+    <CommonWebcastVideoPlayer
+      ref="mediaPlayer"
+      :stream="currentStreamData"
+      :presentation="currentPresentation"
+      :class-object="classObject.components.webcastPlayer"
+    ></CommonWebcastVideoPlayer>
+  </div>
+</template>
+
 <style scoped>
 .media-container {
   display: grid;
@@ -105,4 +105,4 @@ const { currentStreamData, currentPresentation } = useStream(
     opacity: 0.7;
   }
 }
-</style>
+</style>

package/dist/runtime/components/media/components/OverviewPanel.vue

@@ -1,52 +1,52 @@
-<script lang="ts" setup>
-import { toRefs, computed } from "vue";
-import { Presentation } from "../../../models/conference";
-import { OverviewPanelClassObj } from "../../../@types/components";
-import { useClassBinding } from "../../../composables/useClassBinding";
-type Props = {
-  presentation: Presentation;
-  classObject?: OverviewPanelClassObj;
-};
-
-const props = withDefaults(defineProps<Props>(), {
-  classObject: () => {
-    return {
-      container: "",
-      htmlElement: "",
-      noOverviewElement: "",
-    };
-  },
-});
-
-const { presentation } = toRefs(props);
-
-const { classBinding } = useClassBinding();
-
-// computed
-const sessionOverview = computed((): string | null => {
-  return presentation.value.description ? presentation.value.description : null;
-});
-</script>
-
-<template>
-  <div
-    :class="
-      classBinding(
-        classObject,
-        'container',
-        'text-grey-800 px-2 py-4 text-base leading-normal font-light'
-      )
-    "
-  >
-    <span
-      v-if="sessionOverview"
-      :class="classBinding(classObject, 'htmlElement', '')"
-      v-html="sessionOverview"
-    ></span>
-    <p v-else :class="classBinding(classObject, 'noOverviewElement', '')">
-      There is no overview for this presentation.
-    </p>
-  </div>
-</template>
-
-<style scoped></style>
+<script lang="ts" setup>
+import { toRefs, computed } from "vue";
+import { Presentation } from "../../../models/conference";
+import { OverviewPanelClassObj } from "../../../@types/components";
+import { useClassBinding } from "../../../composables/useClassBinding";
+type Props = {
+  presentation: Presentation;
+  classObject?: OverviewPanelClassObj;
+};
+
+const props = withDefaults(defineProps<Props>(), {
+  classObject: () => {
+    return {
+      container: "",
+      htmlElement: "",
+      noOverviewElement: "",
+    };
+  },
+});
+
+const { presentation } = toRefs(props);
+
+const { classBinding } = useClassBinding();
+
+// computed
+const sessionOverview = computed((): string | null => {
+  return presentation.value.description ? presentation.value.description : null;
+});
+</script>
+
+<template>
+  <div
+    :class="
+      classBinding(
+        classObject,
+        'container',
+        'text-grey-800 px-2 py-4 text-base leading-normal font-light'
+      )
+    "
+  >
+    <span
+      v-if="sessionOverview"
+      :class="classBinding(classObject, 'htmlElement', '')"
+      v-html="sessionOverview"
+    ></span>
+    <p v-else :class="classBinding(classObject, 'noOverviewElement', '')">
+      There is no overview for this presentation.
+    </p>
+  </div>
+</template>
+
+<style scoped></style>

package/dist/runtime/components/media/components/PresentersPanel.vue

@@ -1,57 +1,57 @@
-<template>
-  <span v-if="presenterLevelArray['presenters_all'].presenters.length > 0">
-    <presenters-detail
-        :presenters-by-level="presenterLevelArray"
-        :pres-format="layoutFormat"
-        :item-width="itemWidth"
-        :show-levels="false"
-        :is-compact="isCompact"
-    ></presenters-detail>
-  </span>
-  <div v-else class="text-grey-800 px-2 py-4">
-      <p class="text-base leading-normal font-light">There are no presenters associated with this presentation.</p>
-  </div>
-</template>
-
+<template>
+  <span v-if="presenterLevelArray['presenters_all'].presenters.length > 0">
+    <presenters-detail
+        :presenters-by-level="presenterLevelArray"
+        :pres-format="layoutFormat"
+        :item-width="itemWidth"
+        :show-levels="false"
+        :is-compact="isCompact"
+    ></presenters-detail>
+  </span>
+  <div v-else class="text-grey-800 px-2 py-4">
+      <p class="text-base leading-normal font-light">There are no presenters associated with this presentation.</p>
+  </div>
+</template>
+
 <script>
-import PresentersDetail from '@/components/presenters/PresentersDetail';
-
-export default {
-  props: {
-    itemWidth: {
-      type: String,
-      default: '120'
-    },
-    layoutFormat: {
-      type: String,
-      default: 'PresenterItemGrid'
-    },
-    isCompact: {
-      default: true,
-      type: Boolean
-    }
-  },
-  components: {
-    PresentersDetail
-  },
-  provide() {
-    return {
-      itemWidth: this.itemWidth,
-      imageStyle: this.imageStyle,
-    };
-  },
-  computed: {
-    presenterLevelArray() {
-      let returnArray = [];
-      returnArray['presenters_all'] = { 'presenters': _.sortBy(this.$parent.currentPresentation.presenters, function (presenter) {
-        return presenter.pivot.order;
-      }) };
-      return returnArray;
-    }
-  }
+import PresentersDetail from '@/components/presenters/PresentersDetail';
+
+export default {
+  props: {
+    itemWidth: {
+      type: String,
+      default: '120'
+    },
+    layoutFormat: {
+      type: String,
+      default: 'PresenterItemGrid'
+    },
+    isCompact: {
+      default: true,
+      type: Boolean
+    }
+  },
+  components: {
+    PresentersDetail
+  },
+  provide() {
+    return {
+      itemWidth: this.itemWidth,
+      imageStyle: this.imageStyle,
+    };
+  },
+  computed: {
+    presenterLevelArray() {
+      let returnArray = [];
+      returnArray['presenters_all'] = { 'presenters': _.sortBy(this.$parent.currentPresentation.presenters, function (presenter) {
+        return presenter.pivot.order;
+      }) };
+      return returnArray;
+    }
+  }
 };
-</script>
-
+</script>
+
 <style scoped>
 .presenter-grid {
   display: grid;

package/dist/runtime/components/media/components/SessionReporting.vue

@@ -1,96 +1,102 @@
-<script>
-import Cookies from "universal-cookie";
-
-const cookies = new Cookies();
-
-export default {
-  render() {},
-  data() {
-    return {
-      sessionCookieName: "session-cookie",
-      sessionId: null,
-      sessionLoopId: null,
-      sessionLoopIntervalMinutes: 5,
-      cookieExpireMinutes: 20
-    };
-  },
-  props: {
-    loggableType: {
-      type: String,
-      default: "App\\Presentation"
-    },
-    loggableId: {
-      type: Number
-    }
-  },
-  watch: {
-    loggableId(_newId, _oldId) {
-      this.updateSession();
-    }
-  },
-  methods: {
-    getSessionIdFromCookie() {
-      return (this.sessionId = cookies.get(this.sessionCookieName));
-    },
-    initSessionLoop() {
-      this.sessionLoop();
-      this.sessionLoopId = setInterval(
-        this.sessionLoop,
-        parseInt(this.sessionLoopIntervalMinutes * 60 * 1000)
-      );
-    },
-    sessionLoop() {
-      if (this.getSessionIdFromCookie()) {
-        this.updateSession();
-      } else {
-        this.initSession();
-      }
-    },
-    updateSessionCookie() {
-      let expireDate = new Date(
-        new Date().getTime() + this.cookieExpireMinutes * 60 * 1000
-      );
-
-      cookies.set(this.sessionCookieName, this.sessionId, {
-        expires: expireDate
-      });
-    },
-    initSession() {
-      this.$axios.$post("session-logs", {}).then(response => {
-        this.sessionId = response;
-        this.updateSession();
-      });
-    },
-    updateSession() {
-      if (!this.sessionId || !this.loggableType || !this.loggableId) {
-        return false;
-      }
-
-      this.updateSessionCookie();
-
-      let inputs = {
-        _method: "PATCH",
-        resource_type: this.loggableType,
-        resource_id: this.loggableId
-      };
-
-      this.$axios
-        .$post(`session-logs/${this.sessionId}`, inputs)
-        .then(response => {
-          console.log("updateSession", response);
-        })
-        .catch(error => {
-          console.log("Error updating session-log", error);
-        });
-    }
-  },
-  mounted() {
-    console.log("SessionReporting component mounted");
-    this.initSessionLoop();
-  },
-  beforeRouteLeave(to, from, next) {
-    clearInterval(this.sessionLoopId);
-    next();
-  }
+<script lang="ts" setup>
+import { toRefs, watch, onMounted } from "vue";
+import { onBeforeRouteLeave } from "vue-router";
+import { useApi } from "../../../composables/useApi";
+import { useCookie } from "#app";
+// data
+const sessionLoopIntervalMinutes = 5;
+const cookieExpireMinutes = 20;
+let cookie = useCookie("session-cookie");
+let sessionId: any = null;
+let sessionLoopId: any = null;
+
+type Props = {
+  loggableType?: string;
+  loggableId: number | undefined;
 };
-</script>
+
+const props = withDefaults(defineProps<Props>(), {
+  loggableType: "App\\Presentation",
+});
+
+const { loggableType, loggableId } = toRefs(props);
+
+// methods
+const updateSessionCookie = () => {
+  const expireDate = new Date(
+    new Date().getTime() + cookieExpireMinutes * 60 * 1000
+  );
+  cookie = useCookie("session-cookie", {
+    expires: expireDate,
+  });
+  cookie.value = sessionId;
+};
+
+const updateSession = () => {
+  if (!sessionId || !loggableType.value || !loggableId.value) {
+    return false;
+  }
+
+  updateSessionCookie();
+
+  const inputs = {
+    method: "PATCH",
+    resource_type: loggableType,
+    resource_id: loggableId,
+  };
+  const url = `session-logs/${sessionId}`;
+  const request = useApi();
+  request(url, inputs)
+    .then((response) => {
+      console.log("updateSession", response);
+    })
+    .catch((error) => {
+      console.log("Error updating session-log", error);
+    });
+};
+
+const initSession = () => {
+  const url = "session-logs";
+  const request = useApi();
+  request(url, { method: "POST" }).then((response) => {
+    sessionId = response;
+    console.log("initSession", response);
+    updateSession();
+  });
+};
+
+const getSessionIdFromCookie = () => {
+  return (sessionId = cookie.value);
+};
+
+const sessionLoop = () => {
+  if (getSessionIdFromCookie()) {
+    updateSession();
+  } else {
+    initSession();
+  }
+};
+
+const initSessionLoop = () => {
+  sessionLoop();
+  sessionLoopId = setInterval(
+    sessionLoop,
+    sessionLoopIntervalMinutes * 60 * 1000
+  );
+};
+
+// watchers
+watch(loggableId, (_newId: number, _oldId: number) => {
+  updateSession();
+});
+
+// mounted
+onMounted(() => {
+  console.log("SessionReporting component mounted");
+  initSessionLoop();
+});
+
+onBeforeRouteLeave(() => {
+  clearInterval(sessionLoopId);
+});
+</script>