mirror of
https://github.com/indentlabs/notebook.git
synced 2025-10-26 11:19:22 +00:00
hook up category suggesting
This commit is contained in:
Andrew Brown
parent
7dc3d99fa9
commit
c6bcb53aa3
40
app/assets/javascripts/attributes_editor.js
Normal file
40
app/assets/javascripts/attributes_editor.js
Normal file
@ -0,0 +1,40 @@
|
||||
$(document).ready(function () {
|
||||
$('.js-show-category-suggestions').click(function () {
|
||||
var content_type = $(this).closest('.attributes-editor').data('content-type');
|
||||
var result_container = $(this).siblings(".suggest-categories-container").first();
|
||||
|
||||
$.ajax({
|
||||
dataType: "json",
|
||||
url: "/api/v1/categories/suggest/" + content_type,
|
||||
success: function (data) {
|
||||
var existing_categories = $('.js-category-label').map(function(){
|
||||
return $.trim($(this).text());
|
||||
}).get();
|
||||
|
||||
var new_categories = data.filter(c => !existing_categories.includes(c));
|
||||
var any_suggestions = new_categories.length > 0;
|
||||
if (any_suggestions) {
|
||||
result_container.html('');
|
||||
$.each(new_categories, function(i, value) {
|
||||
result_container.append(
|
||||
$('<a />')
|
||||
.attr('href', '#')
|
||||
.addClass('category-suggestion-link chip hoverable')
|
||||
.text(value)
|
||||
.on('click', function () {
|
||||
$('.js-category-input').text($(this).text());
|
||||
$('.js-category-input').siblings('label').addClass('active');
|
||||
return false;
|
||||
})
|
||||
);
|
||||
});
|
||||
} else {
|
||||
result_container.text("It doesn't look like there are any suggestions right now. Since suggestions are constantly growing, check back later and there might be more!");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$(this).hide();
|
||||
return false;
|
||||
});
|
||||
});
|
||||
@ -4,7 +4,7 @@
|
||||
|
||||
<!-- TODO set up overrides
|
||||
<div class="row">
|
||||
<div class="col s12 m6">
|
||||
<div class="col s12 m4">
|
||||
<div class="hoverable card white">
|
||||
<div class="card-content">
|
||||
<div class="card-title">
|
||||
@ -15,7 +15,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m6">
|
||||
<div class="col s12 m4">
|
||||
<div class="hoverable card white-text" style="background-color: <%= @content_type_class.hex_color_for(current_user) %>">
|
||||
<div class="card-content">
|
||||
<div class="card-title">Customize color</div>
|
||||
@ -23,65 +23,84 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="hoverable card white-text">
|
||||
<div class="card-content">
|
||||
<div class="card-title">Customize header image</div>
|
||||
You can change the header image.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
|
||||
<ul class="hoverable sortable collapsible white" data-sortable-class="AttributeCategory">
|
||||
<%= render partial: 'content/attributes/general_settings', locals: { content_type: @content_type, content_type_class: @content_type_class } %>
|
||||
<div class="attributes-editor" data-content-type="<%= @content_type %>">
|
||||
<ul class="hoverable sortable collapsible white" data-sortable-class="AttributeCategory">
|
||||
<%= render partial: 'content/attributes/general_settings', locals: { content_type: @content_type, content_type_class: @content_type_class } %>
|
||||
|
||||
<% @attribute_categories.each do |attribute_category| %>
|
||||
<li data-position="<%= attribute_category.position %>" data-content-id="<%= attribute_category.id %>" class="js-category-container">
|
||||
<div class="collapsible-header">
|
||||
<span class="sortable-handle"><i class="material-icons grey-text">menu</i></span>
|
||||
<i class="material-icons"><%= attribute_category.icon %></i>
|
||||
<div class="js-category-label">
|
||||
<%= attribute_category.label %>
|
||||
</div>
|
||||
<% if attribute_category.hidden? %>
|
||||
<span class="grey-text">—</span>
|
||||
<i class="material-icons grey-text tooltipped" data-tooltip="You've hidden this category.">visibility_off</i>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="collapsible-body">
|
||||
<div class="row">
|
||||
<% @attribute_categories.each do |attribute_category| %>
|
||||
<li data-position="<%= attribute_category.position %>" data-content-id="<%= attribute_category.id %>" class="js-category-container">
|
||||
<div class="collapsible-header">
|
||||
<span class="sortable-handle"><i class="material-icons grey-text">menu</i></span>
|
||||
<i class="material-icons"><%= attribute_category.icon %></i>
|
||||
<div class="js-category-label">
|
||||
<%= attribute_category.label %>
|
||||
</div>
|
||||
<% if attribute_category.hidden? %>
|
||||
<div class="col s12 m12 l12">
|
||||
<%= render partial: 'content/attributes/category_visibility_controls', locals: { category: attribute_category } %>
|
||||
</div>
|
||||
|
||||
<% else %>
|
||||
<div class="col s12 m12 l8">
|
||||
<%= render partial: 'content/attributes/category_fields_customization', locals: { category: attribute_category } %>
|
||||
</div>
|
||||
<div class="col s12 m12 l4">
|
||||
<%= render partial: 'content/attributes/category_ui_customization', locals: { category: attribute_category } %>
|
||||
<%= render partial: 'content/attributes/category_visibility_controls', locals: { category: attribute_category } %>
|
||||
</div>
|
||||
|
||||
<span class="grey-text">—</span>
|
||||
<i class="material-icons grey-text tooltipped" data-tooltip="You've hidden this category.">visibility_off</i>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<% end %>
|
||||
<li>
|
||||
<div class="collapsible-header">
|
||||
<i class="material-icons <%= @content_type_class.color %>-text">add</i>
|
||||
Add another category
|
||||
</div>
|
||||
<div class="collapsible-body">
|
||||
<%= form_for(current_user.attribute_categories.build, method: :post) do |f| %>
|
||||
<%= f.hidden_field :entity_type, value: @content_type %>
|
||||
<div class="row">
|
||||
<div class="input-field col s12">
|
||||
<%= f.text_area :label, class: 'materialize-textarea' %>
|
||||
<%= f.label :label, 'Category label' %>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<%= f.submit 'Add new category', class: "btn #{@content_type_class.color}" %>
|
||||
|
||||
<div class="collapsible-body">
|
||||
<div class="row">
|
||||
<% if attribute_category.hidden? %>
|
||||
<div class="col s12 m12 l12">
|
||||
<%= render partial: 'content/attributes/category_visibility_controls', locals: { category: attribute_category } %>
|
||||
</div>
|
||||
|
||||
<% else %>
|
||||
<div class="col s12 m12 l8">
|
||||
<%= render partial: 'content/attributes/category_fields_customization', locals: { category: attribute_category } %>
|
||||
</div>
|
||||
<div class="col s12 m12 l4">
|
||||
<%= render partial: 'content/attributes/category_ui_customization', locals: { category: attribute_category } %>
|
||||
<%= render partial: 'content/attributes/category_visibility_controls', locals: { category: attribute_category } %>
|
||||
</div>
|
||||
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<% end %>
|
||||
<li>
|
||||
<div class="collapsible-header">
|
||||
<i class="material-icons <%= @content_type_class.color %>-text">add</i>
|
||||
Add another category
|
||||
</div>
|
||||
<div class="collapsible-body">
|
||||
<%= form_for(current_user.attribute_categories.build, method: :post) do |f| %>
|
||||
<%= f.hidden_field :entity_type, value: @content_type %>
|
||||
<div class="row">
|
||||
<div class="input-field col s12">
|
||||
<%= f.text_area :label, class: 'materialize-textarea js-category-input' %>
|
||||
<%= f.label :label, 'Category label' %>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<%= f.submit 'Add new category', class: "btn #{@content_type_class.color}" %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="grey-text text-darken-1">
|
||||
<strong>New:</strong> Notebook.ai can now suggest additional categories for your pages.
|
||||
</div>
|
||||
<p class="suggest-categories-container">
|
||||
</p>
|
||||
<%= f.button "Show suggestions", class: 'small btn white black-text js-show-category-suggestions' %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
Loading…
Reference in New Issue
Block a user