@maas/vue-equipment 0.24.0 → 0.24.1

package/dist/nuxt/module.json

@@ -1,5 +1,5 @@
 {
   "name": "@maas/vue-equipment/nuxt",
   "configKey": "vueEquipment",
-  "version": "0.23.2"
+  "version": "0.24.0"
 }

package/dist/plugins/MagicPlayer/src/components/MagicAudioPlayerControls.vue

@@ -80,10 +80,6 @@ const { play, pause, mute, unmute, touched, mouseEntered } = usePlayerAudioApi({
   id: props.id,
 })
 
-const { formattedCurrentTime } = usePlayerMediaApi({
-  id: props.id,
-})
-
 usePlayerControlsApi({
   id: props.id,
   barRef: barRef,

package/dist/plugins/MagicPlayer/src/components/MagicPlayerCurrentTime.vue

@@ -14,41 +14,45 @@ interface Props {
 
 const props = defineProps<Props>()
 
-const { formattedCurrentTime } = usePlayerMediaApi({
+const { currentTime } = usePlayerMediaApi({
   id: props.id,
 })
 
-const hours = computed(() => {
-  return formattedCurrentTime.value.hours
-})
+function toNumber(value: string | number): number {
+  return typeof value === 'string' ? parseFloat(value) : Number(value)
+}
 
-const minutes = computed(() => {
-  return formattedCurrentTime.value.minutes || '0'
-})
+const formatTime = function (seconds: number, guide: number) {
+  seconds = seconds < 0 ? 0 : seconds
+  let s: string | number = Math.floor(seconds % 60)
+  let m: string | number = Math.floor((seconds / 60) % 60)
+  let h: string | number = Math.floor(seconds / 3600)
+  const gm = Math.floor((guide / 60) % 60)
+  const gh = Math.floor(guide / 3600)
+
+  // handle invalid times
+  if (isNaN(seconds) || seconds === Infinity) {
+    // '-' is false for all relational operators (e.g. <, >=) so this setting
+    // will add the minimum number of fields specified by the guide
+    h = m = s = '-'
+  }
 
-const seconds = computed(() => {
-  return formattedCurrentTime.value.seconds
-})
+  // Check if we need to show hours
+  h = toNumber(h) > 0 || gh > 0 ? h + ':' : ''
 
-const stringifiedTime = computed(() => {
-  let time = hours.value ? `${hours.value}:` : ''
+  // If hours are showing, we may need to add a leading zero.
+  // Always show at least one digit of minutes.
+  m = ((h || gm >= 10) && toNumber(m) < 10 ? '0' + m : m) + ':'
 
-  if (minutes.value.toString().length === 1) {
-    time += `0${minutes.value}`
-  } else {
-    time += `${minutes.value}`
-  }
+  // Check if leading zero is need for seconds
+  s = toNumber(s) < 10 ? '0' + s : s
 
-  if (seconds.value.toString().length === 1) {
-    time += `:0${seconds.value}`
-  } else {
-    time += `:${seconds.value}`
-  }
+  return h + m + s
+}
 
-  return time
-})
+const stringifiedTime = computed(() => formatTime(currentTime.value, 60))
 </script>
 
 <style>
-:root{--magic-player-current-time-font-size:0.875rem;--magic-player-current-time-color:inherit;--magic-player-current-time-width:3.875rem;--magic-player-current-time-justify-content:flex-start}.magic-player-current-time{align-items:center;color:var(--magic-player-current-time-color);display:flex;font-size:var(--magic-player-current-time-font-size);height:100%;justify-content:var(--magic-player-current-time-justify-content);width:var(--magic-player-current-time-width)}
+:root{--magic-player-current-time-font-size:0.875rem;--magic-player-current-time-color:inherit;--magic-player-current-time-width:3.25rem;--magic-player-current-time-justify-content:flex-start}.magic-player-current-time{align-items:center;color:var(--magic-player-current-time-color);display:flex;font-size:var(--magic-player-current-time-font-size);height:100%;justify-content:var(--magic-player-current-time-justify-content);width:var(--magic-player-current-time-width)}
 </style>

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerMediaApi.d.ts

@@ -5,11 +5,6 @@ export type UsePlayerMediaApiArgs = {
 };
 export declare function usePlayerMediaApi(args: UsePlayerMediaApiArgs): {
     currentTime: import("vue").Ref<number>;
-    formattedCurrentTime: import("vue").ComputedRef<{
-        hours: number;
-        minutes: number;
-        seconds: number;
-    }>;
     duration: import("vue").Ref<number>;
     seeking: import("vue").Ref<boolean>;
     volume: import("vue").Ref<number>;

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerMediaApi.mjs

@@ -1,4 +1,4 @@
-import { ref, computed, watch, unref, toValue } from "vue";
+import { ref, watch, unref, toValue } from "vue";
 import { useEventListener, watchIgnorable } from "@vueuse/core";
 import { usePlayerStateEmitter } from "./usePlayerStateEmitter.mjs";
 export function usePlayerMediaApi(args) {
@@ -14,13 +14,6 @@ export function usePlayerMediaApi(args) {
   const buffered = ref([]);
   const muted = ref(false);
   const { mediaRef } = args;
-  const formattedCurrentTime = computed(() => formatTime(currentTime.value));
-  function formatTime(currentTime2) {
-    const hours = Math.floor(currentTime2 / 3600);
-    const minutes = Math.floor(currentTime2 % 3600 / 60);
-    const seconds = Math.floor(currentTime2 % 60);
-    return { hours, minutes, seconds };
-  }
   function timeRangeToArray(timeRanges) {
     let ranges = [];
     for (let i = 0; i < timeRanges.length; ++i)
@@ -256,7 +249,6 @@ export function usePlayerMediaApi(args) {
   });
   return {
     currentTime,
-    formattedCurrentTime,
     duration,
     seeking,
     volume,

package/dist/plugins/MagicPlayer/src/composables/usePlayerApi.d.ts

@@ -5,11 +5,6 @@ type usePlayerApiArgs = {
 export declare function usePlayerApi(args: usePlayerApiArgs): {
     mediaApi: {
         currentTime: import("vue").Ref<number>;
-        formattedCurrentTime: import("vue").ComputedRef<{
-            hours: number;
-            minutes: number;
-            seconds: number;
-        }>;
         duration: import("vue").Ref<number>;
         seeking: import("vue").Ref<boolean>;
         volume: import("vue").Ref<number>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment",
   "description": "A magic collection of Vue composables, plugins, components and directives",
-  "version": "0.24.0",
+  "version": "0.24.1",
   "author": "Robin Scholz <https://github.com/robinscholz>, Christoph Jeworutzki <https://github.com/ChristophJeworutzki>",
   "devDependencies": {
     "@antfu/ni": "^0.21.12",