diff --git a/app/assets/javascripts/drag.js b/app/assets/javascripts/drag.js index e65ede53..0f604636 100644 --- a/app/assets/javascripts/drag.js +++ b/app/assets/javascripts/drag.js @@ -6,5 +6,16 @@ $(document).on('turbolinks:load', function() { }).on('drop', function(from, to, el, mode) { // Al soltar, reordenamos toda la tabla $('.post_order').val(function(i,v) { return i; }); + $('.reorder-posts-panel') + .addClass('d-block') + .removeClass('d-none'); + }); + + // Ocultar el panel de ayuda con botón + $('.reorder-posts-panel .close').click(function(e) { + e.preventDefault(); + $('.reorder-posts-panel') + .removeClass('d-block') + .addClass('d-none'); }); }); diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index b00df3a7..08335f43 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -106,3 +106,7 @@ textarea.post-content { .sindu_dragger table { background: transparent !important; } + +.d-none, .d-block { + transition: all 3s; +} diff --git a/app/views/posts/index.haml b/app/views/posts/index.haml index 28d1aea6..fc405e10 100644 --- a/app/views/posts/index.haml +++ b/app/views/posts/index.haml @@ -20,6 +20,14 @@ .col - if @posts.present? = form_tag site_reorder_posts_path, method: :post do + = hidden_field 'posts', 'lang', value: @lang + .reorder-posts-panel.alert.alert-info.alert-dismissible.fade.show{role: 'alert'} + = raw t('help.posts.reorder') + %br + = submit_tag t('posts.reorder_posts'), class: 'btn btn-success' + %button.close{type: 'button', + 'aria-label': t('help.close') } + %span{'aria-hidden': true} × %table.table.table-condensed.table-striped.table-draggable %tbody - @posts.each_with_index do |post, i| @@ -32,7 +40,7 @@ %tr %td = fa_icon 'arrows-v', class: 'handle' - = text_field 'posts[order]', i, value: post.order || i, class: 'post_order' + = hidden_field 'posts[order]', i, value: post.order || i, class: 'post_order' %td{class: direction} = link_to post.title, site_post_path(@site, post, lang: @lang) diff --git a/config/locales/en.yml b/config/locales/en.yml index 4348a2d6..ca22cba3 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -8,6 +8,10 @@ en: breadcrumbs: "What you see up here are the bread crumbs for this site. When you enter a new section, you will see the previous ones and also have a path for where you\'re standing." + posts: + reorder: 'You can drag and drop articles by the arrow icon () and then press the "Reorder posts" + button to save them in different order.' i18n: top: 'Back to top' index: "Here you can edit your site's texts that don't belong to a @@ -127,6 +131,7 @@ en: en: 'English' ar: 'Arabic' posts: + reorder_posts: 'Reorder posts' new: 'New post' index: 'Posts' edit: 'Edit' diff --git a/config/locales/es.yml b/config/locales/es.yml index a0c91d0d..1a3ac06d 100644 --- a/config/locales/es.yml +++ b/config/locales/es.yml @@ -8,6 +8,10 @@ es: breadcrumbs: 'Lo que ves arriba son las migas de pan de este sitio. Cuando ingreses a una sección, podrás volver a las secciones anteriores y además tener una ruta de donde estás parada.' + posts: + reorder: 'Puedes arrastrar y soltar los artículos por el ícono de + las flechas () y luego presionar el + botón "Reordenar artículos" para guardarlos en ese orden.' i18n: top: 'Volver al principio' index: 'Aquí puedes editar todos los textos del sitio que no se @@ -129,6 +133,7 @@ es: en: 'inglés' ar: 'árabe' posts: + reorder_posts: 'Reordenar artículos' new: 'Empezar un artículo nuevo' index: 'Artículos' edit: 'Editar'