add toolbar for blog

Gemfile

@@ -37,6 +37,7 @@ gem 'grape-entity'
 
 #tags
 # gem 'mongoid_taggable_on'
+gem 'pagedown-rails', '~> 1.1.3'
 
 #tools
 gem 'exception_notification'

Gemfile.lock

@@ -155,6 +155,8 @@ GEM
       omniauth (~> 1.0)
     optionable (0.1.1)
     origin (1.1.0)
+    pagedown-rails (1.1.3)
+      railties (> 3.1)
     polyglot (0.3.3)
     posix-spawn (0.3.6)
     protected_attributes (1.0.3)
@@ -256,6 +258,7 @@ DEPENDENCIES
   mongoid (~> 4.0.0)!
   mongoid_auto_increment_id (= 0.6.2)
   omniauth-google-oauth2
+  pagedown-rails (~> 1.1.3)
   protected_attributes
   rails (= 4.0.0)
   sass-rails (~> 4.0.0)

app/assets/javascripts/application.js

@@ -16,4 +16,7 @@
 //= require twitter/bootstrap
 //= require bootstrap-datepicker
 //= require bootstrap-timepicker
+//= require markdown.converter
+//= require markdown.sanitizer
+//= require markdown.editor
 //= require_tree .

app/assets/stylesheets/application.css.scss

@@ -14,6 +14,7 @@
  *= require_self
  *= require bootstrap-datepicker
  *= require bootstrap-timepicker
+ *= require markdown
  */
 
 hr{
@@ -201,5 +202,10 @@ a.nav_blogs {
 margin-left: 260px;
 }
 
-
+.wmd-preview{
+border: 1px solid #e3e3e3;
+padding: 10px;
+margin-bottom:20px;
+}
+
 

app/views/blogs/new.html.erb

@@ -19,14 +19,15 @@
 
 
 
-
-		<div class="clearfix">
+		<div class="clearfix wmd-panel">
 	      <%= f.label "故事内容" %>
-	      <div class="input">
-		 	<%= f.text_area :body, :rows => "10",:class => "xxlarge form-control" %>
-	      </div>
+	  	  <div id='wmd-button-bar'></div>
+		  <textarea class='wmd-input xxlarge' "rows" = "15" id="blog_body" name="blog[body]"><%=@blog.body%></textarea>
 		  <p class="help-block"></p>
 	    </div>
+
+
+		<div id="wmd-preview" class="wmd-panel wmd-preview">预览</div>
 
 
 	    <div class="clearfix">
@@ -35,16 +36,15 @@
 	        <%= f.text_field :tag_list, :class => "xxlarge form-control" %>
 	      </div>
 		  <p class="help-block"></p>
-
 	    </div>
 
 
-
 	    <div class="actions">
-	      <%= f.submit "保存", :class => "btn btn-primary", :disable_with => "保存ing.." %>
+	      <%= f.submit "故事写好了", :class => "btn btn-primary", :id=>"submit-it", :disable_with => "保存ing.." %>
 	    </div>
 	<% end %> 
-
+
+
 
 	<div class="clearfix"></div>
 
@@ -54,4 +54,21 @@
 
 
  	</div>
-</div>
+</div>
+
+<script>
+  (function () {
+    var converter = Markdown.getSanitizingConverter();
+    var editor = new Markdown.Editor(converter);
+    editor.run();
+
+    window.onbeforeunload = function(){
+      return '你正在编辑摘要，确定不保存编辑内容吗？';
+    };
+
+    $("#submit-it").click(function(){
+      window.onbeforeunload = null;
+    });
+
+  })();
+</script>