philomena/lib/philomena_web/templates/search/reverse/index.html.heex
2024-06-01 23:50:36 -04:00

98 lines
3 KiB
Text

<h1>
Reverse Search
</h1>
<%= form_for :image, ~p"/search/reverse", [multipart: true], fn f -> %>
<p>
Basic image similarity search. Finds uploaded images similar to the one
provided based on simple intensities and uses the median frame of
animations; very low contrast images (such as sketches) will produce
poor results and, regardless of contrast, results may include seemingly
random images that look very different.
</p>
<div class="image-other">
<div id="js-image-upload-previews"></div>
<p>
Upload a file from your computer, or provide a link to the page containing the image and click Fetch.
</p>
<div class="field">
<%= file_input(f, :image, class: "input js-scraper") %>
</div>
<div class="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 class="button button--separate-left" data-disable-with="Fetch" disabled id="js-scraper-preview" title="Fetch the image at the specified URL" type="button">
Fetch
</button>
</div>
<div class="field-error-js hidden js-scraper"></div>
</div>
<h4>
Optional settings
</h4>
<div class="field">
<%= label(f, :distance, "Match distance (suggested values: between 0.2 and 0.5)") %>
<br />
<%= number_input(f, :distance, value: 0.25, min: 0, max: 1, step: 0.01, class: "input") %>
</div>
<div class="field">
<%= submit("Reverse Search", class: "button") %>
</div>
<% end %>
<%= cond do %>
<% is_nil(@images) -> %>
<% Enum.any?(@images) -> %>
<h2>
Results
</h2>
<table>
<tr>
<th>
&nbsp;
</th>
<th>
Image
</th>
<th>
&nbsp;
</th>
</tr>
<%= for match <- @images do %>
<tr>
<th>
<h3>
<%= link("##{match.id}", to: ~p"/images/#{match}") %>
</h3>
<p>
<%= if image_has_sources(match) do %>
<span class="source_url">
<%= link("Source", to: image_first_source(match)) %>
</span>
<% else %>
Unknown source
<% end %>
</p>
</th>
<th>
<%= render(PhilomenaWeb.ImageView, "_image_container.html", image: match, size: :thumb, conn: @conn) %>
</th>
<th>
<h3>
<%= match.image_width %>
x
<%= match.image_height %>
-
<%= round(match.image_size / 1024) %>
KiB
</h3>
<%= render(PhilomenaWeb.TagView, "_tag_list.html", tags: Tag.display_order(match.tags), conn: @conn) %>
</th>
</tr>
<% end %>
</table>
<% true -> %>
<h2>
Results
</h2>
<p>
We couldn't find any images matching this in our image database.
</p>
<% end %>