From 0e151e5e1d37a58d20ca0104f95fa1d2fbfcae7b Mon Sep 17 00:00:00 2001
From: Rekai Musuka <musukarekai@gmail.com>
Date: Thu, 6 Sep 2018 12:32:44 +0100
Subject: [PATCH] Website now supports non 1:1 aspect ratio images

---
 app/uploaders/photo_uploader.rb   | 3 +++
 app/views/pages/_contact.html.erb | 7 +++++--
 app/views/shared/_navbar.html.erb | 4 +++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/app/uploaders/photo_uploader.rb b/app/uploaders/photo_uploader.rb
index a700b37..a9dc606 100644
--- a/app/uploaders/photo_uploader.rb
+++ b/app/uploaders/photo_uploader.rb
@@ -1,3 +1,6 @@
 class PhotoUploader < CarrierWave::Uploader::Base
   include Cloudinary::CarrierWave
+
+  process convert: "jpg"
+  process tags: ["profile_picture"]
 end
diff --git a/app/views/pages/_contact.html.erb b/app/views/pages/_contact.html.erb
index e95836c..86f0f0d 100644
--- a/app/views/pages/_contact.html.erb
+++ b/app/views/pages/_contact.html.erb
@@ -3,7 +3,9 @@
     <% if contact.photo.url.nil? %>
       <img src="https://upload.wikimedia.org/wikipedia/commons/8/89/Portrait_Placeholder.png" class="avatar profile dropdown-toggle img-circle" width=65>
     <% else %>
-      <%= cl_image_tag contact.photo, class: "profile avatar dropdown-toggle img-circle", width:65%>
+      <%= cl_image_tag(contact.photo, class: "profile avatar dropdown-toggle img-circle", width:65, transformation: [
+          { gravity: "face:auto", width: 100, height: 100, radius: "max", crop: "crop" }
+        ])%>
     <% end %>
     <div class="text text-color">
       <% if contact.first_name.nil? || contact.last_name.nil? %>
@@ -39,7 +41,8 @@
               <% if contact.photo.url.nil? %>
                 <img src="https://upload.wikimedia.org/wikipedia/commons/8/89/Portrait_Placeholder.png" class="avatar profile dropdown-toggle img-circle modal-picture" width=150>
               <% else %>
-                <%= cl_image_tag contact.photo, class: "profile avatar dropdown-toggle img-circle modal-picture", width:150%>
+                <%= cl_image_tag(contact.photo, class: "profile avatar dropdown-toggle img-circle modal-picture", width:150, transformation: [
+          { gravity: "face:auto", width: 100, height: 100, radius: "max", crop: "crop" }])%>
               <% end %>
               <div class="modal-text">
                 <h4 class="modal-title" id="myModalLabel">Calling</h4>
diff --git a/app/views/shared/_navbar.html.erb b/app/views/shared/_navbar.html.erb
index 0369080..5c2a24d 100644
--- a/app/views/shared/_navbar.html.erb
+++ b/app/views/shared/_navbar.html.erb
@@ -15,7 +15,9 @@
             <% if current_user.photo.url.nil? %>
               <img src="https://upload.wikimedia.org/wikipedia/commons/8/89/Portrait_Placeholder.png" class="avatar dropdown-toggle img-circle">
             <% else %>
-              <%= cl_image_tag current_user.photo, class: "avatar dropdown-toggle img-circle"%>
+              <%= cl_image_tag(current_user.photo, class: "avatar dropdown-toggle img-circle", transformation: [
+          { gravity: "face:auto", width: 100, height: 100, radius: "max", crop: "crop" }
+        ])%>
             <% end %>
           </div>
           <ul class="dropdown-menu dropdown-menu-right polyglot-dropdown">