import type { VideoPlayer } from "../runtime/media"
import { Element, type AnimateStyle, type AppearStyle, type BaseStyle, type DisappearStyle, type DrawableStyle, type ElementStyle, type OnLayoutCallback, type Style, type StyleFn } from "./UINode"

export type UIVideoStyle = ElementStyle & DrawableStyle & { objectFit?: "cover" | "contain" | "fill" }

export interface UIVideo {
  readonly type: "video",
  player: VideoPlayer
  style: Style<this, UIVideoStyle>
  animateTo: AnimateStyle<this, DrawableStyle & BaseStyle>
  animateFrom: AnimateStyle<this, DrawableStyle & BaseStyle>

  onLayout(onLayout: OnLayoutCallback): this

  setClass(name: string, enabled: boolean): this
  toggleClass(name: string): this
  hasClass(name: string): boolean
  bindClass(name: string, fn: () => boolean): this
}

class VideoElement extends Element<"video"> {
  private _playerId: number
  private _player: VideoPlayer
  constructor(style: any, player: VideoPlayer) {
    super("video", style)
    this._player = player
    this._playerId = (player as any)._id
  }

  get player() {
    return this._player
  }
}

export function UIVideo(player: VideoPlayer): UIVideo
export function UIVideo(style: UIVideoStyle, player: VideoPlayer): UIVideo
export function UIVideo(...args: [VideoPlayer] | [UIVideoStyle, VideoPlayer]): UIVideo {
    if (args.length === 1) {
    return new VideoElement({}, args[0])
  } else {
    return new VideoElement(args[0], args[1])
  }
}