fill field_types partials

This commit is contained in:
Andrew Brown 2021-03-17 15:14:13 -07:00
parent 974098af53
commit d93e62bdbe
10 changed files with 263 additions and 195 deletions

View File

@ -62,6 +62,15 @@ p.long-form {
textarea.materialize-textarea {
height: 80px;
}
&.link {
padding-bottom: 2em;
}
.field-actions {
position: relative;
top: -0.4em;
}
}
.content-field.focused {
@ -185,6 +194,7 @@ p.long-form {
margin-bottom: 0rem;
padding-left: 1em;
padding-right: 0.75em;
padding-top: 0.5em;
i.left, i.right {
font-size: 1.5em;

View File

@ -12,6 +12,13 @@
Actions
</li>
<li class="collection-item">
<%= link_to '#', class: "expand" do %>
<i class="material-icons left">format_line_spacing</i>
Expand all categories
<% end %>
</li>
<% if raw_model.persisted? %>
<li class="collection-item fake-tab">
<%= link_to '#', class: 'share' do %>
@ -21,13 +28,6 @@
</li>
<% end %>
<li class="collection-item">
<%= link_to '#', class: "expand" do %>
<i class="material-icons left">format_line_spacing</i>
Expand all categories
<% end %>
</li>
<% if user_signed_in? && current_user.id == content.user.id %>
<li class="collection-item fake-tab">
<%= link_to attribute_customization_path(content_type: raw_model.class.name.downcase) do %>

View File

@ -50,7 +50,7 @@
</span>
<% else %>
<span class="badge grey-text hide-on-med-and-down">
<%= category[:percent_complete] %>%
<small><%= category[:percent_complete] %>%</small>
</span>
<% end %>
</span>

View File

@ -3,7 +3,7 @@
%>
<div id="<%= category[:name].gsub("'", '') %>_panel" class="panel card" style="display: none">
<div class="<%= raw_model.class.color %>-text text-darken-1 section-title white sticky-below-navbar <%= raw_model.class.color %> lighten-5">
<div class="<%= raw_model.class.color %>-text text-darken-1 section-title sticky-below-navbar <%= raw_model.class.color %> lighten-5">
<i class="material-icons right"><%= category[:icon] %></i>
<%= category[:label] %>
</div>
@ -14,7 +14,6 @@
<% end %>
<% if category[:name] == 'contributors' %>
<%# todo reorganize the files for all these panels? %>
<%= render partial: 'content/form/contributors', locals: { f: f, content: content } %>
<% end %>
@ -23,162 +22,51 @@
<div class="panel-field">
<% if field[:type] == 'link' %>
<%# Relation-setting UI %>
<% through_class = raw_model.class.reflect_on_association(field[:old_column_source]).options[:through].to_s %>
<%=
render 'content/form/relation_input',
render partial: 'content/form/field_types/legacy_link', locals: {
f: f,
attribute: field[:old_column_source],
label: field[:label],
relation: through_class
label: field[:label],
relation: raw_model.class.reflect_on_association(field[:old_column_source]).options[:through].to_s
}
%>
<% elsif field[:type] == 'tags' %>
<div class="content-field">
<div class="input-field">
<small><%= f.label field[:id], field[:label] %></small>
<div class="chips chips-autocomplete chips-initial"></div>
<%= f.hidden_field :page_tags, value: content.page_tags.join(PageTag::SUBMISSION_DELIMITER), id: 'hidden_page_tags_value' %>
<div class="help-text show-when-focused">
<i class="material-icons tiny">label</i>
Type and press enter to create a new tag, or click any of the suggested tags below to add it.
</div>
<div class="tags-container show-when-focused">
<% @suggested_page_tags.each do |tag| %>
<%=
link_to '#', class: 'js-add-tag' do
%>
<span class="new badge grey left hoverable" data-badge-caption="<%= tag %>"></span>
<% end %>
<% end %>
</div>
<div class="clearfix"></div>
</div>
</div>
<%= content_for :javascript do %>
function update_hidden_page_tag_value(e) {
var chips = M.Chips.getInstance($('.chips')).chipsData.map(function (c) {
return c['tag'];
});
var hidden_input = $('#hidden_page_tags_value').first();
hidden_input.val(chips.join('<%= PageTag::SUBMISSION_DELIMITER %>'));
<%=
render partial: 'content/form/field_types/tags', locals: {
f: f,
page: @content,
field: field
}
var chips = $('.chips-autocomplete').chips({
placeholder: 'Tag this page',
secondaryPlaceholder: '+ Tag',
autocompleteOptions: {
data: {
<% @content.page_tags.pluck(:tag).each do |tag| %>
'<%= tag %>': null,
<% end %>
},
limit: 100,
minLength: 1
},
data: [
<% @content.page_tags.pluck(:tag).each do |tag| %>
{tag: '<%= tag %>'},
<% end %>
],
onChipAdd: update_hidden_page_tag_value,
onChipDelete: update_hidden_page_tag_value
});
<% end %>
%>
<% elsif field[:type] == 'universe' %>
<div class="content-field">
<div class="input-field">
<%= f.label field[:id], field[:label] %><br />
<% if !f.object.persisted? || (f.object.persisted? && f.object.universe && f.object.universe.user == current_user) || f.object.universe_id.nil? %>
<%# todo not like this %>
<%
valid_universes = []
show_premium_notice = false
if Rails.application.config.content_types[:free].map(&:name).include?(raw_model.class.name)
valid_universes += current_user.universes
valid_universes += current_user.contributable_universes
else
# Premium content
if current_user.on_premium_plan? \
|| (raw_model.persisted? && content.user == current_user) \
|| PermissionService.user_has_active_promotion_for_this_content_type(user: current_user, content_type: f.object.class.name)
valid_universes += current_user.universes
# Allow premium users to add premium content to non-premium universes
valid_universes += current_user.contributable_universes
else
show_premium_notice = true
end
current_user.contributable_universes.each do |potential_universe|
if potential_universe.user.on_premium_plan?
valid_universes += [potential_universe]
end
end
end
%>
<%= hidden_field_tag "#{raw_model.class.name.downcase}[custom_attribute_values][][name]", field[:id] %>
<%=
@universe_dropdown_options ||= valid_universes.uniq.sort_by(&:name).map { |u| [u.name, u.id] }
select_tag "#{raw_model.class.name.downcase}[custom_attribute_values][][value]",
options_for_select(
@universe_dropdown_options.compact,
content.is_a?(ContentSerializer) ? content.universe.try(:id) : @universe_scope.try(:id)
),
include_blank: current_user.on_premium_plan? || Rails.application.config.content_types[:free].map(&:name).include?(raw_model.class.name)
%>
<% if show_premium_notice %>
<div class="help-text">
<i class="material-icons" style="font-size: 90%">info</i>
While on a <%= link_to 'Starter plan', subscription_path %>, you can only create premium content in universes you're a contributor to.
</div>
<% end %>
<% else %>
<br />
<%= link_to(f.object.universe.name, f.object.universe) if f.object.universe %>
<% end %>
</div>
</div>
<% elsif field[:label].start_with?('Private') %>
<%#
This field is shown if and only if:
* A user is signed in AND
* That user is the owner of this universe, if it's a universe, or
* That user is the owner of this content's universe, if it's content
* That user is the owner of this content, if it's not in a universe
<%=
render partial: 'content/form/field_types/universe', locals: {
f: f,
field: field,
page: @content,
raw_model: raw_model
}
%>
<% if user_signed_in? && (
(raw_model.is_a?(Universe) && content.user == current_user) ||
(raw_model.respond_to?(:universe) && raw_model.universe && raw_model.universe.user == current_user) ||
(raw_model.respond_to?(:universe) && raw_model.universe.nil? && content.user == current_user)
)
<% elsif field[:type] == 'name' %>
<%=
render partial: 'content/form/field_types/name', locals: {
f: f,
content: @content,
field: field
}
%>
<div class="content-field">
<div class="input-field">
<%= render 'content/form/rich_text_input', f: f, content: content, field: field %>
</div>
</div>
<% end %>
<% elsif field[:type] == 'name' && @entity.present? %>
<%= render 'content/form/rich_text_input', f: f, content: content, field: field, value: @entity.try(:text) %>
<%= f.hidden_field :document_entity_id, value: @entity.id %>
<% else %>
<%= render 'content/form/rich_text_input',
f: f,
content: content,
field: field,
autocomplete: AutocompleteService.for_field_label(content_model: raw_model.class, label: field[:label])
<%=
render partial: 'content/form/field_types/text', locals: {
f: f,
content: @content,
raw_model: raw_model,
field: field,
}
%>
<% end %>

View File

@ -8,48 +8,33 @@
value = field[:value]
end
%>
<div class="content-field">
<div class="input-field">
<% unless defined?(show_label) && !show_label %>
<%= f.label field do %>
<%= field[:label].present? ? field[:label] : ' ' %>
<% if defined?(autocomplete) && autocomplete && autocomplete.any? %>
<i class="material-icons grey-text lighten-2 tooltipped"
style="font-size: 100%"
data-tooltip="This field may suggest some ideas for you when you start typing."
data-position="right"
>
offline_bolt
</i>
<% end %>
<% end %>
<% end %>
<%
placeholder = I18n.translate "attributes.#{content_name}.#{field[:label].downcase.gsub(/\s/, '_')}",
scope: :serendipitous_questions,
name: f.object.send('name') || "this #{content_name}",
default: 'Write as little or as much as you want!'
%>
<% unless defined?(show_label) && !show_label %>
<%= f.label field do %>
<%= field[:label].present? ? field[:label] : ' ' %>
<% end %>
<% end %>
<%= hidden_field_tag "#{content_name}[custom_attribute_values][][name]", field[:id] %>
<%=
text_area_tag "#{content_name}[custom_attribute_values][][value]",
value,
class: "js-can-mention-pages materialize-textarea #{defined?(autocomplete) && autocomplete ? ('autocomplete ' + 'js-autocomplete-' + field[:id].to_s) : ''}",
placeholder: placeholder
%>
<%
placeholder = I18n.translate "attributes.#{content_name}.#{field[:label].downcase.gsub(/\s/, '_')}",
scope: :serendipitous_questions,
name: f.object.send('name') || "this #{content_name}",
default: 'Write as little or as much as you want!'
%>
<p class="help-text show-when-focused">
Tip: You can press @ to insert a link to your other pages.
</p>
<% if field[:label].start_with?('Private') %>
<div class="help-text show-when-focused">
Private notes are <em>always</em> visible to only you, even if content is made public and shared.
</div>
<% end %>
<%= hidden_field_tag "#{content_name}[custom_attribute_values][][name]", field[:id] %>
<%=
text_area_tag "#{content_name}[custom_attribute_values][][value]",
value,
class: "js-can-mention-pages materialize-textarea #{defined?(autocomplete) && autocomplete ? ('autocomplete ' + 'js-autocomplete-' + field[:id].to_s) : ''}",
placeholder: placeholder
%>
<% if field[:label].start_with?('Private') %>
<div class="help-text show-when-focused">
Private notes are <em>always</em> visible to only you, even if content is made public and shared.
</div>
</div>
<% end %>
<% if defined?(autocomplete) && autocomplete && autocomplete.any? %>
<%= content_for :javascript do %>

View File

@ -1,7 +1,7 @@
<%# Usage: render 'content/form/relation_input', f: f, attribute: attribute, relation: through_class %>
<div class="content-field">
<div class="hoverable" style="padding: 8px; margin-bottom: 1rem;">
<div class="content-field link">
<div class="hoverable">
<div>
<i class="material-icons left grey-text">link</i>
<%= f.label attribute, I18n.translate(
"attributes.#{f.object.class.name.downcase}.#{attribute}",
scope: :activerecord,
@ -9,7 +9,7 @@
) %>
</div>
<div id="<%= relation %>">
<div id="<%= relation %>" class="clearfix">
<%= f.fields_for relation do |builder| %>
<%= render 'content/form/groupship_fields', f: builder, attribute: attribute.singularize, parent: f.object %>
<% end %>

View File

@ -0,0 +1,20 @@
<div class="content-field name">
<div class="input-field">
<div>
<i class="material-icons grey-text left">fingerprint</i>
<%= f.label field[:id], field[:label] %>
</div>
<%=
render partial: 'content/form/rich_text_input', locals: {
f: f,
content: content,
field: field,
value: @entity.present? ? @entity.try(:text) : nil,
show_label: false
}
%>
<% if @entity.present? %>
<%= f.hidden_field :document_entity_id, value: @entity.id %>
<% end %>
</div>
</div>

View File

@ -0,0 +1,56 @@
<div class="content-field tags">
<div class="input-field">
<small>
<i class="material-icons left grey-text">label</i>
<%= f.label field[:id], field[:label] %>
</small>
<div class="chips chips-autocomplete chips-initial"></div>
<%= f.hidden_field :page_tags, value: page.page_tags.join(PageTag::SUBMISSION_DELIMITER), id: 'hidden_page_tags_value' %>
<div class="help-text show-when-focused">
<i class="material-icons tiny">label</i>
Type and press enter to create a new tag, or click any of the suggested tags below to add it.
</div>
<div class="tags-container show-when-focused">
<% @suggested_page_tags.each do |tag| %>
<%=
link_to '#', class: 'js-add-tag' do
%>
<span class="new badge grey left hoverable" data-badge-caption="<%= tag %>"></span>
<% end %>
<% end %>
</div>
<div class="clearfix"></div>
</div>
</div>
<%= content_for :javascript do %>
function update_hidden_page_tag_value(e) {
var chips = M.Chips.getInstance($('.chips')).chipsData.map(function (c) {
return c['tag'];
});
var hidden_input = $('#hidden_page_tags_value').first();
hidden_input.val(chips.join('<%= PageTag::SUBMISSION_DELIMITER %>'));
}
var chips = $('.chips-autocomplete').chips({
placeholder: 'Tag this page',
secondaryPlaceholder: '+ Tag',
autocompleteOptions: {
data: {
<% page.page_tags.pluck(:tag).each do |tag| %>
'<%= tag %>': null,
<% end %>
},
limit: 100,
minLength: 1
},
data: [
<% page.page_tags.pluck(:tag).each do |tag| %>
{tag: '<%= tag %>'},
<% end %>
],
onChipAdd: update_hidden_page_tag_value,
onChipDelete: update_hidden_page_tag_value
});
<% end %>

View File

@ -0,0 +1,49 @@
<%
autocomplete_options = AutocompleteService.for_field_label(content_model: raw_model.class, label: field[:label])
%>
<div class="content-field text">
<div class="input-field">
<div>
<i class="material-icons grey-text left">text_fields</i>
<%= f.label field[:id], field[:label] %>
<div class="right show-when-focused">
<% if autocomplete_options.any? %>
<i class="material-icons tiny grey-text lighten-2 tooltipped"
data-tooltip="This field may suggest some ideas for you when you start typing."
data-position="left"
>
offline_bolt
</i>
<% end %>
</div>
</div>
<%=
render partial: 'content/form/rich_text_input', locals: {
f: f,
content: content,
field: field,
autocomplete: autocomplete_options,
show_label: false
}
%>
<div class="show-when-focused">
<div class="btn-group field-actions card" data-field-id="<%= field[:id] %>">
<a href="#" class="btn btn-small white black-text tooltipped" data-tooltip="Link a notebook page">
<i class="material-icons">link</i>
</a>
<a href="#" class="btn btn-small white black-text tooltipped" data-tooltip="Suggest an answer for me">
<i class="material-icons">casino</i>
</a>
<a href="#" class="btn btn-small white black-text tooltipped" data-tooltip="Ask my followers for an answer">
<i class="material-icons">help</i>
</a>
<a href="#" class="btn btn-small white black-text tooltipped" data-tooltip="Add a private note to this field">
<i class="material-icons">note_alt</i>
</a>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,60 @@
<div class="content-field universe">
<div class="input-field">
<div>
<i class="material-icons grey-text left"><%= Universe.icon %></i>
<%= f.label field[:id], field[:label] %>
</div>
<% if !f.object.persisted? || (f.object.persisted? && f.object.universe && f.object.universe.user == current_user) || f.object.universe_id.nil? %>
<%# todo not like this %>
<%
valid_universes = []
show_premium_notice = false
if Rails.application.config.content_types[:free].map(&:name).include?(raw_model.class.name)
valid_universes += current_user.universes
valid_universes += current_user.contributable_universes
else
# Premium content
if current_user.on_premium_plan? \
|| (raw_model.persisted? && content.user == current_user) \
|| PermissionService.user_has_active_promotion_for_this_content_type(user: current_user, content_type: f.object.class.name)
valid_universes += current_user.universes
# Allow premium users to add premium content to non-premium universes
valid_universes += current_user.contributable_universes
else
show_premium_notice = true
end
current_user.contributable_universes.each do |potential_universe|
if potential_universe.user.on_premium_plan?
valid_universes += [potential_universe]
end
end
end
%>
<%= hidden_field_tag "#{raw_model.class.name.downcase}[custom_attribute_values][][name]", field[:id] %>
<%=
@universe_dropdown_options ||= valid_universes.uniq.sort_by(&:name).map { |u| [u.name, u.id] }
select_tag "#{raw_model.class.name.downcase}[custom_attribute_values][][value]",
options_for_select(
@universe_dropdown_options.compact,
page.is_a?(ContentSerializer) ? page.universe.try(:id) : @universe_scope.try(:id)
),
include_blank: current_user.on_premium_plan? || Rails.application.config.content_types[:free].map(&:name).include?(raw_model.class.name)
%>
<% if show_premium_notice %>
<div class="help-text">
<i class="material-icons" style="font-size: 90%">info</i>
While on a <%= link_to 'Starter plan', subscription_path %>, you can only create premium content in universes you're a contributor to.
</div>
<% end %>
<% else %>
<br />
<%= link_to(f.object.universe.name, f.object.universe) if f.object.universe %>
<% end %>
</div>
</div>