wysiwyg yapıyom

[Brigand]

Paylaşayım dedim. Bugün merak ettim mantığı nedir bu wysiwyg mantığı. Baktım sevdim 4-5 saat sonra şöyle birşey meydana geldi.

http://www.todark.com/wysiwyg

Eksikler yok değil. Renk değiştirme için yapmak istediğim div'de en azından bir 20-30 renk çeşidi olması gerektiği için üşendim onu yapmaya. Sonra font değiştirme, font boyutu değiştirme, açılan taglar ama kapatılmayanları kapatma, url eklemeyi geliştirme ve firefox'a uyarlama filan... Yavaş yavaş geliştiririm canım istedikçe :). Yorumlarınızı merak ediyorum.

ed: yapmamın sebebi de tinymce gibi hazır wysiwyg scriptlerin 1.3mb gibi hayvani olması. Ben yaptım 18kb tuttu grafikler dahil :), aslında grafikleri yapması kodları yazmaktan daha çok zaman aldı... :)

[ Mesaj 23 Nisan 2007, Pazartesi - 19:11 tarihinde, Brigand tarafından güncellenmiştir ]

[riglous]

mootools hakkinda bilgilendirir misin?

[ Mesaj 23 Nisan 2007, Pazartesi - 20:45 tarihinde, riglous tarafından güncellenmiştir ]

[PrudenT]

wysiwyg gta'ların birinde hileydi ya sanki :D

[ Mesaj 23 Nisan 2007, Pazartesi - 21:33 tarihinde, PrudenT tarafından güncellenmiştir ]

[Brigand]

moo tools efekt veren şey. Gerekli değil ama hoş olsun diye koydum. Onu koymasam 14kb daha düşecekti boyut :) editör 5kb filan olacaktı gifler ile

Ayrıca wysiwyg = what you see is what you get :)
Ve yine ayrıca bir element wysiwyg olmak isteyip olamazsa what you think you see is what you think you get olarak geçiyor güzel birşey :D

[ Mesaj 23 Nisan 2007, Pazartesi - 23:16 tarihinde, Brigand tarafından güncellenmiştir ]

[Brigand]

Ula bu kadar mi ilgi çekti, birşey üretsek de paylaşmayacaz demek ki, insan geliştiresi gelmiyo silip atası geliyo yeminle. Hayır webden scriptlerden kodlamadan bi habersiz

said:

"ben gerçek(orjinal) hacker yucel ben gecen hack olarak bır sırket te calısıyodum .. 4 ,5milyar maas aldık sonra cıktık 5.5 iş bulduk hackligi ogrenın ac kalmassınız>).86/:^+#$W:FhackéR..YucéL.. "

gibi lamer insanların bulunduğu bir forum da değil ki burası, elit bir yer ama ne bileyim acayip...

[riglous]

Insanlarin takdirini almak icin mi yapiyosun sen bu isi...
Bakip oha supersin abi mi dememiz lazim, anlamadim. Herkesin yaptigi onlarca sey var, bu yapilanlarin hepsini buraya koymak suretiyle birbirimize hava atmak pek bi amacsiz gozuktu bana. Dedigin gibi TinyMCE'nin yerine gececek, ufak boyutlu bi wysiwyg yazmissin... yani... Tesekkur ederiz, vatana millete hayirli olsun...

[Brigand]

said:

Insanlarin takdirini almak icin mi yapiyosun sen bu isi...
Bakip oha supersin abi mi dememiz lazim, anlamadim. Herkesin yaptigi onlarca sey var, bu yapilanlarin hepsini buraya koymak suretiyle birbirimize hava atmak pek bi amacsiz gozuktu bana. Dedigin gibi TinyMCE'nin yerine gececek, ufak boyutlu bi wysiwyg yazmissin... yani... Tesekkur ederiz, vatana millete hayirli olsun...

Hep aynı mantık. Hava atmaya çalıştığımı mı düşünüyosun? Öyle olsa kodları açık vermezdim. moo tools kendi nasıl packaged olarak geliyorsa bende tüm kodları gizlerdim. Eksikler var yazdım, ki küçük bir çalışma. Ama insanların destek olmasını, şunlar şunlar olsa diye görüşlerini bildirmesini, varsa dandirik bir yanı belirtmesini, beğendilerse nesini beğendiklerini, beğenmedilerse nelerini beğenmediklerini yazmalarını beklerdim. Senin gibi karşımdaki insanlara kötü gözle bakan birisi değilim. Akşam akşam sinirlerimi bozuyorsun. Niye birilerine hava atma ihtiyacı duyayım ki? Ben birilerinin hareketlerini incelerken onların kendi egolarını tatmin ettiğini düşündüğünü sanıp onlara 'hava mı atmaya çalışıyorsun' diyecek düşüncelere sahip birisi değilm ki...

[riglous]

said:

Ula bu kadar mi ilgi çekti, birşey üretsek de paylaşmayacaz demek ki, insan geliştiresi gelmiyo silip atası geliyo yeminle.

Eger insanlarin ilgisini cekerse, soylemek istedikleri bir seyler varsa, gelip sorarlar, soylerler zaten. Konu asagi dusunce boyle bir mesaj yaziyosan, ben ilgi cekmege calistigini dusunurum.

Diger turevleriyle karsilastirdiginda ne eksik goruyosun?
- Ilk olarak submit gibi bir secenegimiz daha goze gorunen bir yerde olursa, mesela asagida daha kullanisli olur.
- Insanlarin bunu kullanabilmeleri icin dogrudan kodu donduren bir function yazarsan daha kullanisli olur. Ayrica ASP, PHP veya JS ile ornek dosya olusturursan, kullanacak kisiler daha az sorunla karsilasir.
- Koda yorum eklersen ve degiskenleri kodun basinda tutarak ne olduklarini belirtirsen modifiye etmesi daha kolay olur. Misal textarea'nin boyutlarini variable olarak yukarida ata. Sonra yanlarina width/height diye belirt ki insanlar kodu degistirmek yerine sadece degerleri degistirsinler.
- Herhangi bir button'a tikladigimizda focus textarea'dan gidiyor; bunu tekrar textarea'ya koyarsan daha rahat kullanilir.
- Yeni satira gecip alignment'i degistirdigin zaman bold/italic/underline ozelligini kaldiriyor.

Bunun disinda sadece Firefox'ta denedim, IExplorer ve Opera'da da denemek gerek.

Umarim yardimci olmusumdur.

Edit:
'leri
seklinde eklersen xhtml'e uyumlu olur.

[ Mesaj 25 Nisan 2007, Çarşamba - 02:22 tarihinde, riglous tarafından güncellenmiştir ]

[dasaaa]

sanırım url opera'da çalışmıyor veya bende çalışmadı.. diğerleri çalışıyor.. sayfayı sol-sağda da genişletme olacak mı?

[Mirage]

Öncelikle emegine saglik bence basarili bir calisma olmus. Durus olarak da cok güzel, estetik olmus.Kodlarina bakmadim ama riglous'un söylediklerine katiliyorum.

said:

Koda yorum eklersen ve degiskenleri kodun basinda tutarak ne olduklarini belirtirsen modifiye etmesi daha kolay olur. Misal textarea'nin boyutlarini variable olarak yukarida ata. Sonra yanlarina width/height diye belirt ki insanlar kodu degistirmek yerine sadece degerleri degistirsinler.

Özellikle burayi ben de vurgulamak istiyorum. Yorum olmamasi ciddi bir eksik.

Kodun icine lömbürt diye konulan bu rakamlara magic numbers deniyor. Ve bir cok sirkette yada proje bunlarin kullanilmasi yasak. 0 ve 1 haric (belki 2) hic bir rakami direk kod icine yazmamak lazim. Onun yerine, yine riglous'un dedigi gibi, yukarda const bir attribute atayip bir güzel dökümanlamak lazim.

[cemad]

eline sağlık güzel olmuş

girdiğimiz şeyi doğru zamanlı olarak html kodu gösterme türü bir özellik de eklersen gayet güzel olur zaten html e çevirio ama kodu göstermiyor sanırım.

[Mum_Chamber]

said:

Öyle olsa kodları açık vermezdim. moo tools kendi nasıl packaged olarak geliyorsa bende tüm kodları gizlerdim.

javascript kodları nasıl gizlenebilir çok merak ediyorum. ayrıca;

said:

mooTools is released under the Open Source MIT license, which gives you the possibility to use it and modify it in every circumstance.

[Brigand]

Evet yorumlarınız için şimdi teşekkürler. Şimdi insanın geliştiresi geliyor :), dediklerinizi elimden geldiğince yapmaya çalışacağım. Ama yine de insan karşısındakini yermeye çalışmamalı arkadaşlar.

İlk olarak javascript gizlenebilir. Bu gizlenmeye packetleme olarak adlandırabilirm. Daha az yer kaplıyor ve kodlar gizleniyor fakat tekrar açılamaz değil çok basit olarak kodlar gösterilebilir. http://dean.edwards.name/packer/ (Görüldüğü gibi buradaki paketlenmiş moo tools dosyasından birşey anlamak mümkün değil. Hatta insan paketlenmiş olduğunu bile anlayamayabilir.)

Ayrıca url evet sadece ie'de çalışıyor. Firefox ve Opera'da çalışmıyor. execCommand('createlink'); komutu ie dışında işlemiyor. Bu nedenle firefox ve opera için menual olarak bir url sistemi yazacam. Tabi ie'de çalışan createlink kadar güzel olmaz ama 'linki girin - url'yi girin' gibi 2 prompttan oluşan klasik birşey koyacağım.

Yorumlarınız için tekrar teşekkürler.

said:

girdiğimiz şeyi doğru zamanlı olarak html kodu gösterme türü bir özellik de eklersen gayet güzel olur zaten html e çevirio ama kodu göstermiyor sanırım.

Sağ üstte <> işareti var onu mu demek istemiştin acaba? Orda kodları görebiliyorsun. Eş zamanlı değil ama tıkladıkça yazdığın kadarını gösteriyor.

said:

Özellikle burayi ben de vurgulamak istiyorum. Yorum olmamasi ciddi bir eksik.

Evet kodların yanlarına yorum koymak mantıklı ve geliştirme aşamasında güzel olur. Ama sonra yorumları silmek daha iyi olur çünkü yorumlar kodların 3/1'i kadar yer tutar ise boşuna browser'a yüklenecek veri sayısını arttırırız. Sonuçta bu çalışmaya tinymce gibi editörler çok büyük olduğu için girdim ve buna sadık kalmalıyım :).

said:

- Herhangi bir button'a tikladigimizda focus textarea'dan gidiyor; bunu tekrar textarea'ya koyarsan daha rahat kullanilir.

Evet bunu denemiştim ama fazla üzerinde durmadım. Oradaki aslında textarea değil iframe. İframe içindeki body'e focus vermek lazım tekrardan. Bunu tekrar deneyecem, eksik olarak gözüküyormuş demekki gerçekten, daha üzerinde durulması gerektiğini anladım sağolasın ;)

said:

- Insanlarin bunu kullanabilmeleri icin dogrudan kodu donduren bir function yazarsan daha kullanisli olur. Ayrica ASP, PHP veya JS ile ornek dosya olusturursan, kullanacak kisiler daha az sorunla karsilasir.

php/asp/jsp için herhangi örnek yazmaya gerek yok zaten normal post data gibi post edilecek. Ama js olarak post sistemi biraz farklı olacak. iframe içindeki html'leri alıp post etmek gerekiyor tek satır kod o örneği de koyayım.

[ Mesaj 25 Nisan 2007, Çarşamba - 13:28 tarihinde, Brigand tarafından güncellenmiştir ]

[Mum_Chamber]

said:

İlk olarak javascript gizlenebilir. Bu gizlenmeye packetleme olarak adlandırabilirm. Daha az yer kaplıyor ve kodlar gizleniyor fakat tekrar açılamaz değil çok basit olarak kodlar gösterilebilir. http://dean.edwards.name/packer/ (Görüldüğü gibi buradaki paketlenmiş moo tools dosyasından birşey anlamak mümkün değil. Hatta insan paketlenmiş olduğunu bile anlayamayabilir.)

aslinda, "javascript gercekten gizlenir mi" diye sormadim, cunku gizlenemez. paketlemek gizlemek demek degildir, insanlari yanlis yonlendirmeyelim. client tarafinda calisacak hicbir kodu gizleyemezsin, sadece okunamaz hale getirebilirsin. verdigin ornek sadece yorumlari ve bosluklari cikararak dosya boyutunu ufaltir.

yorum olarak da, opera 9.20 kullaniyorum, renk hedehodesi ve link disinda hersey calisiyor. ve aninda goruntulemek istersen yan tarafa "yandiv" idli div koyarak onKeyPress olayinda docutment.getElementById("yandiv").innerHTML = iframe hedehodusu ile yapabilirsin.

[Brigand]

said:

aslinda, "javascript gercekten gizlenir mi" diye sormadim, cunku gizlenemez. paketlemek gizlemek demek degildir, insanlari yanlis yonlendirmeyelim. client tarafinda calisacak hicbir kodu gizleyemezsin, sadece okunamaz hale getirebilirsin. verdigin ornek sadece yorumlari ve bosluklari cikararak dosya boyutunu ufaltir.

Ne olduğunu biliyorum arkadaşım merak etme. Kimseyi yönlendirdiğim filan da yok. Türkçe terimlere bakarsan gizlenen şey görülmeyen şeydir. Ama gizlenen şeyi bulabilirsin. Gizlemek bulunamaz yapmak demek değildir. Bu nedenle ister gizlemek derim ister paketlemek derim bu bana kalmış bir seçim.

[Mum_Chamber]

madem arkadasmisiz (?), ve madem yorum istiyorsun, aci soyleyeyim:

konuyu sen actiktan 2-3 dakika sonra gordum, birsey yazarak sevkini kirmak istemedim..

ilk mesajda da dedigin gibi hic ugrasilmamis bir calisma. birden fazla gezgin desteklemeyen topu topu 60 satir kod yazmissin. birak diger gezginleri desteklemeyi, acip firefox ya da opera ile bakmamissin bile.

onun disinda hazirladigin sey mevcut html elementlerinin cok cok ufak bir kismini destekledigi gibi, destekledigi elementlerin de neredeyse hicbir ozelligini desteklemiyor. bunlari senin de cok rahat farketmis olman lazim, daha neye yorum bekliyorsun?

genel olarak ise, forumdaki yazi tarzini (bu konuda da goruldugu uzere) cok fazla beklentili, cok agresif ve (yine burada oldugu gibi) hatalarla dolu buluyorum. eger insanlar bu konuya yorum yazmiyorlarsa genel olarak bu tarzindan urktukleri (ya da tasvip etmedikleri), yaptigin seyi begenmedikleri veya sevkini kirmak istemediklerindendir.

ama tavsiye istiyorsan yukarida hazdim. sanmiyorum ama umarim bu yazdigimdan da olumlu etkilenirsin.

[Brigand]

Olumlu etkileneceğim tabi. Ben karşımdaki bir insan kaldırmayacağım bir laf ettiğinde onun eksiklerini bulup göstermeye çalışan, onu ezmeye çalışan birisi değilim senin gibi. Eleştirinin iyisi de kötüsü de güzeldir. Kötüsü daha güzeldir hatta, çünkü daha iyisini yapılmasını sağlar.

said:

ilk mesajda da dedigin gibi hic ugrasilmamis bir calisma. birden fazla gezgin desteklemeyen topu topu 60 satir kod yazmissin. birak diger gezginleri desteklemeyi, acip firefox ya da opera ile bakmamissin bile.

Arkaşım delirtmek mi istiyorsun beni? Yukarıda dedim zaten butonları yapması (patiden alarak yaptım) daha çok zaman aldı diye. Ayrıca 60 satır kod olsun istiyorum zaten. Amacım bu. Yoksa tinymce kullanırım 1.3mblik sistem. Amacım az yazmak anlatabildim mi?

Ayrıca arkadaşım ben firefox kullanıyorum. Yaparken de firefox ile yaptım editörü. Url'yi ie'de denedim ve çıkan link ekleme kutusunu çok beğendim (opera muhattabım değil onda test etmem hibirşeyi). Url butonunu değiştirmeyecem fakat browser ie değilse prompt ile direk http link eklettirecem.

Bana karşı bir garazın mı var ? Buraya kavga etmeye gelmiyorum ben. Sakin ol tamam mı?

[ Mesaj 25 Nisan 2007, Çarşamba - 15:34 tarihinde, Brigand tarafından güncellenmiştir ]