const okno   = document.getElementById('oknoCzatu');
const pole   = document.getElementById('poleWiadomosci');
const btn    = document.getElementById('przyciskWyslij');
const btnLos = document.getElementById('przyciskLosuj');

const odpowiedzi = [
    "Świetnie!",
    "Kto gra główną rolę?",
    "Lubisz filmy Tego reżysera?",
    "Będę 10 minut wcześniej",
    "Może kupimy sobie popcorn?",
    "Ja wolę Colę",
    "Zaproszę jeszcze Grześka",
    "Tydzień temu też byłem w kinie na Diunie",
    "Ja funduję bilety"
];

function dodajLewo(tresc){
  if(!okno) return;
  const w = document.createElement('div');
  w.className = 'wiadomosc wiadomosc-lewa';
  const img = document.createElement('img');
  img.src = 'Jolka.jpg';
  img.className = 'avatar';
  const d = document.createElement('div');
  d.className = 'dymek dymek-biale';
  d.innerText = tresc;
  w.appendChild(img);
  w.appendChild(d);
  okno.appendChild(w);
  w.scrollIntoView();
}

function dodajPrawo(tresc){
  if(!okno) return;
  const w = document.createElement('div');
  w.className = 'wiadomosc wiadomosc-prawa';
  const d = document.createElement('div');
  d.className = 'dymek dymek-szare';
  d.innerText = tresc;
  const img = document.createElement('img');
  img.src = 'Krzysiek.jpg';
  img.className = 'avatar';
  w.appendChild(d);
  w.appendChild(img);
  okno.appendChild(w);
  w.scrollIntoView();
}

if (btn && pole) {
  btn.addEventListener('click', function(){
    const t = pole.value.trim();
    if(t === '') return;
    dodajLewo(t);
    pole.value = '';
  });

  pole.addEventListener('keydown', function(e){
    if (e.key === 'Enter') {
      e.preventDefault();
      btn.click();
    }
  });
}

if (btnLos) {
  btnLos.addEventListener('click', function(){
    const t = odpowiedzi[Math.floor(Math.random() * odpowiedzi.length)];
    dodajPrawo(t);
  });
}