Added comment preview functionality to user pages. It works by passing the comment's value as a JSON string to a new handler that lives at /ajax/comment/preview. The query string is decoded, unquoted, and has its leading and trailing quotes removed to match the input that cleaned_markdown_conversion expects.

It does this in real time with a 500ms lag by using a timer. Initially I tried the onChange handler but you need to lose focus for that to process. The javascript timer is only invoked if the add comment button is pressed. A request is only sent if the comment box is not empty and the current value is not the same as the last value.

1 files changed, 12 insertions, 0 deletions

diff --git a/mediagoblin/static/js/comment_show.js b/mediagoblin/static/js/comment_show.js
index c5ccee66..cb69fccd 100644
--- a/mediagoblin/static/js/comment_show.js
+++ b/mediagoblin/static/js/comment_show.js
@@ -15,12 +15,24 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
+var content="";
 
+function previewComment(){
+	if ($('#comment_content').val() && (content != $('#comment_content').val())) {
+		content = $('#comment_content').val();
+		$.getJSON($('#previewURL').val(),JSON.stringify($('#comment_content').val()),
+		function(data){
+			$('#comment_preview').replaceWith("<div id=comment_preview><h3>Comment Preview</h3><br />" + decodeURIComponent(data) + 
+			"<hr style='border: 1px solid #333;' /></div>");
+		});
+	}
+}
 $(document).ready(function(){
   $('#form_comment').hide();
   $('#button_addcomment').click(function(){
     $(this).fadeOut('fast');
     $('#form_comment').slideDown(function(){
+	setInterval("previewComment()",500);
         $('#comment_content').focus();
     });
   });