EpisodeSelector (Выбор серий)

Выбор сезонов и серий в модальном окне или встроенной панели очереди Potok.

Специфичные методы EpisodeSelector

Метод	Аргумент	Описание
isOpen(v)	boolean	Видимость селектора. Значение по умолчанию: false
presentation(v)	"modal" | "panel"	Модальное окно или встроенная панель очереди Potok. Значение по умолчанию: "modal"
activeEpisodeId(v)	string	ID текущей серии для подсветки в панели.
canReorder(v)	boolean	Разрешает перестановку серий перетаскиванием. Значение по умолчанию: false
title(v)	string	Заголовок (название сериала).
subtitle(v)	string	Подзаголовок.
episodes(v)	any[]	Серии текущего сезона. Значение по умолчанию: []
backdropSrc(v)	string	URL фонового изображения.
seasonsLoading(v)	boolean	При true — спиннер загрузки. Значение по умолчанию: false
seasons(v)	any[]	Сезоны для вкладок. Значение по умолчанию: []
onClose(v)	CallbackFunction	Обработчик закрытия.
onPlay(v)	CallbackFunction	Обработчик воспроизведения серии.
onApplyOverride(v)	CallbackFunction	Обработчик переопределения серии.
onStartEditing(v)	CallbackFunction	Обработчик начала редактирования.
onReorder(v)	(episodes: SDKStreamEpisode[]) => void	Получает полный новый порядок серий после перетаскивания.

Базовые методы (наследуются от UIComponent)

Пример использования

// Модальный селектор
const { ui, createState } = PotokSDK;
const state = createState({ open: false });

const mockEp = {
  id: "s01e01",
  season: 1,
  episode: 1,
  rawSeason: 1,
  rawEpisode: 1,
  title: "Зима близко",
  fileName: "Show.S01E01.mkv",
  stillPath: "https://image.tmdb.org/t/p/w500/j5M3P1xMWh1Sohc29N3L9B6c4W0.jpg",
  airDate: "2011-04-17",
  isWatched: false,
  sizeLabel: "1.2 GB",
  audios: [
    { id: "ru", name: "Русский дубляж", url: "http://example.com/s01e01_ru.m3u8" }
  ],
  url: "http://example.com/s01e01.m3u8"
};

function draw() {
  ui.render(
    VStack()
      .child(Button("Выбрать серию").onClick(() => state.open = true))
      .child(
        EpisodeSelector()
          .isOpen(state.open)
          .title("Игра Престолов")
          .subtitle("Выберите серию для просмотра")
          .backdropSrc("https://image.tmdb.org/t/p/original/example.jpg")
          .seasonsLoading(false)
          .seasons([{
            id: 1,
            seasonNumber: 1,
            season_number: 1,
            episodes: [{
              id: 101,
              episodeNumber: 1,
              episode_number: 1,
              name: "Зима близко",
              stillPath: "https://image.tmdb.org/t/p/w500/j5M3P1xMWh1Sohc29N3L9B6c4W0.jpg",
              airDate: "2011-04-17",
              overview: "Описание серии"
            }]
          }])
          .episodes([mockEp])
          .onClose(() => state.open = false)
          .onPlay((ep, audioId) => {
            state.open = false;
            ui.showHUD("success", "Запускаем: " + ep.title + " (" + audioId + ")");
          })
          .onApplyOverride(({ sourceSeason, targetSeason, offset }) => {
            ui.showHUD("info", "Override: " + sourceSeason + " -> " + targetSeason + " (offset " + offset + ")");
          })
          .onStartEditing(() => {
            ui.showHUD("info", "Редактирование сезонов");
          })
      )
  );
}
state.$subscribe(draw); draw();
// Та же очередь, встроенная в layout плагина без модального overlay
ui.render(
  EpisodeSelector()
    .isOpen(true)
    .presentation("panel")
    .activeEpisodeId("s01e01")
    .canReorder(true)
    .episodes([mockEp])
    .onReorder((nextQueue) => {
      console.log("Новый порядок:", nextQueue);
    })
);

Запустить в Sandbox