| |
@@ -9,16 +9,23 @@
|
| |
onsubmit="return try_async_comment(this, null)" >
|
| |
|
| |
|
| |
- <div class="tabs ui-widget ui-widget-content ui-corner-all"
|
| |
- id="comment_block">
|
| |
-
|
| |
+ <fieldset class="form-group">
|
| |
+ <label for="comment"><strong>Edit comment</strong></label>
|
| |
+ <small class="text-muted pull-xs-right">
|
| |
+ <span class="btn btn-sm btn-secondary inactive"
|
| |
+ aria-pressed="false" id="edit_previewinmarkdown">Preview
|
| |
+ </span>
|
| |
+ </small>
|
| |
+
|
| |
<div id="edit">
|
| |
<textarea class="form-control" id="update_comment" name="update_comment" style="width:100%;">
|
| |
{{- comment.comment -}}
|
| |
</textarea>
|
| |
</div>
|
| |
+ <div id="preview">
|
| |
+ </div>
|
| |
+ </fieldset>
|
| |
|
| |
- <div>
|
| |
|
| |
{{ form.csrf_token }}
|
| |
<div>
|
| |
@@ -32,6 +39,45 @@
|
| |
|
| |
</section>
|
| |
<script>
|
| |
+ $("#preview").hide();
|
| |
+ $("#edit_previewinmarkdown").click(
|
| |
+ function(event, ui) {
|
| |
+ if ($("#edit_previewinmarkdown").hasClass("inactive")){
|
| |
+ var _text = $("#update_comment").val();
|
| |
+ var _url = "{{ url_for('markdown_preview',
|
| |
+ repo=repo.name,
|
| |
+ user=repo.user.user if repo.is_fork,
|
| |
+ namespace=repo.namespace) | safe}}";
|
| |
+ $.ajax({
|
| |
+ url: _url ,
|
| |
+ type: 'POST',
|
| |
+ data: {
|
| |
+ content: _text,
|
| |
+ csrf_token: "{{ form.csrf_token.current_token }}",
|
| |
+ },
|
| |
+ dataType: 'html',
|
| |
+ success: function(res) {
|
| |
+ var preview = emojione.toImage(res);
|
| |
+ $("#preview").html(preview);
|
| |
+ $("#edit_previewinmarkdown").removeClass("inactive");
|
| |
+ $("#edit_previewinmarkdown").addClass("active");
|
| |
+ $("#update_comment").hide();
|
| |
+ $("#preview" ).show();
|
| |
+ },
|
| |
+ error: function() {
|
| |
+ alert('Unable to generate preview!');
|
| |
+ }
|
| |
+ });
|
| |
+ return false;
|
| |
+ } else if ($("#edit_previewinmarkdown").hasClass("active")){
|
| |
+ $("#edit_previewinmarkdown").addClass("inactive");
|
| |
+ $("#edit_previewinmarkdown").removeClass("active");
|
| |
+ $("#update_comment").show();
|
| |
+ $("#preview").hide();
|
| |
+ }
|
| |
+ }
|
| |
+ );
|
| |
+
|
| |
$.get("{{ url_for('api_ns.api_users') }}", {
|
| |
pattern: '*'
|
| |
}).done(function(resp) {
|
| |
here you may also use toggleclass() method
link : http://stackoverflow.com/questions/7002039/easiest-way-to-toggle-2-classes-in-jquery