From 127730fd7645206cd49ddb0629d209d72c668e24 Mon Sep 17 00:00:00 2001 From: Nicolas Bally Date: Fri, 28 Nov 2014 23:31:09 +0100 Subject: [PATCH] gestion des fichiers --- app/assets/stylesheets/manager.scss | 240 +++++++++++++----- .../admin/data_files/_data_file.html.haml | 34 +-- .../_data_files_container.html.haml | 7 +- app/views/admin/data_files/_form.html.haml | 28 +- .../admin/data_files/_index_block.html.haml | 109 ++++---- app/views/admin/data_files/_show.html.haml | 30 +-- app/views/admin/data_files/index.html.haml | 4 +- .../admin/file_folders/_file_folder.html.haml | 17 +- .../file_folders/_file_folders.html.haml | 8 +- .../_file_folders_navbar.html.haml | 9 + app/views/admin/file_folders/edit.js.erb | 14 +- app/views/admin/file_folders/new.js.erb | 16 +- 12 files changed, 319 insertions(+), 197 deletions(-) create mode 100644 app/views/admin/file_folders/_file_folders_navbar.html.haml diff --git a/app/assets/stylesheets/manager.scss b/app/assets/stylesheets/manager.scss index 8aae1f4..0579cb3 100644 --- a/app/assets/stylesheets/manager.scss +++ b/app/assets/stylesheets/manager.scss @@ -1,27 +1,27 @@ /* manager.css */ #manager_box_place{ position:fixed; - height:0; - width:100%; - z-index:1500; - top:0px; - margin:0px; - padding:0px; - display:none; + height:0; + width:100%; + z-index:1500; + top:0px; + margin:0px; + padding:0px; + display:none; } #manager_box{ - position:relative; - width:98%; - height:98%; - overflow:auto; + position:relative; + width:98%; + height:98%; + overflow:auto; - margin:auto; - margin-top:0px; + margin:auto; + margin-top:0px; - background:white; - - box-shadow: rgba(0,0,0,0.8) 1px 1px 50px; + background:white; + + box-shadow: rgba(0,0,0,0.8) 1px 1px 50px; @@ -29,7 +29,7 @@ } #manager_box_place.manager_box_place_active{ - height:95%; + height:95%; } @@ -43,11 +43,11 @@ #image_files .image_file .img { - text-align:center; - width:150px; - height:150px; - margin:0px; - + text-align:center; + width:150px; + height:150px; + margin:0px; + background-position: center center; background-repeat: no-repeat; background-size: contain; @@ -60,29 +60,29 @@ #image_files .image_file .name { - padding:4px 0px 2px 0px; - font-size:10px; - text-align:center; + padding:4px 0px 2px 0px; + font-size:10px; + text-align:center; } #image_files .image_file { - float:left; - padding:8px; - margin:2px; - border:4px solid white; + float:left; + padding:8px; + margin:2px; + border:4px solid white; - /* webkit */ - -webkit-transition-property: background-color; - -webkit-transition-duration: 0.5s; + /* webkit */ + -webkit-transition-property: background-color; + -webkit-transition-duration: 0.5s; - /* Firefox */ - -moz-transition-property: background-color; - -moz-transition-duration: 0.5s; + /* Firefox */ + -moz-transition-property: background-color; + -moz-transition-duration: 0.5s; - /* standardisé */ - transition-property: background-color; - transition-duration: 0.5s; + /* standardisé */ + transition-property: background-color; + transition-duration: 0.5s; @@ -90,7 +90,7 @@ #image_files .image_file.active { - background-color: rgba(46,119,187,0.3); + background-color: rgba(181,205,226,1); } @@ -108,12 +108,12 @@ background:rgba(247,245,246,0.9); } #image_files_big_container{ - - position:absolute; - top:0px; - left:0px; - bottom:0px; - right:0px; + + position:absolute; + top:0px; + left:0px; + bottom:0px; + right:0px; @@ -121,23 +121,23 @@ background:rgba(247,245,246,0.9); #image_files_container{ - position:absolute; - top:0px; - left:300px; - bottom:0px; - right:0px; - overflow:auto; + position:absolute; + top:0px; + left:300px; + bottom:0px; + right:0px; + overflow:auto; background:white; padding:20px; padding-bottom:60px; } #albums_navbar{ - position:absolute; - - width:299px; - bottom:0px; - left:0px; + position:absolute; + + width:299px; + bottom:0px; + left:0px; border-top:1px solid rgba(191,191,191,1); height:51px; background:rgba(220,220,220,1); @@ -165,12 +165,12 @@ background:rgba(247,245,246,0.9); #albums{ padding-bottom:60px; - position:absolute; - top:0px; - width:300px; - bottom:0px; - left:0px; - overflow:auto; + position:absolute; + top:0px; + width:300px; + bottom:0px; + left:0px; + overflow:auto; background:rgba(230,230,230,1); border-right:1px solid rgba(191,191,191,1); @@ -207,3 +207,119 @@ background:rgba(247,245,246,0.9); } + + + + + + + + + +/* Aperçu des images */ + +#data_files_navbar{ +left:300px; +background:rgba(247,245,246,0.9); +} + +#data_files_big_container{ + + position:absolute; + top:0px; + left:0px; + bottom:0px; + right:0px; + + + + + + #data_files_container{ + width:auto; + position:absolute; + top:0px; + left:300px; + bottom:0px; + right:0px; + overflow:auto; + background:white; + + padding:20px; + padding-bottom:60px; + } + #file_folders_navbar{ + position:absolute; + + width:299px; + bottom:0px; + left:0px; + border-top:1px solid rgba(191,191,191,1); + height:51px; + background:rgba(220,220,220,1); + a{ + color:#5e5e5e; + font-size:1.5em; + position:absolute; + top:10px; + + } + #add_file_folder{ + left:10px; + } + + #edit_current_file_folder{ + + right:10px; + } + + #remove_current_file_folder{ + + right:50px; + } + } + + #file_folders{ + padding-bottom:60px; + position:absolute; + top:0px; + width:300px; + bottom:0px; + left:0px; + overflow:auto; + background:rgba(230,230,230,1); + border-right:1px solid rgba(191,191,191,1); + + + + ul{ + padding-top: 1.2em; + li{ + border-top:1px solid rgba(191,191,191,0.5) ; + position:static; + + + a{ + position:static; + color:rgba(0,0,0,0.8); + &:hover, &.active{ + background:rgba(220,220,220,1); + + } + } + + #edit_current_file_folder{ + position:absolute; + top:10px; + } + + } + + + } + + } + + +} + diff --git a/app/views/admin/data_files/_data_file.html.haml b/app/views/admin/data_files/_data_file.html.haml index 5699d48..c5f893e 100644 --- a/app/views/admin/data_files/_data_file.html.haml +++ b/app/views/admin/data_files/_data_file.html.haml @@ -1,20 +1,22 @@ - if data_file.file? - - %tr#data_file.data_file{:id => data_file.id, :"data-id" => data_file.id, :"data-name" => data_file.abstract_file_name, :"data-description" => data_file.description, :"data-show_url" => admin_data_file_path(:id => data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :"data-edit_url" => edit_admin_data_file_path(:id => data_file.id, :manager => params[:manager], :multiple => params[:multiple]) , :class => ("new" if @data_file_create)} - - %td{:style => "width:32px;text-align:center;"} - -ext = File.extname(data_file.file.path)[1..-1] - =image_tag "file_types/"+ext+".png", :style => "height:30px;" - %td - =data_file.abstract_file_name - %td{:style => "width:300px;"} - + + %tr#data_file.data_file{:id => data_file.id, :"data-id" => data_file.id, :"data-name" => data_file.abstract_file_name, :"data-description" => data_file.description, :"data-show_url" => admin_data_file_path(:id => data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :"data-edit_url" => edit_admin_data_file_path(:id => data_file.id, :manager => params[:manager], :multiple => params[:multiple]) , :class => ("new" if @data_file_create)} + + %td{:style => "width:32px;text-align:center;"} + -ext = File.extname(data_file.file.path)[1..-1] + =image_tag "file_types/"+ext+".png", :style => "height:30px;" + %td + =data_file.abstract_file_name + %td{:style => "width:300px;"} + - =data_file.file_type - %td{:style => "width:100px;"} - =link_to i(:"download"), data_file.file.url + =data_file.file_type + %td + =data_file.file.url + %td{:style => "width:120px;text-align:right;"} + =link_to i(:"download"), data_file.file.url - = link_to i(:"trash-o"), admin_data_file_path(:id => data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :data => {:confirm => 'Voulez-vous vraiment supprimer cette image ?'}, :method => :delete, :remote => true - = link_to i(:"check"), "#",:onclick => "manager_send_data_file("+data_file.id.to_s+");return false;" if params[:manager] and !params[:multiple] - + = link_to i(:"trash-o"), admin_data_file_path(:id => data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :data => {:confirm => 'Voulez-vous vraiment supprimer cette image ?'}, :method => :delete, :remote => true + = link_to i(:check), "#",:onclick => "manager_send_data_file("+data_file.id.to_s+");return false;" if params[:manager] and !params[:multiple] + diff --git a/app/views/admin/data_files/_data_files_container.html.haml b/app/views/admin/data_files/_data_files_container.html.haml index e9017bc..87ba304 100644 --- a/app/views/admin/data_files/_data_files_container.html.haml +++ b/app/views/admin/data_files/_data_files_container.html.haml @@ -1,3 +1,4 @@ -%table#data_files_container.table - %tbody#data_files=render @data_files - \ No newline at end of file +#data_files_container + %table.table + %tbody#data_files=render @data_files + \ No newline at end of file diff --git a/app/views/admin/data_files/_form.html.haml b/app/views/admin/data_files/_form.html.haml index 4eea331..03b39ef 100644 --- a/app/views/admin/data_files/_form.html.haml +++ b/app/views/admin/data_files/_form.html.haml @@ -1,15 +1,15 @@ - form_for @data_file, :url => admin_data_file_path(:id => @data_file.id, :file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true do |form| - %table{:style => "width:100%"} - %tr - %td{:style => "width:120px"} Nom : - %td= form.text_field :name, :style => "width:90%" - %tr - %td{:style => "vertical-align:top;"} Description : - %td= form.text_area :description, :style => "max-width:90%;width:90%;height:100px;" - %tr.submit_tr - %td=link_to "Annuler", admin_data_file_path(:id => @data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :remote => true - %td - - =form.submit "Sauvegarder" - - \ No newline at end of file + %table{:style => "width:100%"} + %tr + %td{:style => "width:120px"} Nom : + %td= form.text_field :name, :style => "width:90%" + %tr + %td{:style => "vertical-align:top;"} Description : + %td= form.text_area :description, :style => "max-width:90%;width:90%;height:100px;" + %tr.submit_tr + %td=link_to "Annuler", admin_data_file_path(:id => @data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :remote => true + %td + + =form.submit "Sauvegarder" + + \ No newline at end of file diff --git a/app/views/admin/data_files/_index_block.html.haml b/app/views/admin/data_files/_index_block.html.haml index b1e5319..63e5dff 100644 --- a/app/views/admin/data_files/_index_block.html.haml +++ b/app/views/admin/data_files/_index_block.html.haml @@ -1,67 +1,70 @@ #data_files_content #data_files_big_container.container-fluid - .row-fluid - .span3#file_folders{:"data-file_folders_url" => admin_file_folders_url(:file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple])} - =render :partial => "admin/file_folders/file_folders" + #file_folders=render :partial => "admin/file_folders/file_folders" + - .span9 - =render :partial => "data_files_container" + #file_folders_navbar + =render :partial => "admin/file_folders/file_folders_navbar" + + + + + =render :partial => "data_files_container" %form#fileupload{:action => admin_data_files_path(:id => @data_file.id, :file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]),:method=>"POST", :enctype=>"multipart/form-data", :style => "display:inline;"} %input{:name => "redirect", :type => "hidden", :value => "/"}/ - - .navbar.navbar-fixed-bottom{:style => "position:absolute;"} - .navbar-inner - .container-fluid + + + %nav.navbar.navbar-default.navbar-fixed-bottom#image_files_navbar{:style => "position:absolute;"} + + .container-fluid + + %ul.nav.navbar-nav.navbar-right - .pull-right{:style => ""} - - .fileupload-progress.fade{:style => "float:left;"} - #upload_details{:style => ""} - .content - .fileupload-buttonbar - %button.btn.btn-warning.cancel{:type => "reset"} - %i.icon-ban-circle.icon-white - %span Cancel upload - %span.fileupload-loading - - %table.table.table-striped{:role => "presentation"} - %tbody.ulpoad_files - - - - .progress-extended{:style => "float:left;padding: 10px;font-size:14px;line-height:20px;"} - + .fileupload-progress.fade{:style => "float:left;"} + #upload_details{:style => ""} + .content + .fileupload-buttonbar + %button.btn.btn-warning.cancel{:type => "reset"} + %i.icon-ban-circle.icon-white + %span Cancel upload + %span.fileupload-loading + + %table.table.table-striped{:role => "presentation"} + %tbody.ulpoad_files + + + + .progress-extended{:style => "float:left;padding: 10px;font-size:14px;line-height:20px;"} + + + .progress.progress-success.progress-striped.active{"aria-valuemax" => "100", "aria-valuemin" => "0", :role => "progressbar",:style => "width:200px;float:left;margin: 10px;height:20px;"} + .bar{:style => "width:0%;"} - .progress.progress-success.progress-striped.active{"aria-valuemax" => "100", "aria-valuemin" => "0", :role => "progressbar",:style => "width:200px;float:left;margin: 10px;height:20px;"} - .bar{:style => "width:0%;"} - - - - + + + .navbar-header + %span.navbar-brand Fichiers + + + + .collapse.navbar-collapse + %ul.nav.navbar-nav + %li + %a{:href => "#", :onclick => "$(this).next('input').click();return false;"} + %span.fileinput-button{} + %i.icon-plus.icon-white + %span Ajouter des fichiers + %input{:multiple => "", :name => "files[]", :type => "file", :style => "display:none;"} + + + - .brand Fichiers - - - - - - - .container.nav-collapse - %ul.nav - %li - %a{:href => "#", :onclick => "$(this).next('input').click();"} - %span.fileinput-button{} - %i.icon-plus.icon-white - %span Ajouter des fichiers - %input{:multiple => "", :name => "files[]", :type => "file", :style => "display:none;"} - - @@ -135,9 +138,9 @@ - - - + + + diff --git a/app/views/admin/data_files/_show.html.haml b/app/views/admin/data_files/_show.html.haml index 526e688..3307a7d 100644 --- a/app/views/admin/data_files/_show.html.haml +++ b/app/views/admin/data_files/_show.html.haml @@ -1,18 +1,18 @@ .img{:style => ("background-image:url('"+(@data_file.file.url).to_s+"');")} - + .form - %table{:style => "width:100%"} - %tr - %td{:style => "width:120px"} Date d'ajout : - %td= l @data_file.created_at - =render :partial => "form" + %table{:style => "width:100%"} + %tr + %td{:style => "width:120px"} Date d'ajout : + %td= l @data_file.created_at + =render :partial => "form" #right_bar_clone - #right_bar_clone_buttons_left - = link_to i(:trash_stroke, :gray_light), admin_data_file_path(:id => @data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :confirm => 'Voulez-vous vraiment supprimer cette image ?', :method => :delete, :remote => true - - - = link_to i(:check_alt, :gray_light), "#",:onclick => "manager_send_data_file("+@data_file.id.to_s+");return false;" if params[:manager] and !params[:multiple] - - - - + #right_bar_clone_buttons_left + = link_to i(:"trash-o"), admin_data_file_path(:id => @data_file.id, :manager => params[:manager], :multiple => params[:multiple]), :confirm => 'Voulez-vous vraiment supprimer cette image ?', :method => :delete, :remote => true + + + = link_to i(:check_alt, :gray_light), "#",:onclick => "manager_send_data_file("+@data_file.id.to_s+");return false;" if params[:manager] and !params[:multiple] + + + + diff --git a/app/views/admin/data_files/index.html.haml b/app/views/admin/data_files/index.html.haml index 891b211..83dff9e 100644 --- a/app/views/admin/data_files/index.html.haml +++ b/app/views/admin/data_files/index.html.haml @@ -1,2 +1,2 @@ - -=render :partial => "index_block" \ No newline at end of file +%div{:style => ("position:absolute;bottom:0px;left:0px;right:0px;top:52px;" if !params[:manager])} + =render :partial => "index_block" \ No newline at end of file diff --git a/app/views/admin/file_folders/_file_folder.html.haml b/app/views/admin/file_folders/_file_folder.html.haml index 5785a87..727bcf9 100644 --- a/app/views/admin/file_folders/_file_folder.html.haml +++ b/app/views/admin/file_folders/_file_folder.html.haml @@ -1,14 +1,5 @@ %li{:class => (" active" if file_folder.id == params[:file_folder_id].to_i).to_s} - - =link_to file_folder.name, admin_data_files_path(:file_folder_id => file_folder.id, :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :class => "file_folder"+(" active" if file_folder.id == params[:file_folder_id].to_i).to_s, :id => "file_folder_"+file_folder.id.to_s,:"data-file_folder_id" => file_folder.id, :"data-file_folder_path" => admin_file_folder_path(:format => "js",:file_folder_id => file_folder.id, :manager => params[:manager], :multiple => params[:multiple], :id => file_folder.id), :"data-edit_file_folder_path" => edit_admin_file_folder_path(:format => "js",:file_folder_id => file_folder.id, :manager => params[:manager], :multiple => params[:multiple], :id => file_folder.id) - - -if file_folder.id == params[:file_folder_id].to_i - - = link_to i(:pencil),edit_admin_file_folder_url(:id => params[:file_folder_id], :file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :id => "edit_current_file_folder", :style => "display:inline-block; margin-right:5px;" - - = link_to i(:"trash-o"), admin_file_folder_url(:id => params[:file_folder_id],:file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :id => "remove_current_file_folder", :method => :delete, :confirm => "Voulez-vous vraiment supprimer cet file_folder ? Attention, toutes les images de celui-ci seront définitivement supprimées.", :style => "display:inline-block;" - - - - - + + =link_to file_folder.name, admin_data_files_path(:file_folder_id => file_folder.id, :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :class => "file_folder"+(" active" if file_folder.id == params[:file_folder_id].to_i).to_s, :id => "file_folder_"+file_folder.id.to_s,:"data-file_folder_id" => file_folder.id, :"data-file_folder_path" => admin_file_folder_path(:format => "js",:file_folder_id => file_folder.id, :manager => params[:manager], :multiple => params[:multiple], :id => file_folder.id), :"data-edit_file_folder_path" => edit_admin_file_folder_path(:format => "js",:file_folder_id => file_folder.id, :manager => params[:manager], :multiple => params[:multiple], :id => file_folder.id) + + \ No newline at end of file diff --git a/app/views/admin/file_folders/_file_folders.html.haml b/app/views/admin/file_folders/_file_folders.html.haml index 70aba8d..4b06e9e 100644 --- a/app/views/admin/file_folders/_file_folders.html.haml +++ b/app/views/admin/file_folders/_file_folders.html.haml @@ -1,6 +1,6 @@ %ul.nav.nav-list - =render @file_folders - - %li - = link_to i(:plus), new_admin_file_folder_url(:file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :id => "add_album" + =render @file_folders + + %li + =# link_to i(:plus), new_admin_file_folder_url(:file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :id => "add_album" diff --git a/app/views/admin/file_folders/_file_folders_navbar.html.haml b/app/views/admin/file_folders/_file_folders_navbar.html.haml new file mode 100644 index 0000000..a6ec442 --- /dev/null +++ b/app/views/admin/file_folders/_file_folders_navbar.html.haml @@ -0,0 +1,9 @@ += link_to ic(:plus), new_admin_file_folder_url(:file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :id => "add_file_folder" += link_to ic(:pencil),edit_admin_file_folder_url(:id => params[:file_folder_id], :file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :id => "edit_current_file_folder", :style => "display:inline-block; margin-right:5px;" + += link_to ic(:"trash-o"), admin_file_folder_url(:id => params[:file_folder_id],:file_folder_id => params[:file_folder_id], :manager => params[:manager], :multiple => params[:multiple]), :remote => true, :id => "remove_current_file_folder", :method => :delete, :"data-confirm" => "Voulez-vous vraiment supprimer cet file_folder ? Attention, toutes les images de celui-ci seront définitivement supprimées.", :style => "display:inline-block;" + + + + + diff --git a/app/views/admin/file_folders/edit.js.erb b/app/views/admin/file_folders/edit.js.erb index ee769f2..0d099f4 100644 --- a/app/views/admin/file_folders/edit.js.erb +++ b/app/views/admin/file_folders/edit.js.erb @@ -3,13 +3,13 @@ var new_file_folder_name = prompt("Nom de l'file_folder :\n <%= "Le nom que vous if(new_file_folder_name){ - $.ajax({url : $("#file_folder_<%=@file_folder.id %>").data('file_folder_path'), type: "PUT", data : { - file_folder : { - name: new_file_folder_name - } - } - - }); + $.ajax({url : $("#file_folder_<%=@file_folder.id %>").data('file_folder_path'), type: "PUT", data : { + file_folder : { + name: new_file_folder_name + } + } + + }); diff --git a/app/views/admin/file_folders/new.js.erb b/app/views/admin/file_folders/new.js.erb index 2fa38bb..1f35639 100644 --- a/app/views/admin/file_folders/new.js.erb +++ b/app/views/admin/file_folders/new.js.erb @@ -1,15 +1,15 @@ -var new_file_folder_name = prompt("Nom du dossier :\n <%= "Vous n'avez spécifié aucuns nom pour ce nouvel file_folder, ou le nom que vous avez chosi existe déjà." if @file_folder_create %>", "<%=escape_javascript(@file_folder.name) %>"); +var new_file_folder_name = prompt("Nom de l'file_folder :\n <%= "Vous n'avez spécifié aucuns nom pour ce nouvel file_folder, ou le nom que vous avez chosi existe déjà." if @file_folder_create %>", "<%=escape_javascript(@file_folder.name) %>"); if(new_file_folder_name){ - $.ajax({url : $("#file_folders").data('file_folders_url'), type: "POST", data : { - file_folder : { - name: new_file_folder_name - } - } - - }); + $.ajax({url : "/admin/file_folders?&manager=true&multiple=true", type: "POST", data : { + file_folder : { + name: new_file_folder_name + } + } + + });