Flashes

src/Gemfile

@@ -16,3 +16,5 @@ gem "bcrypt"
 gem "redcarpet"
 
 gem "rmagick", "~> 4.2"
+
+gem "sinatra-flash", "~> 0.3.0"

src/Gemfile.lock

@@ -26,6 +26,8 @@ GEM
       rack-protection (= 2.2.0)
       sinatra (= 2.2.0)
       tilt (~> 2.0)
+    sinatra-flash (0.3.0)
+      sinatra (>= 1.0.0)
     sinatra-reloader (1.0)
       sinatra-contrib
     slim (4.1.0)
@@ -45,6 +47,7 @@ DEPENDENCIES
   rmagick (~> 4.2)
   sassc
   sinatra
+  sinatra-flash (~> 0.3.0)
   sinatra-reloader
   slim
   sqlite3

src/app.rb

@@ -4,6 +4,7 @@ DEBUG = ARGV[0] == "debug"
 
 require "sinatra" 
 require "sinatra/reloader" if DEBUG # reload stuff
+require "sinatra/flash"
 require "slim" # template
 require "sqlite3" # db
 require "sassc" # SASS -> CSS precompiler
@@ -33,7 +34,7 @@ before do
 	if !is_logged_in && request.path_info.start_with?(*AUTH_ROUTES) then
 		session[:ret] = request.fullpath # TODO: return the user to the previous route
 		session[:status] = 403
-		session[:error_msg] = AUTH_ERRORS[:needed] 
+		flash[:error] = AUTH_ERRORS[:needed] 
 		redirect "/login"
 	end
 end
@@ -106,7 +107,7 @@ post "/register" do
 	status, ret = User.register(email, name, password, password_confirm)
 	Console.debug "/register STATUS: #{status}", ret
 	if !status then # if something went wrong then return to 0
-		session[:error_msg] = ret
+		flash[:error] = ret
 		redirect "/register"
 	else # if everything went right then continue
 		redirect "/login"
@@ -119,7 +120,7 @@ post "/login" do
 
 	status, ret = User.login(email, password)
 	if !status then # ret = error message
-		session[:error_msg] = ret
+		flash[:error] = ret
 		redirect "/login"
 	else # ret = userid
 		session[:userid] = ret 
@@ -145,8 +146,9 @@ post "/user/update" do
 	end
 
 	success, msg = get_current_user.update_creds data # update the user creds
-	if not success then session[:error_msg] = msg end	
+	if not success then flash[:error] = msg end	
 
+	flash[:success] = "Updated profile"
 	redirect "/settings"
 end
 
@@ -170,10 +172,8 @@ post "/auctions" do
 	category_choices = (params.select { |k, v| k.to_s.match(/^category-\d+/) }).map{ |k, v| v.to_i }
 	
 	newid, resp = Auction.create user_id, title, description, init_price, delta_time, category_choices
-	p "###################"
-	p newid
-	p "###################"
 
+	flash[:success] = "Auction posted!"
 	redirect "/auctions/#{newid}"
 end
 

src/func.rb

@@ -13,10 +13,6 @@ end
 
 # Serve templates
 def serve(template, locals={}, layout: :layout)
-	# Insert the error locals (if it exists)
-	locals[:error_msg] = session[:error_msg] or ""
-	session[:error_msg] = nil
-
 	locals[:session_user] = get_current_user unless !is_logged_in
 
 	# Serve the slim template

src/views/empty.slim

@@ -6,4 +6,8 @@ html lang="en"
     title The Auction House 
   body
     .content-container
+      .flash
+        - flash.each do |k, v|
+            div class="flash-#{k}"
+              | #{v}
       ==yield

src/views/layout.slim

@@ -28,7 +28,10 @@ html lang="en"
               li
                 a.inlbutton href="/profile" target="_self" 
                   img.avatar src="#{session_user.avatar}" alt="Profile"
-
     .content-container
+      .flash
+        - flash.each do |k, v|
+            div class="flash-#{k}"
+              | #{v}
       ==yield
 

src/views/stylesheets/style.sass

@@ -141,10 +141,25 @@ a.button:hover
   color: $fg_alt_clr
   background-color: $special_clr
 
-label.error_msg
-  color: $fg_error
+.flash
+  position: absolute
+  text-align: center
+  top: 5rem
   font-size: 1rem
   font-weight: bold
+  animation: flash .2s ease-in alternate
+
+  &-error
+    color: $fg_error
+    padding: 8px
+    border: $border_size solid $red_clr
+    border-radius: $border_radius
+
+  &-success
+    color: $green_clr
+    padding: 8px
+    border: $border_size solid $green_clr
+    border-radius: $border_radius
 
 img.avatar, img.avatar_big
   background: $bg_clr
@@ -368,9 +383,14 @@ ul.button-container
         padding: 0 .2rem
         border: $border_size solid $border_clr
 
-
-
 // Auctions
-#auctinos
+#auctions
   display: flex
   flex-direction: column
+
+// Animation keyframes
+@keyframes flash
+  0%
+    opacity: 0
+  100%
+    opacity: 1

src/views/user/login.slim

@@ -1,7 +1,6 @@
 .form-container
   form action="/login" method="post"
     h2 Log in
-    label.error_msg = error_msg 
     input type="text" name="email" placeholder="Email"
     input type="password" name="password" placeholder="Password"
     input type="submit" value="Log in"

src/views/user/register.slim

@@ -1,7 +1,6 @@
 .form-container
   form action="/register" method="post"
     h2 Register Account
-    label.error_msg = error_msg
     input type="text" name="email" placeholder="Email"
     input type="text" placeholder="Name" oninput="this.reportValidity()" title="#{REGISTER_ERRORS[:name_desc]}" maxlength="#{MAX_NAME_LEN}" name="name" pattern="#{NAME_REGEX_STR}"
     input type="password" name="password" placeholder="Password"

src/views/user/settings.slim

@@ -2,7 +2,6 @@
   h1.tcenter = "#{session_user.name}'s Settings"
   .form-container
     form action="/user/update" method="post" enctype="multipart/form-data"
-      label.error_msg = error_msg
       img.avatar_big src="#{session_user.avatar_url}" alt="Your avatar"
       label Change avatar
       input type="file" name="image" accept="image"