WYSIWYG, uzun adıyla What You See Is What You Get kısaltması olup türkçe karşılığı “Ne Görüyorsan Onu Alırsın” dır.. Bunda olay, editörde yazdığınızı çıktı aldığınızda neredeyse birebir benzerlikte olmasıdır.. [Kaynak: Wikipedia]
Bir nesnenin düzenlenebilir olması için contenteditable niteliği eklenmelidir..
Modern tarayıcılarda çalışan HTML5’in güzel nimetlerinden olan history.pushState metodu ile, sayfa yenilenmeden link yapımızı dinamik olarak değiştirebileceğiz.. Ve ajax’ın da işin içine girmesi ile baştan aşağı dinamik ve hiç yenilenmeden içerik ve linklerin değiştiği bir site hazırlayacağız.. Yararlı olması dileğiyle..
Düzelme Videosu
Ders bittikten sonra bir hatayı farkettim, ve hemen bir düzeltme videosu hazırladım.. Ben kaynak dosyaları bu şekilde güncelledim, eğer bundan önce indirenleriniz var ise, tekrar indirmeleri rica olunur ????
Aslında başlık tam olarak durumu özetlemiyor.. Ancak en genel tanım bu şekilde sanıyorum ???? Biz dersimizde bir nesnenin genişlik ve yüksekliği yeniden boyutlandırsakta aslında yaptığımz şey fare olaylarıydı.. Yararlı olması dileğiyle..Dikkat: Firefox’da drag içinde a olduğunda sorun veriyor.. Direk drag nesnesi ile yaparsanız sorun çözülecektir.
Bu dersimizde 2 farklı mantıkta tab örneği hazırlayacağız sizlerle.. İlk olarak indis değerine göre bir tab örneği, daha sonrada id değerine (hash yapısına) göre bir tab örneği hazırlayacağız.. Yararlı olması dileğiyle..
Bazen jquery’de ajax ile çalışırken hata yapıyoruz.. Özellikle json formatında geriye değer döndürmeye çalıştığımızda ve php dosyasında bir hata yaptığımızda hatanın nerede olduğunu bulamıyoruz.. En azından dosyayı açıp bakmadığımız sürece.. Bu gibi durumlarda ne yapmalı, hataları nasıl kolayca tespit edebilir ve giderebiliriz bu videoda bunları anlatmaya çalıştım..
Bugün prototürk’ün yeni halini hazırlarken bir hex değerini rgb’ye dönüştürme ihtiyacı duydum.. Biraz araştırdıktan sonra bu işin o kadarda zor olmadığını anladım, bulduğum fonksiyonları sizlerle de paylaşmak istiyorum, eminim bir gün işinize yarar ????
RGB to HEX
Elinizde bulunan RGB değerini HEX değerine çevirmek için gerekli fonksiyon;
function hex(c) {
var hex = c.toString(16);
return hex.length == 1 ? "0" + hex : hex;
}
function rgb2hex(r, g, b) {
return "#" + hex(r) + hex(g) + hex(b);
}
alert( rgb2hex(12, 47, 112) ); // #0c2f70
Sırasıyla Red, Green ve Blue değerlerini yazmanız yeterlidir.
HEX to RGB
Elinizde bulunan HEX değerini RGB değerine çevirmek için gerekli fonksiyon;
Ben sunucu programı olarak Xampp’ı kullanıyorum.. Ve çoğu zaman 80 portunu kullanan bir başka program açık olduğundan localhost’u başlatabilmek için önce o programları kapatmak zorunda kalıyorum ???? Ancak bundan sıkıldığım için xampp’da nasıl port değiştirebileceğimizi biraz araştırdım, öğrendim ve sizlerede göstermek istiyorum..
Yapılacaklar;
1)[XAMPP_KURULU_DIZIN]/etc/httd.conf dosyasını herhangi bir editör ile açın. 2) Daha sonra Listen 80 diye aratın.. Buradaki 80 değerini herhangi bir sayı ile değiştirin, bu sizin yeni portunuz olacak.. Örneğin Listen 31 yapın. 3) Ve tekrar aynı dosyada ServerName diye aratın.. Muhtemelen onun değeri localhost ya da localhost:80 olacaktır.. Siz bunu 2. maddede belirlediğiniz port olarak değiştirin.. Yani ServerName localhost:31şeklinde. 4) Xampp’ı yeniden başlatın ve servisleri çalıştırın. 5)http://localhost:31 ya da http://127.0.0.1:31 şeklinde localhostunuza giriş yapabilirsiniz ????
Bugün sizlere PHP ve JSON ilişkisini anlatacağım.. JSON’ı temel olarak öğrendikten sonra, PHP’de bulunan JSON fonksiyonlarını ve ne işe yaradıklarını öğreneceğiz..Öncelikle JSON nedir sorusuna basit bir cevap verelim.. JSON, javascript Object Notation’ın kısaltması olup tıpkı XML gibi bir veri değişim formatıdır.
JSON Yapısı
jSON, object (nesne) ve array (dizi) olmak üzere 2 temel yapı içerir. Bu temel yapılar evrensel yapılardır ve tüm modern programlama dillerinde mevcuttur.
Object Yapısı
Bir nesne (object), { (süslü parantez) ile başlar ve } (süslü parantez) ile biter. Anahtar ve değer şeklinde tanımlanırlar.. Her anahtardan sonra : (iki nokta üstüste)kullanılır.. Anahtar/değer çiftleri birbirinden , (virgül) ile ayrılırlar.
Aşağıdaki resim object yapısını temsil etmektedir.
Gördüğünüz gibi o kadarda karmaşık bir yapı değil.. Daha iyi pekiştirmek için hemen ilk örneğimizi yapalım ve bir nesne oluşturalım.
{
"yeniNesne" : "nesne değeri"
}
Tebrikler, ilk json nesnemizi oluşturduk ???? Şimdi diğer yapıya (array) göz atalım..
Array Yapısı
Bir dizi (array), [ (köşeli parantez) ile başlar ve ] (köşeli parantez) ile biter. Sadece değer şeklinde tanımlanır.. Değerler birbirinden , (virgül) ile ayrılır.
Aşağıdaki resim array yapısını temsil etmektedir.
Gördüğünüz gibi object yapısından biraz farklı.. Köşeli parantezlerle başlayıp bittiği gibi bir anahtar tanımlaması yok.. Yani dizi yapısında sadece değerleri bir arada tutuyoruz.. Bununla ilgili küçük bir örnek yapalım hemen.
["test1","test2"]
Örnekte gördüğünüz gibi dizi içerisinde 2 değer ve bu değerleri virgül ile ayırdık.
Value
Bir değer, çift tırnak içinde şu türleri barındırabilir. string (yazı), true, false, null (boş değer), number (sayı), object (nesne) ve array (dizi)
Bizim için şimdilik bu kadar bilgi yeterli.. Daha fazla bilgi edinmek için resmi adresine başvurabilirsiniz; http://json.org/json-tr.html
PHP’de JSON Fonksiyonları
PHP bize JSON ile ilgili 2 fonksiyon sunuyor.. Bunların ilki json_encode()yani bir json formatı dönüştürücüsü ve ikincisi ise json_decode() yani bir json formatı çözücüsü.. Zaten temelde json işlemi içinde bu 2 fonksiyon yeterlidir.
json_encode()
Bir dizi ifadeyi json formatına dönüştürür.. Küçük bir örnek ile kullanımını görelim;
Bu fonksiyona ait birde 2. parametre vardır ancak zorunlu değildir.. 2. parametre değerleri parse etmek için kullanılan tip atamalarıdır.. Sırasıyla aşağıda inceleyelim;
JSON_HEX_TAG Bütün < ve > karakterleri \u003C ve \u003E karakterlerine dönüştürülürler.
JSON_HEX_AMP Bütün & karakterleri \u0026 karakterlerine dönüştürülürler.
JSON_HEX_APOS Bütün ‘ karakterleri \u0027 karakterlerine dönüştürülürler.
JSON_HEX_QUOT Bütün “ karakterleri \u0022 dönüştürülürler.
JSON_FORCE_OBJECT İlişkisel olmayan dizi kullanıldığında çıktıların dizi yerine nesne olmasını sağlar.
json_decode()
JSON formatındaki veriyi çözer ve php’de kullanabileceğimiz hale getirir.. Yapısal olarak obje ve dizi halinde çevrilir. 3 parametre alır ancak sadece ilk parametre zorunludur. Bir örnek ile daha anlaşılır hale getirelim;
Fonksiyona 2. parametreyi true olarak atarsak nesne değil dizi olarak çözme işlemi yapacaktır.. O zamanda veriye erişimimiz yukarıdaki gibi değil aşağıdaki gibi olacaktır.
JSON işleminde bir hata oluşup oluşmadığını bu fonksiyon ile kontrol edebiliriz. Bir hata olduğunda sayısal değer döndürecektir.. Bu sayısal değerler sırasıyla aşağıdaki sabitleri temsil etmektedir.
JSON_ERROR_NONE – Hata bulunamadı JSON_ERROR_DEPTH – Azami yığın derinliği aşıldı (?) JSON_ERROR_CTRL_CHAR – Denetim karakteri hatası, muhtemelen yanlış kodlanmış JSON_ERROR_SYNTAX – Sözdizimi hatası JSON_ERROR_UTF8 – UTF-8 karakter kodlama hatası, muhtemelen yanlış kodlanmış (Geçerlilik : PHP 5.3.1)
JSONView Eklentisi
Tarayıcılarınız için JSON görüntüleme eklentisini kullanabilirsiniz.
Mevcut nesnemiz dışında herhangi bir yere tıklandığında bunu yakalayıp işlem yapmak için yani hedef dışı tıklamayı yakalamak için nasıl bir yol izleyeceğimizi bu derste sizlere anlatmaya çalıştım.. Yararlı olması dileğiyle..