philomena/lib/philomena_web/templates/search/reverse/index.html.slime

59 lines
2.1 KiB
Text

h1 Reverse Search
= form_for @changeset, ~p"/search/reverse", [multipart: true, as: :image], fn f ->
.walloftext
p
' Advanced image similarity search. Finds uploaded images similar to the one
' provided based on perceptual features and uses the median frame of
' animations.
.image-other
#js-image-upload-previews
p Upload a file from your computer, or provide a link to the page containing the image and click Fetch.
.field
= file_input f, :image, class: "input js-scraper"
= error_tag f, :uploaded_image
= error_tag f, :image_width
= error_tag f, :image_height
= error_tag f, :image_mime_type
.field.field--inline
= url_input f, :url, name: "url", class: "input input--wide js-scraper", placeholder: "Link a deviantART page, a Tumblr post, or the image directly"
button.button.button--separate-left#js-scraper-preview(type="button" title="Fetch the image at the specified URL" data-disable-with="Fetch" disabled)
' Fetch
.field-error-js.hidden.js-scraper
= hidden_input f, :limit, value: @conn.assigns.image_pagination.page_size
= error_tag f, :limit
.field
= submit "Reverse Search", class: "button"
= cond do
- is_nil(@images) ->
/ Don't render anything.
- Enum.any?(@images) ->
.block#imagelist-container
section.block__header.page__header.flex
span.block__header__title.page__title.hide-mobile
' Search by uploaded image
.block__content.js-resizable-media-container
= for image <- @images do
= render PhilomenaWeb.ImageView, "_image_box.html", image: image, link: ~p"/images/#{image}", size: :thumb, conn: @conn
.block__header.block__header--light.page__header.flex
span.block__header__title.page__info
= render PhilomenaWeb.PaginationView, "_pagination_info.html", page: @images
.flex__right.page__options
a href="/settings/edit" title="Display Settings"
i.fa.fa-cog
span.hide-mobile.hide-limited-desktop<>
' Display Settings
- true ->
p
' No images found!