Commit 560b9c49d10d94d134630bdc1ed7c8b34c908903

Authored by Victor Costa
1 parent 7d560b7d

Filter blocks by name in block store

app/views/box_organizer/index.html.erb
... ... @@ -8,9 +8,10 @@
8 8 <% end %>
9 9  
10 10 <div id="block-store">
  11 + <input type="text" id="block-store-filter" placeholder="<%= _('Filter blocks') %>" title="<%= _('Filter blocks') %>">
11 12 <div id="block-types">
12 13 <% @available_blocks.each do |block| %>
13   - <div id="block-<%= block.name.to_css_class %>" class="block-type <%= block.name.to_css_class %>" data-block-type="<%= block.name %>">
  14 + <div id="block-<%= block.name.to_css_class %>" class="block-type <%= block.name.to_css_class %>" data-block-type="<%= block.name %>" data-block-name="<%= block.pretty_name %>">
14 15 <div class="button-bar">
15 16 <%= modal_button 'help', _('Help on this block'),
16 17 {:action => 'show_block_type_info', :type => block.name},
... ...
public/javascripts/block-store.js
  1 +function filterBlocks() {
  2 + jQuery('#block-store #block-types').slick('slickFilter', function() {
  3 + var name = $(this).data('block-name');
  4 + var filter = $('#block-store #block-store-filter').val();
  5 + return name.toLowerCase().indexOf(filter.toLowerCase()) > -1;
  6 + });
  7 +}
  8 +
1 9 function cloneDraggableBlock(el, blockIcon) {
2 10 el.addClass('ui-draggable-dragging');
3 11 return blockIcon;
... ... @@ -38,4 +46,5 @@ function initBlockStore() {
38 46 ]
39 47 });
40 48 jQuery('#block-store').show();
  49 + jQuery('#block-store #block-store-filter').keyup(filterBlocks);
41 50 }
... ...
public/stylesheets/block-store.css
... ... @@ -27,6 +27,13 @@
27 27 /************************************************
28 28 * block store styles
29 29 ************************************************/
  30 +#block-store #block-store-filter {
  31 + float: right;
  32 + margin-bottom: 8px;
  33 +}
  34 +#block-store #block-types {
  35 + clear: both;
  36 +}
30 37 #block-store {
31 38 display: none;
32 39 }
... ...