Get best of the week

خطوط 9753: يوم جرذ الأرض

            إذا كنت تلعب المكعبات لفترة طويلة ،
            فإنها تتحول إلى كرات

بالنظر إلى اسم اللعبة Lines 9753 ، قد تعتقد أن هذه القصة تدور حول استنساخ 9753 من لعبة Color Lines الشهيرة ، والتي تحتاج فيها إلى صنع 5 كرات متتالية من نفس اللون. نعم ، إنه استنساخ. حسنًا ، ماذا يمكن أن يكون جديدًا؟ سوف أشارك أفكاري وبعض التفاصيل الدقيقة للتنفيذ في HTML + CSS + JavaScript. سأخبركم بما تعنيه الأرقام 9753 ، وسأقترح طريقة للعثور على تركيبة أخرى من الأرقام ومعرفة كيف تتغير اللعبة. ستصبح أكثر إثارة للاهتمام أو مملة - أنت تقرر. هل خمنت ماذا يعني 9753؟ ثم ، من فضلك ، تحت القط.

مجموعة متنوعة من خيارات اللعبة


هل تساءلت يومًا عن المكان الذي جاءت فيه البعد الميداني 9x9 في اللعبة الأصلية؟ إنه لأمر مدهش مدى جودة اختيار ليس فقط أبعاد اللعبة ، ولكن أيضًا معلمات أخرى ، لذلك من المثير للاهتمام اللعب: عدد الألوان هو 7 ، عدد الكرات المتتالية هو 5 وعدد الكرات التي تظهر في كل دور هو 3. يتم وضع هذه المعلمات 4 في اسم اللعبة - خطوط 9753 هذا هو الأربعة التي تحدد بشكل عام مدى تعقيد اللعبة ، وهو على الأرجح غير مناسب للجميع.


ربما شخص ما سيحب مجموعة مختلفة. على سبيل المثال:

  • 3333 - العزلة مثل مآس ، لا يمكنك أن تخاف من الوصول إلى طريق مسدود ومحاولة انهيار أكبر عدد ممكن من الكرات في وقت واحد (5 لا تزال سهلة ، 6 أصعب ، 7 و 8 تكاد تكون غير واقعية) ، مناسبة في حالة عدم الرغبة في التفكير على الإطلاق ؛
  • 5643 - على لوحة 5x5 ، الخلايا ليست صغيرة مثل 9x9 ، لذلك من الملائم اللعب على الهاتف ، ولكن يبدو أن الصعوبة أعلى قليلاً من 9753 ؛
  • 5543 هو خيار أسهل قليلاً من 5643 ، لأن عدد الألوان المختلفة أقل ، مما يعني أنه من المرجح أن يصنع سلسلة من الكرات من نفس اللون ؛
  • 4443 - قابلة للمقارنة من حيث التعقيد إلى 5643 ، لكن الكرات أكبر - فقط 4 كرات على الجانب القصير من الشاشة.



أعتقد أن الجميع سيجدون خيارات اللعبة المناسبة لأنفسهم. لا تنفصل عن الشبكة ، وسنتمكن من رؤية الخيارات الأكثر شيوعًا في الجدول على الموقع.

ارجع للوراء


يسمح بالعودة. ذات مرة ، عندما كانت الأشجار طويلة ، وكنت لا أزال طالبة ، كان علي أن ألعب خطوط الألوان. انا حقا احببت اللعبة ذات مرة ، بعد أن خسرت نصف يوم فيه ، وسجلت عدة آلاف من النقاط ، وصلت إلى طريق مسدود. جاء الإدراك أنه كان من قبيل الصدفة ، أن الكرات سقطت بنجاح ، وأنه في المستقبل القريب لم أستطع الذهاب إلى هذا الحد. لتحطيم الرقم القياسي الخاص بي ، سأضطر إلى قتل عشرة أضعاف الوقت ، ثم إذا كنت محظوظًا. منذ ذلك الحين ، لم ألعب هذه اللعبة منذ فترة طويلة. الشعور بالظلم الشامل عميق في روحي. وجلس هناك حتى تبلورت خطة الانتقام الخبيثة - لصنع اللعبة نفسها ، ولكن مع القدرة على إرجاع التحركات إلى البداية على الأقل. كان هذا الخيار هو الذي أصبح بالنسبة لي السبب الرئيسي الدافع لكتابة اللعبة بطريقي الخاص.

عشوائية ثابتة


قال بعض اللاعبين إن السيارة تعمد أحيانًا وضع الكرات بشكل متعمد في أماكن غير مريحة لتعقيد المرور. خاصة عندما يكون هناك عدد قليل جدًا من الخلايا الحرة المتبقية ، فمن المستحيل انتظار الكرة اليمنى في المكان الصحيح. بمعنى آخر ، العشوائية في اللعبة أبعد ما تكون عن العشوائية. مع فرصة جديدة لإعادة الترجيع للخلف ، لن يكون من المنطقي أن نقدم في كل مرة مكانًا جديدًا للكرات الجديدة. لذا سيكون من الممكن العودة ذهابًا وإيابًا حتى تظهر الكرة اليمنى في المكان الصحيح. لذلك ، يتم تحديد جميع حركات الآلة في اللعبة وتعتمد بشكل عشوائي على رقم الحركة وموقع الكرات في الملعب. علاوة على ذلك ، يلعب الجميع نفس اللعبة. أي أن اللعبة تبدأ بالترتيب نفسه (الخطوة الأولى للسيارة) ، ثم تعتمد حركات السيارة على كيفية سير اللاعب: إذا سار اللاعبون بنفس الطريقة ،ثم في الملعب سيكون لديهم نفس ترتيب الكرات. هذا يسمح لك بموضوعية وبغض النظر عن فرصة لمقارنة الحلول المختلفة. يحب بعض الأشخاص قياس من هو التالي ، ومن هو الأسرع ... يتم إرسال القرارات في شكل سلسلة من تحركات اللاعب إلى الخادم. يتم حساب تحركات السيارة وفقًا لنفس الخوارزمية العشوائية. لا يمكن خداع الخادم ، ويتم فحص التسلسل بأكمله للتحقق من صحته ، وعندئذ فقط يتم إدخال النتيجة في الجدول. يتم حفظ جميع السجلات جنبًا إلى جنب مع تسلسل تحركات اللاعب. ثم نقوم بتحليل ونشر أفضل القرارات لأولئك الذين حصلوا على 9999 نقطة. سيكون من الضروري التوصل إلى معايير لاختيار الأفضل.يتم حساب تحركات السيارة وفقًا لنفس الخوارزمية العشوائية. لا يمكن خداع الخادم ، ويتم فحص التسلسل بأكمله للتحقق من صحته ، وعندئذ فقط يتم إدخال النتيجة في الجدول. يتم حفظ جميع السجلات جنبًا إلى جنب مع تسلسل تحركات اللاعب. ثم نقوم بتحليل ونشر أفضل القرارات لأولئك الذين حصلوا على 9999 نقطة. سيكون من الضروري التوصل إلى معايير لاختيار الأفضل.يتم حساب تحركات السيارة وفقًا لنفس الخوارزمية العشوائية. لا يمكن خداع الخادم ، ويتم فحص التسلسل بأكمله للتحقق من صحته ، وعندئذ فقط يتم إدخال النتيجة في الجدول. يتم حفظ جميع السجلات جنبًا إلى جنب مع تسلسل تحركات اللاعب. ثم نقوم بتحليل ونشر أفضل القرارات لأولئك الذين حصلوا على 9999 نقطة. سيكون من الضروري التوصل إلى معايير لاختيار الأفضل.


يمكن العثور على بعض المعايير في الإحصائيات ، والتي تتوفر بالنقر على العداد الأيمن أو السفلي. إذا توصلت إلى معايير أخرى مثيرة للاهتمام ، فأرسلني ، سأحاول إضفاء الطابع الرسمي على الحساب والإضافة.

مستعجل


يتم عرض مواقف وألوان الكرات التالية. نظرًا لحقيقة أن اللعبة يمكن إعادة لفها للأمام والخلف ، فلا معنى لإخفاء التحركات التالية. يمكن أن تظهر عدة تحركات للأمام ، لكنها لم تحدث لواجهة بسيطة (ضع في اعتبارك أن حركات السيارة تتغير إذا كانت الخلايا مشغولة نتيجة لأفعال اللاعب).

التهديف


يتم تسجيل النقاط وفقًا للصيغة الكلاسيكية N * (1 + N - DIMENSION) ، حيث N هو عدد الكرات في الخط ، DIMENSION هو بُعد مجال اللعب. أي 5 و 6 و 7 و 8 من الكرات التي تم جمعها معًا تعطي 5 و 12 و 21 و 32 نقطة على التوالي. بالنسبة لخيار اللعبة 3333 ، عندما تنهار 3 و 4 و 5 و 6 كرات ، يتم الحصول على 3 و 8 و 15 و 24.

الفنون التصويرية


الرسومات متجهة فقط - لا أحب تحجيم القطع الأثرية ، وخاصة الحدود المشوشة. العناصر الرسومية الرئيسية: مسجل شرائط عتيق وكرات مرتدة مع لمحات وإضاءة متدرجة. وهي مصنوعة باستخدام CSS ومتبلة بقطع من JavaScript. في البداية ، تم عمل مخطط ألوان داكنة. يمكنك تجربته عن طريق تشغيله في الإعدادات. ومع ذلك ، كل شيء يبدو قاتما. أنا أحب النور أفضل.

كرة ثلاثية الأبعاد


مفارقة كما يبدو ، ولكن من 3 مستطيلات متداخلة في بعضها البعض ، يتم الحصول على كرة ثلاثية الأبعاد:


  1. حاوية تحدد الحجم والموضع على الشاشة
  2. مربع مستدير ، يخلق شكلًا ثنائي الأبعاد ، يتقلص ويمتد أثناء الارتداد
  3. مربع مع حشو متدرج بيضاوي الشكل يحدد لون وإضاءة الكرة ، مضيفًا بعدًا ثالثًا.

مع الحاوية ، كل شيء بسيط. يحدد موقع سمات CSS الخاصة به ، إلى اليسار والجزء العلوي ، إحداثيات الكرة في الملعب ، ويعين حجم الخط الحجم النسبي الذي يتم قياس المربعين الآخرين به. المربع المستدير ، مثل الغالبية العظمى من الجولات ، على صفحات الويب الخاصة بنا ، هو مجرد مربع يحتوي على أكثر الزوايا تقريبًا. عندما نضغط عليه بالماوس ، فإنه يسطح ، ويضغط من فوق ويوسع الجوانب. وإذا اتضح أن النقرة سريعة مثل نقرة الماوس ، تبدأ الكرة في الارتداد.


@keyframes flat {
            0%   {height: 1.0em; width: 1.0em; top: 0; left: 0em;}
            100% {height: 0.9em; width: 1.05em; top: 0.1em; left: -0.025em;}
        }

@keyframes jumping {
            0%   {height: 0.9em;   width: 1.025em; top: 0.1em;   left: -0.0125em;}
            10%  {height: 1.02em;  width: 1.0em;   top: -0.02em; left: 0em;}
            40%  {height: 1.008em; width: 1.0em;   top: -0.18em; left: 0em;}
            50%  {height: 1.01em;  width: 1.0em;   top: -0.2em;  left: 0em;}
            60%  {height: 1.0em;   width: 1.0em;   top: -0.18em; left: 0em;}
            70%  {height: 1.0em;   width: 1.0em;   top: -0.1em;  left: 0em;}
            90%  {height: 1.0em;   width: 1.0em;   top: 0em;     left: 0em;}
            100% {height: 0.9em;   width: 1.025em; top: 0.1em;   left: -0.0125em;}
        }

الحد الأقصى لعدد الألوان هو 15.


لا تحتوي جميع الألوان على تدرجات ناعمة تمامًا حتى على شاشة جيدة ، لذلك اخترت الألوان للعين. كلما زادت الألوان ، زادت صعوبة تمييز الكرات حسب اللون في الحقل. يبدو أن 15 لونًا كافيًا.

عداد


السر الرئيسي للعداد في الأشرطة مع الأرقام. كل شريط مخفي داخل مستطيل يظهر من خلاله رقم واحد فقط. يتم تعتيم حواف هذا المستطيل قليلاً لإنشاء تأثير دائري ، كما لو لم يكن هناك شريط ، ولكن قرص. تتناسب سرعة حركة التمرير مع الزيادة المتبقية في العداد ومحدودة ببعض القيم المعقولة. الرقم الأخير يدور ثانية واحدة.


صوت


الأصوات (الانفجار والقفز) اصطناعية. يتم إنشاؤها بواسطة صيغ رياضية غير معقدة. هذا يخلق بعض مذاق الثمانينيات عندما تم إنشاء معظم الأصوات في الألعاب باستخدام مولد تردد واحد. تتضمن الإيجابيات ضغط البرنامج: مولد بسيط لمثل هذه المؤثرات الصوتية ، مكتوب بلغة JavaScript ، أصغر بكثير من ملف mp3. لكل كرة ، حدد زوجك من ملاحظات lowFreq و highFreq (انظر ويكيبيديا ) واملأ المخزن المؤقت الصوتي مثل هذا:

    var soundUpBuffer = audioCtx.createBuffer(1, frameCount, sampleRate);
    for (var i = 0; i < frameCount; i++) {
      var x = i / frameCount; // from 0.0 to 1.0
      var time = duration * x;
      var volume = Math.sin(x * Math.PI);
      var freq = lowFreq + Math.sqrt(x) * (highFreq - lowFreq);
      buffer[i] = volume * Math.sin(2 * Math.PI * freq * time);
    }

هنا ، يتغير التردد من lowFreq إلى highFreq على طول المنحنى x ½ ، وخطيئة الصوت (π x).

عند حدوث انفجار ، يتحلل الحجم وفقًا للصيغة 1 / (1 + 10 * x + 1000 * x * x) ، ويتم تحديد التردد عشوائيًا من الأول إلى الخامس.

حجم مربع الحوار التكيفي


تم تنفيذ خوارزمية لتحديد حجم مربع الحوار بحيث تشغل أكبر مساحة ممكنة ولا تتجاوز حدود المنطقة المرئية. تكمن المشكلة في اختلاف حجم مربعات الحوار على الأجهزة المختلفة - وأحيانًا تكون صغيرة جدًا ، وأحيانًا لا تدخل الشاشة. لقد جعلت حجم مربعات الحوار يعتمد على حجم الخط (وحدات CSS em). بعد ذلك ، أقوم بالفرز من خلال حجم الخط بحيث لا يستغرق الحوار أكثر من 95٪ من أي من أبعاد الشاشة. لذا لم يكن عليّ تقديم حالات لـ CSS التكيفي.


حجم برنامج صغير


اللعبة كاملة تناسبها في ملف html واحد حوالي 150 كيلو بايت. حوالي 3000 سطر من شفرة المصدر (بالطبع ، من دون جانب الخادم). لم يتم استخدام مكتبات وأطر جافا سكريبت - كل شيء طبيعي ، كما هو الحال في العصر الحجري. في بعض الأحيان ، لا ترغب في التعامل مع واجهة برمجة تطبيقات تابعة لجهة خارجية ، وأحيانًا يكون من المفيد فهم مقدار الأطر التي تبسط حياة مخترع الدراجات واختبار أشعل النار. من المفيد أن تتوصل أولاً إلى كيفية تنفيذ هذه الفكرة أو تلك ، ثم تقارن بعد ذلك بالطريقة التي نفذها الآخرون. على سبيل المثال ، يستغرق إصدار Android 250 كيلوبايت فقط. وهو يتألف من غلاف WebView رقيق ومجموعة من png-shek لدقة الهاتف المختلفة. بالمناسبة ، يمكن استبدال png-shki بناقل xml-koy واحد. كان يمكن أن يتحول بالضبط إلى روح البساطة.

المنتدى


المنتدى يعمل على phpBB . يتيح لك الحساب:

  • حفظ إنجازاتك على الخادم حتى لا تضيع عند تغيير هاتفك أو جهاز الكمبيوتر الخاص بك
  • لعب بالتناوب على جهاز ، ثم على جهاز آخر
  • ترك الرسائل وطرح الأسئلة على اللاعبين أو المطورين الآخرين.

i18n و l10n


تدويل وتوطين. تمت ترجمة اللعبة إلى الروسية والإنجليزية. 35 عبارة قصيرة فقط. لن أرفض المساعدة المجانية في الترجمة إلى عدة لغات أكثر شيوعًا (الصينية والألمانية ، ...).

لا اعلانات


يمكنك غالبًا سماع الرأي القائل بأنه إذا كان البرنامج مجانيًا وبدون إعلانات ، فهذا يعني وجود حصان طروادة ، أو باب خلفي ، أو فيروس ... وبعبارة أخرى ، فإن الجبن المجاني يكون فقط في مصيدة فئران. وإلا لماذا؟ لماذا يرغب شخص ما في فعل شيء للآخرين مجانًا؟ لا أعرف الجواب العام. ليس هذا فقط ، لا أعرف بالضبط لماذا أفعل ذلك بنفسي. أنا مجرد فضول. إذا كنت تحب شيئًا ، فأنا غالبًا ما أتساءل كيف نجح المؤلف. أود أن أحاول أن أفعل الشيء نفسه أو حتى أفضل. في بعض الأحيان أحب كل شيء ، باستثناء بعض التفاصيل ، وهناك رغبة في القيام بشيء مثل هذا ، ولكن مع لعبة ورق وأطراف أصابعي.

استنتاج


هذا كل شئ حتى الان. آمل أن تستمتع باللعبة بقدر ما كنت مهتمًا بإنشائها. سأكون سعيدا بأي تعليق.

المراجع


More articles:


All Articles