User Settings: Profile avatars

src/app.rb

@@ -11,7 +11,7 @@ require "colorize" # colors for debug
 require "bcrypt" # password digest
 # TODO: remove redcarpet dep
 require "redcarpet" # markdown renderer
-require "mini_magick" # image manipulation
+require "rmagick" # image manipulation
 
 require_relative "config" # config stuff
 require_relative "debug" # debug methods
@@ -61,7 +61,7 @@ get "/profile/:id" do
 	if userobj then
 		serve :"user/profile", {user: userobj}
 	else
-		serve :"404"
+		raise Sinatra::NotFound
 	end
 end
 
@@ -124,14 +124,13 @@ get "/logout" do # TODO: make me post
 	redirect "/"
 end
 
-
 post "/user/update" do
-
-	path = "./public/avatars/#{session[:userid]}.png"
+	imgdata = params[:image][:tempfile] 
+	save_image imgdata.read, "./public/avatars/#{session[:userid]}.png"
 
 	data = {
 		bio_text: params["bio"],
-		avatar_url: params["avatar_url"]
+		avatar_url: "/avatars/#{session[:userid]}.png"
 	}
 	User.update(data, "id = ?", session[:userid])
 	redirect "/settings"

src/func.rb

@@ -24,14 +24,10 @@ def serve(template, locals={}, layout: :layout)
 end
 
 # Save image
-def save_image params, path
-	if params[:image] && params[:image][:filename]
-		filename = params[:image][:filename]
-		file = params[:image][:tempfile]
-
-		# Write file to disk
-		File.open(path, 'wb') do |f|
-			f.write(file.read)
-		end
+def save_image imgdata, path
+	image = Magick::Image.from_blob(imgdata).first
+	image.format = "PNG"
+	File.open(path, 'wb') do |f|
+		image.resize_to_fill(512, 512).write(f) 
 	end
 end

src/views/stylesheets/style.sass

@@ -185,6 +185,14 @@ ul.button-container
     max-width: 400px
     border-radius: .4rem
 
+    textarea
+      background-color: $bg_alt_clr
+      color: $fg_alt_clr
+      font-size: 1rem
+      resize: none
+      border: $border_size solid $border_clr
+      border-radius: $border_radius
+
     label
       color: $fg_alt_clr
       opacity: .8
@@ -209,6 +217,10 @@ ul.button-container
       font-size: 1.2rem
       padding: .2rem 1rem
 
+    input[type=file]
+      padding: 0
+      font-size: .9rem
+
     input[type=submit]
       background: $bg_clr
       transition: color .2s
@@ -328,3 +340,4 @@ ul.button-container
     form
       background-color: $bg_alt_clr
       border: $border_size solid $border_clr
+

src/views/user/settings.slim

@@ -1,11 +1,11 @@
 #settings
   h1.tcenter = "#{session_user.name}'s Settings"
   .form-container
-    form action="/user/update" method="post"
+    form action="/user/update" method="post" enctype="multipart/form-data"
 
       img.avatar_big src="#{session_user.avatar_url}" alt="Your avatar"
       label Change avatar
-      input type="file" name="avatar_file"
+      input type="file" name="image" accept="image"
 
       label Biography
       textarea name="bio" cols="20" rows="5" placeholder="Tell us about yourself!" value="#{session_user.bio_text}"