.js-sourcesauce
  - has_sources = Enum.any?(@image.sources)
  = form_for @changeset, ~p"/images/#{@image}/sources", [method: "put", class: "hidden", id: "source-form", data: [remote: "true"]], fn f ->
    = if can?(@conn, :edit_metadata, @image) and !@conn.assigns.current_ban do
      = if @changeset.action do
        .alert.alert-danger
          p Oops, something went wrong! Please check the errors below.

      p
        'The page(s) you found this image on. Images may have a maximum of
        span.js-max-source-count> 10
        ' source URLs. Leave any sources you don't want to use blank.

      = inputs_for f, :sources, [as: "image[old_sources]", skip_hidden: true], fn fs ->
        = hidden_input fs, :source
      = inputs_for f, :sources, [skip_hidden: true], fn fs ->
        .field.js-image-source.field--inline.flex--no-wrap.flex--centered
          = text_input fs, :source, class: "input flex__grow js-source-url", placeholder: "Source URL"
          = error_tag fs, :source

          label.input--separate-left.flex__fixed.flex--centered
            a.js-source-remove href="#"
              i.fa.fa-trash>
              ' Delete

      .field
        button.button.js-image-add-source type="button"
          i.fa.fa-plus>
          ' Add source
        = submit "Save sources", class: "button button--separate-left"
        button.button.button--separate-left type="reset" data-click-hide="#source-form" data-click-show="#image-source"
          ' Cancel

      = render PhilomenaWeb.CaptchaView, "_captcha.html", name: "source", conn: @conn

    - else
      p
        ' You can't edit the source on this image.

  .block#image-source
    .block__header.flex
      span.block__header__title
        i.fas.fa-link>
        = if !has_sources || length(@image.sources) == 1 do
          ' Source
        - else
          ' Sources

      .block__header__buttons
        a.button#edit-source data-click-focus=".js-image-source" data-click-hide="#image-source" data-click-show="#source-form" title="Edit source" accessKey="s"
          i.fas.fa-edit
          = if has_sources do
            ' Add/Edit
          - else
            ' Add
        = if @source_change_count > 0 do
          a.button href=~p"/images/#{@image}/source_changes" title="Source history"
            i.fa.fa-history>
            spanspan.hide-mobile> History
            | (
            = @source_change_count
            | )
        = if can?(@conn, :hide, @image) and not hide_staff_tools?(@conn) do
          = form_for @changeset, ~p"/images/#{@image}/source_history", [method: "delete"], fn _f ->
            a.button.button--warning type="submit" data-confirm="Are you really, really sure?" title="Wipe sources"
              i.fas.fa-eraser>
              ' Wipe
    .block__content.flex.flex--wrap.flex--column
      .image-sources
        = if has_sources do
          - [first_source | sources] = @image.sources
          .image-source__icon
            i class=image_source_icon(first_source.source)
          .image-source__link
            a.js-source-link href=first_source.source
              strong = first_source.source
          = for source <- sources do
            .image-source__icon
              i class=image_source_icon(source.source)
            .image-source__link
              a href=source.source
                strong = source.source
        - else
          .image-source__icon
            i.fa.fa-unlink
          .image-source__link
            em> not provided yet