Yeni Reklam Tasarımı ile Şablon Editörünün Testi

Bu gün yeni bir reklam şablonu oluşturdum. Amacım var olan editörü kullanarak, yeni bir şablonda yapabileceğim şeyleri test etmekti. Test sonucunda bir kaç problemimiz olduğunu farkettim. Birden fazla resim eklememiz gerektiği zamanlar için bir otomatizasyon hazırlamamıştık. Bu otomatizasyonun hazırlanması bir sonraki işimiz olacak. Bunun dışında, animasyonda Dinamik bir yazının Alpha efektinin verilmesinde problem olduğunu farkettim. Çözebilmek için oldukça zaman harcamam gerekti. Halbuki problem oldukça basit ve gözümün önündeymiş. İlk yapmam gerekeni son yaptım ve google'adım problemi, bir çok luzumsuz sitenin ardında bir sitede cevabı buldum.
Problemin genel açıklaması şöyle. Dinamik bir yazının resim ve arkaplanlı sabit bir nesne gibi görünürlüğünün değimesini istemiştim. Halbuki dinamik olan yazı karakterlerinin resime dönüştürülmesi gerekiyordu. Bulduğum cevap ise, embeded text özelliğini kullanmamdı. Ardından farkettim ki flash dosyamın boyutu da çok arttı. limitimiz 50K iken ben çoktan 200K'ları bulmuştum. Bunun da çözümü karakterleri tek tek yazmak ile çözdüm. Yani Embeded Text özelliğine; "1234567890*-üğpoıuytrewqasdfghjklşi,.çömnbvcxz< >ZXCVBNMÖÇ:;İŞLKJHGFDSAQWERTYUIOPĞÜ_?=)(/&%+^'!é #${[]}\~ şeklinde bir string girdim. Burada yaptığım şey aslında, yazılarda kullanılabilecek karakterleri tek tek tanımlamaktı. Bunları daha da kısaltabilirdik ancak, şimdilik gerek yok.
Sonuç olarak,yeni temamızı çalıştırabildim. Problemler de iyi zamanda ortaya çıktı. Yeni temamızın görünümü yandaki gibi.

Adım Adım İlk Reklamımız #6

Reklam yöneticimizin kayıt formundan flash dosyamıza veri gönderiminde kod karmaşıklığından kurtulmak için bir jQuery kütüphanesi hazırlayacağımızı belirtmiştim. Bahsettiğim bu kütüphane, from nesnelerini otomatik olarak farkederek, flash dosyası ile ilişkilendiriyor ve güncellemeler yapabiliyor.
Hazırladığım jQuery kodu karmaşıklığı gidermesinin yanı sıra, hem dinamizm kazandırdı hem de anlaşılmasını kolaylaştırdı.
Yaptığım değişiklikler iki taraflı oldu, öncelikle SWF nesnemizi oluştururken hazırladığım kod;

<script type="text/javascript" charset="utf-8">
   var flashVars = new Array();

$(document).ready(
   function () {
   var _flashVars = new Array();
   
   $('.SWFVar').each(function(){
   _flashVars[this.id] = this.value;
   })
   .change(function(){
   $('.SWFVar').each(function(){
   var _id = this.id;
   var _value = this.value;
   
   $('#adv_container').flash(
   function(){this.SetVariable('/:' + _id, _value);});
   });
   });
   
   $('#adv_container').flash(
   {
   swf: 'adv_templates/TextTemp1.swf',
   params: {
   play: true
   },
   flashvars: _flashVars,
   height: 240,
   width: 300
   }
   );
   }
   );
   </script>

Bu kod hem Flash dosyamıza veri gönderilmesini, hem de her bir nesneye onChange anlarına güncelleme eklenmesini sağlıyor. 
Ve daha sonra da HTML Form nesnelerinde kullanmamız gereken kod;

<input name="image1" id="image1" type="hidden" value="uploads/smile.png" class="SWFVar"/>

Burada belirtmeliyim ki, class içerisinde belirtmiş olduğumuz SWFVar class'ını kullanarak form nesnelerini SWF dosyamız ile ilişkilendirioruz.

Adım Adım İlk Reklamımız #5

Reklam yöneticimizin resim yükleme ve yüklenen resmin flash dosyasında görüntülenmesi işlemlerini bitirmiş bulunuyoruz. Yapılan son değişiklikler ile artık, editörden istenilen düzeyde bilgi flash dosyasına gönderilebiliyor ve değişikliklerin yapılması anlarında flash dosyamız güncellenerek tekrar görüntüleniyor.
Bu noktada geriye kalan yalnızca form nesnelerinden alınan bilgilerin gerek MySQL, gerekse e-posta yolu ile kayıt edilmesini sağlamak.
Fakat bu işlemden önce bence yapılması gereken daha önemli ve öncelikli işlem, kod karmaşıklığından kurtulmak olmalıdır. Flash dosyasına veri yazarken bir çok konfigürasyonu elle yazmak zorunda kaldım. Bu konfigürasyoların biraz daha otomatize edilmesi şart! En baştan beri esnek temalar söz konusu olduğu için, bir sonraki adımımızda form nesnelerimizin otomatize edilmesini ve gerekli konfigürasyonların da form nesnelerine bağlanmasını sağlayacak jQuery kütüphanesini hazırlayacağız.

Actionscript 2.0 ile Resim Yükleme

ADV Manager sistemimizde kullanmamız gereken bir diğer uygulama kodu da flash dosyamızda yüklediğimiz resimlerin görüntülenmesi ile ilgili olmalı. Bunun içine araştırıp bulduğum örnek kod aşağıdaki gibiydi.

var my_pb:mx.controls.ProgressBar;
my_pb.mode = "manual";

this.createEmptyMovieClip("img_mc", 999);

var my_mcl:MovieClipLoader = new MovieClipLoader();
var mclListener:Object = new Object();
mclListener.onLoadStart = function(target_mc:MovieClip):Void {
    my_pb.label = "loading: " + target_mc._name;
};
mclListener.onLoadProgress = function(target_mc:MovieClip, numBytesLoaded:Number, numBytesTotal:Number):Void {
    var pctLoaded:Number = Math.ceil(100 * (numBytesLoaded / numBytesTotal));
    my_pb.setProgress(numBytesLoaded, numBytesTotal);
};
my_mcl.addListener(mclListener);
my_mcl.loadClip("http://www.helpexamples.com/flash/images/image1.jpg", img_mc);

Örneğin alına http://livedocs.adobe.com/flash/9.0/main/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00001025.html linkinden ulaşılabiliyor.