{#
  Live Markdown Editor (text-forge).

  Provides an "Edit" button on content pages that opens a split-pane editor
  with live preview using Pyodide + PyMdown Extensions.

  Config (mkdocs.yml -> plugins -> text-forge):
    text-forge:
      editor_enabled: true   # Show editor button on content pages
#}

{% if text_forge_editor_enabled and page and page.content %}
<!-- Live Editor Panel -->
<div id="md-editor" class="md-editor" hidden>
  <div class="md-editor__toolbar">
    <div class="md-editor__left">
      <span class="md-editor__title" data-i18n="editor_title">Редактор Markdown</span>
      <button id="md-editor-sync-right" class="md-editor__btn" data-i18n-title="editor_sync_right" title="Синхронизировать скролл →">
        {% include ".icons/material/arrow-right-bold.svg" %}
      </button>
    </div>
    <span class="md-editor__filename" id="md-editor-filename"></span>
    <div class="md-editor__actions">
      <button id="md-editor-sync-left" class="md-editor__btn" data-i18n-title="editor_sync_left" title="← Синхронизировать скролл">
        {% include ".icons/material/arrow-left-bold.svg" %}
      </button>
      <button id="md-editor-save" class="md-editor__btn" data-i18n-title="editor_save" title="Сохранить">
        {% include ".icons/material/content-save.svg" %}
      </button>
      <button id="md-editor-close" class="md-editor__btn" title="Закрыть">
        {% include ".icons/material/close.svg" %}
      </button>
    </div>
  </div>
  <div class="md-editor__content">
    <div class="md-editor__pane md-editor__pane--source">
      <textarea id="md-editor-source" spellcheck="false" data-i18n-placeholder="editor_loading" placeholder="Загрузка редактора..."></textarea>
    </div>
    <div class="md-editor__pane md-editor__pane--preview">
      <div id="md-editor-preview" class="md-typeset"></div>
    </div>
  </div>
  <div class="md-editor__status">
    <span id="md-editor-status" data-i18n="editor_status_ready">Готов</span>
  </div>
</div>

<!-- Editor Toggle Button (fab style, bottom-right) -->
<button id="md-editor-toggle" class="md-editor-fab" data-i18n-title="editor_title" title="Редактировать">
  {% include ".icons/material/pencil.svg" %}
</button>

<!-- Pass page metadata and source content to JS -->
{% set editor_config = {
  'sourceUrl': (config.repo_url ~ '/' ~ config.edit_uri ~ page.file.src_path)|e|replace('/blob/', '/raw/'),
  'filePath': page.file.src_path|e,
  'fileName': page.file.name|e,
  'sourceContent': (page._text_forge_original_source | default(page.markdown)),
  'markdownExtensions': config.markdown_extensions,
  'extensionConfigs': config.mdx_configs,
  'github': {
    'owner': config.repo_name.split('/')[0]|e,
    'repo': config.repo_name.split('/')[1]|e,
    'branch': config.remote_branch|default('main')|e,
    'apiUrl': 'https://api.github.com'
  } if config.repo_name else None
} %}
<script id="md-editor-config" type="application/json">
{{ editor_config | tojson }}
</script>
<script>
  window.__MD_EDITOR__ = JSON.parse(document.getElementById('md-editor-config').textContent);
</script>
{% endif %}