create_page.html 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. <div class="modal create-page" id="create-page">
  2. <div class="modal-dialog modal-lg">
  3. <div class="modal-content">
  4. <div class="modal-header bg-primary">
  5. <div class="modal-title text-white">{{ t('New Page') }}</div>
  6. <button type="button" class="close text-white" data-dismiss="modal" aria-hidden="true">&times;</button>
  7. </div>
  8. <div class="modal-body">
  9. <form id="create-page-today" role="form">
  10. <div class="row form-group">
  11. <fieldset class="col-12 mb-4">
  12. <h3 class="grw-modal-head pb-2">{{ t("Create today's") }}</h3>
  13. <div class="d-flex create-page-input-container">
  14. <div class="create-page-input-row d-flex align-items-center">
  15. <span class="page-today-prefix">{{ userPageRoot(user) }}/</span>
  16. <input type="text" data-prefix="{{ userPageRoot(user) }}/" class="page-today-input1 form-control text-center" value="{{ t('Memo') }}" id="" name="">
  17. <span class="page-today-suffix">/{{ now|datetz('Y/m/d') }}/</span>
  18. <input type="text" data-prefix="/{{ now|datetz('Y/m/d') }}/" class="page-today-input2 form-control" id="page-today-input2" name="" placeholder="{{ t('Input page name (optional)') }}">
  19. </div>
  20. <div class="create-page-button-container">
  21. <button type="submit" class="btn btn-outline-primary rounded-pill"><i class="icon-fw icon-doc"></i>{{ t('Create') }}</button>
  22. </div>
  23. </div>
  24. </fieldset>
  25. </div>
  26. </form>
  27. <form id="create-page-under-tree" role="form">
  28. <div class="row form-group">
  29. <fieldset class="col-12 mb-4">
  30. <h3 class="grw-modal-head pb-2">{{ t('Create under') }}</h3>
  31. <div class="d-flex create-page-input-container">
  32. <div class="create-page-input-row d-flex align-items-center">
  33. {% if isSearchServiceConfigured() %}
  34. <div id="create-page-name-input" class="page-name-input"></div>
  35. {% else %}
  36. <input type="text" value="{{ parentPath(path) }}" class="page-name-input form-control " placeholder="{{ t('Input page name') }}" required />
  37. {% endif %}
  38. </div>
  39. <div class="create-page-button-container">
  40. <button type="submit" class="btn btn-outline-primary rounded-pill"><i class="icon-fw icon-doc"></i>{{ t('Create') }}</button>
  41. </div>
  42. </div>
  43. </fieldset>
  44. </div>
  45. </form>
  46. {% set templateParentPath = parentPath(path | preventXss | escape) %}
  47. <div id="template-form" class="row form-group">
  48. <fieldset class="col-12">
  49. <h3 class="grw-modal-head pb-2">{{ t('template.modal_label.Create template under', templateParentPath) }}</h3>
  50. <div class="d-flex create-page-input-container">
  51. <div class="create-page-input-row d-flex align-items-center">
  52. <div id="dd-template-type" class="dropdown w-100">
  53. <a type="button" class="btn btn-secondary btn-block dropdown-toggle d-flex align-items-center justify-content-between"
  54. id="template-type" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  55. {{ t('template.option_label.select') }}
  56. </a>
  57. <div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
  58. <button class="dropdown-item" type="button" data-template-type="children">
  59. {{ t('template.children.label') }} (_template) <small class="text-muted">- {{ t('template.children.desc') }}</small>
  60. </button>
  61. <button class="dropdown-item" type="button" data-template-type="decentants">
  62. {{ t('template.decendants.label') }} (__template) <small class="text-muted">- {{ t('template.decendants.desc') }}</small>
  63. </button>
  64. </div>
  65. </div>
  66. </div>
  67. <div class="create-page-button-container my-auto">
  68. <a id="link-to-template" href="{{ page.path || path }}" class="btn btn-outline-primary rounded-pill disabled">
  69. <i class="icon-fw icon-doc"></i>
  70. <span id="create-template-button-link">{{ t('Edit') }}</span>
  71. </a>
  72. </div>
  73. </div>
  74. </fieldset>
  75. </div>
  76. <script>
  77. $('#dd-template-type .dropdown-item').on('click', function() {
  78. const value = $(this).data('template-type');
  79. // modify label
  80. const label = (value === 'children')
  81. ? '{{ t("template.children.label") }} (__template)'
  82. : '{{ t("template.decendants.label") }} (__template)';
  83. $('#dd-template-type .dropdown-toggle').text(label);
  84. // modify href
  85. const pageName = (value === 'children') ? '_template' : '__template';
  86. const parentPath = '{{templateParentPath}}';
  87. const link = parentPath + pageName + '#edit-form';
  88. $('#link-to-template').attr('href', link);
  89. // enable button
  90. $('#link-to-template').removeClass('disabled');
  91. });
  92. </script>
  93. </div><!-- /.modal-body -->
  94. </div><!-- /.modal-content -->
  95. </div><!-- /.modal-dialog -->
  96. </div><!-- /.modal -->