KUT 1.0’da desteklenir

Script Kütüphanesi

Bu bölümde javascript kodlarının dinamik olarak işlemesi ve kaynak kodların sıkıştırılması ile ilgili kullanımlar anlatılmıştır. # Bölüm Başlıkları # Yöntemler # Dinamik Javascript Kullanımı…

5 dk okumaSon kontrol: KUT 1.0

This article is currently available in Turkish. Its English translation is being prepared.

Bu bölümde javascript kodlarının dinamik olarak işlemesi ve kaynak kodların sıkıştırılması ile ilgili kullanımlar anlatılmıştır.

Bölüm Başlıkları

# Yöntemler
# Dinamik Javascript Kullanımı

** Kontrolcüyü Hazırlayın
** Javascript Dosyalarını Hazırlayın
** Kontrolcüyü Soyutlayın
** Javascript Dosyalarını Dahil Edin

# Yöntemler

Script::open() : string
Script::close() : string
Script::type(string $type) : this
Script::library(string ...$libraries) : this
Script::compress(callable $content, string $encoding = 'normal', bool $fastDecode = true, bool $specialChars = false) : string

# Open

Bir javascript kodu yazılabilmesi için gerekli olan <script> etiketi oluşturur.

Parametreler

return this

Örnekler

@Script::open()

# Close

Bir javascript kodunun tamamlandığını göster script> etiketi oluşturur.

Parametreler

return this

Kullanım

@Script::open()

# Js codes

@Script::close()

<script> ... </script>

# Type

Script etiketinin type attributesine karşılık gelir.

Parametreler

string $type	Kaynağın türü.
return this

Kullanım

@Script::type('application/javascript')->open()

<script type="application/javascript">

# Library

Javascript etiketi açarken aynı zamanda farklı javascript kaynaklarını dahil etmek için kullanılır.

Parametreler

string ...$libraries	Extra yüklenecek kaynaklar
return this

Kullanım

@Script::library('jquery', 'bootstrap')->type('application/javascript')->open()

<script src="js/jquery"></script>
<script src="js/bootstrap"></script>
<script type="application/javascript">

# Compress KUT 1.0’da desteklenir

Bir javascript kodunu sıkıştırarak dışarıdan okunmasını engellemek için kullanılır.

Parametreler

string $content		Javascript kodları.
string $encoding = 'normal'		Kodlama türü.
Seçenekler	none, numeric, normal, ascii
bool $fastDecode = true		Hızlı kodlama.
bool $specialChars = false		Özel karakterler de sıkıştırılsın.
return string

Kullanım

@Script::type('application/javascript')->open()

@Script::compress
({[|
    console.log(data);
|]})

@Script::close()

<script type="application/javascript">
eval(function(p,a,c,k,e,d){e=function(c){return c.toString(36)};if(!''.replace(/^/,String)){while(c--){d[c.toString(a)]=k[c]||c.toString(a)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('$.1({a:"9:\\/\\/8\\/7\\/6\\/1",5:4(0){$(\'#3\').2(0)}});',11,11,'data|ajax|html|Container|
function|success|Home|KUT|localhost|http|url'.split('|'),0,{}))
</script>

Script Etiketi KUT 1.0’da desteklenir

Bu güncelleme ile opsiyonel Script::tag() yöntemi eklemiştir. Bu yöntem script etiklerinin otomatik olarak açılıp kapatılmasını sağlar. Bu yöntem sadece Script::compress() yöntemi ile beraber kullanılabilir.

@Script::tag()->compess
({[|
    # your script codes
|]})

# Dinamik Javascript Kullanımı

KUT Framework'te kontrolcüleri kullanarak dinamik içerikli parametrelere bağlı olarak değişebilen javascript içerikleri oluşturabilirsiniz. Burada dinamik içerikten kastımız PHP ile entegreli çalışabilir olmasıdır. Bunun için aşağıdaki aşamaları takip ediniz.

Kontrolcüyü Hazırlayın

Harici olarak çağrılacak javascript içeriklerine erişmek için kullanacağınız kontrolcüyü oluşturun.

Dosya: Controllers/Scripts.php
 namespace Project\Controllers;

class Scripts extends Controller
{
    public function application(){}
    public function site(){}
    public function main(){}
}
Yukarıdaki kontrolcü 3 ayrı .js dosyasının çağrılmasını sağlayacaktır.

Javascript Dosyalarını Hazırlayın

Javascript kodları standart bir .php dosyasına yazılacaktır. Bunun için aslında burada yaptığımız şey bir görünüm oluşturmaktır ki yukarıda tanımlanan kontrolcü ile uyumlu otomatik olarak yüklenecek 3 adet görünüm oluşturalım.

Dosya: Views/Scripts/[application|site|main].wizard.php

Yukarıdaki görünümlerden herhangi birinin içerisine PHP ile entegreli javascript kodlarınızı yazabilirsiniz. Örneğin;
@login()
    console.log('Oturum açık');
@endlogin

Kontrolcüyü Soyutlayın

Başlangıç kontrolcüsü her kontrolcüden önce bir takı içerikleri otomatik olarak entegre ettiği için bu içeriklerin Scripts.php kontrolcüsünden önce yüklenmesinin engellenmesi gerekmektedir. Bunun için başlangıç kontrolcüsünün const exclude sabitini aşağıdaki gibi ayarlayınız.

Dosya: Controllers/Initialize.php
 namespace Project\Controllers;

class Initialize extends Controller
{
    const exclude = ['Scripts'];
}
Yukarıdaki işlemin amacı çağrılacak javascript kaynağının kendisi dışında başka bir içerikle yüklenmesini engellemek.

Javascript Dosyasını Dahil Edin

Önceki adımlar yapıldıktan sonra artık yapılması gereken sadece ilgili javascript dosyalarınızın normal bir javascript çağrımı gibi dahil edilmesidir. Ve genellikle bu işlemler footer içerisinde gerçekleştirilir.

Dosya: Views/Sections/footer.wizard.php
[|script src="{| URL::site('Scripts/application') |}"|][|/script|]
[|script src="{| URL::site('Scripts/site') |}"|][|/script|]
[|script src="{| URL::site('Scripts/main') |}"|][|/script|]

Artık dinamik javascript içeriklerini kullanıma hazır.