🎟️ 🧢 👏🏿 Flappy बर्ड 1KB तक 🤲🏻 🕴🏽 🏩

30 लोअरकेस जेएस का सप्ताह लंबा चला गया है, लेकिन पदों से प्रेरित होकर हम फेजर (भाग I) पर फ्लैपी बर्ड विकसित कर रहे हैं और जैसा कि मिंकोवस्की ने फ्लैपी बर्ड पर खेला है , मैं मदद नहीं कर सका, लेकिन खेल के एएससीआईआई संस्करण "फ्लैपी बर्ड" को लिखने और जावास्क्रिप्ट में फिट रखने की कोशिश कर रहा हूं 1024 अक्षरों में।

आप देख सकते हैं कि यहाँ क्या आया (और खेलते हैं), और यहाँ असम्पीडित स्रोत देखें।

कार्यान्वयन के विवरण के लिए, मैं बिल्ली के लिए पूछता हूं।

खेल के बारे में

मैं उन बोरिंग विवरणों को छोड़ दूंगा जो आप खुद विकि पर पा सकते हैं या मूल खेल खेलने की कोशिश कर रहे हैं। संक्षेप में, आप बाधाओं के बीच उड़ने वाले एक पक्षी को नियंत्रित करते हैं। अप की का उपयोग करना, आप इसे थोड़ा अधिक धक्का दे सकते हैं और इस प्रकार पैंतरेबाज़ी कर सकते हैं।

मैदान

मैंने पर्याप्त प्रामाणिकता के लिए प्रयास नहीं किया, और प्रतिबंध बहुत सख्त हैं। इसलिए, मैंने अधिकतम बलिदान किया और, परीक्षण और त्रुटि के द्वारा, अधिक या कम इष्टतम फ़ील्ड आकार (स्केलिंग के बिना) का चयन किया - प्रत्येक 30 वर्णों की 10 पंक्तियाँ:

 - +++++ ---- +++++ ----- +++++ -----
  +++++ +++++++++++     
  +++++ +++++++++++     
  +++++                        
                              
  0                            
           ++++++ +++++     
  +++++ +++++++++++     
  +++++ +++++++++++     
 - ++++ ---- +++++ ----- +++++ -----
 123

शून्य - खिलाड़ी की स्थिति (मैंने बाईं ओर दूसरा कॉलम चुना), निचले बाएँ में 123 बिंदु हैं।

फ़ील्ड एनीमेशन

पहला काम यह है कि खेल के मैदान को कैसे आगे बढ़ाया जाए, बाधाओं को दाईं से बाईं ओर ले जाया जाए। आप फ़ील्ड कोशिकाओं को द्वि-आयामी सरणी में संग्रहीत करने का प्रयास कर सकते हैं, लेकिन हम एक अलग तरीके से जाएंगे। आइए लाइनों में से एक को देखें, इसमें शून्य के साथ रिक्त स्थान की जगह, और लोगों के साथ अवरोध:

011111000011111000001111100000

यह अनुमान लगाना मुश्किल नहीं है कि यह एक संख्या (521110496) का द्विआधारी प्रतिनिधित्व है। बिटवाइज़ लेफ्ट शिफ्ट ऑपरेशन का उपयोग करके इसे बाईं ओर ले जाना हमारे लिए सभी आसान है। पूर्णांक मानों की लंबाई सीमा याद रखें। 30 बाइट्स की सीमा बनाए रखने के लिए, बस मास्क और उन्हें चीर दें, शिफ्ट के बाद अनावश्यक रूप से सब कुछ काट दें:

 = 011111000011111000001111100000;  =  << 1;  =  & 2^30; //  = 111110000111110000011111000000

और दूसरा कार्य बाधाओं की समान चौड़ाई को बनाए रखना है। चार संभावित मामले (पहले झूठ से पहले) इस तरह दिखते हैं:

 ????010 - true -> 000011 ???0110 - true -> 000111 ??01110 - true -> 001111 ?011110 - true -> 011111 0111110 - false

तर्क तुच्छ है: यदि दूसरा बिट = 1 है, तो सच है अगर बाधा की चौड़ाई के लिए दूसरे बिट के बाद अगले में थोड़ा = 0 है।

हमारे द्वारा लागू किए गए क्षेत्र की सभी लाइनों को शिफ्ट करने के लिए कुल:

  <<= 1;  &= 2^30; if ( & 2) { for ( = 2;  <= _; ++) { if (!( & 1 << )) {  |= 1; break; } } }

स्कोरिंग

इस स्थान पर, हमारे पास स्कोरिंग के लिए पर्याप्त शर्तें हैं। बशर्ते कि दो बाधाएं एक अंतराल के बिना नहीं जा सकतीं, हम खिलाड़ी के प्रत्येक खाली कॉलम के लिए एक बिंदु जोड़ते हैं यदि खिलाड़ी पिछले कॉलम में बाधा बिल्कुल था (28 और 29 एक में दो आसन्न स्तंभों के सूचक हैं, जिनमें से एक निम्न सूचकांक के साथ है , - खिलाड़ी):

  += (__ & 1 << 29) && !(__ & 1 << 28) ? 1 : 0;

नई बाधाएँ

यह थोड़ा पेचीदा मामला है। मैंने परिस्थितियों का सामना करने की कोशिश की:

बाधाओं को बिना अंतराल के एक पंक्ति में नहीं जाना चाहिए
जितना बड़ा अंतर पहले ही बन चुका है, उतनी ही बड़ी बाधा की संभावना होनी चाहिए
जितने अधिक अंक आप स्कोर करेंगे, उतनी बार बाधाओं को जाना होगा

इसकी कल्पना निम्नलिखित रूप में की जा सकती है:

 000011111 -> 0% (0 * 12.5) 0 000111110 -> 0% (0 * 12.5) 1 001111100 -> 12.5% (1 * 12.5) 2 011111000 -> 25.0% (2 * 12.5) 3 111110000 -> 37.5% (3 * 12.5) .. 111100000 -> 50.0% (4 * 12.5) 111000000 -> 62.5% (5 * 12.5) 110000000 -> 75.0% (6 * 12.5) 100000000 -> 87.5% (7 * 12.5) 000000000 -> 100.0% (8 * 12.5)

पहला स्तंभ फ़ील्ड के चरम बिट्स हैं, इसके बाद एक नई बाधा की संभावनाओं का प्रतिशत। आठ अधिकतम अंतराल है, जो खेल में दोनों इष्टतम है और गणना के लिए सुविधाजनक है: 100 को 8 से विभाजित किया जा सकता है और मूर्त मान प्राप्त कर सकता है। दाईं ओर का स्तंभ मुखौटा की बिटवाइज़ लेफ्ट शिफ्ट है जिसके साथ हम बाधाओं के बीच वर्तमान अंतराल की लंबाई की खोज करेंगे और गणना करेंगे।

बिंदु छोटा है: मुखौटा इकाई को तब तक बाईं ओर घुमाएं जब तक कि हम दूसरी इकाई से न मिलें। इस समय, वर्तमान अवधि और संभाव्यता को जानकर, हम एक नई बाधा बनाने की कोशिश कर रहे हैं:

     0   { if (__ & 1 << ) { if ( > 1 && ( - 2) * 125 +  > (124..999)) { //   } break; } }

मैंने सब कुछ 10 से गुणा किया और इस तरह गैर-पूर्णांक मानों से छुटकारा पाया। 100% को छोड़कर: एक हजार (100% * 10) से मैंने यूनिट लिया, क्योंकि यूनिट एप्लिकेशन की पूरी अतिरिक्त बाइट है! और, जैसा कि हम याद करते हैं, बाइट्स को बचाना चाहिए।

बाधाओं को जोड़ना स्वयं एक मुश्किल काम नहीं है, लेकिन अगम्य वर्गों के निर्माण को बाहर करने के लिए, मैंने एक शर्त जोड़ी: प्रत्येक अगली बाधा एक से अधिक / पहले वाली या उससे कम होनी चाहिए, और एक ही समय में दो या पांच से कम नहीं होनी चाहिए। इसके अलावा हम उड़ान के लिए एक अंतराल बनाए रखते हैं - तीन लाइनें। हमें मिलता है:

 //  -   ,   ,     = (   > 2 ?  - 1 : 2   < 5 ?  + 1 : 5 );    0   {  |= 1; }     + 3   {  |= 1; }

प्रस्तुत करना

कोई चाल नहीं है। हम सिर्फ एक पुराने ट्यूब टीवी की तरह, पंक्तियों में, और उनमें स्तंभों में और क्षेत्र कोशिकाओं को संचित करते हैं:

  = '';    ( ) {    ( ) {  +=  == 28 &&  == _ ? "0" : (  & 1 <<  ? "+" : ( ! ||  == _ - 1 ? "-" : " " ) ); }  += "\n"; } _;

अलग से खिलाड़ी की जाँच करें और ड्रा करें, साथ ही मैदान की ऊपरी और निचली सीमा।

कोर्स

खेल की दुनिया तैयार है और काम कर रही है। यह चरित्र को पुनर्जीवित करने के लिए बनी हुई है। मैंने इसे अधिकतम करने के लिए सरलीकृत किया। परबोला, गुरुत्वाकर्षण, त्वरण और जड़ता पर कोई उड़ानें (शायद थोड़ा छोड़कर)। अप कुंजी को एक आवेग सेट करें - ऊपर की ओर आंदोलन की सीमा। और एनीमेशन के प्रत्येक पुनरावृत्ति को इस गति को कम करने दें, अगर यह अभी तक शून्य तक नहीं पहुंचा है। परीक्षणों पर, यह बहुत दयनीय लग रहा था और पक्षी स्पष्ट रूप से त्रिकोणीय पथ के साथ चले गए। इसलिए, मैंने शुरुआती गति को थोड़ा बढ़ाया और गति को "जड़ता" से जोड़ा अगर गति एक के बराबर है:

 if (  ) {  ,   = 3; } //  if ( > 1) { --; --_ || ; //  } else if () { --; //  } else { _ < 9 ? _++ : ; }

एक आवेग न केवल इसके मूल्य को नियंत्रित करता है, बल्कि चरित्र की स्थिति को भी नियंत्रित करता है। यदि हम क्षेत्र की सीमाओं से टकराते हैं तो प्लस चेक।

अलग से, एक बाधा के साथ टकराव की जाँच करें:

 if (_ & 1 << 28) { ; }

हिट

इस पर, मुख्य कार्य पूरा हो गया है। लेआउट जोड़ें, एक अनाम फ़ंक्शन में एप्लिकेशन को लपेटें और कई ब्राउज़रों में जांचें।

संपीड़न से पहले परिणाम

 <script> (function(){ var run = 0, imp = 0; function up(){ run = 1; var pos = 2, rows = [1, 1, 1, 1, 0, 0, 0, 1, 1, 1], rowsLen = 10, fieldWidth = 30, fieldMask = Math.pow(2, fieldWidth) - 1, profit = 0, hTop = 4, row, col, timer = setInterval(function(){ /** * Move user */ if (imp > 1) { imp--; // up --pos || _stop(); } else if (imp) { imp--; } else { // down pos < 9 ? pos++ : _stop(); } /** * Move field * * 0111110 - false * ?011110 - true -> 011111 * ??01110 - true -> 001111 * ???0110 - true -> 000111 * ????010 - true -> 000011 */ for (row = rowsLen; row--;) { rows[row] <<= 1; rows[row] &= fieldMask; if (rows[row] & 2) { for (w = 2; w <= 5; w++) { if (!(rows[row] & 1 << w)) { rows[row] |= 1; break; } } } } /** * Add new objects * * * 000011111 -> 0% (0 * 12.5) 0 * 000111110 -> 0% (0 * 12.5) 1 * 001111100 -> 12.5% (1 * 12.5) 2 * 011111000 -> 25.0% (2 * 12.5) 3 * 111110000 -> 37.5% (3 * 12.5) .. * 111100000 -> 50.0% (4 * 12.5) * 111000000 -> 62.5% (5 * 12.5) * 110000000 -> 75.0% (6 * 12.5) * 100000000 -> 87.5% (7 * 12.5) * 000000000 -> 100.0% (8 * 12.5) */ for (var tryNum = 0; true; tryNum++) { if (rows[0] & 1 << tryNum) { if (tryNum > 1 && (tryNum - 2) * 125 + profit > _rnd(124, 999)) { hTop = _rnd(hTop > 2 ? hTop - 1 : 2, hTop < 5 ? hTop + 1 : 5); // 2..5, prev +/- 1 for (h = 0; h < hTop; h++) { rows[h] |= 1; } for (h = hTop + 3; h < rowsLen; h++) { rows[h] |= 1; } } break; } } /** * Render */ var text = ''; for (row = 0; row < rowsLen; row++) { for (col = 29; col >= 0; col--) { text += col == 28 && row == pos ? "0" : ( rows[row] & 1 << col ? "+" : ( !row || row == rowsLen - 1 ? "-" : " " ) ); } text += "\n"; } profit += (rows[0] & 1 << 29) && !(rows[0] & 1 << 28) ? 1 : 0; text += "\n"+profit; pre.innerHTML = text; if (rows[pos] & 1 << 28) { _stop(); } }, 250); var _rnd = function(min, max){ return Math.floor(Math.random() * (max - min + 1)) + min; } var _stop = function(){ clearInterval(timer); run && alert(':('); run = 0; } } onkeyup = function(e){ e.which == 38 && (run ? imp = 3 : up()); }; })() </script> <body onload=""><pre id="pre">press up!

किसी भी ऑप्टिमाइज़र के माध्यम से जेएस चलाएं एक UglifyJS और फिर बस इसे स्थानांतरित करें:

 <body onload='..'

कुल: 785 बाइट्स। मुझे यकीन है कि यह सीमा नहीं है!

संदर्भ

उपरोक्त के अलावा, यह दिलचस्प होगा:

Flappy बर्ड 1KB तक