Pac-Man بازی گوگل

[mrr1990]

گوگل به مناسبت 30امین سالگرد این بازی اون رو لوگوی خودش قرار داده منتها می خوام بدونم
این که فایل فلش نیست!!!
پس چه جوری نوشته شده؟ با چه زبونی؟
این سوال رو تو انجمن های دیگه هم پرسیدم جواب درست درمونی نگرفتم

[salehbagheri]

http://barnamenevis.org/forum/showpost.php?p=987669&postcount=5

[tick-tock]

گوگل به مناسبت 30امین سالگرد این بازی اون رو لوگوی خودش قرار داده منتها می خوام بدونم
این که فایل فلش نیست!!!
پس چه جوری نوشته شده؟ با چه زبونی؟
این سوال رو تو انجمن های دیگه هم پرسیدم جواب درست درمونی نگرفتم



سلام دوست عزیز حتماً نباید که تمام بازی های اینترنتی فلش باشه . درسته اکثر سایتا اگه بخوان بازی بزارن فلش میزارن اونم بخاطر برنامه نویسی ساده فلش و گرافیک زیبای اونه فقط کافیه که با اینترنت اکسپلور گوگل رو باز کنی و سورس یک صفحه ساده اونو که اگه با لوگوی قبلیش بود 5 خط بیشتر نبود رو ببینی چقدر زیاده


تازه زبان برنامه نویسی اونم از جاوا و اچتمل استفاده شده


به نظرم برای این از فلش استفاده نکرد که حتماً روی سیستم کاربر فلش پلیر باید نصب باشه اما اینجوری دیگه هیچ برنامه کمکی نیاز نیست .

[eshpilen]

چه جالب منم الان اومدم توی این تالار یک تاپیک دقیقا در همین مورد ایجاد کنم که دیدم کس دیگه ای اینکار رو قبلا انجام داده!

البته مشخصه که بازی گوگل با فلش نیست، ولی منکه خودم با DHTML و توانایی هاش آشنا هستم این بازی برام خیلی غریب بود و نمیدونم چطور میشه درستش کرد. از اول فکر کردم شاید از امکانات جدیدی مثل SVG یا امکانات جدیدی که در HTML 5 اضافه شده (و بنده خبر ندارم چون نسخهء 5 رو مطالعه نکردم) استفاده میکنه.
کسی میدونه چطوری کار میکنه؟ حداقل اینکه با همون DHTML عادی که در مرورگرها و استانداردهای معمولی غیرجدید هست کار میکنه یا نه (البته بصورت مستدل و مستند ادعایی بکنید).

وقتی میخوای ببینی تصویرهاش چی هست میبینی که تنها یک تصویر بکگراند با فرمت PNG هست، و البته بعد از شروع بازی این تصویر فرق داره ظاهرا. من نمیدونم چطور مثلا انگار اون تصویر رو تکه تکه میکنه و هر قطعه رو بصورت مجزا به حرکت درمیاره.

خلاصه چیزی میدونید یا ایده ای به ذهنتون میرسه که چنین انیمیشنی رو چطور میشه ایجاد کرد (جدای از الگوریتم و منطق خود بازی) بگید لطفا.

[eshpilen]

به بابا کسی نظری نداشت؟
ایده ای چیزی. ذوقی هیجانی!
آدم ناامید میشه.
من بودم حداقل میامدم میگفتم آره چیز جالبیه منم میخوام بدونم چطوری درست شده.
برنامه نویس باید عاشق دونستن و تونستن باشه.

[pashaie]

الان یه چند وقیه که تو دنیای HTML چیزی به نام Canvas ایجاد شده و اکثر بروز ها هم اونو ساپورت می کنند
همچنین، خیلی سال پیش، گوگل شبیه سازشو واسه IE6 هم نوشته بود.

حالا این Canvas چی کار می کنه؟ Canvas در واقع یه امکانی هست که به شما اجازه می ده با Javascript توش شکل رسم کنید!
روی Canvas خیلی کار شده و حتی الان API برای رسم تصاویر سه بعدی نیز داره
و ازون جالب تر موتور های بازی زیادی هم واسش نوشته شده.

درباره Canvas (http://en.wikipedia.org/wiki/Canvas_element)

یه گیم اینجین (http://www.lukewallin.co.uk/?go=engine)

25 بازی جالب با JS (http://www.webresourcesdepot.com/25-amazing-javascript-games-some-fun-and-inspiration/)

ویرایش

الان که یکم در موردش سرچیدم دیدم که نه! از Canvas استفاده نکردند! با Javascript و البته تکنیک Css Sprite استفاده کردند!
اینم اسپریت مربوطه

http://www.google.com/logos/pacman10-hp-sprite-2.png

و البته اینم Javascript مربوطه
http://www.google.com/logos/js/pacman10-hp.3.js

[eshpilen]

ایول ایول!
فکر کنم از همون Canvas (http://en.wikipedia.org/wiki/Canvas_element) استفاده کرده باشه (که جزیی از HTML5 هست).
الان دارم مقالهء ویکیپیدا در اینمورد رو میخونم.
ولی شما میگی با استفاده از Css Sprite هست و من مقاله ای درمورد این هنوز پیدا نکردم. اگر چیزی سراغ داری معرفی کن بخونیم.
ضمنا اون بازی گوگل روی اینترنت اکسپلورر نسخهء ۷ خطای جاوااسکریپت داد و کار نکرد.

[eshpilen]

بهه خسته نباشه میکروسافت! الان تست کردم حتی اینترنت اکسپلورر نسخهء ۸ هم Canvas (http://en.wikipedia.org/wiki/Canvas_element) رو ساپورت نمیکنه.
ضمنا من تعجب میکنم چرا گوگل اون بازی رو همونطور بدون Detect کردن و تغییر (درواقع حذف) بر اساس مرورگر توی سایتش گذاشته بود. مثل اینکه خیلی عجله داشتن و وقتشون کم بوده!! توی اینترنت هم دیدم که ملت از اینکه صدای بازی رو نمیتونستن خفه کنن شاکی بودن (ظاهرا صداش با یک فلش پخش میشده).

[mohsen_Iran]

سلام مرورگر ie از Canvas پشتیبانی نمی کنه
یه سایت هم است که جالبه به نام democanvas اگه خواستید ببینید نمونه های خوبی داره

[pashaie]

ولی شما میگی با استفاده از Css Sprite هست و من مقاله ای درمورد این هنوز پیدا نکردم. اگر چیزی سراغ داری معرفی کن بخونیم.

مقالات سایت A List Apart خیلی جالبن! اینم لینک مربوط به مقاله Css Sprite (http://www.alistapart.com/articles/sprites)


سلام مرورگر ie از Canvas پشتیبانی نمی کنه
بله، ولی فریورکی که اونو شبیه سازی کنه واسه IE6 ساخته شده
http://excanvas.sourceforge.net/