a better look for course#show #31

happypeter · Dec 13, 2012 · 2e4ab0d · 2e4ab0d
1 parent 1497901
commit 2e4ab0d
Show file tree

Hide file tree

Showing 25 changed files with 164 additions and 128 deletions.
diff --git a/Gemfile b/Gemfile
@@ -8,6 +8,7 @@ gem 'rails', '3.2.8'
 gem 'mysql2'
 gem "cancan"
 gem 'unicorn'
+gem 'redcarpet'
 
 
 # Gems used only for assets and not required

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -103,6 +103,7 @@ GEM
     rake (0.9.2.2)
     rdoc (3.12)
       json (~> 1.4)
+    redcarpet (2.1.1)
     sass (3.2.1)
     sass-rails (3.2.5)
       railties (~> 3.2.0)
@@ -140,6 +141,7 @@ DEPENDENCIES
   jquery-rails
   mysql2
   rails (= 3.2.8)
+  redcarpet
   sass-rails (~> 3.2.3)
   therubyracer
   uglifier (>= 1.0.3)

diff --git a/app/assets/stylesheets/application.css.scss.erb b/app/assets/stylesheets/application.css.scss.erb
@@ -26,6 +26,7 @@ ul {
 body {
   position: relative;
   padding-top: 40px;
+  background-color: $light-gray;
 }
 
 body > .navbar {

diff --git a/app/assets/stylesheets/comment.css.scss b/app/assets/stylesheets/comment.css.scss
@@ -1,31 +1,22 @@
 $comment-color: #E0E8EC;
 div.comment {
-  margin-bottom: 15px;
-  border: solid 1px darken($comment-color, 20%);
-  &:hover {
-    border: solid 1px darken($comment-color, 40%);
-  }
   a {
     text-decoration:none;
     &:hover {
       text-decoration: underline; 
     }
   }
   .comment_head {
-    padding: 5px;
     font-weight: bold;
     font-size: 80%;
     color: hsl(0, 0%, 40%);
-    border-bottom: solid 1px darken($comment-color, 40%);
-    margin-bottom: 5px;
     .comment_time {
       float: right;
       margin-right: 10px;
     }
   }
   .comment_body {
     position: relative;
-    padding: 10px;
     ul.actions {
       margin-top: 0px;
       position: absolute;
@@ -45,19 +36,20 @@ div.comment {
   }
   #comment_box {
     margin-top: 10px;
+    text-align: center;
     textarea
     {
-      width: 930px;
+      width: 100%;
       height: 88px;
       margin-bottom: 9px;
-      margin-left:10px;
-      margin-right:10px;
+      padding: 0;
       @include textarea-style;
     }
   }
   #comment_btn {
     margin-top: 10px;
     float: right;
+    margin-bottom: 40px;
   }
 }
 
diff --git a/app/assets/stylesheets/course.css.scss b/app/assets/stylesheets/course.css.scss
@@ -1,28 +1,15 @@
+.course-show {
+  margin-top: 40px;
+}
 div#html5-player {
   border: 1px solid $light-gray;
   width: 768px;
   margin: 0 auto;
   video#videojs {
     display: block;
   }
-  #title_area {
-   padding: 10px;
-   border: 3px solid $light-blue;
-   h2 {
-     margin-bottom: -10px;
-   }
-   p.light {
-     font-size: 90%;
-     color: $light-green;
-   }
-  }
-}
-#video_create_box {
-  padding-left: 40px;
 }
-
 .all_courses_container {
-  background-color: $light-gray;
   padding-bottom: 50px;
   padding-top: 50px;
   margin-bottom: 30px;
@@ -46,3 +33,6 @@ div#html5-player {
     }
   }
 }
+#course_info {
+  margin-top: 30px;
+}
diff --git a/app/assets/stylesheets/global.css.scss b/app/assets/stylesheets/global.css.scss
@@ -19,7 +19,6 @@ $light-blue: #7ac9de;
 }
 @mixin textarea-style {
   display: inline-block;
-  padding: 5px;
   border: 1px solid darken($light-gray, 20%);
   font-size: 120%;
   @include rounded-corners(3px);
@@ -30,3 +29,25 @@ $light-blue: #7ac9de;
     @include onestep-shadow;
   }
 }
+.box {
+  background: white;
+  border-radius: 3px;
+  box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.15);
+  border-bottom: 1px solid #E2E2E9;
+  margin-bottom: 20px;
+
+  .cell, .box-header {
+    padding: 10px;
+    border-bottom: 1px solid #F0F0F0;
+  }
+
+  .inner {
+    padding: 10px;
+  }
+
+  .header {
+    padding: 10px;
+    border-bottom: 1px solid #E2E2E2;
+  }
+}
+
diff --git a/app/assets/stylesheets/vendor/bootstrap.css.scss b/app/assets/stylesheets/vendor/bootstrap.css.scss
@@ -9,6 +9,7 @@
 @import "bootstrap/scaffolding";
 @import "bootstrap/grid";
 @import "bootstrap/layouts";
+@import "bootstrap/alerts";
 
 @import "bootstrap/buttons";
 @import "bootstrap/navs";

diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb
@@ -23,9 +23,9 @@ def create
     respond_to do |format|
       format.html do
         if @comment.errors.present?
-          render :new
+          redirect_to_target_or_default root_url
         else
-          redirect_to(course_path(@comment.course))
+          redirect_to_target_or_default root_url
         end
       end
       format.js
@@ -35,7 +35,7 @@ def create
   def update
     respond_to do |format|
       if @comment.update_attributes(params[:comment])
-        format.html { redirect_to @comment.course, notice: 'comment was successfully updated.' }
+        format.html { redirect_to_target_or_default root_url, notice: 'comment was successfully updated.' }
         format.json { head :no_content }
       else
         format.html { render action: "edit" }

diff --git a/app/controllers/courses_controller.rb b/app/controllers/courses_controller.rb
@@ -29,12 +29,13 @@ def show
   end
 
   def edit
+    @course = Course.find_by_name(params[:course_name])
   end
 
   def update
     respond_to do |format|
       if @course.update_attributes(params[:course])
-        format.html { redirect_to(@course, :notice => 'Course was successfully updated.') }
+        format.html { redirect_to_target_or_default root_url, :success => 'Course was successfully updated.' }
       else
         format.html { render :action => "edit" }
       end
@@ -44,9 +45,9 @@ def update
   def create
     course = Course.new(params[:course])
     if course.save
-      redirect_to :root, :notice => "New course created successfully!"
+      redirect_to_target_or_default :root, :notice => "New course created successfully!"
     else
-      redirect_to :root, :notice => "Failed to creat new course!"
+      redirect_to_target_or_default :root, :notice => "Failed to creat new course!"
     end
   end
 end
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
@@ -6,4 +6,16 @@ def poster_link(course)
       "http://media.happycasts.net/hpcasts/screenshots/default.png"
     end
   end
+  def markdown(text)
+    renderer = Redcarpet::Render::HTML.new(hard_wrap: true, filter_html: true)
+    options = {
+      autolink: true,
+      no_intra_emphasis: true,
+      fenced_code_blocks: true,
+      lax_html_blocks: true,
+      strikethrough: true,
+      superscript: true
+    }
+    Redcarpet::Markdown.new(renderer, options).render(text).html_safe
+  end
 end
diff --git a/app/models/ability.rb b/app/models/ability.rb
@@ -3,8 +3,7 @@ class Ability
 
   def initialize(user)
       user ||= User.new # guest user (not logged in)
-      can :manage, :all # for testing
-      can :read, :all
+      can :manage, :all # cancan not in use now
       if user.admin?
         can :manage, :all
       end

diff --git a/app/views/comments/_editable_comment.html.erb b/app/views/comments/_editable_comment.html.erb
@@ -1,19 +1,21 @@
 <%= div_for editable_comment do %>
-    <div class="comment_head">
+  <div class="box">
+    <div class="box-header comment_head">
       <i class="icon-comment"></i> 
       <%= link_to editable_comment.user.name, editable_comment.user%>
        说
       <span class="comment_time">
           <%= time_ago_in_words editable_comment.created_at  %>前
       </span>
     </div>
-    <div class="comment_body">
+    <div class="inner comment_body">
       <% if current_user.try(:id) == editable_comment.user.id %>
         <ul class="actions">
           <li><%= link_to t("edit"), edit_comment_path(editable_comment), :class => "btn btn-small" %></li>
           <li><%= link_to t("delete"), editable_comment, :confirm => "Are you sure you want to delete this comment?", :method => :delete, :class => "btn btn-small" %></li>
         </ul>
       <% end %>
-      <%= editable_comment.content %>
+      <%= markdown editable_comment.content %>
     </div>
+  </div>
 <% end %>
diff --git a/app/views/comments/edit.html.erb b/app/views/comments/edit.html.erb
@@ -1,3 +1,3 @@
-<h1>Editing comment</h1>
-
-<%= render 'form' %>
+<div class="container">
+  <%= render 'form' %>
+</div>
diff --git a/app/views/comments/index.html.erb b/app/views/comments/index.html.erb
@@ -1,4 +1,3 @@
-<p id="notice"><%= notice %></p>
 <h1>Listing comments</h1>
 
 <table>

diff --git a/app/views/courses/_add_class.html.erb b/app/views/courses/_add_class.html.erb
@@ -1,28 +1,30 @@
-<h3><%= t("add_class") %></h3>
-<% if course.videos.empty? %>
-  <% this_video_no = 0 %>
-<% else %>
-  <% this_video_no = course.videos.reorder('no').last.no + 1 %>
-<% end  %>
+<div class="box">
+  <h3 class="box-header"><%= t("add_class") %></h3>
+  <% if course.videos.empty? %>
+    <% this_video_no = 0 %>
+  <% else %>
+    <% this_video_no = course.videos.reorder('no').last.no + 1 %>
+  <% end  %>
 
-<div id="video_create_box">
-  <%= form_for(Video.new(:course_id => course.id)) do |f| %>
-    <%= f.label t("video_no") %>
-    <%= f.select :no, ((0..20).map {|i| [i,i] }),  :selected => this_video_no  %>
-    (第0课为课程简介，第一课序号为1，以此类推)
-    <br>
-    <br>
-    <%= f.hidden_field :course_id %>
-    <% if not course.videos.empty? %>
-      <%= f.label t("video_title") %>
-      <%= f.text_field :title %>
+  <div class="inner">
+    <%= form_for(Video.new(:course_id => course.id)) do |f| %>
+      <%= f.label t("video_no") %>
+      <%= f.select :no, ((0..20).map {|i| [i,i] }),  :selected => this_video_no  %>
+      (第0课为课程简介，第一课序号为1，以此类推)
       <br>
       <br>
+      <%= f.hidden_field :course_id %>
+      <% if not course.videos.empty? %>
+        <%= f.label t("video_title") %>
+        <%= f.text_field :title %>
+        <br>
+        <br>
+      <% end %>
+      <%= f.label t("video_link") %>
+      <%= f.text_field :link %>
+      <br>
+      <br>
+      <%= f.submit "#{t('add_this_video')}", :class => "btn btn-success", :id => "comment_btn" %>
     <% end %>
-    <%= f.label t("video_link") %>
-    <%= f.text_field :link %>
-    <br>
-    <br>
-    <%= f.submit "#{t('add_this_video')}", :class => "btn btn-success", :id => "comment_btn" %>
-  <% end %>
+  </div>
 </div>
diff --git a/app/views/courses/_course_info.html.erb b/app/views/courses/_course_info.html.erb
@@ -0,0 +1,23 @@
+<div id="course_info" class="row-fluid">
+  <div class="course_intro box span4">
+    <h2 class="box-header">
+      <%= course.title %>
+    </h2>
+    <div class ="inner">
+      <p class="light"><%=course.cat.titleize %><p>
+      <p><%= course.description %><p>
+      <p>
+      <% if current_user && current_user.admin? %>
+        <%= link_to 'Edit', "/edit/#{course.name}"%>
+      <% end %>
+      </p>
+    </div>
+  </div>
+  <div class="videos  box span8">
+    <h3 class="box-header"><%= t("all_videos") %></h3>
+    <div class ="inner">
+      <%= render "videos", :videos  => course.videos.reorder('no'), :current_video => video %>
+    </div>
+  </div>
+</div>
+
diff --git a/app/views/courses/_video_player.html.erb b/app/views/courses/_video_player.html.erb
@@ -2,17 +2,5 @@
   <video id="videojs" class="video-js vjs-default-skin" controls autoplay width="768" height="576" poster="" preload="auto" data-setup="{}">
   <source src="<%= video.link %>" type="video/mp4"/ >
   </video>
-  <div id="title_area">
-    <h2>
-      <%= video.course.title %>
-    </h2>
-    <p class="light"><%=video.course.cat.titleize %><p>
-    <p><%= video.course.description %><p>
-    <p>
-    <% if can? :edit, :course %>
-      <%= link_to 'Edit', edit_course_path(@course) %>
-    <% end %>
-    </p>
-  </div>
 </div>
 
diff --git a/app/views/courses/edit.html.erb b/app/views/courses/edit.html.erb
@@ -1,6 +1,8 @@
-<h1> Edit </h1>
+<div class="container">
+  <h1> Edit </h1>
 
-<%= render 'form' %>
+  <%= render 'form' %>
 
-<%= link_to 'Show', @course %> |
-<%= link_to 'Back', courses_path %>
+  <%= link_to 'Show', @course %> |
+  <%= link_to 'Back', courses_path %>
+</div>