elixir:
  scope = scope(@conn)
  image_url = fn image, hit -> ~p"/images/#{image}?#{Keyword.put(scope, :sort, hit["sort"])}" end
  route = fn p -> ~p"/galleries/#{@gallery}?#{p}" end
  pagination = render PhilomenaWeb.PaginationView, "_pagination.html", page: @images, route: route, params: scope
  info = render PhilomenaWeb.PaginationView, "_pagination_info.html", page: @images

#sortable class=sortable_classes(@conn)
  .block#imagelist-container
    section.block__header.flex.page__header
      span.block__header__title.page__title
        span
          ' Viewing gallery
          strong>
            = @gallery.title

      .page__pagination = pagination

      .flex__right.page__options
        = render PhilomenaWeb.ImageView, "_random_button.html", conn: @conn, params: scope

        a href=~p"/galleries/#{@gallery}/reports/new"
          i.fa.fa-exclamation-triangle>
          span.hide-mobile Report

        = if can?(@conn, :edit, @gallery) do
          a href=~p"/galleries/#{@gallery}/edit"
            i.fas.fa-edit>
            span.hide-mobile Edit

        = if can?(@conn, :edit, @gallery) do
          a.rearrange-button.js-rearrange href="#" data-click-hide=".js-rearrange" data-click-show=".js-save,#gallery-rearrange-info"
            i.fa.fa-sort>
            ' Rearrange

          a.rearrange-button.js-save.hidden href="#" data-click-hide=".js-save,#gallery-rearrange-info" data-click-show=".js-rearrange" data-reorder-path=~p"/galleries/#{@gallery}/order"
            i.fa.fa-check>
            ' Save

          a href=~p"/galleries/#{@gallery}" data-method="delete" data-confirm="Are you really, really sure?"
            i.fa.fa-trash>
            span.hide-mobile Delete

        = if show_subscription_link?(@gallery.creator, @conn.assigns.current_user) do
          = render PhilomenaWeb.Gallery.SubscriptionView, "_subscription.html", watching: @watching, gallery: @gallery, conn: @conn

    .block__header.block__header--light.block__header--sub
      span.block__header__title A gallery by

      => link @gallery.creator.name, to: ~p"/profiles/#{@gallery.creator}"
      ' with
      => @gallery.image_count
      = pluralize("image", "images", @gallery.image_count)
      span.hide-mobile-t
        ' , last updated
        = pretty_time(@gallery.updated_at)

    .block__content.flex.js-imagelist-info
      .flex__fixed.thumb-tiny-container.spacing-right
        = render PhilomenaWeb.ImageView, "_image_container.html", image: @gallery.thumbnail, size: :thumb_tiny, conn: @conn

      .flex__grow
        = if @gallery.spoiler_warning not in [nil, ""] do
          strong> Warning:
          = @gallery.spoiler_warning

        = if @gallery.description not in [nil, ""] do
          p = @gallery.description

    .block__content.hidden#gallery-rearrange-info
      .block.block--fixed.block--primary
        | Click the image and drag.
        br
        strong Note that you may have to wait a couple of seconds before the order is applied.

    .block__content.js-resizable-media-container
      = for {image, hit} <- @gallery_images do
        = render PhilomenaWeb.ImageView, "_image_box.html", image: image, link: image_url.(image, hit), size: :thumb, conn: @conn

    .block__header.block__header--light.flex.page__header
      .page__pagination = pagination

      span.block__header__title.page__info
        = info