History

softchris 3f7ec0bbe8 🌐 Update translations via Co-op Translator		1 month ago
..
solution	🌐 Update translations via Co-op Translator	3 months ago
your-work	🌐 Update translations via Co-op Translator	3 months ago
README.md	🌐 Update translations via Co-op Translator	1 month ago
assignment.md	🌐 Update translations via Co-op Translator	3 months ago

README.md

Unescape Escape

स्पेस गेम तयार करा भाग ५: स्कोरिंग आणि जीवन

प्री-लेक्चर क्विझ

तुमचा स्पेस गेम खऱ्या गेमसारखा वाटेल असं तयार करण्यासाठी तयार आहात का? चला, स्कोरिंग पॉइंट्स आणि जीवन व्यवस्थापन जोडूया - मुख्य यांत्रिकी ज्यामुळे स्पेस इनव्हेडर्ससारखे सुरुवातीचे आर्केड गेम्स साध्या डेमोमधून व्यसनाधीन मनोरंजनात बदलले. यामुळे तुमचा गेम खऱ्या अर्थाने खेळण्यायोग्य होतो.

स्क्रीनवर मजकूर काढणे - तुमच्या गेमचा आवाज

तुमचा स्कोअर दाखवण्यासाठी, कॅनव्हासवर मजकूर रेंडर कसा करायचा हे शिकणे आवश्यक आहे. fillText() पद्धत तुमचं मुख्य साधन आहे - क्लासिक आर्केड गेम्समध्ये स्कोअर आणि स्टेटस माहिती दाखवण्यासाठी याच तंत्राचा वापर केला जातो.

तुमच्याकडे मजकूराच्या स्वरूपावर पूर्ण नियंत्रण आहे:

ctx.font = "30px Arial";
ctx.fillStyle = "red";
ctx.textAlign = "right";
ctx.fillText("show this on the screen", 0, 0);

✅ कॅनव्हासवर मजकूर जोडणे यावर अधिक सखोल जा - तुम्ही फॉन्ट्स आणि स्टाइलिंगसह किती सर्जनशील होऊ शकता याबद्दल तुम्हाला आश्चर्य वाटेल!

जीवन - फक्त एक संख्या नाही

गेम डिझाइनमध्ये, "जीवन" खेळाडूच्या चुका करण्याच्या मर्यादेचे प्रतिनिधित्व करते. ही संकल्पना पिनबॉल मशीनपासून सुरू झाली, जिथे तुम्हाला खेळण्यासाठी अनेक बॉल्स मिळायचे. अ‍ॅस्टरॉइड्ससारख्या सुरुवातीच्या व्हिडिओ गेम्समध्ये, जीवन खेळाडूंना धोका पत्करण्याची आणि चुका करून शिकण्याची परवानगी देत असे.

दृश्य प्रतिनिधित्व खूप महत्त्वाचे आहे - "Lives: 3" फक्त मजकूर दाखवण्याऐवजी जहाजाच्या आयकॉन दाखवणे त्वरित दृश्य ओळख निर्माण करते, जसे की सुरुवातीच्या आर्केड कॅबिनेट्सने भाषा अडथळ्यांवर संवाद साधण्यासाठी आयकॉनोग्राफीचा वापर केला.

तुमच्या गेमचा रिवॉर्ड सिस्टम तयार करणे

आता आपण मुख्य फीडबॅक सिस्टम लागू करू जे खेळाडूंना गुंतवून ठेवतात:

स्कोरिंग सिस्टम: प्रत्येक नष्ट केलेल्या शत्रूच्या जहाजासाठी १०० पॉइंट्स मिळतात (गोल संख्या खेळाडूंना मानसिक गणना करणे सोपे करते). स्कोअर तळाच्या डाव्या कोपऱ्यात दिसेल.
जीवन काउंटर: तुमचा हिरो तीन जीवनांसह सुरू होतो - सुरुवातीच्या आर्केड गेम्सने आव्हान आणि खेळण्यायोग्यता संतुलित करण्यासाठी स्थापित केलेला मानक. प्रत्येक शत्रूशी झालेल्या टक्करमुळे एक जीवन कमी होते. उर्वरित जीवन तळाच्या उजव्या बाजूला जहाजाच्या आयकॉनद्वारे दाखवले जाईल .

चला तयार करूया!

प्रथम, तुमचं वर्कस्पेस सेट करा. तुमच्या your-work सब फोल्डरमधील फाइल्सकडे जा. तुम्हाला या फाइल्स दिसायला हव्यात:

-| assets
  -| enemyShip.png
  -| player.png
  -| laserRed.png
-| index.html
-| app.js
-| package.json

तुमचा गेम टेस्ट करण्यासाठी, your_work फोल्डरमधून डेव्हलपमेंट सर्व्हर सुरू करा:

cd your-work
npm start

हे http://localhost:5000 वर लोकल सर्व्हर चालवते. तुमच्या ब्राउझरमध्ये हा पत्ता उघडा आणि तुमचा गेम पहा. अॅरो कीजसह कंट्रोल्स टेस्ट करा आणि शत्रूंवर शूट करण्याचा प्रयत्न करा की सर्व काही व्यवस्थित कार्य करते का ते तपासा.

कोड लिहिण्याची वेळ आली!

तुम्हाला आवश्यक असलेली दृश्यात्मक संसाधने मिळवा. solution/assets/ फोल्डरमधून life.png संसाधन तुमच्या your-work फोल्डरमध्ये कॉपी करा. नंतर lifeImg तुमच्या window.onload फंक्शनमध्ये जोडा:
```
lifeImg = await loadTexture("assets/life.png");
```
lifeImg तुमच्या अॅसेट्स लिस्टमध्ये जोडायला विसरू नका:
```
let heroImg,
...
lifeImg,
...
eventEmitter = new EventEmitter();
```
तुमच्या गेम व्हेरिएबल्स सेट करा. तुमचा एकूण स्कोअर (० पासून सुरू) आणि उर्वरित जीवन (३ पासून सुरू) ट्रॅक करण्यासाठी काही कोड जोडा. हे स्क्रीनवर दाखवू जेणेकरून खेळाडूंना नेहमी त्यांची स्थिती माहित असेल.
कोलिजन डिटेक्शन लागू करा. तुमच्या updateGameObjects() फंक्शनला विस्तारित करा जेणेकरून शत्रू तुमच्या हिरोशी टक्कर करत आहेत का ते शोधता येईल:
```
enemies.forEach(enemy => {
    const heroRect = hero.rectFromGameObject();
    if (intersectRect(heroRect, enemy.rectFromGameObject())) {
      eventEmitter.emit(Messages.COLLISION_ENEMY_HERO, { enemy });
    }
  })
```
तुमच्या हिरोमध्ये जीवन आणि पॉइंट ट्रॅकिंग जोडा.
1. काउंटर प्रारंभ करा. तुमच्या Hero क्लासमध्ये this.cooldown = 0 च्या खाली जीवन आणि पॉइंट्स सेट करा:
```
this.life = 3;
this.points = 0;
```
2. खेळाडूंना हे मूल्ये दाखवा. स्क्रीनवर ही मूल्ये काढण्यासाठी फंक्शन्स तयार करा:
```
function drawLife() {
  // TODO, 35, 27
  const START_POS = canvas.width - 180;
  for(let i=0; i < hero.life; i++ ) {
    ctx.drawImage(
      lifeImg, 
      START_POS + (45 * (i+1) ), 
      canvas.height - 37);
  }
}

function drawPoints() {
  ctx.font = "30px Arial";
  ctx.fillStyle = "red";
  ctx.textAlign = "left";
  drawText("Points: " + hero.points, 10, canvas.height-20);
}

function drawText(message, x, y) {
  ctx.fillText(message, x, y);
}
```
3. हे सर्व तुमच्या गेम लूपमध्ये जोडा. updateGameObjects() नंतर window.onload फंक्शनमध्ये हे फंक्शन्स जोडा:
```
drawPoints();
drawLife();
```
गेमचे परिणाम आणि रिवॉर्ड्स लागू करा. आता आपण फीडबॅक सिस्टम जोडू जे खेळाडूंच्या कृतींना अर्थपूर्ण बनवतात:
1. टक्कर झाल्यावर जीवन कमी होते. प्रत्येक वेळी तुमचा हिरो शत्रूशी टक्कर घेतो, तुम्ही एक जीवन गमावले पाहिजे.
  
  तुमच्या Hero क्लासमध्ये हा मेथड जोडा:
```
decrementLife() {
  this.life--;
  if (this.life === 0) {
    this.dead = true;
  }
}
```
2. शत्रूंवर शूट केल्यावर पॉइंट्स मिळतात. प्रत्येक यशस्वी हिटसाठी १०० पॉइंट्स मिळतात, जे अचूक शूटिंगसाठी त्वरित सकारात्मक फीडबॅक प्रदान करतात.
  
  तुमच्या Hero क्लासमध्ये हा इन्क्रिमेंट मेथड विस्तारित करा:
```
  incrementPoints() {
    this.points += 100;
  }
```
  आता हे फंक्शन्स तुमच्या कोलिजन इव्हेंट्सशी कनेक्ट करा:
```
eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
   first.dead = true;
   second.dead = true;
   hero.incrementPoints();
})

eventEmitter.on(Messages.COLLISION_ENEMY_HERO, (_, { enemy }) => {
   enemy.dead = true;
   hero.decrementLife();
});
```

✅ जावास्क्रिप्ट आणि कॅनव्हाससह तयार केलेल्या इतर गेम्सबद्दल उत्सुक आहात? काही एक्सप्लोर करा - तुम्हाला काय शक्य आहे याबद्दल आश्चर्य वाटेल!

या फीचर्स लागू केल्यानंतर, तुमचा गेम टेस्ट करा आणि संपूर्ण फीडबॅक सिस्टम अॅक्शनमध्ये पहा. तुम्हाला तळाच्या उजव्या बाजूला जीवनाचे आयकॉन, तळाच्या डाव्या बाजूला तुमचा स्कोअर दिसेल आणि टक्कर झाल्यावर जीवन कमी होताना आणि यशस्वी शॉट्समुळे स्कोअर वाढताना पहा.

तुमच्या गेममध्ये आता सुरुवातीच्या आर्केड गेम्सला इतके आकर्षक बनवणारे आवश्यक यांत्रिकी आहेत - स्पष्ट उद्दिष्टे, त्वरित फीडबॅक आणि खेळाडूंच्या कृतींसाठी अर्थपूर्ण परिणाम.

GitHub Copilot Agent Challenge 🚀

Agent मोड वापरून खालील चॅलेंज पूर्ण करा:

वर्णन: स्पेस गेमच्या स्कोरिंग सिस्टमला उच्च स्कोअर फीचर, स्थायी स्टोरेज आणि बोनस स्कोरिंग यांत्रिकीसह सुधारित करा.

प्रॉम्प्ट: खेळाडूचा सर्वोत्तम स्कोअर localStorage मध्ये सेव्ह करणारी उच्च स्कोअर सिस्टम तयार करा. सलग शत्रू ठार मारल्यावर बोनस पॉइंट्स (कॉम्बो सिस्टम) जोडा आणि वेगवेगळ्या शत्रू प्रकारांसाठी वेगवेगळे पॉइंट्स मूल्ये लागू करा. खेळाडूने नवीन उच्च स्कोअर मिळवल्यावर व्हिज्युअल इंडिकेटर समाविष्ट करा आणि गेम स्क्रीनवर चालू उच्च स्कोअर दाखवा.

🚀 चॅलेंज

आता तुमच्याकडे स्कोरिंग आणि जीवन असलेला कार्यक्षम गेम आहे. खेळाडूंचा अनुभव वाढवण्यासाठी कोणते अतिरिक्त फीचर्स उपयुक्त ठरतील याचा विचार करा.

पोस्ट-लेक्चर क्विझ

पुनरावलोकन आणि स्व-अभ्यास

अधिक एक्सप्लोर करू इच्छिता? गेम स्कोरिंग आणि जीवन प्रणालींना वेगवेगळ्या पद्धतीने संशोधन करा. PlayFab सारख्या आकर्षक गेम इंजिन्स आहेत जी स्कोरिंग, लीडरबोर्ड्स आणि खेळाडूंची प्रगती हाताळतात. अशा गोष्टींचा समावेश करून तुमचा गेम पुढच्या स्तरावर कसा जाऊ शकतो याचा विचार करा.

असाइनमेंट

स्कोरिंग गेम तयार करा

अस्वीकरण:
हा दस्तऐवज AI भाषांतर सेवा Co-op Translator वापरून भाषांतरित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपया लक्षात ठेवा की स्वयंचलित भाषांतरांमध्ये त्रुटी किंवा अचूकतेचा अभाव असू शकतो. मूळ भाषेतील दस्तऐवज हा अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी व्यावसायिक मानवी भाषांतराची शिफारस केली जाते. या भाषांतराचा वापर करून निर्माण झालेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थासाठी आम्ही जबाबदार राहणार नाही.

README.md Unescape Escape