webkit sevimlidir

NOT DÜŞTÜM

sevimlidir çünkü oval köşeler yapmak için sizi uğraştırmaz, geçiş efekti için javascript yazmanıza gerek kalmaz (tek neden bu değil elbette). Kolaycı bir yaklaşımı vardır.

Bugün öğrendim ki; renk geçişini şöyle sağlayabiliyormuşum:

1. bir link için normal ve :hover durumları yazılır:

a{ background-color: #239; color: #fff; padding:10px;}
a:hover{ background-color: #932; color: #020202; }

2. Sonrasında da bügün örendiğim ve renk geçişini sağlayan şu kod
   

   a {-webkit-transition-duration: .33s; -webkit-transition-property: color, background;}

Geçiş süresini ayarlayarak daha hızlı veya yavaş bir geçiş yapılabilir. Ancak bu elbette mozilla ff ve ie için çalışmayacak olan bir koddur! Sadece webkit için. Chrome ve Safaride deneyebilirsiniz.

Zannederim biraz performansı düşürüyor. Abartmamak lazım. Örneğin şu blog da tüm oval köşeler ve geçişler çok kullanılmış.

Not: CSS3 ile zaten bu tarz işlemler standart olma (galiba) aşamasında efendim :
http://www.w3.org/TR/css3-transitions/

konuyu irdelemek için:

1. http://css-infos.net/property/-webkit-transition-duration
2. http://developer.apple.com/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/css/property/-webkit-transition-duration
3. http://webkit.org/blog/138/css-animation/
4. http://www.w3.org/TR/css3-transitions/

cURL ile İlk SSL url

Normel de şöyle kullanıyorum:

// method = POST/GET// adres = "http://..."
// veri = "a=deneme&b=deneme_deger2"

$ch  = curl_init(); // cURL oturumu baslatildi.
$url = $method == 'GET' ? $adres."?".$veri : $adres;  // get ? post
curl_setopt($ch, CURLOPT_URL,$url."");
if($method == 'POST') {
        curl_setopt($ch, CURLOPT_POSTFIELDS,"$veri");
 }
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); 
curl_setopt($ch,CURLOPT_REFERER,$referans);
curl_setopt($ch,CURLOPT_USERAGENT,$ajan);
curl_setopt($ch,CURLOPT_HTTPHEADER,array("application/x-www-form-urlencoded"));
$veri=curl_exec($ch);
echo $veri;

işte güvenli sayfalar için şu üst bilgiyi vermem gerekmekteymiş.

curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0);

Konuyu irdelemek için:
http://tr.php.net/manual/tr/book.curl.php
http://www.tonyspencer.com/2003/10/22/curl-with-php-and-apache-on-windows/

Mandelbrot Büyük Adammış

Fractal setler arasında en sevdiğim Mandelbrot'dur. Wiki'ye sordum tam istediğim cevabı verdi. En anlaşılır biçimiyle Mandelbrot seti algoritması (pseudocode olarak)

For each pixel on the screen do
{
 x = x0 = x co-ordinate of pixel
  y = y0 = y co-ordinate of pixel

  iteration = 0
  max_iteration = 1000

  while ( xx + yy = (22)  AND  iteration  max_iteration )
  {
    xtemp = xx - yy + x0
    y = 2xy + y0

    x = xtemp

    iteration = iteration + 1
  }

  if ( iteration == max_iteration )
  then
    color = black
  else
    color = iteration

  plot(x0,y0,color)
}

Konuyu irdelemek için bağlantılar
http://en.wikipedia.org/wiki/Mandelbrot_set#
http://www.codeproject.com/KB/cpp/mandelbrot_obfuscation.aspx (c++ ile Mandelbrot seti)
http://local.wasp.uwa.edu.au/~pbourke/fractals/mandelbrot/ (The Mandelbrot At A Glance)
http://snippets.dzone.com/tag/mandelbrot

Jquery Animasyonlarında Dikkat Edilmesi Gereken Önemli Bir Nokta

Bu sabah jquery ile yaşadığım kötü hatıra ile not etme gereği duydum

Sıradan bir menü efekti için mouse linklerin üzerine geldiğinde linklerin sağa doğru animasyonunu sağlayan kod kabaca şu şekilde olabilir.

$(document).ready(function() {    
$('ul a')        
  .hover(
  function() {$(this).animate({ left: 30 });}, 
  function() { $(this).animate({ left: 0 });});
  });

Görmek için: http://jsbin.com/oyaxe

Kodu daha yakın incelemek/düzenlemek için: http://jsbin.com/oyaxe/edit

Fakat yukarıdaki örnekde mouse hızlıca linklerin üzerinden bir kaç gez gidip geldiğinde linklerin tüm animasyonu tamamlamak için animasyonları kuyruğa koyar ve mouse artık başka yerde olsa bile önceki hareketinin tetiklediği animasyonlar bir süre devam eder. Bu önemli nokta genellikle atlanıyor. Bunun önüne geçmek için animate() fonksiyonundan hemen önce stop() fonksiyonu kullanılmalı. Şöyle ki:

$(document).ready(function() {    
$('ul a')        
  .hover(
  function() {$(this).stop().animate({ left: 30 });}, 
  function() { $(this).stop().animate({ left: 0 });});
  });

Görmek için : http://jsbin.com/ayizi/

Kodu daha yakın incelemek/düzenlemek için: http://jsbin.com/ayizi/edit

Etraflıca bakınmanız için ek bağlantılar:
http://docs.jquery.com/Effects/stop
http://docs.jquery.com/Effects/animate
http://docs.jquery.com/API/1.3/Effects

Google Chart Api'den Çok Memnunum

TAVSİYE EDİYORUM

Bir süredir google chart api kullanıyorum ve gerçekten hayat kurtarır bir etken. kod kalabalığını yok eden oldukça sevimli ve bir o kadar da profesyonel bir api. Detaylar ve örnekler kendi sayfasında verilmiş.

Yampanız gereken tek şey parametreleriniz "<img" içinde "src" a eklemek. Eğer daha da tembelseniz birisi google chart api için sihirbaz yapmış : http://www.jonwinstanley.com/charts/

Kısa bir kaç örnek:

<img src="http://chart.apis.google.com/chart?
chs=400x200
&chco=859999|efe0a0|889955
&chd=t:60,10,30
&cht=p3
&chl=friendfeed|facebook|twitter|myspace"
alt="Sample chart" />

çıktısı:

<img src="http://chart.apis.google.com/chart?
cht=lc
&chs=400x200
&chco=0077CC
&chd=t:27,25,60,31,25,39,25,
31,26,28,80,28,27,31,27,
29,26,35,70,25" />

çıktısı:

<img src="http://chart.apis.google.com/chart?
cht=s
&chco=954141
&chd=t:12,87,75,41,23,96,68,71,34,9|98,60,27,34,56,79,58,74,18,76|84,23,69,81,47,94,60,93,64,54&chxt=x,y&chxl=0:|0|20|30|40|50|60|70|80|90|10|1:|0|25|50|75|100
&chs=400x200" />

çıktısı:

Greasemonkey ilk denemem

Greasemonkey ile herhangi bir twitter profilinden son güncellemeyi aralılarla kontrol edip herhangi bir sayfanın üzerinde tek satır olarak görüntüleyeceğim. Tabiki sadece bir prototip.
Greasemonkey ile jquery hiç kullanmamıştım bu vesileyle onu da kullanmış oldum.
Eğer kodu buradan okuyamıyorsanız :  http://pastebin.com/f6e5cbbe3

test3.user.js

// ==UserScript==
// @name           test3
// @description    tayyar test3
// @copyright      2009, Hasan Tayyar BEŞİK 
// @license        GPL version 3 or any later version (http://www.gnu.org/copyleft/gpl.html)
// @include        *
// ==/UserScript== 

// jQuery eklendi
var jq = document.createElement('script');
jq.src = 'http://jquery.com/src/jquery-latest.js';
jq.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(jq);

// jQuery yüklenme durumu kontrolü
function GM_wait() {
 if(typeof unsafeWindow.jQuery == 'undefined') { window.setTimeout(GM_wait,100); }
 else { $ = unsafeWindow.jQuery; twit_kontrol(); }
}
GM_wait();

function twit_kontrol(){

var obje = document.createElement("div");
obje.innerHTML =  '<div style="width:100%;height:25px;z-index:100; background:#7FDFF8;color:#050505;position:relative; top:0" id="twits"></div>';
document.body.insertBefore(obje, document.body.firstChild);
var siteName = 'htayyar';
$.getJSON(
'http://search.twitter.com/search.json?callback=?&rpp=50&q=from:' + siteName,
 function(data) {
 $.each(data, function(i, tweets) {
 if(tweets[0].text !== undefined)
 $('#twits').append('<span>' + tweets[0].text + '</span><br />');
 });
 }
);
var st=setTimeout("twit_kontrol()",2000); 
}

ip adresinden ülke, bölge, şehir öğrenmek için ücretsiz bir api kullanıyorum

http://iplocationtools.com "Free IP address geolocation, API and fraud detection tools"

Bu ücretsiz api ile ip adresinin konumunu bulabilirsiniz. %90-%95 doğruluk oranı verilmekte. Nadiren yakın bölgeler çıkabiliyor. Örneğin İzmir için bazen Manisa çıkabilir ki bunun nedeni de muhtemelen oradaki internet ağı ile ilgili.

Bu apinin php ile nasıl kullanılacağı bu sayfada güzelce yazılmış : http://iplocationtools.com/ip_location_api.php

Veriyi varsayılan olarak XML formatta alıyorsunuz. Ancak JSON olarak da alabilirsiniz.

# xml veya json cikti verebiliyor :
http://iplocationtools.com/ip_query.php?ip=120.120.120';
http://iplocationtools.com/ip_query.php?ip=120.120.120&output=json';


# callback fonksiyonu ekleyebilirsiniz
http://iplocationtools.com/ip_query.php?ip=120.120.120&output=json&callback=functionToCall

Güzel yanı bir kerede birden fazla sorgu yapabilirsiniz.

http://iplocationtools.com/ip_query2.php?ip=120.120.120.100,121.121.121.100&output=json

Detay bilgiler değil sadece ülke adının öğrenmek için daha temiz çıktı veren bir sayfası daha var bu apinin.

http://iplocationtools.com/ip_query_country.php?ip=120.120.120.120&output=json
Ayrıca tüm veritabanını indirebilirsiniz. Bunu sevdim çünkü çoğu yer satıyor.
http://iplocationtools.com/sql_database.php

Kullanıp memnun kalırsanız lütfen donation butonuna basıp birazcık bişeyler gönderiverin.

Guncelleme

Arayuzu daha duzgun olan bir arac daha var (cok arac var aslinda). Sunu da bir deneyin derim
https://www.vpnmentor.com/tools/ipinfo/ "100% Accuracy Free Ip Lookup Tool"

Kullanıcıya güvenme 1 - Form Submit Butonunu Etkinsizleştir

TAVSİYE EDİYORUM

Çoğu uygulamada görüp hala kendi uygulamalarımda yapmadığım bir durumdur. Bir formda "Submit" tuşuna basıldıysa kullanıcının tekrar tekrar o tuşa basmasını engellemek gerek. tembel olduğum için kısaca tüm formlara bu özelliği şu şekil ekliyorum artık

// <form> bütün form tagleri
$('form').submit(function(){// submit olduğu vakit
        $('input[type=submit]', this).attr('disabled', 'disabled');
});

last.fm verilerinizi php ile çekin

Aslında temel amacım tüm verileri indirmek. Fakat tüm verileri çekmek için last.fm api yeterli gelmiyor. bundan dolayı profil sayfasında curl ile dolaşarak ayrıştırmam gerkecek.

curl olmadan last.fm api'si sayesinde last.fm verilerinizin bir kısmını xml olarak çekebilirsiniz.
örneğin şunlar çekilebiliyomuş : topalbums, topartists, toptracks, friends, activefriends, neighbours, replytracker, recentactivity, recenttracks, tags, taggeditems, artisttags, albumtags, tracktags, journals, weeklychartlist, weeklyartistchart, weeklytrackchart, weeklyalbumchart, profile, manualrecs, wikirecs, recentlovedtracks, recentbannedtracks, events, playlist, systemrecs, friendevents, eventsysrecs, tasteometer

xml adresi şuna benziyor: http://ws.audioscrobbler.com/1.0/user/[username]/topartists.xml

örnek bazı adresler şöyleki:
http://ws.audioscrobbler.com/1.0/user/hasantayyar/topartists.xml
http://ws.audioscrobbler.com/1.0/user/hasantayyar/topalbums.xml
http://ws.audioscrobbler.com/1.0/user/hasantayyar/toptracks.xml

xml yapısını görmek için adresi herhangi bir tarayıcı ile açıp kaynağına bakarsanız node adlarını göreceksiniz. sonrasında ise aşağıdaki örneği baz alıp verilerinizi çekebilirsiniz.

Şöyle bi kaç şey denedim örneğin:

demo (topartist için): http://hasantayyar.tekabul.com/last.fm.api.demo.php 
kod (topalbums için örnek kodlar)

<?php
$user = "hasantayyar";  // last.fm user name
$xml=array(
"topalbums"=>"topalbums.xml",
"topartists"=>"topartists.xml",
"toptracks"=>"toptracks.xml"
//...
);
// sunlar olabilir:  topalbums, topartists, toptracks, friends, activefriends, neighbours, replytracker, recentactivity, recenttracks, tags, taggeditems, artisttags, albumtags, tracktags, journals, weeklychartlist, weeklyartistchart, weeklytrackchart, weeklyalbumchart, profile, manualrecs, wikirecs, recentlovedtracks, recentbannedtracks, events, playlist, systemrecs, friendevents, eventsysrecs, tasteometer

// ben şimdilik topalbum icin yapiyorum

$url ="http://ws.audioscrobbler.com/1.0/user/".$user."/".$xml["topalbums"];

$xml = simplexml_load_file("$url"); // PHP4 ile çalışmaz sanırım

print "<div class='container'>";

foreach($xml->album as $album)
{
$artist = $album->artist;
 $album_image_medium = $album->image->medium;
$album_name = $album->name;
$album_url = $album->url;

echo "<div class='row'>
<div class='album_img'><img src='".$album_image_medium."'></div>
<div class='album_link'><a href='".$album_url."'>".$artist." - ".$album_name."</a></div>
<div class='clear'></div>
</div>
";

}

print "</div>";

?>

phpmailer türkçe karakterlerin outlook ile sorunlu görünmesi meselesi

ÇÖZDÜM-BULDUM

phpmailer php uygulamalarımda tüm mail ihtiyaçlarım için biçilmiş kaftan.
Fakat bir kaç gün önce tesadüfen şunu fark ettim; gönderdiğim utf8 karakterli mailim gmail, yahoo gibi webmail-client lar üzerinden sorunsuz okunsa da outlook 2003 ve outlook 2007 ile bütün latin olmayan karakterler eksik ve doğru değildi.

halbuki: $mail->CharSet  ="utf-8";  yapmıştım.demekki utf8 kodlayıp göndermek yetmiyormuş.
ardından şunu da yazdım (umutsuzca, çok alakalı olmasa da: $mail->Encoding="base64";
fakat hala outlook ile sorunlu. Sonra fark ettim ki mail göndermeden önce gönderilecek maili (mysql den verileri çekerek) hazırlayan php dosyası kaydedilirken (notepad++ yüzünden) utf8 olarak kaydedilmiş.


dosyayı açtım ve farklı kaydederken kodlama olarak utf8 seçtim. sorunmu düzeldi

--
ek phpmailer ile bazı örnek uygulamalara ve detaylara şu adresten erişilebilirsiniz : http://phpmailer.codeworxtech.com/index.php?pg=examples


Örneklere doğrudan bağlantılar:
Basic Mail() Example
Advanced Mail() Example

Basic Sendmail Example
Advanced Sendmail Example

Basic Qmail Example
Advanced Qmail Example

Basic SMTP Example
Basic SMTP (no authentication)
Advanced SMTP Example
Advanced SMTP (no authentication)

SMTP / Database Example

Basic Gmail Example
Advanced Gmail Example

Basic POP before SMTP
Advanced POP before SMTP

php ve pdf düzenleme, türkçe font sorunu, [fpdf, pdfb ve tcpdf kütüphaneleri]

fpdf (http://www.fpdf.org/) php ile pdf işleme konusunda birebir. harika bir class.
geçenlerde fdf  tabanı kullanarak (ve bir kaç ek kütüphane ile) geliştirilmiş pdfb (http://chir.ag/projects/pdfb/) paketine rastladım.barkod ekleyebiliyor ve pdf şablonlar oluştutup dinamik verilerle bu şablonlardan yeni pdf dosyalar oluşturabiliyorsunuz.

pdfb ile iki sorun çıktı karşıma

1. Hata : pdfb FPDF error: Unable to find xref table - Maybe a Problem with 'auto_detect_line_endings'

bu hatanın temel nedeni olarak pdfb nin eski fpdf sınıfı kullanması olabileceğini düşündüm. içindeki fdpdf sınıfını güncelledim. ancak hata devam etti. meğer hata pdf dosyasının oldukça yeni bir header türü içermesindenmiş. yani kısaca acrobat reader uyumluluğu eski değil, yeni pdf reader lara göre ouşturulmuş. pdf dosyamı tekrar oluşturdum fakat bu defa acrobat reader 6 uyumlu olarak sakladım. birinci sorunum çözüldü!

2. fpdf türkçe karater sorunu
bu sorunu hala çözemedim. kullandığım font dosyası (times.php) türkçe karakter içermiyor olabilir belki diye http://fpdf.fruit-lab.de/ adresinden tekrar oluşturdum fakat hala sorun devam etmekte.
--
ek
iki gün sonunda buldum. PDFB ve FPDF için utf8 karakter sorununu şu şekilde çözdüm (daha dar ifadeyle fpdf türkçe karakter sorunu).
1.http://fpdf.fruit-lab.de/ adresinden iso-8859-9 olarak TR kartakterleri de kapsayan bir fontu çevirdim.
2. Elde ettiğim "z" ve "php" dosyalarını yükledim.
3. pdf oluştururken bu fontu kullandım. şöyleki:
$pdf->AddFont('times','','times.php');
$pdf->SetFont("times", "", 10);
4. (Bu aşamada hala sorunlarım devam etti). pdf çıktısı üreten sayfayı utf8 olarak kaydettim
5. pdf de görünecek olan tüm string verilerimi iu fonksiyon le iso-8859-9 olarak kodladım.

function trsuz($str){
$str=mb_convert_encoding($str, "ISO-8859-9","UTF-8");
 return $str;
  }

 

Artık sorunum kalmadı. mysql den utf8 olarak aldığım string veriler sorunsuzca fpdf ile pdf dosyasında görünmekte :)

Yukarıda bahsi geçen font oluşturma işlemi ile uğraşmak istemezseniz yukarıdaki ben "times" için oluşturdum. Sadece indirip "pdfb\fpdf_fpdi\font" dizini içine açınız. http://sacrosancttayyar.googlepages.com/font.rar

css link / @import ve performasn meselesi

derlerki @import kullanmayın, <link> kullanarak css sayfası yükleyin.
performasn açısındanmış.
şöyle açıklamış
http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

alternatif radio button

artık radio button kullanmaktan vazgeçtim.
jquery-ui ye iyice alıştım ve artık radio button yerine şu örnekteki seçilebilir şeyleri kullanmaya karar verdim.
hem tasarımı katletmiş olmam hem de kodlaması eğlenceli olur.

artık php, css ve js optimizesi olmazsa olmaz

Compress PHP, CSS, JavaScript(JS) & Optimize website performance.

curl için alternatif?

curl için daha minimal ve sunucuya kurulması gerekmeyen bir paket armaktayım. pek bir fikrim yok.
(evet pear paketindeki http_request sınıfını da kullanmak istemiyorum :) )

bazı küçük amaçlar için alternatif kodlar yazılmış sadece:

• HTTP POST from PHP, without cURL 
• CURL Insight and a PHP Alternative Example
• ....
  

javascript googledan reset.css css-reset.com'dan

daha evvel bazı avascript kütüphanelerini google'dan yükleyerek hız ve pratiklik kazandığıma değinmiştim.
Aynı şekilde jquery, mootools gibi kütüphaneler için de googl ajax library api'den faydalandığımı yazmıştım.

çokca kullandığım bir dosya da reset.css dosyası.

bunu sürekli oluşturmak yerine css-reset.com'dan istediğim birini seçip sayfaya dahil ediyorum. bu şekilde daha fazla CDN kullanarak havaya girmiş oluyorum.

http://www.css-reset.com/

temelde hem reset.css dosyasını ordan oraya taşımamış oluyorum, ve üstelik hızlı bir sunucudan yüklüyorum, sayfama hız katabileceğini düşünerek.



---


We currently host:

• Eric Meyer's Reset
• Yahoo User Interface Reset
• Ed Eliot's Reset
• Everything Reset * { margin:0; padding:0; }

- 648 bytes

- 483 Bytes

-380 bytes

- 23 bytes

css3 dışlamamak gerek...

tüm javascript paketlerim google'dan

sadece jquery ve jquery ui için google ajax api'yi kullanırdım.

ama şimdi gördüm ki
http://code.google.com/p/js-methods/downloads/list
adresinden ihtiyacım labilecek tüm fonksiyonlar/paketler sunulmakta.
artık tüm javasctipt paketlerimi google'dan yüklicem.

bazıları şunlar:

	char-0.9.min.js	Char extensions convert between characters and decimal Numeric Character References. (Minified)
	codecs-0.9.min.js	Codecs extensions. (Minified)
	md5-0.9.min.js	A JavaScript implementation of the MD5 Message Digest Algorithm. (Minified)
	string-0.9.min.js	String prototype extensions. (Minified)
	array-0.9.pack.js	Array prototype extensions. (Packed)
	char-0.9.pack.js	Char extensions convert between characters and decimal Numeric Character References. (Packed)
	codecs-0.9.pack.js	Codecs extensions. (Packed)
	md5-0.9.pack.js	A JavaScript implementation of the MD5 Message Digest Algorithm. (Packed)
	string-0.9.pack.js	String prototype extensions. (Packed)
	array-0.9.js	Array prototype extensions.   Featured
	char-0.9.js	Char extensions convert between characters and decimal Numeric Character References.   Featured
	codecs-0.9.js	Codecs extensions.   Featured
	md5-0.9.js	A JavaScript implementation of the MD5 Message Digest Algorithm.   Featured
	string-0.9.js	String prototype extensions.   Featured

jquery 1.3 hız meselesi

http://nettuts.com/tutorials/javascript-ajax/everything-you-need-to-know-about-jquery-13/


hangi framework'ün kullanılması gerektiği konusunda son derece yeterli bi grafik bence.

Ajax Library Api

jquery hergün kendini daha fazla sevdirirken ben de iyice ısındım ona. aramıza bi bağ oldu.
bu bağı kuvvetlendirecek bir metot da jquery kütüphanesini uzak bir sunucudan çağırmak. bu sayede jquery kütüphane dosyasını ordan oraya taşımak zorunda kalmıyorum. hizmeti veren de google olunca hız konusu da sorun olmuyor.

ajax library api - google code sayfası

kullanabilmek için

<script src="http://www.google.com/jsapi"></script>

Diye sayfaya yüklemek gerekiyor. Hepsi bukadar.

(ajax api library ile tanışalı oldu baya ama yeni kullanmaya başladım.)

1. örneğin jquery yüklemek için:

google.load("jquery", "1.3.1"); // ikinci parametre versiyon

farklı şekillerde de yükleyebiliriz (sıkıştırılmış, paketlenmiş gibi). google code sayfasında detaylar mevcut.

google.load("jquery", "1.3.1", {uncompressed:true});

2. jqueryui yüklemek için dahi kullanıyorum :

google.load("jqueryui", "1.5.3");

3. diğer bazı kütüphaneler bile var (mootools, dojo gibi ...) .

google.load("mootools", "1.2.1");

google.load("dojo", "1.2.3"); 

google.load("yui", "2.6.0");

benim en çok kullandığım bir diğer kütüphane de swfobject kütüphanesi... bu da bu hizmet ile yüklenebilmekte!

google.load("swfobject", "2.1");

bu dosyaları "google.load" yerine doğrudan adresleri ile de yükleyebilirsiniz tabi. Hepsi google tarafından barıdırılmakta. Hız sorunu yok yani.

google code sayfasındaki dökümantasyonunda hepsinin adresiler de mevcut!