Commit 3db199c7668428c34808e8ea5df34778a0c22f9b

Authored by Rodrigo Souto
1 parent 59f24175

[media-panel-improvements] Media search

app/controllers/my_profile/cms_controller.rb
... ... @@ -330,9 +330,7 @@ class CmsController < MyProfileController
330 330 end
331 331  
332 332 def published_media_items
333   - parent = profile.articles.find(params[:parent_id])
334   - load_recent_files(parent)
335   - @published_media_items_id = params[:parent_id]
  333 + load_recent_files(params[:parent_id], params[:q])
336 334 render :partial => 'published_media_items'
337 335 end
338 336  
... ... @@ -432,23 +430,32 @@ class CmsController < MyProfileController
432 430 {:images => _('Images'), :generics => _('Files')}
433 431 end
434 432  
435   - def load_recent_files(parent = nil)
  433 + def load_recent_files(parent_id = nil, q = nil)
436 434 #TODO Since we only have special support for images, I'm limiting myself to
437 435 # consider generic files as non-images. In the future, with more supported
438 436 # file types we'll need to have a smart way to fetch from the database
439 437 # scopes of each supported type as well as the non-supported types as a
440 438 # whole.
441 439 @recent_files = {}
  440 +
  441 + parent = parent_id.present? ? profile.articles.find(parent_id) : nil
442 442 if parent.present?
443 443 files = parent.children.files
444   - @published_media_items_id = parent.id
445 444 else
446 445 files = profile.files
447   - @published_media_items_id = 'recent-media'
448 446 end
  447 +
449 448 files = files.more_recent
450   - @recent_files[:images] = files.images.limit(6)
451   - @recent_files[:generics] = files.no_images.limit(6)
  449 + images = files.images.limit(6)
  450 + generics = files.no_images.limit(6)
  451 +
  452 + if q.present?
  453 + @recent_files[:images] = find_by_contents(:images, images, q)[:results]
  454 + @recent_files[:generics] = find_by_contents(:generics, generics, q)[:results]
  455 + else
  456 + @recent_files[:images] = images
  457 + @recent_files[:generics] = generics
  458 + end
452 459 end
453 460  
454 461 end
... ...
app/views/cms/_published_media_items.html.erb
1   -<div id='<%= @published_media_items_id %>' class='items'>
  1 +<div class='items'>
2 2 <% file_types.each do |key, header| %>
3 3 <% display = @recent_files[key].present? ? '' : 'none' %>
4 4 <div class='<%= key.to_s %>' style='display: <%= display%>;'>
... ...
app/views/cms/_text_editor_sidebar.html.erb
1 1 <div class='text-editor-sidebar'>
2   - <span class='button-add' data-value='<%= _('Add to the text') %>'></span>
3   - <span class='button-zoom' data-value='<%= _('Zoom in') %>'></span>
4   - <span class='button-close' data-value='<%= _('Close') %>'></span>
5   -
6 2 <%= render(:partial => 'textile_quick_reference') if @article.is_a?(TextileArticle) %>
7 3 <div class='text-editor-sidebar-box' id='media-upload-box'>
8 4 <div class='header'><strong><%= _('Insert media') %></strong></div>
... ... @@ -21,30 +17,14 @@
21 17 </div>
22 18 </div>
23 19  
24   - <div id='published-media' class='text-editor-sidebar-box'>
  20 + <div id='published-media' class='text-editor-sidebar-box' data-url='<%= url_for({:controller => 'cms', :action => 'published_media_items', :profile => profile.identifier}) %>'>
25 21 <div class='header'><strong><%= _('Published media') %></strong></div>
26   - <%= select_profile_folder(nil, :parent_id, profile, 'recent-media', {'data-url' => url_for({:controller => 'cms', :action => 'published_media_items', :profile => profile.identifier})}, {},
  22 + <%= select_profile_folder(nil, :parent_id, profile, 'recent-media', {}, {},
27 23 "type='Folder' or type='Gallery'", {:root_label => _('Recent media')}) %>
  24 + <%= labelled_form_field _('Search'), text_field_tag('q') %>
28 25 <%= render :partial => 'drag_and_drop_note' %>
29 26 <%= render :partial => 'published_media_items' %>
30 27 </div>
31   -
32   - <div id='media-search-box' class='text-editor-sidebar-box'>
33   - <div class='header'><strong><%= _('Media search') %></strong></div>
34   - <p>
35   - <%= form_tag({ :action => 'search' }) do %>
36   - <span class='formfield'>
37   - <input name='q' type='text' id='media-search-query' style='width: 250px;'/>
38   - </span>
39   - <%= submit_button :search, _('Search'), :id => 'media-search-button' %>
40   - <% end %>
41   - </p>
42   - <div id='media-search-results' style='display: none'>
43   - <%= render :partial => 'drag_and_drop_note' %>
44   - <div class='items'>
45   - </div>
46   - </div>
47   - </div>
48 28 </div>
49 29  
50 30 <script id="template-upload" type="text/x-tmpl">
... ...
public/javascripts/media-panel.js
... ... @@ -13,31 +13,34 @@ jQuery(&#39;#file&#39;).fileupload({
13 13 }
14 14 });
15 15  
16   -jQuery('#published-media #parent_id').change(function(){
17   - value = jQuery(this).val();
18   - if(value == '')
19   - value = 'recent-media'
20   - selector = '#published-media #'+value
  16 +function loadPublishedMedia() {
  17 + var parent_id = jQuery('#published-media #parent_id').val();
  18 + var q = jQuery('#published-media #q').val();
  19 + var url = jQuery('#published-media').data('url');
21 20  
22   - if (jQuery(selector).length > 0){
23   - jQuery('#published-media .items').hide();
24   - jQuery(selector).show();
25   - } else {
26   - jQuery('#published-media').addClass('fetching');
27   - url = jQuery(this).data('url');
28   - jQuery.ajax({
29   - url: url,
30   - data: {"parent_id":value},
31   - dataType: 'html',
32   - success: function(response) {
33   - jQuery('#published-media .items').hide();
34   - jQuery("#published-media").append('<div id="'+ value +'" class="items">' + response + '</div>');
35   - jQuery('#published-media').removeClass('fetching');
36   - },
37   - error: function(response, textStatus, xhr) {
38   - console.log(response);
39   - console.log(textStatus);
40   - }
41   - });
42   - }
  21 + jQuery('#published-media').addClass('fetching');
  22 + jQuery.ajax({
  23 + url: url,
  24 + data: {'parent_id': parent_id, 'q': q},
  25 + dataType: 'html',
  26 + success: function(response) {
  27 + jQuery("#published-media .items").html(response);
  28 + jQuery('#published-media').removeClass('fetching');
  29 + },
  30 + error: function(response, textStatus, xhr) {
  31 + console.log(response);
  32 + console.log(textStatus);
  33 + }
  34 + });
  35 +}
  36 +
  37 +jQuery('#published-media #parent_id').change(function(){ loadPublishedMedia() });
  38 +
  39 +jQuery("#published-media #q").typeWatch({
  40 + callback: function (value) { loadPublishedMedia() },
  41 + wait: 750,
  42 + highlight: true,
  43 + captureLength: 2
43 44 });
  45 +
  46 +jQuery("#published-media #q").bind('notext', function(){ loadPublishedMedia() });
... ...
public/stylesheets/application.css
... ... @@ -3448,6 +3448,11 @@ div.with_media_panel .formfield input[type=&quot;checkbox&quot;] {
3448 3448 margin-bottom: 12px;
3449 3449 }
3450 3450  
  3451 +.text-editor-sidebar select,
  3452 +.text-editor-sidebar input {
  3453 + width: 100%;
  3454 +}
  3455 +
3451 3456 .text-editor-sidebar .items .image {
3452 3457 display: inline-block;
3453 3458 vertical-align: middle;
... ...