mirror of
https://github.com/indentlabs/notebook.git
synced 2025-10-26 11:19:22 +00:00
polish up some of the basil review views
This commit is contained in:
Andrew Brown
parent
15eb30afbd
commit
1074c9ab21
@ -1,224 +0,0 @@
|
||||
<script type="text/javascript">
|
||||
function commission_basil(style) {
|
||||
// Set style hidden value to our selected style
|
||||
$('#basil_commission_style').val(style);
|
||||
|
||||
// Submit form to start the commission
|
||||
$('#new_basil_commission').submit();
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<div class="row">
|
||||
<%= form_for BasilCommission.new, url: basil_character_path(@character) do |f| %>
|
||||
<%= f.hidden_field :style, value: 'realistic' %>
|
||||
<%= f.hidden_field :entity_type, value: 'Character' %>
|
||||
<%= f.hidden_field :entity_id, value: @character.id %>
|
||||
<div class="col s12 m4">
|
||||
<div style="margin: 1em 0">
|
||||
<%= link_to basil_path, class: 'grey-text text-darken-2' do %>
|
||||
<i class="material-icons left">chevron_left</i>
|
||||
Back to my character list
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="clearfix">
|
||||
<%= image_tag @character.random_image_including_private(format: :medium), style: 'width: 100%' %>
|
||||
<h1 style="font-size: 2rem; margin-bottom: 0"><%= link_to @character.name, @character %></h1>
|
||||
<%= link_to 'Edit this character page', edit_polymorphic_path(@character), class: 'grey-text text-darken-2' %>
|
||||
</div>
|
||||
|
||||
<ul>
|
||||
<% if @gender_field && @gender_value %>
|
||||
<li style="margin-bottom: 1em">
|
||||
<div class="grey-text text-darken-3" style="font-weight: bold; font-size: 0.8em">
|
||||
Gender
|
||||
<%= range_field_tag "field[#{@gender_field.id}]", @guidance.fetch(@gender_field.id.to_s, 1), { min: 0, max: 1.3, step: 0.1, style: 'width: 50%', class: 'js-importance-slider hide' } %>
|
||||
</div>
|
||||
<div>
|
||||
<%= @gender_value %>
|
||||
</div>
|
||||
</li>
|
||||
<% end %>
|
||||
|
||||
<% if @age_field && @gender_value %>
|
||||
<li style="margin-bottom: 1em">
|
||||
<div class="grey-text text-darken-3" style="font-weight: bold; font-size: 0.8em">
|
||||
Age
|
||||
<%= range_field_tag "field[#{@age_field.id}]", @guidance.fetch(@age_field.id.to_s, 1), { min: 0, max: 1.3, step: 0.1, style: 'width: 50%', class: 'js-importance-slider hide' } %>
|
||||
</div>
|
||||
<div>
|
||||
<%= @age_value %>
|
||||
</div>
|
||||
</li>
|
||||
<% end %>
|
||||
|
||||
<% shown_any_value = false %>
|
||||
<% @appearance_fields.each do |field| %>
|
||||
<%
|
||||
value = @attributes.detect { |attr| attr.attribute_field_id == field.id }.try(:value)
|
||||
next if value.nil? || value.blank?
|
||||
shown_any_value = true
|
||||
%>
|
||||
<li style="margin-bottom: 1em;">
|
||||
<div class="grey-text text-darken-3" style="font-weight: bold; font-size: 0.8em">
|
||||
<%= field.label %>
|
||||
<%= range_field_tag "field[#{field.id}]", @guidance.fetch(field.id.to_s, 1), { min: 0, max: 1.3, step: 0.1, style: 'width: 50%', class: 'js-importance-slider hide' } %>
|
||||
</div>
|
||||
<div>
|
||||
<%= value %>
|
||||
</div>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
||||
<% if !shown_any_value %>
|
||||
<div class="red card-panel lighten-3">
|
||||
Basil works best with guidance! Please fill out some fields in the "Looks" category for this character
|
||||
before requesting an image.
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div>
|
||||
<% if @can_request_another %>
|
||||
<%= link_to 'Customize per-field importance', "javascript:var sliders = document.getElementsByClassName('js-importance-slider'); for(var i = 0; i < sliders.length; i++) sliders.item(i).classList.remove('hide')" %>
|
||||
<% end %>
|
||||
|
||||
<div class="card-panel js-importance-slider hide" style="margin-right: 1em">
|
||||
<strong>How to customize per-field importance</strong>
|
||||
<br /><br />
|
||||
|
||||
This allows you to tell Basil which fields are more or less important to you. For example, if Basil isn't
|
||||
getting a character's hair color right, you can increase the importance of the "Hair Color" field.
|
||||
<br /><br />
|
||||
You can also tell Basil to ignore a field entirely by dragging the slider all the way to the left.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-panel" style="margin-top: 2em">
|
||||
<p>
|
||||
This is still a work in progress and very much a beta that will change a lot before releasing publicly,
|
||||
but feel free to use it as much as you'd like to provide feedback!
|
||||
</p>
|
||||
<p>
|
||||
If you run into any issues, please let me know <%# in the %>
|
||||
<%# link_to 'Site Support forums', 'https://www.notebook.ai/forum/site-support' %>
|
||||
<%# or %> <%= link_to 'on Discord', 'https://discord.gg/7WCuGxY3AW' %>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col s12 m2" style="margin-top: 1rem">
|
||||
<% if @can_request_another && shown_any_value %>
|
||||
<div class="grey-text center"><strong>Available styles</strong></div>
|
||||
<% %w(realistic painting sketch digital anime abstract).each do |style| %>
|
||||
<%= link_to "javascript:commission_basil('#{style}')" do %>
|
||||
<div class="hoverable card-panel purple white-text">
|
||||
<%= style.humanize %>
|
||||
<i class="material-icons right">chevron_right</i>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<% if @can_request_another && shown_any_value %>
|
||||
<div class="grey-text center"><strong>Experimental styles</strong></div>
|
||||
<% %w(painting2 horror watercolor).each do |style| %>
|
||||
<%= link_to "javascript:commission_basil('#{style}')" do %>
|
||||
<div class="hoverable card-panel purple white-text">
|
||||
<%= style.humanize %>
|
||||
<i class="material-icons right">chevron_right</i>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<% if !@can_request_another %>
|
||||
<div class="card-panel purple white-text">
|
||||
Basil is working on your <%= pluralize @in_progress_commissions.count, 'requested commission' %>.
|
||||
<br /><br />
|
||||
As soon as he completes one, you'll be able to request another.
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="col s12 m6" style="margin-top: 1rem">
|
||||
<% @commissions.each do |commission| %>
|
||||
<div>
|
||||
<% if commission.complete? %>
|
||||
<%# image_tag commission.image, style: 'width: 100%' %>
|
||||
<%
|
||||
s3 = Aws::S3::Resource.new(region: "us-east-1")
|
||||
obj = s3.bucket(commission.s3_bucket).object("job-#{commission.job_id}.png")
|
||||
%>
|
||||
<div class="card horizontal">
|
||||
<div class="card-image">
|
||||
<%= link_to obj.presigned_url(:get) do %>
|
||||
<%= image_tag obj.presigned_url(:get) %>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<div>
|
||||
<strong><%= @character.name %></strong>
|
||||
<% if commission.style? %>
|
||||
<em>(<%= commission.style.humanize %>)</em>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="grey-text text-darken-2">
|
||||
<span style="font-size: 0.8em">Completed <%= time_ago_in_words commission.completed_at %> ago</span>
|
||||
·<br />
|
||||
<span style="font-size: 0.8em">Took <%= distance_of_time_in_words commission.completed_at - commission.created_at %></span>
|
||||
</div>
|
||||
<div style="margin-top: 1em">
|
||||
<div class="center" style="font-size: 0.9em"><strong>Feedback for Basil</strong></div>
|
||||
<div class="row">
|
||||
<%= form_for commission.basil_feedbacks.find_or_initialize_by(user: current_user), url: basil_feedback_path(commission.job_id), method: :POST, remote: true do |f| %>
|
||||
<div class="col s3 red lighten-3">
|
||||
<label>
|
||||
<%= f.radio_button :score_adjustment, '-2', { class: 'autosave-closest-form-on-change' } %>
|
||||
<span class="black-text">:'(</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col s3 orange lighten-3">
|
||||
<label>
|
||||
<%= f.radio_button :score_adjustment, '-1', { class: 'autosave-closest-form-on-change' } %>
|
||||
<span class="black-text">:(</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col s3 green lighten-3">
|
||||
<label>
|
||||
<%= f.radio_button :score_adjustment, '1', { class: 'autosave-closest-form-on-change' } %>
|
||||
<span class="black-text">:)</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col s3 blue lighten-3">
|
||||
<label>
|
||||
<%= f.radio_button :score_adjustment, '2', { class: 'autosave-closest-form-on-change' } %>
|
||||
<span class="black-text">:D</span>
|
||||
</label>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
<div class="card-action">
|
||||
<%= link_to "Save to #{@character.name}", '#', class: 'purple-text' %>
|
||||
<%= link_to "Delete", '#', class: 'red-text right' %>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
<% else %>
|
||||
<div class="card-panel green white-text darken-4">
|
||||
Basil is still working on this commission... (style: <%= commission.style %>)
|
||||
<div style="font-size: 0.8em">
|
||||
(Requested <%= time_ago_in_words(commission.created_at) %> ago)
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
@ -20,7 +20,7 @@
|
||||
<% @current_queue_items.each do |commission| %>
|
||||
<li>
|
||||
<%= commission.entity_type %>-<%= commission.entity_id %> (<%= commission.style %>)
|
||||
for U-<%= commission.user_id %>
|
||||
for U-<%= commission.user_id %> (#<%= commission.id %>)
|
||||
</li>
|
||||
<% end %>
|
||||
</ol>
|
||||
@ -29,15 +29,10 @@
|
||||
<% @recent_commissions.each do |commission| %>
|
||||
<div>
|
||||
<% if commission.complete? %>
|
||||
<%# image_tag commission.image, style: 'width: 100%' %>
|
||||
<%
|
||||
s3 = Aws::S3::Resource.new(region: "us-east-1")
|
||||
obj = s3.bucket(commission.s3_bucket).object("job-#{commission.job_id}.png")
|
||||
%>
|
||||
<div class="card horizontal">
|
||||
<div class="card-image">
|
||||
<%= link_to obj.presigned_url(:get) do %>
|
||||
<%= image_tag obj.presigned_url(:get) %>
|
||||
<%= link_to commission.image do %>
|
||||
<%= image_tag commission.image %>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="card-stacked">
|
||||
@ -45,6 +40,7 @@
|
||||
<div>
|
||||
<%= commission.id %>.
|
||||
<% if commission.entity.present? %>
|
||||
<i class="material-icons right <%= content_class_from_name(commission.entity_type).text_color %>"><%= content_class_from_name(commission.entity_type).icon %></i>
|
||||
<strong><%= link_to commission.entity.name, commission.entity %></strong>
|
||||
<% end %>
|
||||
<% if commission.style? %>
|
||||
|
||||
@ -42,7 +42,7 @@
|
||||
</div>
|
||||
<div class="col s12 m8 l9 grey lighten-3">
|
||||
<%=
|
||||
area_chart @commissions.group_by_day(:created_at).map { |date, count| [date.to_date, count] },
|
||||
area_chart @commissions.where('created_at > ?', 30.days.ago.beginning_of_month).group_by_day(:created_at).map { |date, count| [date.to_date, count] },
|
||||
colors: ['#9C27B0', '#2196F3'],
|
||||
title: 'Images created per day',
|
||||
suffix: ' images'
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
material for your ideas.
|
||||
</p>
|
||||
<p>
|
||||
To generate an image of this <%= @content.try(:page_type) || 'page' %>,
|
||||
To generate an image of this <%= @content.try(:page_type).try(:downcase) || 'page' %>,
|
||||
simply click a style below. Once the image has generated, you can move it
|
||||
to your <%= link_to @content.try(:name), @content.view_path %> page by clicking "Save" on any image.
|
||||
</p>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user