metude's Blog

The Hobbit

noreply@blogger.com (metude) — Thu, 13 Dec 2012 19:35:00 +0000

Bundan yıllar yıllar önce yüzüklerin efendisi diye bir filmin trailerını teknosa mağazasında gördükten sonra tolkien külliyatını okumaya başlamış, filmlerini defalarca dost meclislerinde toplu olarak izlemiş, replikleri yutmuş bir kişi yazıyor bu satırları.

Bazıları vardır filmi izlemiştir, kitabı okumuştur, çok saçma bulmuştur, böyle hikaye mi olur, bunlar ne biçim yaratıklar falan diyenler olacaktır. Bu size hitap etmiyor demektir, bizim görebildiklerimizi siz göremiyorsunuz demektir. Size başka tatlar lazım boşverin siz orta dünyayı, bize bırakın.

Fanstastik kurgu farklı bir daldır, bu dünyadan soyutlanmanın bir başka yoludur. Biz tolkien okurları, pj seyrederleri olarak yeni bir orta-dünya filmiyle başbaşa kalmanın ve bunu dostların içinde izlemenin tarifsizlik mutluluğu içindeyiz.

Bir de orta dünyaya silmarilliondan girin.

Javascript ile URL Parçalama

noreply@blogger.com (metude) — Sun, 09 Dec 2012 14:47:00 +0000

Bu yazıda Chrome'dan eklenti indirmemizi sağlayan eklentiyi kodlarken ihtiyaç duyduğum bir konudan bahsedeceğim. Daha sonra bu konuda yeterli Türkçe kaynak Google'da olmayınca ben yazayım dedim.

İşin hikaye kısmını anlatmaya gerek yok, elimizde bir URL var bunu parçalayıp bazı kısımları alacağız.

Öz

Aşağıda normal bir URL'miz var, şimdi bunda hangi komutları neleri döndürüyor bize aşağıda listeledim.

http://metude.blogspot.com/ornek/index.html#hash

Bu satırı özetlersek şöyle olacak:
protocol://host/pathname#hash

window.location.protocol = "http"

window.location.host = "metude.blogspot.com"
Host eğer subdomain varsa size onunla birlikte bir sonuç getirir. Yani aslında site blogspot.com'da olmasına rağmen adresin subdomaini de alır. www.ornek.com:80 gibi port numarası varsa onu da alır.

window.location.pathname = "ornek/index.html"
Bunda ise bize .com/ gibi son kısımdan sonrası bize döner. Ancak hash varsa dahil edilmez.

window.location.hash = "#hash"

window.location.href = "http://metude.blogspot.com/ornek/index.html#hash"
Bu ise bize tüm url'yi getirir.

window.location.port ile www.ornek.com:80'deki 80 rakamını alabilirsiniz.

window.location.search ise bize soru işareti dahil olmak üzere query sorgusunu verir. (“?x=1&y=2″)

Metodlar

Burada bir de location'a ait 2 metoda değinmek istiyorum.

replace()
window.location.replace("http://www.google.com") adresi yeni adresle değiştirebilirisiniz. Ayrıca bu tarayıcı geçmişindeki girişi de değiştirir.

reload() komutu ile sayfayı yenilemeniz mümkün.

Parçalama

Şimdi ise başlıktaki konumuza gelelim. Elimizdeki adresi "/" işaretini baz alarak parçalamak istiyoruz. Sonrasında bu bir dizi içinde olacak. Kullanmak içinse bunu bir değişkene yükleyelim.

pathArray = window.location.href.split( '/' );

Bu satır bizim adresimizi şöyle bir dizide saklayacak:

Tüm bu komutları denemek için uzağa gitmenize gerek yok eğer Dragonfly gibi geliştirici aracına sahip tarayıcınız varsa, konsoldan komutları deneyebilirsiniz.

Kaynaklar:

Opera Eklentisi Yapımı - Download Chrome Extension

noreply@blogger.com (metude) — Wed, 28 Nov 2012 11:28:00 +0000

Bu yazımda bir Opera eklentisini nasıl yaptığımdan bahsedeceğim. Opera Eklentisi ve JavaScript için başlangıçta olanlara güzel bir kaynak çıkar umarım. Öncelikle bir çalışmaya başlamadan önce her yazılımcının yapması gerektiği gibi ihtiyaç duyduğum noktaları belirmemem gerekli.

Sağ tık menüde sadece Chrome Web Store adresinde görülmeli.
https://chrome.google.com/webstore/detail/bfbmjmiodbnnpllbbbfblcplfjjepjdn?hl=tr Burada detail'den sonraki id'yi almalı ama yerelleştirme verileri yani ?hl kısmını almamalı.
Daha sonra bunu aynı sayfada https://clients2.google.com/service/update2/crx?response=redirect&x=id%3D~~~~%26uc adrese gidip ~~~~ yerine bizim id'yi yerleştirmeli.

Bir eklenti için olmazsa olmaz bazı dosyalar var. Bunlar hakkında ayrıntılı bilgi bu adreste mevcut. Ayrıca ben eğer daha fazla Opera eklentisi hazırlama düşünceniz varsa kendinize özel bir helloworld.oex hazırlamanızı öneririm.

Eklenti temeli

config.xml'de adı ihtiyaç duyduğu özellikler gibi bir bilgi sayfası tanımladık. Dikkat edilmesi gereken 6. satırda içerik menüsünü kullanmamız için izin istedik. Aksi takdirde eklentimiz çalışmayacak.

index.html ise boş da olsa tanımlanması gereken bir dosya. Tabi biz içine de iki tane gerekli .js dosyası ekleyeceğiz. Yerelleştirme için strings.js ve istediğimiz parçalamayı yapmayı sağlayacak olan background.js.

Eklenti dosyalarımızı herhangi bir klasör içine koymadan .zip olarak paketleyip, uzantısını .oex olarak değiştiriyoruz işimiz bitince. Ayrıca dosyalarınızı her seferinde ziplemekle uğraşmamak için kodlama yaparken config.xml'i Opera'da eklenti yönetimi sayfasına bırakın. Daha sonra test etmek yenile düğmesine tıklamanız yeterli olacak.

Arkaplan

Burası hikayenin başladığı nokta öncelikle index.html'den çağırdığımız background.js'e window.addEventListener ile DOM ağacı yüklendikten sonra çalışmasını sağlıyoruz. Ayrıca bir de load parametresi var ancak onda sayfanın tamamen yüklenip gerçeklenmesini (render) beklediği için en hızlı ve yeterli çözüm bu.

Daha sonra anonim bir fonksiyonun içinde 3. satırda Opera'nın içerik menüsü destekleyen sürümüne sahip olup olmadığını sorgulyoruz. Aksi takdirde ise satıs 24'de else ile console'a hata yazdırıyoruz.

Satır 5; itemProps değişkeni bizim içerik menüsü oluşturmamızı sağlayacak diziyi saklayacak olan değişkeni.

Satır 7; contexts'e page ve link vererek yapacağımız menü girişinin sadece o sayfadaki bağlantı ve normal sayfa menüsünde çıkmasını sağlayacağız.

Satır 8; documentURLPatterns ile menü girişinin aktif edeceğimiz sayfaları belirledik.

Satır 12; bize bu menü girişinin adını tanımlamamızı sağlıyor. Biz de diğer js dosyamızdaki strings dizisi içindeki download-it değişkenini çağırdık. Bu değişkene diğer başlıkta değineceğim.

Satır 13; Tıklandığında bir fonksiyonu başlattık.

Satır 14; Bu noktadan sonraki kısımda url'yi yakalayıp yeni URL'ye gideceğiz. Bu boş dizi de bize indirme url'sine gitmede yardımcı olacak. Bu dizinin url nesnesine atama yapıp sekmenin adresini değiştireceğiz.

Satır 15; Aynı satırda iki değişken tanımladık. İlki aktif sekmeyi yakalıyor, ikincisi ise bu sekmenin URL'sini currentUrl içine alıyor.

Satır 16; URL parçalama konusu ile ilgili ayrı bir yazı yazacağım. Burada biz diziyi pathArray değişkeni içinde saklayacağız. currentUrl ile aldığımız adresi, split('/') fonksiyonu ile /'yi temel alarak parçlayıp diziyi sakladık. Bunu daha canlı görmek için herhangi bir sekmede Opera Dragonfly'ı (Ctrl+Shift+I) ile açıp konsola document.URL.split('/')
Bu oluşan diziden 6. nesneyi aldık. Dizilerin saymaya sıfırdan başladığını atlamayın.

Satır 17; Burada bir kere daha split yaptık ama bu sefer ? ile çünkü Chrome Web Store bazen yerelleştirme ile ilgili ?hl=tr'yi adrese ekliyoruz. Bize ise sadece id lazım.

Satır 18; Yukarılarda oluşturduğumuz boş tabProps dizisinin url nesnesine şimdi bir atama yapacağız. lastArray'ın ilk nesnesini alıp yeni bir string içinde url'imizi paketliyoruz.

Satır 19; currentTab ile odaklanan sekmeyi almıştık, update() ile de bu sayfadaki adresi güncelleyeceğiz böylece kullanıcı gereksiz yere yeni sekmeye gitmeyecek. currentTab.update ile sayfanın özelliklerine sahip dizideki url'yi bizim tabProps.url ile güncelledik.

Satır 22; Şimdi bunca şeyden sonra yazdıklarımızı uygun raflara yerleştirelim. itemProps dizisi ile yeni menümüzü oluşturalım. Bunu da item değişkeninde saklayalım.

Satır 23; Menümüze item değişkeni içindekileri yerleştirelim.

Satır 27; false ile fonksiyonumuzun bittiğini artık durması gerektiğini söyledik.

Yerelleştirme

Opera geliştiricilere kolaylık olsun diye eğer locales klasörünüz varsa dosyalara öncelikle oradan bakıyor. locales klasörüne dosyaları yerleştirken IANA standartlarına uygun yerleştirmeniz gerekiyor. Biz de en ve tr-TR içinde strings.js'lerimizi oluşturduk. Bu dosyanın içinde strings dizisi içinde download-it nesnesini koyduk ve çevirimlerimizi yaptık. Bunu eklentimiz geride bahsettiğim satır 12'de kullanacak.

Sonuç

Eklentimizi böylece tamamlamış olduk, eklentinin yayınlanmış hali burada, tüm kodlar ise github'da.

Tüyap AutoShow 2012

noreply@blogger.com (metude) — Thu, 08 Nov 2012 20:53:00 +0000

/2 hafta arayla 2 defa İstanbul'da bulunmam gerekti. İlki; Çağlar, Mağruf, Osman, Melih, Burak ve daha niceleri ile birlikte Özgür Web Günlerinde Opera Türkiye olarak oradaydık. (Özgür Web Günleri ile ilgili yazımı daha sonra yazacağım.) İki hafta aradan sonra tekrar İstanbul'a gelişimle birlikte Tüyap Autoshow'u Emre ile birlikte görme fırsatım oldu. Gördüklerimi notlar halinde dizeyim istedim.

Fuara katılım sanırım diğer yıllara göre en yüksek düzeydeydi, gerek ziyaretçi gerekse firma olarak.
Aklımda kalan ve Tüyap Autoshow 2012 deyince aklıma gelen ilk şeylerden biri şu olacaktır. Sanırım gelen kitlenin artmasında büyük etkeni olan mankenleri unutmamak gerekecek. Kırmızı Renault Dezir'in yanındayken önümdeki gencin yanına arkadaşı geldi ve sordu "Bu nasıl?" Cevap ise muhtemeşemdi. "Sarışın".
Audi Türkiye'ye selam ve saygılarımı iletiyorum. Arabalarını yontulmuş heykel olarak orada tuttukları, kapılarının kilitli olduklarından iyice emin olduklarından gayet iyi iş çıkardılar... A8'i kilitlemeyi anlamaya çalışabilirim, ama A3? Ne kadar çok müşteri kaybettiklerini ve düşman kazandıklarını bir bilseler. A6 Allroad; Emre'den öğrendikten sonra... İlk hedeflerden biri haline geldi bu araba.
Ferrari, Lamborghini, Bentley, Aston Martin fuarın ağır abilerindendi. Tüm karizmaları orada duruyor ve bizse hayvanat bahçesinde hareketlenmesini umarak beklediğimiz aslanı bekler gibi onlara bakıyorduk.
Farkedeceğiniz diğer şeylerden biri manken kalitesi araçların kalitesi doğru orantılı olarak gidiyordu.
Beni en çok şaşırtansa BMW i8'i fuarda görmek oldu. Sevdiğim nadir konseptlerden biri olarak onu fuarda görmek güzel oldu.
Skodalar beni D segmentindeki Superb'si ile şaşırttı. Mesela VW Passat yerine Superb çok daha iyi bir seçim. VW ise bildiğimiz gibi aynı seviyede/kalitede üretime devam ediyor...
Mercedes CLS - Shooting Brake. Bu madde için daha fazla bir şey yazmıyorum. Fiyatını merak ediyorsanız 122.000 TL + KDV + ÖTV + ABCDEFV = 335.000 TL.

Arada bir hafta geçti ve aklımda kalanlar şimdilik bunlar.

GitHub'daki Forklanmış Reponuzu Nasıl Güncellersiniz?

noreply@blogger.com (metude) — Thu, 08 Nov 2012 20:11:00 +0000

Bir kaç gündür git gibi revision control systemleri öğrenmeye çalışıyorum. Sonunda iki çözüm buldum. Ben kolay bulamadığım için hatta Türkçe olarak bulamadığımdan ikisinden de burada bahsedeceğim.

1. Konsoldan güncelleme

Konsol-severler için komutları yazayım. Komutların açıklanmasını daha sonra girmeyi düşünüyorum, eğer bir müddet sonra geri gelip hala komut açıklamasın göremediyseniz beni yorumlardan bir dürtün.

git clone https://github.com/metude/YOURREPO.git
cd YOURREPO
git remote add upstream https://github.com/nickname/ORIGINALREPO.git
git fetch upstream
git push origin master
git checkout master
git rebase upstream/mastergit push -f origin master

Bu adımların sonunda forklanmış reponuz artık güncellenmiş olmalı.

2. Github.com'dan Güncelleme

Yukarıdakine göre daha kolay ama artistiği olmayan bir yöntem. Forklandığınız reponuzun sayfasında pull request dedikten sonra head ve base noktalarını yer değiştirmek. Daha sonrasında size gelen pull'u merge etmek ile tamamlanıyor.

Bugsuz günlerde kullanın.

Google Web Fonts'daki Türkçe Fontlar

noreply@blogger.com (metude) — Sat, 06 Oct 2012 17:25:00 +0000

Google Web Fonts sizleri bir çok zahmetten kurtaran güzel bir katalog. Ailecek kullanıyoruz ama Türkçe karakterler de biraz sorun yaşatıyor. Bu amaçla naçizane bir liste yapayım.

Bu amaçla katalogda gördüğüm Türkçe Fontları resimleriyle birlikte buradan sunacağım. Gördüğünüz Türkçe fontları en yakın yorum kutusuna bildirenler arasında yapacağım çekilişle 1 kişi audi s8, 5 kişi iphone 6 very-pre-release-edition, 500 kişi sony ps 4 soon-edition kazanabilir.

Yetmedi bunlar diyenler Oktay Elipek'in şu ve şu listesini de kontrol etsinler.

Ve Nihayet

noreply@blogger.com (metude) — Thu, 07 Sep 2006 13:22:00 +0000

2Blog açıklaması sonra -belki de hiç eklenmeyecek- eklenecek.

İletişim Adreslerim:
Mail(E-Posta):

06.10.2012 - 19:58

Bu yazının üzerinden 6 yıl geçmiş...
6 koca yıl, 2.190'dan fazla gün, 52.000'den fazla saat...
Bunca zamanda ben ne yaptım, ne oldu, ne değişti hayatımda diye sormayın. Bir quick-list'im yok. Size highlights bile veremiyorum. Ama yakında olacakları siz de göreceksiniz. (Bilgisayar, internet, web kavramları hakkında merak, ilgi ve bilgisi olmayanlar için sağ üst veya herhangi bir yerde olan X butonu faydalı olacaktır. Buraya nasıl geldiğnizi atayizler bile açıklayamacaktır, emin olun.)