Method constructor

packages/vidstack/src/player/player.tsx:94–145

(instance: ComponentInstance<PlayerAPI>)

  }

  constructor(instance: ComponentInstance<PlayerAPI>) {
    super(instance);

    this._initStore();
    new MediaStoreSync(instance);

    const context = {
      player: null,
      scope: getScope(),
      qualities: new VideoQualityList(),
      audioTracks: new AudioTrackList(),
      $provider: signal<MediaProvider | null>(null),
      $props: this.$props,
      $store: this.$store as MediaStore,
    } as MediaContext;

    if (__DEV__) {
      const logPrinter = new LogPrinter(instance);
      effect(() => {
        logPrinter.logLevel = this.$props.logLevel();
      });
    }

    if (__DEV__) context.logger = new Logger();
    context.remote = new MediaRemoteControl(__DEV__ ? context.logger : undefined);
    context.$iosControls = computed(this._isIOSControls.bind(this));
    context.textTracks = new TextTrackList();
    context.textTracks[TEXT_TRACK_CROSSORIGIN] = this.$props.crossorigin;
    context.textRenderers = new TextRenderers(context);
    context.ariaKeys = {};

    this._media = context;
    provideContext(mediaContext, context);

    this.orientation = new ScreenOrientationController(instance);

    new FocusVisibleController(instance);
    new MediaKeyboardController(instance, context);
    new ThumbnailsLoader(instance);
    if (__DEV__) new MediaEventsLogger(instance, context);

    const request = new MediaRequestContext();
    this._stateMgr = new MediaStateManager(instance, request, context);
    this._requestMgr = new MediaRequestManager(instance, this._stateMgr, request, context);

    context.delegate = new MediaPlayerDelegate(
      this._stateMgr._handle.bind(this._stateMgr),
      context,
    );

    new MediaLoadController(instance, this.startLoading.bind(this));
  }

  protected override onAttach(el: HTMLElement): void {
    el.setAttribute('tabindex', '0');