Refactored user profiles

dominic · dominic · commit 863c9376389a · 2012-01-08T21:54:35.000-05:00
* Unified user's question and answer lists
* Updated user info sidebar styles
* User edit page uses correct form elements and appropriate sidebar
diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss
@@ -15,4 +15,5 @@
 @import "home.css.scss";
 @import "questions.css.scss";
 @import "programs.css.scss";
+@import "users.css.scss";
 
diff --git a/app/assets/stylesheets/content.css.scss b/app/assets/stylesheets/content.css.scss
@@ -11,6 +11,27 @@ h2 {
   margin-bottom: 0.5em;
 }
 
+.heading {
+  @include clearfix;
+  padding: 0.75em;
+  background: $green;
+
+  h3, .description {
+    color: white;
+  }
+
+  h3 {
+    float: left;
+    margin-bottom: 0;
+    margin-right: 1em;
+  }
+  .description {
+    float: left;
+    margin-top: 0.2em;
+  }
+}
+
+
 .block-message {
   margin-bottom: 0.5em;
   p {
diff --git a/app/assets/stylesheets/layout.css.scss b/app/assets/stylesheets/layout.css.scss
@@ -3,9 +3,14 @@ html {
 }
 
 body {
+  color: $text-color;
   background: $background url("square_bg.png") fixed;
 }
 
+p,h1,h2,h3,h4,h5 {
+  color: $text-color;
+}
+
 .topbar {
   position: relative;
   height: auto;
@@ -86,9 +91,6 @@ header .topbar-inner {
 
 }
 
-p,h1,h2,h3,h4,h5 {
-  color: $text-color;
-}
 
 .alert-message {
   margin-top: -18px;
diff --git a/app/assets/stylesheets/programs.css.scss b/app/assets/stylesheets/programs.css.scss
@@ -1,26 +1,6 @@
 .programs {
 
   margin-bottom: 2em;
-  .heading {
-    @include clearfix;
-    padding: 0.75em;
-    background: $green;
-
-    h3, .description {
-      color: white;
-    }
-
-    h3 {
-      float: left;
-      margin-bottom: 0;
-      margin-right: 1em;
-    }
-    .description {
-      float: left;
-      margin-top: 0.2em;
-    }
-  }
-
 
   ul {
     @include clearfix;
diff --git a/app/assets/stylesheets/users.css.scss b/app/assets/stylesheets/users.css.scss
@@ -0,0 +1,23 @@
+.user-questions, .user-answers {
+  ul {
+    margin: 0;
+    list-style-type: none;
+    padding: 1em 0;
+
+    li {
+      @include clearfix;
+      padding-bottom: 0.5em;
+      border-bottom: 1px solid #ddd;
+      margin-bottom: 0.5em;
+
+      .title, .description {
+        @include columns(8);
+      }
+
+      .meta {
+        @include columns(3, true);
+        text-align: right;
+      }
+    }
+  }
+}
diff --git a/app/models/answer.rb b/app/models/answer.rb
@@ -2,6 +2,7 @@ class Answer
   include MongoMapper::Document
 
   key :description, String
+  timestamps!
 
   validates_presence_of :description
 
diff --git a/app/views/devise/registrations/edit.html.erb b/app/views/devise/registrations/edit.html.erb
diff --git a/app/views/devise/registrations/edit.html.haml b/app/views/devise/registrations/edit.html.haml
@@ -0,0 +1,21 @@
+- content_for :title do
+  Edit #{resource_name.to_s.humanize}
+
+= simple_form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => { :method => :put }) do |f|
+  = f.error_notification
+  .inputs
+    = f.input :username, :autofocus => true
+    = f.input :email, :autofocus => true
+  .inputs
+    = f.input :password, :hint => "Leave it blank if you don't want to change it", :required => false
+    = f.input :password_confirmation, :required => false
+  .inputs
+    = f.input :about, :as => :text
+  .actions
+    = f.button :submit, "Update", :class => "btn primary"
+
+- content_for :sidebar do
+  %section
+    %h2 Cancel my account
+    %p
+      Unhappy? #{link_to "Cancel my account", registration_path(resource_name), :confirm => "Are you sure?", :method => :delete}.
diff --git a/app/views/users/_form.html.erb b/app/views/users/_form.html.erb
diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml
@@ -1,5 +1,5 @@
 - content_for :title do
-  = "#{resource.username}'s page"
+  = "#{resource.username}'s Profile"
 
 -content_for :sidebar do
   %section.about-user
@@ -14,9 +14,8 @@
           = f.hidden_field :followee, :value => resource.id
           = f.button :submit, :value => "Follow", :class => "primary btn"
 
-    %h2= "About #{resource.username}"
-    %h4= resource.about
-    %hr
+    - unless resource.about.blank?
+      %p= resource.about
     %p
       = link_to pluralize(resource.programs.count, "Program"), user_programs_path(resource), :class => "user-programs"
     %p
@@ -31,21 +30,25 @@
 
 
 - unless @user.questions.empty?
-  %section.questions
-    %header
-      %h2 Questions
-    - @user.questions.each do |question|
-      %article.question
-        %h4= link_to question.title, question_path(question)
+  %section.user-questions
+    .heading
+      %h3= pluralize(@user.questions.count, "Question")
+    %ul
+      - @user.questions.each do |question|
+        %li
+          .title
+            = link_to question.title, question_path(question)
+          .meta
+            asked #{question.created_at.strftime("%b %e, %l:%M %p")}
 
 - unless @user.answers.empty?
-  %section.answers
-    %header
-      %h2 Answers
-    - @user.answers.each do |answer|
-      %article.answer
-        %h4
-          = "#{@user.username} answered"
-          = link_to(answer.question.title, answer.question)
-          with:
-        %p= answer.description
+  %section.user-answers
+    .heading
+      %h3= pluralize(@user.answers.count, "Answer")
+    %ul
+      - @user.answers.each do |answer|
+        %li
+          .description
+            = answer.description.truncate(100)
+          .meta
+            = link_to("View Answer", answer.question)
diff --git a/features/step_definitions/user_steps.rb b/features/step_definitions/user_steps.rb
@@ -19,7 +19,7 @@ def login_user
 
 Then /^it should have the right information$/ do
   page.should have_selector('title', :content => "#{@user.username}'s page")
-  page.should have_content("About #{@user.username}")
+  page.should have_content("#{@user.username}'s Profile")
 end
 
 When /^I edit my profile$/ do

Original file line number	Diff line number	Diff line change
`@@ -3,9 +3,14 @@ html {`
`3`	`3`	`}`
`4`	`4`
`5`	`5`	`body {`
	`6`	`+ color: $text-color;`
`6`	`7`	`background: $background url("square_bg.png") fixed;`
`7`	`8`	`}`
`8`	`9`
	`10`	`+p,h1,h2,h3,h4,h5 {`
	`11`	`+ color: $text-color;`
	`12`	`+}`
	`13`	`+`
`9`	`14`	`.topbar {`
`10`	`15`	`position: relative;`
`11`	`16`	`height: auto;`
`@@ -86,9 +91,6 @@ header .topbar-inner {`
`86`	`91`
`87`	`92`	`}`
`88`	`93`
`89`		`-p,h1,h2,h3,h4,h5 {`
`90`		`- color: $text-color;`
`91`		`-}`
`92`	`94`
`93`	`95`	`.alert-message {`
`94`	`96`	`margin-top: -18px;`