'use strict';

(function () {
  const CFG = window.SOSH49_HOMEWORK || {};
  const FORM_HOST = 'https://forms.yandex.ru/u/';

  class HomeworkForm extends HTMLElement {
    connectedCallback() {
      if (this.dataset.rendered === '1') return;
      this.dataset.rendered = '1';

      const formId  = this._get('form-id', CFG.formId, '6acced6a2c4f893c801bb231'); 
      const heading = this._get('heading', CFG.heading, 'Домашнее задание');
      const note    = this._get('note',    CFG.note,    'Загрузите файл :');
      const height  = this._get('height',  CFG.height,  '600');
      //const theme   = this._get('theme',   CFG.theme,   'light');

      if (!formId) {
        this.innerHTML = this._error(
          'Не задан ID формы. Укажите атрибут form-id на <homework-form> ' +
          'или заполните window.SOSH49_HOMEWORK.formId в файле js/homework-config.js.'
        );
        console.error('[homework-form] formId не найден');
        return;
      }

      const lessonName = this._lessonName();
      const className  = this._className();

      const params = new URLSearchParams();
      params.set('iframe', '1');
  
      if (lessonName) params.set('lesson_name', lessonName);
      if (className)  params.set('class_name', className);

      const url = FORM_HOST + formId + '/?' + params.toString();

      this.innerHTML = this._markup(heading, note, url, height);

      console.log('[homework-form] Загружаем форму:', url);
      console.log('[homework-form] lesson_name =', lessonName || '(пусто)');
      console.log('[homework-form] class_name  =', className  || '(пусто)');
    }

    _get(attr, fromConfig, fallback) {
      const v = this.getAttribute(attr);
      if (v != null && v !== '') return v.trim();
      if (fromConfig) return String(fromConfig).trim();
      return fallback || '';
    }

    _lessonName() {
      const h1 = document.querySelector('.lesson-head h1, main h1');
      return h1 ? h1.textContent.replace(/\s+/g, ' ').trim() : '';
    }

    _className() {
      const crumbs = document.querySelectorAll('.breadcrumbs a');
      if (crumbs.length >= 2) {
        return crumbs[1].textContent.replace(/\s+/g, ' ').trim();
      }
      const m = window.location.pathname.match(/\/(\d+)\//);
      return m ? m[1] + ' класс' : '';
    }

    _markup(heading, note, url, height) {
      return `
        <section class="lesson-sectionl" id="homework">
          <h2>${this._escape(heading)}</h2>
          <p>${this._escape(note)}</p>
          <div class="homework-form">
            <iframe
              src="${this._escape(url)}"
              width="100%"
              height="${this._escape(height)}"
              frameborder="0"
              loading="lazy"
              title="Форма для загрузки домашнего задания"
            ></iframe>
          </div>
        </section>
      `.trim();
    }

    _error(msg) {
      return `<div style="padding:16px;border:1px solid #fca5a5;border-radius:8px;` +
             `color:#fca5a5;background:rgba(252,165,165,.08);font-size:14px">` +
             `${this._escape(msg)}</div>`;
    }

    _escape(s) {
      return String(s == null ? '' : s).replace(/[&<>"']/g, c => ({
        '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;'
      }[c]));
    }
  }

  if (!customElements.get('homework-form')) {
    customElements.define('homework-form', HomeworkForm);
  }
})();