@realsee/vreo 0.2.0-alpha.9 → 1.0.0-alpha.2

package/resources/shared-utils/getMediaInfo.ts

@@ -0,0 +1,52 @@
+import getFileExpandedName from './getFileExpandedName'
+
+export default function getMediaInfo(fileUrl: string): Promise<{
+  duration?: number | undefined
+  type?: 'video' | 'audio' | 'image' | 'unknown' | undefined
+  error?: string | undefined
+}> {
+  const type = getMediaType(fileUrl)
+  if (!type) return Promise.resolve({ error: '未知的文件类型: ' + fileUrl })
+  const mediaElement = (() => {
+    if (type === 'video') return document.createElement('video')
+    if (type === 'audio') return document.createElement('audio')
+  })()
+  if (!mediaElement) return Promise.resolve({ error: 'Unknown media element' })
+  mediaElement.src = fileUrl
+  return new Promise<{ duration?: number; type?: 'video' | 'audio' | 'image' | 'unknown'; error?: string }>((resolve) => {
+    mediaElement.onerror = () => resolve({ error: 'onerror' })
+    mediaElement.onloadedmetadata = () => {
+      resolve({ duration: mediaElement.duration * 1000, type }) // s => ms
+    }
+  })
+}
+
+export function getMediaType(url?: string) {
+  const fileExpandedName = getFileExpandedName(url)
+  const type = getMediaTypeByExpandedName(fileExpandedName)
+  return type
+}
+
+export function getMediaTypeByExpandedName(fileExpandedName?: string | null) {
+  if (!fileExpandedName) return 'unknown'
+  if (/jpg|jpeg|png$/.test(fileExpandedName)) return 'image'
+  if (/mp3|wav$/.test(fileExpandedName)) return 'audio'
+  if (/avi|wmv|mpeg|mp4|m4v|mov|asf|flv|f4v|rmvb|rm|3gp|vob$/.test(fileExpandedName)) return 'video'
+  return 'unknown'
+}
+
+export function getMediaTypeByUrl(fileUrl?: string | null) {
+  if (!fileUrl) return
+  const fileExpandedName = getFileExpandedName(fileUrl)
+  return getMediaTypeByExpandedName(fileExpandedName)
+}
+
+export function getFileName(fileUrl?: string) {
+  if (!fileUrl) return ''
+  const index1 = fileUrl.lastIndexOf('/')
+  const index2 = fileUrl.lastIndexOf('\\')
+  const index3 = fileUrl.lastIndexOf('\\\\')
+  const index = Math.max(index1, index2, index3)
+  const ext = fileUrl.substring(index + 1)
+  return ext
+}

package/resources/shared-utils/setElementDataset.ts

@@ -0,0 +1,18 @@
+export default function setElementDataset(element: any, dataset: Record<string, string | number>) {
+  if (element) {
+    Object.keys(dataset).forEach((key) => {
+      
+      const value = dataset[key].toString()
+
+      if (element instanceof Element) {
+        element.setAttribute(`data-${key}`, value)
+      } else if (element instanceof Document) {
+        element.documentElement.setAttribute(`data-${key}`, value)
+      } else if (element instanceof HTMLElement) {
+          element.dataset[key] = value
+      } else {
+          (element as any).setAttribute(`data-${key}`, value)
+      }
+    })
+}
+}

package/resources/typings/VreoUnit.ts

@@ -1,4 +1,4 @@
-import { Mode, MovePanoOptions, Pose } from '@realsee/five'
+import { Mode, Pose } from '@realsee/five'
 import { CameraMovementEffect, Rotation } from '../fivePlugins/CameraMovementPlugin/typings'
 
 export enum VreoKeyframeEnum {
@@ -81,6 +81,10 @@ export interface VreoVideo {
   start: number
   end: number
   url: string
+  avatar?: {
+    url: string
+    force?: true
+  }
 }
 
 /**
@@ -109,6 +113,8 @@ export type VreoKeyframeEvent = { [key in VreoKeyframeEnum]: (keyframe: VreoKeyf
   playing: () => void
   // 未知的 剧本帧类型
   unknownKeyframeType: (keyframe: Record<string, any>) => void
+  // 一次播放完成（试用，只抛事件不做任何额外的逻辑处理）
+  ended: () => void
 }
 
 /**
@@ -164,9 +170,13 @@ export interface Vertex {
 }
 
 /**
- * 四个顶点元组
+ * 矩形顶点
  */
 export type QuadrangleVertexs = [Vertex, Vertex, Vertex, Vertex]
+/**
+ * 顶点数组
+ */
+export type Vertexs = Vertex[]
 
 /**
  * 视频广告
@@ -183,7 +193,18 @@ export type ModelVideoData = {
   /**
    * 视频映射在模型中的顶点
    */
-  vertexs: QuadrangleVertexs
+  vertexs: QuadrangleVertexs | Vertexs
+  matrixWorld?: number[]
+}
+
+/**
+ * 四元数
+ */
+export type Quaternion = {
+  x: number,
+  y: number,
+  z: number,
+  w: number
 }
 
 /**
@@ -192,6 +213,8 @@ export type ModelVideoData = {
 export type PanoTextLabelData = {
   text: string
   vertex: Vertex
+  normal?: Vertex
+  quaternion?: Quaternion
   fontSize?: number
 }
 
@@ -203,8 +226,23 @@ export enum PanoTagEnum {
   Image = 'Image',
 }
 
+/**
+ * 标签样式种类
+ */
+export enum PanoTagStyleEnum {
+  /**
+   * 生长动画：默认值
+   */
+  Growth = 'Growth',
+  /**
+   * 展开动画
+   */
+  Expand = 'Expand',
+}
+
 export type PanoTagData = {
   type: PanoTagEnum
+  style: PanoTagStyleEnum
   text: string
   vertex: Vertex
   imgUrl?: string

package/stylesheets/custom/SpatialScenePanel.css

@@ -46,7 +46,8 @@
   top: 0;
   left: 0;
   pointer-events: none;
-  user-select: none
+  -webkit-user-select: none;
+  user-select: none;
 }
 
 .SpatialScenePanel {