Add preview image in the User edit form

Gemfile

@@ -20,12 +20,14 @@ gem 'devise'
 gem 'devise-i18n'
 
 gem 'simple_form'
+gem 'simple_form_fancy_uploads', github: 'apeacox/simple_form_fancy_uploads'
 
 # Phone validation
 gem 'phony_rails'
 
 # Picture uploads
 gem 'carrierwave'
+gem 'rmagick'
 
 gem 'capistrano'
 gem 'capistrano-rails'

Gemfile.lock

@@ -1,3 +1,12 @@
+GIT
+  remote: git://github.com/apeacox/simple_form_fancy_uploads.git
+  revision: a135aad8f17cbf219a30ce5a30709406e277f7e0
+  specs:
+    simple_form_fancy_uploads (0.1.0)
+      carrierwave
+      rails (>= 4.0.0)
+      simple_form (~> 3.0)
+
 GEM
   remote: https://rubygems.org/
   specs:
@@ -167,6 +176,7 @@ GEM
     rb-inotify (0.9.5)
       ffi (>= 0.5.0)
     ref (1.0.5)
+    rmagick (2.13.3)
     rspec (3.0.0)
       rspec-core (~> 3.0.0)
       rspec-expectations (~> 3.0.0)
@@ -266,9 +276,11 @@ DEPENDENCIES
   rails (= 4.1.5)
   rails-erd
   rails-i18n
+  rmagick
   rspec-rails
   sass-rails (~> 4.0.3)
   simple_form
+  simple_form_fancy_uploads!
   slim-rails
   spring
   spring-commands-rspec

app/assets/stylesheets/forms.css.scss

@@ -28,6 +28,18 @@
         width: 50em;
     }
 
+    img {
+        padding: 5px;
+        display: block;
+        border: 1px solid #CCC;
+        background-color: #F1F1F1;
+
+    }
+
+    img+input.image_preview  {
+        margin-left: 12.7em;
+    }
+
 }
 
 .input label.boolean {

app/uploaders/picture_uploader.rb

@@ -1,7 +1,7 @@
 class PictureUploader < CarrierWave::Uploader::Base
 
   # Include RMagick or MiniMagick support:
-  # include CarrierWave::RMagick
+  include CarrierWave::RMagick
   # include CarrierWave::MiniMagick
 
   # Choose what kind of storage to use for this uploader:
@@ -30,9 +30,9 @@ class PictureUploader < CarrierWave::Uploader::Base
   # end
 
   # Create different versions of your uploaded files:
-  # version :thumb do
-  #   process :resize_to_fit => [50, 50]
-  # end
+  version :thumb do
+    process :resize_to_fit => [50, 50]
+  end
 
   # Add a white list of extensions which are allowed to be uploaded.
   # For images you might use something like this:

app/views/devise/registrations/edit.html.slim

@@ -1,9 +1,9 @@
-= simple_form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f|
+= simple_form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put, multipart: true }) do |f|
   .form_inputs
     h2.entry-title Лекторски профил
     = f.error_notification
     = f.simple_fields_for :speaker_profile do |ff|
-      = ff.input :picture, as: :file
+      = ff.input :picture, as: :image_preview, input_html: {preview_version: :thumb}
       = ff.input :first_name, autofocus: true
       = ff.input :last_name
       = ff.input :public_email