Javascript ile hava karardığında görünüm değiştirmek

1 yıl önce - 166 kişi tarafından okundu

Son zamanlarda popüler olan ve geceleri hayat kurtaran "karanlık tema" tabiri ile sitelerimizde yer edinmiş olan dark mode için hava karardığında işleme geçen bir javascript kodu hazırladım.

Bu düşünceyi uygularken buna alternatif olabilecek bir kütüphane ya da yardımcı olabilecek bir kod var mı düşünmedim. Sadece aklıma geldi ve en basit yolu ile yaptım, belki işinize yarar.

Vermiş olacağım javascript kodunun amacı kullanıcı sitenize girdiğinde eğer havanın karardığı bir saat üzerinde ise otomatik olarak karanlık temaya geçmesini sağlamak. Bence işe yarar ve geliştirilirse daha güzel olur :)

Düzenlemeniz gereken yerler örneğin ülkelere göre hava kararma saatleri farklı olabiliyor bunu göz önünde bulundurup geliştirebilirsiniz. Veya size göre havanın karardığı saatleri dize içerisine ekleyebilirsiniz. Şurayı düzeltin:

const karanliksaatler = ["20", "21", "22", "23", "00", "01", "02", "03", "04", "05"];

Yukarıda bulunan dize içerisinde havanın karardığı veya karanlık olduğu saatler yer alıyor. Burayı kendinize göre düzeltebilirsiniz.

Github üzerinde paylaşacağım kod üzerinde ise basit bir sayfa üzerinde hava karardığında body elementine class ekleniyor. Bu class "aydinlik" ve "karanlik" olmak üzere ikiye ayrılıyor ve havanın karardığı saatlerde foreach döngüsü kontrol edip class'ı değiştiriyor.

Açık kaynak kodları Github üzerinden indirin veya inceleyin:
https://github.com/v4r1able/karanlik-saat-tespiti