Generalize markdown preview.

src/main/scala/app/RepositoryViewerController.scala

@@ -32,6 +32,17 @@ trait RepositoryViewerControllerBase extends ControllerBase {
     }
   }
 
+  /**
+   * Returns converted HTML from Markdown for preview.
+   */
+  post("/:owner/:repository/_preview")(readableRepository {
+    val owner      = params("owner")
+    val repository = params("repository")
+    val content    = params("content")
+    contentType = "text/html"
+    view.helpers.markdown(content, getRepository(owner, repository, servletContext).get, true)
+  })
+
   /**
    * Displays the file list of the repository root and the default branch.
    */

src/main/scala/app/WikiController.scala

@@ -146,14 +146,6 @@ trait WikiControllerBase extends ControllerBase {
     }
   })
 
-  post("/:owner/:repository/wiki/_preview")(writableRepository {
-    val owner      = params("owner")
-    val repository = params("repository")
-    val content    = params("content")
-    contentType = "text/html"
-    view.helpers.markdown(content, getRepository(owner, repository, servletContext).get, true)
-  })
-  
   /**
    * Constraint for the wiki page name.
    */

src/main/twirl/preview.scala.html

@@ -0,0 +1,30 @@
+@(repository: service.RepositoryService.RepositoryInfo, content: String, style: String = "")(implicit context: app.Context)
+@import context._
+<div class="tabbable">
+  <ul class="nav nav-tabs">
+    <li class="active"><a href="#tab1" data-toggle="tab">Write</a></li>
+    <li><a href="#tab2" data-toggle="tab" id="preview">Preview</a></li>
+  </ul>
+  <div class="tab-content">
+    <div class="tab-pane active" id="tab1">
+      <span id="error-content" class="error"></span>
+      <textarea id="content" name="content"@if(style.nonEmpty){ style="@style"}>@content</textarea>
+    </div>
+    <div class="tab-pane" id="tab2">
+      <div class="markdown-body" id="preview-area">
+      </div>
+    </div>
+  </div>
+</div>
+<script>
+$(function(){
+  $('#preview').click(function(){
+    $('#preview-area').html('<img src="@path/assets/common/images/indicator.gif"> Previewing...');
+    $.post('@path/@repository.owner/@repository.name/_preview', {
+      content: $('#content').val()
+    }, function(data){
+      $('#preview-area').html(data);
+    });
+  });
+});
+</script>

src/main/twirl/wiki/wikiedit.scala.html

@@ -19,40 +19,16 @@
     </li>
   </ul>
   <form action="@path/@repository.owner/@repository.name/wiki/@if(pageName == ""){_new} else {_edit}" method="POST" validate="true">
-    <div class="tabbable">
+    <span id="error-pageName" class="error"></span>
-      <ul class="nav nav-tabs">
-        <li class="active"><a href="#tab1" data-toggle="tab">Edit</a></li>
-        <li><a href="#tab2" data-toggle="tab" id="preview">Preview</a></li>
-      </ul>
-      <div class="tab-content">
-        <div class="tab-pane active" id="tab1">
-          <span id="error-pageName" class="error-message"></span>
     <input type="text" name="pageName" value="@pageName" style="width: 900px; font-weight: bold;" placeholder="Input a page name."/>
-          <span id="error-content" class="error-message"></span>
+    @html.preview(repository, page.map(_.content).getOrElse(""), "width: 900px; height: 400px;")
-          <textarea id="content" name="content" style="width: 900px; height: 400px;">@page.map(_.content)</textarea>
     <input type="text" name="message" value="" style="width: 900px;" placeholder="Write a small message here explaining this change. (Optional)"/>
     <input type="hidden" name="currentPageName" value="@pageName"/>
     <input type="submit" value="Save" class="btn btn-primary">
-        </div>
-        <div class="tab-pane" id="tab2">
-          <div class="markdown-body" id="preview-area">
-          </div>
-        </div>
-      </div>
-    </div>
   </form>
 }
 <script>
 $(function(){
-  $('#preview').click(function(){
-	$('#preview-area').html('<img src="@path/assets/common/images/indicator.gif"> Previewing...');
-    $.post('@path/@repository.owner/@repository.name/wiki/_preview', {
-      content: $('#content').val()
-    }, function(data){
-      $('#preview-area').html(data);
-    });
-  });
-  
   $('#delete').click(function(){
     return confirm('Are you sure you want to delete this page?'); 
   });