pages.html.twig 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329
  1. {% extends 'partials/base.html.twig' %}
  2. {% if admin.route %}
  3. {% set context = admin.page(true) %}
  4. {% endif %}
  5. {% if uri.param('new') %}
  6. {% set mode = 'new' %}
  7. {% elseif context %}
  8. {% set mode = 'edit' %}
  9. {% if context.exists %}
  10. {% set page_url = base_url ~ '/pages' ~ (context.header.routes.default ?: context.rawRoute) %}
  11. {% set exists = true %}
  12. {% set title = (context.exists ? "PLUGIN_ADMIN.EDIT"|tu : "PLUGIN_ADMIN.CREATE"|tu ) ~ " " ~ (context.header.title ?: context.title) %}
  13. {% else %}
  14. {% set title = "PLUGIN_ADMIN.ADD_PAGE"|tu %}
  15. {% endif %}
  16. {% else %}
  17. {% set mode = 'list' %}
  18. {% endif %}
  19. {% set modular = context.modular ? 'modular_' : '' %}
  20. {% set warn = config.plugins.admin.warnings.delete_page %}
  21. {% set admin_lang = admin.session.admin_lang ?: 'en' %}
  22. {% set page_lang = context.language %}
  23. {% block stylesheets %}
  24. {% if mode == 'edit' %}
  25. {% do assets.addCss(theme_url~'/css/codemirror/codemirror.css') %}
  26. {% endif %}
  27. {{ parent() }}
  28. {% endblock %}
  29. {% block javascripts %}
  30. {% do assets.addJs(theme_url~'/js/pages-all.js') %}
  31. {% do assets.addJs(theme_url~'/js/speakingurl.min.js') %}
  32. {% do assets.addJs(theme_url~'/js/slugify.min.js') %}
  33. {% if mode == 'edit' %}
  34. {% do assets.addJs(theme_url~'/js/codemirror-compressed.js') %}
  35. {% do assets.addJs(theme_url~'/js/mdeditor.js') %}
  36. {% do assets.addJs(theme_url~'/js/dropzone.min.js') %}
  37. {% endif %}
  38. {{ parent() }}
  39. {% endblock %}
  40. {% set preview_html = (base_url_relative_frontend|rtrim('/') ~ (context.home ? '' : context.route)) ?: '/' %}
  41. {% set preview_link = context.routable ? '<a class="preview" target="_blank" href="' ~ preview_html ~ '"><i class="fa fa-fw fa-angle-double-right"></i></a>' : '' %}
  42. {% macro loop(page, depth, twig_vars) %}
  43. {% set separator = twig_vars['config'].system.param_sep %}
  44. {% set base_url = twig_vars['base_url_relative'] %}
  45. {% set base_url_simple = twig_vars['base_url_simple'] %}
  46. {% set admin_route = twig_vars['admin_route'] %}
  47. {% set admin_lang = twig_vars['admin_lang'] %}
  48. {% set warn = twig_vars['warn'] %}
  49. {% for p in page.children() %}
  50. {% set description = (not p.page ? 'Folder &bull; ' : 'Page &bull; ') ~
  51. (p.modular ? 'Modular &bull; ' : '') ~
  52. (p.routable ? 'Routable &bull; ' : 'Non-Routable &bull; ') ~
  53. (p.visible ? 'Visible &bull; ' : 'Non-Visible &bull; ') ~
  54. (p.published ? 'Published &bull; ' : 'Non-Published &bull; ') %}
  55. {% set page_route = p.rawRoute|trim('/') %}
  56. {% if p.language and p.language != admin_lang %}
  57. {% set page_url = base_url_simple ~ '/' ~ p.language ~ '/' ~ admin_route ~ '/pages/' ~ page_route %}
  58. {% else %}
  59. {% set page_url = base_url ~ '/pages/' ~ page_route %}
  60. {% endif %}
  61. <li class="page-item" data-nav-id="{{ p.route }}">
  62. <div class="row">
  63. <span {{ p.children(0).count > 0 ? 'data-toggle="children"' : ''}} data-hint="{{ description|trim(' &bull; ') }}" class="hint--bottom">
  64. <i class="page-icon fa fa-fw fa-circle-o {{ p.children(0).count > 0 ? 'children-closed' : ''}} {{ p.modular ? 'modular' : (not p.routable ? 'not-routable' : (not p.visible ? 'not-visible' : (not p.page ? 'folder' : ''))) }}"></i>
  65. </span>
  66. <a href="{{ page_url }}" class="page-edit">{{ p.title }}</a>
  67. {% if p.language %}
  68. <span class="badge lang {% if p.language == admin_lang %}info{% endif %}">{{p.language ?: default_site_lang}}</span>
  69. {% endif %}
  70. <span class="page-home">{{ p.home ? '<i class="fa fa-home"></i>' }}</span>
  71. <span class="page-tools">
  72. {% if warn %}
  73. <a href="#delete" data-remodal-target="delete" data-delete-url="{{ page_url }}/task{{ separator }}delete" class="page-delete" ><i class="fa fa-close"></i></a>
  74. {% else %}
  75. <a href="{{ page_url }}/task{{ separator }}delete" class="page-delete" ><i class="fa fa-close"></i></a>
  76. {% endif %}
  77. </span>
  78. <p class="page-route">{{ p.header.routes.default ?: p.route }} <span class="spacer"><i class="fa fa-long-arrow-right"></i></span> {{ p.template() }}</p>
  79. </div>
  80. {% if p.children().count > 0 %}
  81. <ul class="depth-{{ depth + 1 }}" style="display:none;">
  82. {{ _self.loop(p, depth + 1, twig_vars) }}
  83. </ul>
  84. {% endif %}
  85. </li>
  86. {% endfor %}
  87. {% endmacro %}
  88. {% block titlebar %}
  89. <div class="button-bar">
  90. {% if mode == 'list' %}
  91. <a class="button" href="{{ base_url }}"><i class="fa fa-reply"></i> {{ "PLUGIN_ADMIN.BACK"|tu }}</a>
  92. <a class="button" href="#modal" data-remodal-target="modal"><i class="fa fa-plus"></i> {{ "PLUGIN_ADMIN.ADD_PAGE"|tu }}</a>
  93. {% if admin.modularTypes is not empty %}
  94. <a class="button" href="#modular" data-remodal-target="modular"><i class="fa fa-plus"></i> {{ "PLUGIN_ADMIN.ADD_MODULAR"|tu }}</a>
  95. {% endif %}
  96. {% if admin.multilang %}
  97. <div class="button-group">
  98. <button type="button" class="button disabled">
  99. <i class="fa fa-flag-o"></i>
  100. {% set langName = admin.siteLanguages[admin_lang] %}
  101. {{ langName[:1]|upper ~ langName[1:] }}
  102. </button>
  103. <button type="button" class="button dropdown-toggle" data-toggle="dropdown">
  104. <i class="fa fa-caret-down"></i>
  105. </button>
  106. <ul class="dropdown-menu language-switcher">
  107. {% for langCode in admin.languages_enabled %}
  108. {% set langName = admin.siteLanguages[langCode] %}
  109. {% if langCode != admin_lang %}
  110. <li><a href="{{ base_url_relative }}{{ theme.slug }}/pages/task{{ config.system.param_sep }}switchlanguage/lang{{ config.system.param_sep }}{{langCode}}">{{ langName[:1]|upper ~ langName[1:] }}</a></li>
  111. {% endif %}
  112. {% endfor %}
  113. </ul>
  114. </div>
  115. {% endif %}
  116. {% elseif mode == 'edit' %}
  117. <a class="button" href="{{ base_url }}/pages"><i class="fa fa-reply"></i> {{ "PLUGIN_ADMIN.BACK"|tu }}</a>
  118. {% if exists %}
  119. <a class="button" href="{{ page_url }}/task{{ config.system.param_sep }}copy" class="page-copy" ><i class="fa fa-copy"></i> {{ "PLUGIN_ADMIN.COPY"|tu }}</a>
  120. <a class="button" href="#" data-remodal-target="move"><i class="fa fa-arrows"></i> {{ "PLUGIN_ADMIN.MOVE"|tu }}</a>
  121. {% if warn %}
  122. <a class="button" href="#delete" data-remodal-target="delete" data-delete-url="{{ page_url }}/task{{ config.system.param_sep }}delete"><i class="fa fa-close"></i> {{ "PLUGIN_ADMIN.DELETE"|tu }}</a>
  123. {% else %}
  124. <a class="button" href="{{ uri.route(true) }}/task{{ config.system.param_sep }}delete" class="page-delete" ><i class="fa fa-close"></i></a>
  125. {% endif %}
  126. {% endif %}
  127. <div class="button-group">
  128. <button class="button" name="task" value="save" form="blueprints" type="submit"><i class="fa fa-check"></i> {{ "PLUGIN_ADMIN.SAVE"|tu }}</button>
  129. {% if exists and admin.multilang %}
  130. {% if context.untranslatedLanguages %}
  131. <button type="button" class="button dropdown-toggle" data-toggle="dropdown">
  132. <i class="fa fa-caret-down"></i>
  133. </button>
  134. <ul class="dropdown-menu lang-switcher">
  135. {% for langCode in context.untranslatedLanguages %}
  136. {% set langName = admin.siteLanguages[langCode] %}
  137. {% if langCode != page_lang %}
  138. <li><button class="button task" name="task" value="saveas" lang="{{langCode}}" form="blueprints" type="submit">{{ "PLUGIN_ADMIN.SAVE_AS"|tu }} {{ langName[:1]|upper ~ langName[1:] }}</button>
  139. {% endif %}
  140. {% endfor %}
  141. </ul>
  142. {% endif %}
  143. {% endif %}
  144. </div>
  145. {% endif %}
  146. </div>
  147. {% if mode == 'new' %}
  148. <h1><i class="fa fa-fw fa-file-text-o"></i> {{ "PLUGIN_ADMIN.ADD_PAGE"|tu }}</h1>
  149. {% elseif mode == 'edit' %}
  150. <h1><i class="fa fa-fw fa-file-text-o"></i>
  151. {{ context.exists ? "PLUGIN_ADMIN.EDIT"|tu ~ " <i>#{context.menu}</i>" ~ preview_link : "PLUGIN_ADMIN.CREATE"|tu ~ " <i>#{context.menu}</i>" }}
  152. </h1>
  153. {% else %}
  154. <h1><i class="fa fa-fw fa-file-text-o"></i> {{ "PLUGIN_ADMIN.MANAGE_PAGES"|tu }}</h1>
  155. {% endif %}
  156. {% endblock %}
  157. {% block content %}
  158. {% set default_site_lang = grav.config.system.languages|first|first %}
  159. <div class="admin-block clear">
  160. {% include 'partials/messages.html.twig' %}
  161. {% if mode == 'new' %}
  162. {% include 'partials/blueprints-new.html.twig' with { blueprints: admin.blueprints('pages/page'), data: context } %}
  163. {% elseif mode == 'edit' %}
  164. <div class="admin-form-wrapper" data-media-url="{{ base_url }}/media/{{ admin.route|trim('/') }}.json" data-media-local="{{ base_url_relative_frontend }}/{{ admin.route|trim('/') }}" data-media-types="{{ media_types }}">
  165. <div id="admin-topbar">
  166. {% if admin.multilang and page_lang %}
  167. <div id="admin-lang-toggle" class="button-group">
  168. <button type="button" class="button disabled">
  169. {% if exists %}
  170. {{ page_lang }}
  171. {% else %}
  172. {{ admin_lang }}
  173. {% endif %}
  174. </button>
  175. {% if exists and context.translatedLanguages|length > 1 %}
  176. <button type="button" class="button dropdown-toggle" data-toggle="dropdown">
  177. <i class="fa fa-caret-down"></i>
  178. </button>
  179. <ul class="dropdown-menu language-switcher">
  180. {% for language, route in context.translatedLanguages %}
  181. {% if language != page_lang %}
  182. <li><button class="task" name="task" value="switchlanguage" lang="{{language}}" redirect="{{context.rawRoute|trim('/')}}" form="blueprints">{{ language }}</button>
  183. {% endif %}
  184. {% endfor %}
  185. </ul>
  186. {% endif %}
  187. </div>
  188. {% endif %}
  189. {% if context.blueprints.fields %}
  190. <form id="admin-mode-toggle">
  191. <div class="switch-toggle switch-grav">
  192. <input type="radio" value="normal" data-leave-url="{{ base_url }}/pages/{{ admin.route|trim('/') }}/mode{{ config.system.param_sep }}normal" id="normal" name="mode-switch" class="highlight" {% if admin.session.expert == '0' %} checked="checked"{% endif %}>
  193. <label for="normal">{{ "PLUGIN_ADMIN.NORMAL"|tu }}</label>
  194. <input type="radio" value="expert" data-leave-url="{{ base_url }}/pages/{{ admin.route|trim('/') }}/mode{{ config.system.param_sep }}expert" id="expert" name="mode-switch" class="highlight" {% if admin.session.expert == '1' %} checked="checked"{% endif %}>
  195. <label for="expert">{{ "PLUGIN_ADMIN.EXPERT"|tu }}</label>
  196. <a></a>
  197. </div>
  198. </form>
  199. {% endif %}
  200. </div>
  201. {% if context.blueprints.fields and admin.session.expert == '0' %}
  202. {% include 'partials/blueprints.html.twig' with { blueprints: context.blueprints, data: context } %}
  203. {% else %}
  204. {% include 'partials/blueprints-raw.html.twig' with { blueprints: admin.blueprints('pages/'~modular~'raw'), data: context } %}
  205. {% endif %}
  206. </div>
  207. {% else %}
  208. <form id="page-filtering">
  209. <div class="page-filters">
  210. <input type="text" data-template-types="{{ admin.types|merge(admin.modularTypes)|json_encode|e('html_attr') }}" placeholder="{{ "PLUGIN_ADMIN.ADD_FILTERS"|tu }}" class="page-filter" name="page-filter" />
  211. </div>
  212. <div class="page-search">
  213. <input type="text" placeholder="{{ "PLUGIN_ADMIN.SEARCH_PAGES"|tu }}" name="page-search" />
  214. </div>
  215. <div class="page-shortcuts">
  216. <span class="button button-x-small" data-page-toggleall="expand"><i class="fa fa-fw fa-plus-circle"></i> {{ "PLUGIN_ADMIN.EXPAND_ALL"|tu }}</span>
  217. <span class="button button-x-small" data-page-toggleall="collapse"><i class="fa fa-fw fa-minus-circle"></i> {{ "PLUGIN_ADMIN.COLLAPSE_ALL"|tu }}</span>
  218. </div>
  219. </form>
  220. <ul class="pages-list depth-0">
  221. {{ _self.loop(pages, 0, _context) }}
  222. </ul>
  223. {% endif %}
  224. </div>
  225. <div class="remodal" data-remodal-id="generic" data-remodal-options="hashTracking: false">
  226. <form>
  227. <h1>{{ "PLUGIN_ADMIN.ERROR"|tu }}</h1>
  228. <div class="error-content"></div>
  229. <div class="button-bar">
  230. <a class="button remodal-confirm" href="#">{{ "PLUGIN_ADMIN.CLOSE"|tu }}</a>
  231. </div>
  232. </form>
  233. </div>
  234. {% if mode == 'list' %}
  235. <div class="remodal" data-remodal-id="modal" data-remodal-options="hashTracking: false">
  236. {% include 'partials/blueprints-new.html.twig' with { blueprints: admin.blueprints('pages/new'), data: context } %}
  237. </div>
  238. <div class="remodal" data-remodal-id="modular" data-remodal-options="hashTracking: false">
  239. {% include 'partials/blueprints-new.html.twig' with { blueprints: admin.blueprints('pages/modular_new'), data: context } %}
  240. </div>
  241. {% endif %}
  242. {% if mode == 'edit' %}
  243. <div class="remodal" data-remodal-id="move" data-remodal-options="hashTracking: false">
  244. {% include 'partials/page-move.html.twig' with { blueprints: admin.blueprints('pages/move'), data: context } %}
  245. </div>
  246. {% endif %}
  247. <div class="remodal" data-remodal-id="delete" data-remodal-options="hashTracking: false">
  248. <form>
  249. <h1>{{ "PLUGIN_ADMIN.MODAL_DELETE_PAGE_CONFIRMATION_REQUIRED_TITLE"|tu }}</h1>
  250. <p class="bigger">
  251. {{ "PLUGIN_ADMIN.MODAL_DELETE_PAGE_CONFIRMATION_REQUIRED_DESC"|tu }}
  252. </p>
  253. <br>
  254. <div class="button-bar">
  255. <a class="button secondary remodal-cancel" href="#"><i class="fa fa-fw fa-close"></i> {{ "PLUGIN_ADMIN.CANCEL"|tu }}</a>
  256. <a class="button" data-delete-action href="#"><i class="fa fa-fw fa-check"></i> {{ "PLUGIN_ADMIN.CONTINUE"|tu }}</a>
  257. </div>
  258. </form>
  259. </div>
  260. <div class="remodal" data-remodal-id="changes">
  261. <form>
  262. <h1>{{ "PLUGIN_ADMIN.MODAL_CHANGED_DETECTED_TITLE"|tu }}</h1>
  263. <p class="bigger">
  264. {{ "PLUGIN_ADMIN.MODAL_CHANGED_DETECTED_DESC"|tu }}
  265. </p>
  266. <br>
  267. <div class="button-bar">
  268. <a class="button secondary" data-leave-action="cancel" href="#"><i class="fa fa-fw fa-close"></i> {{ "PLUGIN_ADMIN.CANCEL"|tu }}</a>
  269. <a class="button" data-leave-action="continue" href="#"><i class="fa fa-fw fa-check"></i> {{ "PLUGIN_ADMIN.CONTINUE"|tu }}</a>
  270. </div>
  271. </form>
  272. </div>
  273. <div class="remodal" data-remodal-id="delete-media" data-remodal-options="hashTracking: false">
  274. <form>
  275. <h1>{{ "PLUGIN_ADMIN.MODAL_DELETE_FILE_CONFIRMATION_REQUIRED_TITLE"|tu }}</h1>
  276. <p class="bigger">
  277. {{ "PLUGIN_ADMIN.MODAL_DELETE_FILE_CONFIRMATION_REQUIRED_DESC"|tu }}
  278. </p>
  279. <br>
  280. <div class="button-bar">
  281. <a class="button secondary remodal-cancel" href="#"><i class="fa fa-fw fa-close"></i> {{ "PLUGIN_ADMIN.CANCEL"|tu }}</a>
  282. <a class="button remodal-confirm" href="#"><i class="fa fa-fw fa-check"></i> {{ "PLUGIN_ADMIN.CONTINUE"|tu }}</a>
  283. </div>
  284. </form>
  285. </div>
  286. {% endblock %}