{{define "subscription_action"}}
<div class="subscription-action">
  {{if .Subscribed}}
    <span role="status">登録済み</span>
  {{else if .Choosing}}
    {{if .ErrorText}}<p role="alert">{{.ErrorText}}</p>{{end}}
    <form action="/subscriptions/register" method="post" hx-post="/subscriptions/register" hx-target="closest .subscription-action" hx-swap="outerHTML">
      <input type="hidden" name="episode_id" value="{{.ID}}">
      <input type="hidden" name="genre" value="{{.Genre}}">
      <label><input type="checkbox" name="download_existing" value="1" {{if .DownloadExisting}}checked{{end}}>公開中の回もダウンロードする</label>
      <button type="submit">登録</button>
    </form>
  {{else}}
    <button type="button" hx-get="/subscriptions/choice?genre={{.Genre}}&amp;episode_id={{.ID}}" hx-target="closest .subscription-action" hx-swap="outerHTML">番組を登録</button>
  {{end}}
</div>
{{end}}

{{define "subscriptions_page"}}
<h1>登録番組</h1>
<section class="subscription-url-entry">
  <h2>番組URLから登録</h2>
  <form action="/subscriptions/from-url/confirm" method="post" hx-post="/subscriptions/from-url/confirm" hx-target="#subscription-url-result" hx-swap="outerHTML">
    <label>番組URL <input id="subscription-url-input" type="url" name="series_url" placeholder="https://tver.jp/series/…" required></label>
    <button type="submit">確認</button>
  </form>
  <div id="subscription-url-result"></div>
</section>
{{template "subscriptions_list" .}}
{{end}}

{{define "subscription_url_result"}}
<div id="subscription-url-result">
  {{if .ErrorText}}
    <p role="alert">{{.ErrorText}}</p>
  {{else if .SeriesID}}
    <h3>{{.Title}}</h3>
    <p>番組ID: {{.SeriesID}}</p>
    {{if eq .EpisodeCount 0}}<p>公開中の回はありません</p>{{else}}<p>公開中の回数: {{.EpisodeCount}}件</p>{{end}}
    {{if .Subscribed}}
      <p role="status">登録済み</p>
      <button type="button" hx-get="/subscriptions/from-url/cancel" hx-target="#subscription-url-result" hx-swap="outerHTML">キャンセル</button>
    {{else}}
      <form action="/subscriptions/from-url/register" method="post" hx-post="/subscriptions/from-url/register" hx-target="#subscription-url-result" hx-swap="outerHTML">
        <input type="hidden" name="series_id" value="{{.SeriesID}}">
        <label><input type="checkbox" name="download_existing" value="1">公開中の回もダウンロードする</label>
        <button type="submit">登録</button>
        <button type="button" hx-get="/subscriptions/from-url/cancel" hx-target="#subscription-url-result" hx-swap="outerHTML">キャンセル</button>
      </form>
    {{end}}
  {{end}}
</div>
{{end}}

{{define "subscription_url_registered"}}
<div id="subscription-url-result"><p role="status">登録済み</p></div>
<input id="subscription-url-input" type="url" name="series_url" placeholder="https://tver.jp/series/…" required hx-swap-oob="outerHTML">
{{template "subscriptions_list" .Subscriptions}}
{{end}}

{{define "subscriptions_list"}}
<div id="subscriptions-list" {{if .OutOfBand}}hx-swap-oob="outerHTML"{{end}}>
  {{range .Items}}
    <article class="subscription-item">
      <h2>{{.Title}}</h2>
      <p>登録日時: {{.CreatedAtText}}／最終確認: {{.LastCheckedText}}／状態: {{if .Enabled}}有効{{else}}一時停止{{end}}／関連ジョブ: {{.Jobs}}件</p>
      {{if .CheckErrorText}}
        <details class="error"><summary>最後の確認エラー（{{.CheckErrorAtText}}）</summary><p>{{.CheckErrorText}}</p></details>
      {{end}}
      {{if .Enabled}}
        <form action="/subscriptions/{{.ID}}/pause" method="post" hx-post="/subscriptions/{{.ID}}/pause" hx-target="#subscriptions-list" hx-swap="outerHTML"><button type="submit">一時停止</button></form>
      {{else}}
        <form action="/subscriptions/{{.ID}}/resume" method="post" hx-post="/subscriptions/{{.ID}}/resume" hx-target="#subscriptions-list" hx-swap="outerHTML"><button type="submit">再開</button></form>
      {{end}}
      <form action="/subscriptions/{{.ID}}/delete" method="post" hx-post="/subscriptions/{{.ID}}/delete" hx-target="#subscriptions-list" hx-swap="outerHTML" hx-confirm="番組の登録を解除しますか？"><button type="submit">解除</button></form>
    </article>
  {{else}}
    <p>登録番組はありません</p>
  {{end}}
</div>
{{end}}