Ekran görünümü

Ekran görünümü (player.entry) oynatıcının içinde, sandbox’lı bir çerçevede çalışır. Sahadaki en eski oynatıcı LG webOS 3.x’tir (Chromium 38); görünüm orada da açılmalıdır.

<!doctype html>
<html lang="tr">
  <head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="viswoo-screen.css" />
  </head>
  <body>
    <div class="vz-screen vz-center">
      <h1 class="vz-title" id="title"></h1>
    </div>
    <script src="viswoo-player.js"></script>
    <script src="player.js"></script>
  </body>
</html>

// player.js: yalnız ES5
(function () {
  'use strict';
  var player = window.Viswoo.player;
  player.context().then(function (context) {
    document.getElementById('title').textContent = context.settings.title || '';
  });
})();

Tek dosya

Oynatıcı görünümü internet yokken de açabilmek için tek parça indirir ve saklar. pack, köprü etiketini (viswoo-player.js), TV kitini ve paketteki yerel betik ve stilleri (<script src="x.js">, <link rel="stylesheet" href="x.css" />) görünümün içine gömer. Böylece ekran ve telefon sayfası ortak dosya paylaşabilir (ör. shared/metinler.js). Görseller data URI olur. Görünüm en çok 512 KB’tır.

ES5

Yasak sözdizimi: let, const, ok fonksiyonu, şablon dizesi, sınıf, async/await, yayma (...), varsayılan parametre, fonksiyon çağrısında ve tanımında sondaki virgül. Promise kullanılabilir. CSS’te değişken (var(--x)) yoktur; renk JavaScript’le doğrudan verilir.

validate ve pack görünümün betiklerini ES5 olarak ayrıştırır ve hatayı satırıyla bildirir. Prettier’ı "trailingComma": "es5" ile çalıştırın (şablonlarda hazır).

Sandbox ve ağ

Çerçeve yalnız allow-scripts ile açılır; görünüm oynatıcının depolamasına ve belirtecine ulaşamaz. Ağ isteği yapılmaz (connect-src 'none'): sunucu işi köprüdeki call ile yapılır, sonuç köprüden gelir.

Boyut ve yön

Çerçeve bağlam gelmeden boyut almamış olabilir. Çizim boyutu window.innerWidth/innerHeight sıfırdan büyük olunca yapılır ve resize olayında tekrarlanır. Yatay ve dikey ekranda (context.screen.orientation) düzen bozulmaz. Ölçüleri vmin ile verin; kit kenarlardan %5 güvenli alan bırakır.

Dokunmatik ve QR

context.touch true ise ekrana dokunulabilir (kabuğun bildirdiğidir, doğrulanmamış olabilir). Değilse etkileşimi telefona taşıyın: context.publicUrl genel sayfanın adresidir, görünüm onu QR olarak çizer (QR üreticisini pakete koyun; ağdan yüklenemez).

Biri dokununca öğenin bitmemesi için hold(saniye) çağırın (en çok 120 sn, yeniden çağırmak süreyi yeniler). İşiniz bitince done() oynatıcıyı sıradaki öğeye geçirir.

Yerleşim ve süre

Görünüm üç biçimde oynar (Manifest): playlist öğesi, aralıklı (her N dakikada M saniye) ya da sürekli (yayını kaplar). context.duration öğenin planlanan süresidir. Sürekli biçimde görünüm uzun süre açık kalır: zamanlayıcıları ve dinleyicileri biriktirmeyin, belleği sızdırmayın.

Çevrimdışı

İnternet yokken görünüm son indirilen hâliyle ve son ayarlarla açılır. call plugin.offline ile düşer; sakin bir mesaj gösterin ya da etkileşimi gizleyin. report sayıları oynatıcı bekletir ve bağlantı gelince gönderir.

Önizleme

Panel görünümü Ayarlar (kaydedilmemiş değerlerle) ve Önizleme sekmelerinde TV çerçevesinde açar. Önizlemede call deneme kipindedir: çekiliş stok düşürmez, kod örnektir (ORNEK1), kendi sunucunuza gidilmez (plugin.preview_unavailable).

Köprünün tamamı: Ekran köprüsü.