script.js

document.addEventListener("DOMContentLoaded", () => {
    const iframe = document.querySelector(".cv-iframe");
  
    // preview lastet
    iframe.addEventListener("load", () => {
      const nameInput = document.getElementById("name");
      const emailInput = document.getElementById("email");
      const phoneInput = document.getElementById("phone");
  
      function updateCV() {
        const cvDoc = iframe.contentDocument || iframe.contentWindow.document;
        cvDoc.getElementById("cv-name").textContent = nameInput.value;
        cvDoc.getElementById("cv-email").textContent = emailInput.value;
        cvDoc.getElementById("cv-phone").textContent = phoneInput.value;
      }
  
      nameInput.addEventListener("input", updateCV);
      emailInput.addEventListener("input", updateCV);
      phoneInput.addEventListener("input", updateCV);
    });
  
    // om meg
    const aboutMeText = document.getElementById("about-me-text");
    function updateAboutMePreview() {
      const cvDoc = iframe.contentDocument || iframe.contentWindow.document;
      const content = aboutMeText.value;
      const container = cvDoc.getElementById("cv-about-me");
      container.innerHTML = content ? `<p>${content}</p>` : "<p>Fortell litt om deg selv.</p>";
    }
    aboutMeText.addEventListener("input", updateAboutMePreview);
  
    // utdanning
    const educationList = document.getElementById("education-list");
    function addEducation() {
      const group = document.createElement("div");
      group.classList.add("input-group");
  
      const eduInput = document.createElement("input");
      eduInput.type = "text";
      eduInput.placeholder = "Navn på Utdanning";
  
      const startInput = document.createElement("input");
      startInput.type = "text";
      startInput.placeholder = "Start";
  
      const endInput = document.createElement("input");
      endInput.type = "text";
      endInput.placeholder = "Slutt";
  
      [eduInput, startInput, endInput].forEach(input =>
        input.addEventListener("input", updateEducationPreview)
      );
  
      const removeBtn = document.createElement("button");
      removeBtn.classList.add("remove-btn");
      removeBtn.textContent = "Remove";
      removeBtn.onclick = () => {
        educationList.removeChild(group);
        updateEducationPreview();
      };
  
      group.append(eduInput, startInput, endInput, removeBtn);
      educationList.appendChild(group);
      updateEducationPreview();
    }
  
    function updateEducationPreview() {
      const cvDoc = iframe.contentDocument || iframe.contentWindow.document;
      const inputGroups = educationList.querySelectorAll(".input-group");
      const items = [];
  
      inputGroups.forEach(group => {
        const [edu, start, end] = group.querySelectorAll("input");
        if (edu.value || start.value || end.value) {
          items.push(`• ${edu.value} - ${start.value} - ${end.value}`);
        }
      });
  
      const container = cvDoc.getElementById("cv-education");
      if (container) {
        container.innerHTML = "<h2>Utdanninger:</h2>" + items.join("<br>");
      }
    }
  
    document.getElementById("add-education").addEventListener("click", addEducation);
  });