_form.html 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. {% if req.form.errors %}
  2. <div class="alert alert-danger">
  3. <ul>
  4. {% for error in req.form.errors %}
  5. <li>{{ error }}</li>
  6. {% endfor %}
  7. </ul>
  8. </div>
  9. {% endif %}
  10. <div id="form-box" class="row">
  11. <form action="{{ path }}/edit" method="post" class="col-md-6">
  12. <textarea name="pageForm[body]" class="form-control form-body-height" id="form-body">{% if pageForm.body %}{{ pageForm.body }}{% elseif not revision.body %}# {{ path|path2name }}{% else %}{{ revision.body }}{% endif %}</textarea>
  13. <input type="hidden" name="pageForm[format]" value="markdown" id="form-format">
  14. <input type="hidden" name="pageForm[currentRevision]" value="{{ pageForm.currentRevision|default(revision._id.toString()) }}">
  15. <div class="form-submit-group form-group form-inline">
  16. <select name="pageForm[grant]" class="form-control">
  17. {% for grantId, grantLabel in consts.pageGrants %}
  18. <option value="{{ grantId }}" {% if pageForm.grant|default(page.grant) == grantId %}selected{% endif %}>{{ grantLabel }}</option>
  19. {% endfor %}
  20. </select>
  21. <input type="submit" class="btn btn-primary" id="edit-form-submit" value="ページを更新" />
  22. </div>
  23. </form>
  24. <div class="col-md-6">
  25. <div id="preview-body" class="wiki preview-body">
  26. </div>
  27. </div>
  28. <script type="text/javascript">
  29. $(function() {
  30. // preview watch
  31. var prevContent = "";
  32. var watchTimer = setInterval(function() {
  33. var content = $('#form-body').val();
  34. if (prevContent != content) {
  35. var renderer = new Crowi.renderer($('#form-body').val(), $('#preview-body'));
  36. renderer.render();
  37. prevContent = content;
  38. }
  39. }, 500);
  40. // tabs handle
  41. $('textarea#form-body').on('keydown', function(event){
  42. var self = $(this)
  43. start = this.selectionStart,
  44. end = this.selectionEnd
  45. val = self.val();
  46. if (event.keyCode === 9) {
  47. // tab
  48. event.preventDefault();
  49. self.val(
  50. val.substring(0, start)
  51. + ' '
  52. + val.substring(end, val.length)
  53. );
  54. this.selectionStart = start + 4;
  55. this.selectionEnd = start + 4;
  56. } else if (event.keyCode === 27) {
  57. // escape
  58. self.blur();
  59. }
  60. });
  61. });
  62. </script>
  63. </div>