crowdblog 0.0.12 → 0.0.13

data/Gemfile.lock

@@ -9,7 +9,7 @@ GIT
 PATH
   remote: .
   specs:
-    crowdblog (0.0.12)
+    crowdblog (0.0.13)
       backbone-rails
       carrierwave
       devise

data/app/assets/javascripts/crowdblog/templates/posts/edit.jst.eco.slim

@@ -1,21 +1,24 @@
 h2 <%= (if @isNew then 'New' else 'Edit') %> Post
 
-= form_tag '/', class: 'form-horizontal' do
+= form_tag '/' do
   fieldset
-    .control-group.title
-      = label_tag 'post_title', 'Title', class: 'control-label'
-      .controls
-        = text_field_tag 'post_title', "<%= @post.title %>".html_safe, class: 'input-xlarge span7'
-        span.help-inline.title
+    .fields.span5
+      .control-group.title
+        = label_tag 'post_title', 'Title', class: 'control-label'
+        .controls
+          = text_field_tag 'post_title', "<%= @post.title %>".html_safe, class: 'input-xlarge span5'
+          span.help-inline.title
 
-    .control-group.body
-      = label_tag 'post_body', 'Body', class: 'control-label'
-      .controls
-        = text_area_tag 'post_body', "<%= @post.body %>".html_safe, class: 'span9', rows: 30
-        span.help-inline= link_to 'Markdown syntax', 'http://daringfireball.net/projects/markdown/syntax', target: '_BLANK'
+      .control-group.body
+        = label_tag 'post_body', 'Body', class: 'control-label'
+        .controls
+          = text_area_tag 'post_body', "<%= @post.body %>".html_safe, class: 'span5', rows: 30
+          span.help-inline= link_to 'Markdown syntax', 'http://daringfireball.net/projects/markdown/syntax', target: '_BLANK'
+
+    #post_preview.span6
 
     | <% unless @isNew: %>
-    #attachments.row
+    #attachments.row-fluid.clear
       h2 Attachments
       .span8.attachment-list
         | <% for asset in @post.assets: %>
@@ -25,9 +28,9 @@ h2 <%= (if @isNew then 'New' else 'Edit') %> Post
         #uploader
 
     | <% end %>
-    .form-actions
+    .form-actions.clear
       .row
         .span1
           button.btn.btn-primary.update Save
         .span1
-          button.btn.btn-danger.cancel Cancel
+          button.btn.btn-danger.cancel Cancel

data/app/assets/javascripts/crowdblog/views/posts/edit_post_view.js.coffee

@@ -1,6 +1,7 @@
 $ ->
   PostsApp.EditPostView = Backbone.View.extend
     events:
+      'keyup #post_body' : 'updatePreview'
       'click .cancel' : 'cancelPost'
       'click .update' : 'updatePost'
 
@@ -10,6 +11,7 @@ $ ->
     render: ->
       this.model.fetch()
       this.$el.html(this.template({post: this.model.toJSON(), isNew: this.model.isNew()}))
+      @updatePreview()
       this
 
     cancelPost: (e) ->
@@ -30,6 +32,9 @@ $ ->
             this.$('.control-group.' + key).addClass('error')
             this.$('.' + key + '.help-inline').html(value.join(','))
 
+    updatePreview: ->
+      @.$('#post_preview').html markdown.toHTML(@.$('#post_body').val())
+
     extractData: ->
       {
         'body' : this.$('#post_body').val(),

data/app/assets/javascripts/crowdblog.js

@@ -5,6 +5,7 @@
  *= require         'backbone'
  *= require         'swfobject'
  *= require         'jquery.uploadify'
+ *= require         'markdown'
  *= require_self
  *= require_tree    ./crowdblog/models
  *= require_tree    ./crowdblog/views

data/app/assets/stylesheets/crowdblog/posts.css.scss

@@ -1,3 +1,13 @@
-// Place all the styles related to the admin/posts controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
+/* Edit post */
+#post_preview {
+  position: relative;
+  top: 110px;
+  height: 550px;
+  overflow-y: scroll;
+  padding: 0 25px 0 10px;
+  background: #EBEBEB;
+}
+
+form .clear {
+  clear: both;
+}

data/features/posts/manage.feature

@@ -29,3 +29,8 @@ Feature: Manage Posts
   Scenario: Navigate to Edit Post
     When I navigate to Edit Post
     Then I should see the Edit Post page
+
+  Scenario: Post Preview
+    Given I am on the New Post page
+    When I type in the post body field
+      Then I should see its markdown preview

data/features/step_definitions/posts_steps.rb

@@ -55,10 +55,20 @@ When /^(?:|I )write a Post$/ do
   click_button 'Save'
 end
 
+When /^I type in the post body field$/ do
+  fill_in 'Body', with: "# This is a title\n## And a subtitle"
+end
 
 #*****************
 #   THEN steps
 #-----------------
+
+Then /^I should see its markdown preview$/ do
+  preview = find('#post_preview')
+  preview.find('h1').should have_content('This is a title')
+  preview.find('h2').should have_content('And a subtitle')
+end
+
 Then /^(?:|I )should not see the Test Post$/ do
   posts = page.find('#posts table')
 

data/lib/crowdblog/version.rb

@@ -1,3 +1,3 @@
 module Crowdblog
-  VERSION = '0.0.12'
+  VERSION = '0.0.13'
 end