Böyle bir tablo oluşturmak için Dataview eklentisini kurman ve notta YAML'ı etkinleştirmen gerekir

YAML'dan bilgi alan basit bir tablo nasıl görünüyor:

```dataviewjs
const container = this.container;

const allPages = dv.pages('"2. Areas/Сериалы и фильмы/7. Сериалы"')
    .where(p => p.Жанр && p.Рейтинг)
    .sort(p => -Number(p.Рейтинг));

// --- UI bloğu: Filtre + Arama ---
const controls = document.createElement("div");
controls.style.display = "flex";
controls.style.gap = "1rem";
controls.style.marginBottom = "1rem";

// Türlere göre filtre
const genres = [...new Set(allPages.flatMap(p => Array.isArray(p.Жанр) ? p.Жанр : [p.Жанр]))];
const genreSelect = document.createElement("select");

const allOption = document.createElement("option");
allOption.value = "all";
allOption.textContent = "Tüm türler";
genreSelect.appendChild(allOption);

for (let genre of genres.sort()) {
  const option = document.createElement("option");
  option.value = genre;
  option.textContent = genre;
  genreSelect.appendChild(option);
}
controls.appendChild(genreSelect);

// Arama alanı
const searchInput = document.createElement("input");
searchInput.type = "text";
searchInput.placeholder = "🔍 Başlığa göre ara...";
searchInput.style.flex = "1";
controls.appendChild(searchInput);

container.appendChild(controls);

// --- Tablo ---
const table = document.createElement("table");
table.className = "dataview table-view-table";

const header = table.insertRow();
["🎬 Kapak", "🎞 Başlık", "🎭 Tür", "⭐ Puan", "🧠 İçgörü"].forEach(text => {
  const th = document.createElement("th");
  th.textContent = text;
  header.appendChild(th);
});

function renderTable(filterGenre = "all", searchTerm = "") {
  table.querySelectorAll("tr:not(:first-child)").forEach(row => row.remove());

  const filteredPages = allPages.filter(p => {
    const genreMatch = filterGenre === "all" || (Array.isArray(p.Жанр) ? p.Жанр.includes(filterGenre) : p.Жанр === filterGenre);
    const searchMatch = !searchTerm || p.file.name.toLowerCase().includes(searchTerm.toLowerCase());
    return genreMatch && searchMatch;
  });

  for (let p of filteredPages) {
    const row = table.insertRow();

    const cellCover = row.insertCell();
    cellCover.innerHTML = p.Постер
      ? `<img src="${p.Постер}" width="100" style="border-radius: 8px;">`
      : "—";

    const cellTitle = row.insertCell();
    const link = document.createElement("a");
    link.href = p.file.path;
    link.textContent = p.file.name;
    link.className = "internal-link";
    cellTitle.appendChild(link);

    const cellGenre = row.insertCell();
    cellGenre.textContent = Array.isArray(p.Жанр) ? p.Жанр.join(", ") : p.Жанр;

    const cellRating = row.insertCell();
    cellRating.textContent = p.Рейтинг + "/10";

    const cellInsight = row.insertCell();
    cellInsight.textContent = p.Инсайт || "–";
  }
}

// --- Dinleyiciler ---
genreSelect.onchange = () => renderTable(genreSelect.value, searchInput.value);
searchInput.oninput = () => renderTable(genreSelect.value, searchInput.value);

// İlk render
renderTable();
container.appendChild(table);```

→ const allPages = dv.pages(‘“2. Areas/Сериалы и фильмы/7. Сериалы”’) — YAML’lı notlarının bulunduğu kendi yolunla değiştir → Son üç apostrof karakterini yeni bir satıra taşı

---

🧠 Bu kodu daha derin anlamak isteyenler için açıklama:

📁 1. Notları doğru klasörden yükleme

const allPages = dv.pages('"2. Areas/Сериалы и фильмы/7. Сериалы"')
    .where(p => p.Жанр && p.Рейтинг)
    .sort(p => -Number(p.Рейтинг));

• Burada “Diziler” klasöründeki tüm notlar yüklenir.

• Yalnızca Жанр (Tür) ve Рейтинг (Puan) olanlar seçilir.

• Azalan puana göre sıralama — en iyiler üstte.

📌 Yapın farklıysa yolu kendi klasörünle değiştir.

---

🎛️ 2. Arayüz: türe göre filtre + arama

const genres = [...new Set(allPages.flatMap(...))];

• Tüm benzersiz türler toplanır (örn.: Dram, Komedi, Anime).

• Bir açılır liste oluşturulur — yalnızca “Bilim Kurgu” ya da yalnızca “Anime” filtreleyebilirsin.

searchInput.placeholder = "🔍 Başlığa göre ara...";

• Arama alanı not adına göre filtreler (genellikle dizinin başlığıdır).

• Gerçek zamanlı çalışır — kullanışlı!

---

📋 3. Tablo: her satır nasıl görünür

["🎬 Kapak", "🎞 Başlık", "🎭 Tür", "⭐ Puan", "🧠 İçgörü"]

Her satır bir dizidir, şunlar gösterilir:

Sütun	Ne gösterir
🎬 Kapak	Постер (Poster) alanından görsel (varsa)
🎞 Başlık	Dizinin başlığı, nota bir bağlantı olarak
🎭 Tür	Bir ya da birkaç tür
⭐ Puan	10 üzerinden puan (Рейтинг)
🧠 İçgörü	Diziden düşüncen, çıkarımın ya da alıntın

---

🧠 4. Filtreleme ve render etme

function renderTable(filterGenre = "all", searchTerm = "") { ... }

• Eski tablo satırlarını siler ve yalnızca seçilen türe ya da girilen metne uyanları yeniden çizer.

• Bu, tabloyu canlı yapar: kullanıcının eylemlerine tepki verir.

---

🔁 5. Olay dinleyicileri

genreSelect.onchange = () => renderTable(...)
searchInput.oninput = () => renderTable(...)

• Türü değiştirdiğinde ya da aramaya yazdığında — tablo güncellenir.

• Her şey canlı olur, yeniden yükleme olmadan.

---

✅ YAML’da neye ihtiyacın var

Bu kodun çalışması için, dizi notlarında şu alanların belirtildiğinden emin ol:

Постер: https://link-to-image.jpg
Жанр: [Bilim Kurgu, Dram]
Рейтинг: 8.7
Инсайт: Geleceğin teknolojisine ilham veren bir bakış.

---

🔥 Sonuç

Harika bir katalog elde edersin:

• her şey güzel biçimlendirilmiş;

• ruh hâline (tür) göre filtreleyebilirsin;

• hızlıca bulup yeniden izleyebilirsin;

• arkadaşlarınla ya da abonelerinle paylaşabilirsin.

---