İçeriğe geç

Snippet'ler

Bu bölüm LightScript’leriniz için üç kullanışlı kod snippet’i içermektedir: metreler, durum işleyicileri ve efekt işleyicileri.

Önceki bölümden devam olarak, Metre sınıfı kararsız ölçülen verilerdeki anlamlı değişiklikleri takip etmeye yardımcı olmak için tasarlanmıştır. Bunu kodunuz için bir fren pedalı olarak düşünün; karmaşık bölgelerde bile istikrar sağlar. Her metre, güncelleme fonksiyonunuzun her çalışması sırasında toplanan özelleştirilebilir bir değer dizisi tutar. Bu dizideki tüm değerler aynı olduğunda (yani veriler “kararlı” olduğunda), metre değerini günceller ve bir efekti etkinleştirmek için bağlı bir geri çağırma fonksiyonunu tetikler.

YöntemAçıklama
Meter(size, callback)Yapıcı hem size hem de callback kabul eder.\n\n\n\nsize - Metre değerinin işlenebilecek kadar ‘kararlı’ sayılması için aynı değerin kaç kez mevcut olması gerektiği. Daha yüksek değerler daha fazla doğruluk, daha düşük değerler daha az gecikme sağlar.\n\n\ncallback - Metre değeri kararlı olduğunda ve değiştiğinde çağrılacak fonksiyon.
Meter.setValue(value)Her karede veya bu metre için yeni ham veriler mevcut olduğunda setValue(value) çağırmalısınız.

Ekran verisi toplama süreci genellikle şu yapıyı takip etmelidir:

  1. engine.vision.meter değeri, ekrandan gelen yeni verilere göre güncellenir.
  2. Güncelleme fonksiyonunun içinde, yeni değeri kaydetmek için Meter.setValue(engine.vision.meter) çağrılır.
  3. Metre, tüm değerlerin aynı olup olmadığını görmek için iç dizisini kontrol eder. Öyleyse, kendi durumunu günceller ve atanmış geri çağırma fonksiyonunu çalıştırır.
  4. Geri çağırma fonksiyonu daha sonra Metre’nin değişkenlerini kullanarak belirli koşulları değerlendirir ve bu koşullar karşılanırsa kodunu çalıştırır.

ÖNEMLİ NOT:

Geri çağırmaları atlamayın. Güncelleme fonksiyonu sürekli çalıştığından olabildiğince verimli kalmalıdır. Birincil rolü Metre değerlerini güncellemek olmalıdır. Güncelleme içinde metreleri kontrol etmek ve efektleri tetiklemek için koşulları zincirlemeyin; bu her döngüde gereksiz kontrollere yol açar. Bunun yerine efektlerinizi ayrı fonksiyonlarda tanımlayın ve Metre’nize geri çağırma olarak geçirin.

Kararlı olduğunda, Metre geri çağırma fonksiyonuna birkaç değer sağlar:

DeğişkenlerAçıklama
Meter.valueMetrenin mevcut değeri.
Meter.increasedDeğerimizin bu güncellemede artıp artmadığını gösteren bir boolean
Meter.decreasedDeğerimizin bu güncellemede azalıp azalmadığını gösteren bir boolean
Meter.diffMetrenin bu güncellemede yaşadığı değişimin mutlak değeri.

Metre sınıfı kodu dahil temel tek metre kurulumu aşağıdadır:

<head>
<title>Meter Example</title>
<meta description="Step-by-step metering" />
<meta meter="health" tags="vlc,fortnite" x= ".05" y=".9" width=".189" h="70-140" s="40-100" l="40-100" type="linear" />
</head>
<body style="margin: 0; padding: 0; background: #000;">
<canvas id="exCanvas" width="320" height="200"></canvas>
</body>
<script>
var c = document.getElementById("exCanvas");
var ctx = c.getContext("2d");
// Metreyi başlat
var healthMeter = new Meter(5, healthEffect);
function update(){
// Metre değerlerini güncelle
healthMeter.setValue(engine.vision.health);
window.requestAnimationFrame(update);
}
function healthEffect(){
if(healthMeter.increased){
// Efekti tetikle
} else if (healthMeter.value == 0){
// Efekti tetikle
} else if (healthMeter.diff > .3){
// Efekti tetikle
}
}
function Meter(size, callback) {
this.size = size;
this.value = 0;
this.diff = 0;
this.increased = false;
this.decreased = false;
var values = [];
this.setValue = function (updatedValue) {
// Ekle ve kaydır.
values.push(updatedValue);
if (values.length > this.size) {
values.shift();
}
// Uzun vadeli eşleşme yoksa erken çık.
for (var i = 0; i < values.length - 1; i++) {
if (values[i] !== values[i + 1]) return;
}
// Buraya geldik, yani eşleşen değer koleksiyonumuz var. Değişkenleri ayarla ve geri çağırmayı çalıştır.
if (this.value !== values[0]) {
this.diff = Math.abs(this.value - values[0]);
this.increased = this.value < values[0];
this.decreased = this.value > values[0];
this.value = values[0];
callback();
}
};
}
window.requestAnimationFrame(update);
</script>
<head>
<title>Meter Example</title>
<meta description="Step-by-step metering" />
<meta meter="health" tags="vlc,fortnite" x= ".05" y=".9" width=".189" h="70-140" s="40-100" l="40-100" type="linear" />
</head>
<body style="margin: 0; padding: 0; background: #000;">
<canvas id="exCanvas" width="320" height="200"></canvas>
</body>
<script>
var c = document.getElementById("exCanvas");
var ctx = c.getContext("2d");
// Metreyi başlat
var healthMeter = new Meter(5, healthEffect);
function update(){
// Metre değerlerini güncelle
healthMeter.setValue(engine.vision.health);
window.requestAnimationFrame(update);
}
function healthEffect(){
if(healthMeter.increased){
// Efekti tetikle
} else if (healthMeter.value == 0){
// Efekti tetikle
} else if (healthMeter.diff > .3){
// Efekti tetikle
}
}
function Meter(size, callback) {
this.size = size;
this.value = 0;
this.diff = 0;
this.increased = false;
this.decreased = false;
var values = [];
this.setValue = function (updatedValue) {
// Ekle ve kaydır.
values.push(updatedValue);
if (values.length > this.size) {
values.shift();
}
// Uzun vadeli eşleşme yoksa erken çık.
for (var i = 0; i < values.length - 1; i++) {
if (values[i] !== values[i + 1]) return;
}
// Buraya geldik, yani eşleşen değer koleksiyonumuz var. Değişkenleri ayarla ve geri çağırmayı çalıştır.
if (this.value !== values[0]) {
this.diff = Math.abs(this.value - values[0]);
this.increased = this.value < values[0];
this.decreased = this.value > values[0];
this.value = values[0];
callback();
}
};
}
window.requestAnimationFrame(update);
</script>
function Meter(size, callback) {
this.size = size;
this.value = 0;
this.diff = 0;
this.increased = false;
this.decreased = false;
var values = [];
this.setValue = function (updatedValue) {
// Ekle ve kaydır.
values.push(updatedValue);
if (values.length > this.size) {
values.shift();
}
// Uzun vadeli eşleşme yoksa erken çık.
for (var i = 0; i < values.length - 1; i++) {
if (values[i] !== values[i + 1]) return;
}
// Buraya geldik, yani eşleşen değer koleksiyonumuz var. Değişkenleri ayarla ve geri çağırmayı çalıştır.
if (this.value !== values[0]) {
this.diff = Math.abs(this.value - values[0]);
this.increased = this.value < values[0];
this.decreased = this.value > values[0];
this.value = values[0];
callback();
}
};
}

Durum işleyicisi, diğer tüm efektlere öncelik veren efektleri özellikle işleyen bir efekt yığınıdır. Bir büyük baskın animasyonun tamamlanana kadar kesintisiz çalışmasını istiyorsanız, onu durum işleyicisine ekleyin.

YöntemAçıklama
StateHandler()Yapıcı herhangi bir argüman gerektirmez.
StateHandler.push(new State())Push kullanarak durum yığınına yeni bir durum ekleyebilirsiniz ve işlem hemen başlar.
StateHandler.pop()Mevcut durumu durum yığınından çıkarır ve yığındaki önceki durumu işlemeye başlar.

Durum işleyicisine eklenen herhangi bir nesne mutlaka Process() uygulamalıdır. Process fonksiyonu, işleyicideki bir efektin ömrünü belirler.

Aşağıda temel bir durum işleyicisi ve efekt fonksiyonlarınızın içinde çalışması gereken Process fonksiyonu gösterilmektedir:

var stateHdlr = new StateHandler();
function StateHandler() {
var stack = [];
var state = null;
// Mevcut durumu yığındaki en üstteki öğeye ayarla
var updateState = function () {
if (stack.length > 0) {
state = stack[stack.length - 1];
} else {
state = null;
}
};
// Geliştiricinin durum işleyicisine efekt eklemesine izin ver
this.Push = function (newState) {
stack.push(newState);
updateState();
};
// Geliştiricinin işleyiciden efekt kaldırmasına izin ver
this.Pop = function () {
stack.pop();
updateState();
};
// Mevcut durumun (efektin) Process fonksiyonunu çağır
this.Process = function () {
if (state != null) {
state.Process();
}
};
}
function update(){
stateHdlr.Process();
}
this.start = new Date.now()
this.elapsed = 0;
this.duration = 1000;
this.Process = function () {
// Efekt başlangıcından bu yana geçen süreyi değerlendir
this.elapsed = new Date.now() - this.start;
// Efekt ömrüne ulaştıysa durum işleyicisinden kaldır
if (this.elapsed > this.duration) {
stateMgr.Pop();
}
// Efekt hâlâ çalışıyorsa efekt draw fonksiyonunu çağır
this.Draw();
};

Efekt işleyicileri, daha küçük ve daha hafif efektleri birlikte depolamak ve işlemek için mükemmeldir. İşleyicideki her efekt her güncelleme çağrısında değerlendirilir ve ömrünün sonuna ulaştığında kaldırılır.

Efekt işleyicisi yalnızca efektleri depolamak için kullanılan bir dizidir. Hepsi bu.

// Efektler dizisini bildir
let effects = [];
// (Gösterilmedi) Metreyi değerlendir, geri çağırma fonksiyonu efekti efektler dizisine ekler
effects.push(new SpecialEffect());
// Dizide yinele, her efekt için bir kare canlandır
for (let i = 0; i < effects.length; i++) {
effects[i].draw();
// Ömür sona erdiyse efekti kaldır
if (effects[i].lifetime <= 0) {
effects.splice(i, 1);
}
}

Durum yöneticisi özellikle öncelikli efektler içindir, bu da yürütme sırasında ona öncelik vermemiz gerektiği anlamına gelir. Güncelleme fonksiyonunuzda önce efekt işleyiciyi, SONRA durum işleyiciyi işleyin. Bu, durum efektini efekt işleyicisinin öğelerinin üzerine çizecektir.

Şöyle:

function update(){
// Efekt işleyiciyi değerlendir
for (let i = 0; i < effects.length; i++) {
effects[i].draw();
if (effects[i].lifetime <= 0) {
effects.splice(i, 1);
}
}
// SONRA durum işleyiciyi değerlendir
stateMgr.Process();
}

USB verilerini kaydetmek basit bir süreçtir, ancak bu programların kullandığı sürücülerin bazı sistemlerle çakışması ve yazılım kaldırılana kadar USB bağlantı noktalarını devre dışı bırakması bilinen bir sorundur. Yaygın çözüm BIOS/UEFI ayarlarınızda **‘Güvenli Önyükleme’**yi devre dışı bırakmaktır. Devam etmeden önce, bir flash sürücüde bir sistem geri yükleme noktasının mevcut olması veya önyükleme sırasında kullanıcı girişi gerektirmeyen uzaktan bilgisayar erişim yönteminizin bulunması şiddetle tavsiye edilir. Güvenli Önyüklemeyi devre dışı bırakmanın sorunu çözmediği ve programı kaldırmak için sisteme erişemediğiniz durumlarda bu önemlidir. Bu tür durumlarda, kişisel dosyalarınızı korurken tüm yüklü programları kaldırmak için bir Windows yenileme gerekebilir. Bunu kendi sorumluluğunuzda yapıyorsunuz. Denemekten rahatsız hissediyorsanız cihazınızı buradan talep edin. Bu işlem için dizüstü bilgisayar sistemi kullanmayın.

Yüklendikten sonra süreç basittir ve USB cihazlarınızdan geçen tüm verileri yakalayacaktır. Verileri paylaşmayı planlıyorsanız yakalama sırasında hassas bilgi girmemeye dikkat edin; çünkü tuş vuruşları kayıt içinde yer alır. Kullanılabilecek iki üçüncü taraf program: Usblyzer (ücretsiz deneme) ve Wireshark (ücretsiz). Her ikisi de çalışır, ancak Wireshark’ı seçerseniz USBPcap’ın seçili olduğundan emin olun.

Metre geri çağırmaları ve efekt fonksiyonları oluşturma hakkında daha fazla ayrıntı için bir sonraki Callbacks sayfamıza göz atın.