autocompletar categorias y tags, closes #15

app/assets/javascripts/application.js

@@ -15,4 +15,5 @@
 //= require jquery
 //= require bootstrap-markdown/js/bootstrap-markdown
 //= require markdown/lib/markdown
+//= require select2/dist/js/select2
 //= require_tree .

app/assets/stylesheets/application.scss

@@ -1,6 +1,7 @@
 @import "bootstrap";
 @import "bootstrap-markdown/css/bootstrap-markdown.min";
 @import "font-awesome";
+@import "select2/dist/css/select2";
 
 $footer-height: 60px;
 

app/controllers/posts_controller.rb

@@ -49,7 +49,7 @@ class PostsController < ApplicationController
 
   # Solo permitir cambiar estos atributos de cada articulo
   def post_params
-    params.require(:post).permit(:title, :date, :tags,
-      :categories, :content, :slug)
+    params.require(:post).permit(:title, :date, :content, :slug,
+      tags: [], categories: [])
   end
 end

app/models/post.rb

@@ -293,7 +293,9 @@ class Post
 
   def things_to_arrays!
     [:tags,:categories].each do |c|
-      @front_matter[c.to_s] = @front_matter.dig(c.to_s).split(',').map(&:strip)
+      thing = @front_matter.dig(c.to_s)
+      next if thing.is_a? Array
+      @front_matter[c.to_s] = thing.split(',').map(&:strip)
     end
   end
 

app/models/site.rb

@@ -41,6 +41,14 @@ class Site
     end
   end
 
+  def categories
+    posts.map(&:categories).flatten.uniq
+  end
+
+  def tags
+    posts.map(&:tags).flatten.uniq
+  end
+
   # El directorio donde se almacenan los sitios
   def self.site_path
     File.join(Rails.root, '_sites')

app/views/posts/_form.haml

@@ -28,16 +28,23 @@
     %small.text-muted.form-text= t('posts.date_help')
   .form-group
     = label_tag 'post_categories', t('posts.categories')
-    = text_field 'post', 'categories', value: @post.categories.try(:join, ', '),
-      class: 'form-control'
+    = select_tag 'post[categories][]',
+      options_for_select(@site.categories, @post.categories),
+      { class: 'form-control select2', multiple: 'multiple' }
     %small.text-muted.form-text= t('posts.tags_help')
   .form-group
     = label_tag 'post_tags', t('posts.tags')
-    = text_field 'post', 'tags', value: @post.tags.try(:join, ', '),
-      class: 'form-control'
+    = select_tag 'post[tags][]',
+      options_for_select(@site.tags, @post.tags),
+      { class: 'form-control select2', multiple: 'multiple' }
     %small.text-muted.form-text= t('posts.tags_help')
   .form-group
     = label_tag 'post_slug', t('posts.slug')
     = text_field 'post', 'slug', value: @post.slug,
       class: 'form-control'
     %small.text-muted.form-text= t('posts.slug_help')
+
+:javascript
+  $(document).on('turbolinks:load', function() {
+    $('.select2').select2({ tags: true, tokenSeparators: [',']});
+  });

package.json

@@ -3,6 +3,7 @@
   "private": true,
   "dependencies": {
     "bootstrap-markdown": "https://0xacab.org/itacate-kefir/bootstrap-markdown.git",
-    "markdown": "^0.5.0"
+    "markdown": "^0.5.0",
+    "select2": "^4.0.6-rc.1"
   }
 }

yarn.lock

@@ -6,10 +6,18 @@ abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
 
+almond@~0.3.1:
+  version "0.3.3"
+  resolved "https://registry.yarnpkg.com/almond/-/almond-0.3.3.tgz#a0e7c95ac7624d6417b4494b1e68bff693168a20"
+
 "bootstrap-markdown@https://0xacab.org/itacate-kefir/bootstrap-markdown.git":
   version "2.10.0"
   resolved "https://0xacab.org/itacate-kefir/bootstrap-markdown.git#580184dc214ea2364fca0fdcb70e3c5e08bd5605"
 
+jquery-mousewheel@~3.1.13:
+  version "3.1.13"
+  resolved "https://registry.yarnpkg.com/jquery-mousewheel/-/jquery-mousewheel-3.1.13.tgz#06f0335f16e353a695e7206bf50503cb523a6ee5"
+
 markdown@^0.5.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/markdown/-/markdown-0.5.0.tgz#28205b565a8ae7592de207463d6637dc182722b2"
@@ -21,3 +29,10 @@ nopt@~2.1.1:
   resolved "https://registry.yarnpkg.com/nopt/-/nopt-2.1.2.tgz#6cccd977b80132a07731d6e8ce58c2c8303cf9af"
   dependencies:
     abbrev "1"
+
+select2@^4.0.6-rc.1:
+  version "4.0.6-rc.1"
+  resolved "https://registry.yarnpkg.com/select2/-/select2-4.0.6-rc.1.tgz#aa6c3038a7f0f2e91ffade38f0a21c15e1813276"
+  dependencies:
+    almond "~0.3.1"
+    jquery-mousewheel "~3.1.13"