Download as
Browse Code »

Commit e643284a3fdb5fe677363c0237d58c8e0e84b635

Authored by Rodrigo Souto
1 parent 8d248734
Exists in master and in 27 other branches 1.2+SPB2, 2_split_by_role, add_fields_in_api, api_fixies, api_pagination, api_private_token, api_tasks, article_hit_count, blog_page_bug, checkbox_to_user_can_edit_page, communities_ratings, communities_ratings_moderation, community_ratings_rebase, fix_cloned_article_parent, fix_gallery_image_url, fix_javascript_categories, fix_optional_fields, fix_suggest_article, fix_user_email_validation, highlight_block_fix, notification_plugin, notification_plugin_rebase, script_to_update, split_by_role, temp_ratings, tests, tests_fixies

[media-panel-improvements] Show/Hide media panel

Showing 5 changed files with 47 additions and 19 deletions   Show diff stats
app/views/cms/_text_editor_sidebar.html.erb
  Diff comments   View file @e643284
... ... @@ -3,9 +3,10 @@
3 3 <span class='button-zoom' data-value='<%= _('Zoom in') %>'></span>
4 4 <span class='button-close' data-value='<%= _('Close') %>'></span>
5 5  
  6 + <div class='header'><strong><%= _('Insert media') %></strong><%= button('vertical-toggle', _('Show/Hide'), '#') %></div>
  7 +
6 8 <%= render(:partial => 'textile_quick_reference') if @article.is_a?(TextileArticle) %>
7 9 <div class='text-editor-sidebar-box' id='media-upload-box'>
8   - <div class='header'><strong><%= _('Insert media') %></strong></div>
9 10 <div id='media-upload-form'>
10 11 <%= form_tag({ :action => 'media_upload' }, :multipart => true) do %>
11 12 <div class='formfield'>
... ... @@ -27,7 +28,6 @@
27 28 </div>
28 29  
29 30 <div id='published-media' class='text-editor-sidebar-box' data-url='<%= url_for({:controller => 'cms', :action => 'published_media_items', :profile => profile.identifier}) %>'>
30   - <div class='header'><strong><%= _('Published media') %></strong></div>
31 31 <%= select_profile_folder(nil, :parent_id, profile, 'recent-media', {}, {},
32 32 "type='Folder' or type='Gallery'", {:root_label => _('Recent media')}) %>
33 33 <%= labelled_form_field _('Search'), text_field_tag('q') %>
... ...
app/views/shared/_lead_and_body.html.erb
  Diff comments   View file @e643284
... ... @@ -20,16 +20,16 @@
20 20 <div class='article-lead' id="article-lead-<%=lead_id.to_s%>">
21 21  
22 22 <% if f %>
23   - <%= labelled_form_field(_(abstract_label), f.text_area(abstract_method, :style => 'width: 98%; height: 200px;', :class => editor_type)) %>
  23 + <%= labelled_form_field(_(abstract_label), f.text_area(abstract_method, :style => 'width: 100%; height: 200px;', :class => editor_type)) %>
24 24 <% else %>
25   - <%= labelled_form_field(_(abstract_label), text_area(object, abstract_method, :style => 'width: 98%; height: 200px;', :class => editor_type)) %>
  25 + <%= labelled_form_field(_(abstract_label), text_area(object, abstract_method, :style => 'width: 100%; height: 200px;', :class => editor_type)) %>
26 26 <% end %>
27 27 </div>
28 28 <div style="margin-top: 10px;">
29 29 <% if f %>
30   - <%= labelled_form_field(_(body_label), f.text_area(body_method, :style => 'width: 98%; height: 400px;', :class => editor_type)) %>
  30 + <%= labelled_form_field(_(body_label), f.text_area(body_method, :style => 'width: 100%; height: 400px;', :class => editor_type)) %>
31 31 <% else %>
32   - <%= labelled_form_field(_(body_label), text_area(object, body_method, :style => 'width: 98%; height: 400px;', :class => editor_type)) %>
  32 + <%= labelled_form_field(_(body_label), text_area(object, body_method, :style => 'width: 100%; height: 400px;', :class => editor_type)) %>
33 33 <% end %>
34 34 </div>
35 35  
... ...
public/designs/icons/tango/style.css
  Diff comments   View file @e643284
... ... @@ -72,6 +72,7 @@
72 72 .icon-newupload-file { background-image: url(Tango/16x16/actions/filesave.png) }
73 73 .icon-slideshow { background-image: url(Tango/16x16/mimetypes/x-office-presentation.png) }
74 74 .icon-photos { background-image: url(Tango/16x16/devices/camera-photo.png) }
  75 +.icon-vertical-toggle { background-image: url(Tango/16x16/actions/mail-send-receive.png) }
75 76  
76 77 .icon-text-html { background-image: url(Tango/16x16/mimetypes/text-html.png) }
77 78 .icon-text-plain { background-image: url(Tango/16x16/mimetypes/text-x-generic.png) }
... ...
public/javascripts/media-panel.js
  Diff comments   View file @e643284
... ... @@ -116,4 +116,9 @@ jQuery(&quot;#new_folder&quot;).keypress(function( event ) {
116 116 }
117 117 });
118 118 }
119   -})
  119 +});
  120 +
  121 +jQuery('.text-editor-sidebar .header .icon-vertical-toggle').click(function(){
  122 + jQuery('#content').toggleClass('show-media-panel');
  123 + return false;
  124 +});
... ...
public/stylesheets/application.css
  Diff comments   View file @e643284
... ... @@ -3443,11 +3443,18 @@ table.cms-articles .icon:hover {
3443 3443  
3444 3444 /* Text editors sidebar */
3445 3445  
3446   -.controller-cms div.with_media_panel {
  3446 +.controller-cms .with_media_panel {
3447 3447 float: left;
  3448 + width: 900px;
  3449 + transition: 1s 0.5s;
  3450 +}
  3451 +
  3452 +.controller-cms .show-media-panel .with_media_panel {
3448 3453 width: 600px;
  3454 + transition: 1s;
3449 3455 }
3450   -div.with_media_panel .formfield input[type="checkbox"] {
  3456 +
  3457 +.with_media_panel .formfield input[type="checkbox"] {
3451 3458 width: auto;
3452 3459 }
3453 3460  
... ... @@ -3512,6 +3519,14 @@ div.with_media_panel .formfield input[type=&quot;checkbox&quot;] {
3512 3519 width: 280px;
3513 3520 right: 20px;
3514 3521 top: 70px;
  3522 + max-height: 45px;
  3523 + overflow: hidden;
  3524 + transition: 1s;
  3525 +}
  3526 +
  3527 +.show-media-panel .text-editor-sidebar {
  3528 + max-height: 800px;
  3529 + transition: 1s 0.5s;
3515 3530 }
3516 3531  
3517 3532 .text-editor-sidebar-box {
... ... @@ -3521,12 +3536,23 @@ div.with_media_panel .formfield input[type=&quot;checkbox&quot;] {
3521 3536 margin-bottom: 10px;
3522 3537 }
3523 3538  
3524   -.text-editor-sidebar-box .header {
3525   - margin: -10px -10px 0px -10px;
3526   - padding: 10px;
3527   - font-weight: bold;
3528   - border-bottom: 1px solid #d3d7cf;
3529   - background-color: #eeeeec;
  3539 +.text-editor-sidebar .header {
  3540 + margin: 0 0 10px 0;
  3541 + padding: 10px;
  3542 + font-weight: bold;
  3543 + border: 1px solid #d3d7cf;
  3544 + background-color: #eeeeec;
  3545 + background-repeat: no-repeat;
  3546 + background-position: 98% 10px;
  3547 + position: relative;
  3548 +}
  3549 +
  3550 +.text-editor-sidebar .header .icon-vertical-toggle {
  3551 + position: absolute;
  3552 + right: 6px;
  3553 + top: 6px;
  3554 + padding-top: 0px;
  3555 + padding-bottom: 0px;
3530 3556 }
3531 3557  
3532 3558 .text-editor-sidebar code,
... ... @@ -3639,10 +3665,6 @@ div.with_media_panel .formfield input[type=&quot;checkbox&quot;] {
3639 3665 margin-top: 4px;
3640 3666 }
3641 3667  
3642   -.text-editor-sidebar .header {
3643   - background-repeat: no-repeat;
3644   - background-position: 98% 10px;
3645   -}
3646 3668 .text-editor-sidebar .media-upload-error {
3647 3669 color: red;
3648 3670 }
... ...