Tween

گفتم جفت‌یابی یاد ارسطو افتادم. ارسطو معتقد بود در ابتدای جهان، زن و مرد یکی بودند و بسیار قدرت‌مند. خدایان که از وضع موجود می‌ترسیدند انسان رو به دو نیمه زن و مرد تقسیم کردند و به این ترتیب قدرتش رو ازش گرفتند. ارسطو معتقد بود هر شخصی یه نیمه جدا افتاده از خودش داره و تنها با پیدا کردن اون شخص قدرت اولیه‌ش رو به‌دست میاره.
بازی جفت‌یابی رو معادل Matching Game در نظر گرفتم. (کسی معادل خوبی سراغ نداره؟) روند بازی بسیار ساده‌ست: باید کارت‌های مشابه هم‌دیگه رو پیدا کرد. ابتدا یه چیزی بود برای تست تابع data در جی‌کوئری، بعد یه خورده آرایشش کردم تا شد این.

× رخداد مورد استفاده window.load هست چون در این‌جا، باید قبل از اجرای کدها از لود شدن تصاویر اطمینان حاصل می‌شد.

× برای تصادفی کردن مکان تصاویر در DOM ابتدا نظرم این بود که عناصر رو در یه آرایه ذخیره کنیم، ترتیب عناصر آرایه رو به هم بریزیم و بعد دوباره تبدیل به عناصر دامش بکنیم. با جستجوی گوگل متوجه نوشته James در این رابطه و افزونه مفیدی که برای jQuery نوشته بود شدم. اون تابع shuffle از اون‌جا اومده.
× از متغیر stat برای ردگیری تعداد کلیک‌های کاربر استفاده شده، با کلیک اول فقط کارت نمایش داده می‌شه و با کلیک دوم ارزیابی همانندی تصاویر و برنده شدن بازیکن انجام می‌شه.
× تصاویر مورد استفاده در بازی شکل‌های پیش‌فرض فتوشاپ هستند.

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

در هر حال، همان‌طور که گفتم فقط برای تست چند تا تابع jQuery بود بنابراین همین‌جوری که هست ولش می‌کنم.

مشاهده دمو – دانلود سورس بازی