|
|
<!--
|
|
|
CO_OP_TRANSLATOR_METADATA:
|
|
|
{
|
|
|
"original_hash": "4b1d441cfd31924084956000c0fee5a5",
|
|
|
"translation_date": "2025-10-22T22:02:43+00:00",
|
|
|
"source_file": "6-space-game/4-collision-detection/README.md",
|
|
|
"language_code": "bn"
|
|
|
}
|
|
|
-->
|
|
|
# স্পেস গেম তৈরি করুন পার্ট ৪: লেজার যোগ করা এবং সংঘর্ষ সনাক্ত করা
|
|
|
|
|
|
## প্রাক-লেকচার কুইজ
|
|
|
|
|
|
[প্রাক-লেকচার কুইজ](https://ff-quizzes.netlify.app/web/quiz/35)
|
|
|
|
|
|
স্টার ওয়ার্সের সেই মুহূর্তটি মনে করুন যখন লুকের প্রোটন টর্পেডো ডেথ স্টারের এক্সহস্ট পোর্টে আঘাত করে। সেই সুনির্দিষ্ট সংঘর্ষ সনাক্তকরণ গ্যালাক্সির ভাগ্য পরিবর্তন করেছিল! গেমে, সংঘর্ষ সনাক্তকরণ একইভাবে কাজ করে - এটি নির্ধারণ করে কখন বস্তুগুলি একে অপরের সাথে যোগাযোগ করে এবং তারপরে কী ঘটে।
|
|
|
|
|
|
এই পাঠে, আপনি আপনার স্পেস গেমে লেজার অস্ত্র যোগ করবেন এবং সংঘর্ষ সনাক্তকরণ বাস্তবায়ন করবেন। ঠিক যেমন নাসার মিশন পরিকল্পনাকারীরা মহাকাশযানের গতিপথ গণনা করেন ধ্বংসাবশেষ এড়ানোর জন্য, আপনি শিখবেন কখন গেমের বস্তুগুলি একে অপরের সাথে মিলে যায় তা সনাক্ত করতে। আমরা এটি পরিচালনাযোগ্য ধাপে বিভক্ত করব যা একে অপরের উপর ভিত্তি করে তৈরি হবে।
|
|
|
|
|
|
শেষে, আপনার একটি কার্যকরী যুদ্ধ ব্যবস্থা থাকবে যেখানে লেজার শত্রুদের ধ্বংস করবে এবং সংঘর্ষ গেম ইভেন্টগুলি ট্রিগার করবে। এই একই সংঘর্ষের নীতিগুলি পদার্থবিজ্ঞানের সিমুলেশন থেকে ইন্টারেক্টিভ ওয়েব ইন্টারফেস পর্যন্ত সবকিছুতে ব্যবহৃত হয়।
|
|
|
|
|
|
✅ প্রথম কম্পিউটার গেমটি সম্পর্কে একটু গবেষণা করুন। এর কার্যকারিতা কী ছিল?
|
|
|
|
|
|
## সংঘর্ষ সনাক্তকরণ
|
|
|
|
|
|
সংঘর্ষ সনাক্তকরণ অ্যাপোলো লুনার মডিউলের প্রক্সিমিটি সেন্সরগুলির মতো কাজ করে - এটি ক্রমাগত দূরত্ব পরীক্ষা করে এবং বস্তুগুলি খুব কাছাকাছি এলে সতর্কতা ট্রিগার করে। গেমে, এই সিস্টেমটি নির্ধারণ করে কখন বস্তুগুলি যোগাযোগ করে এবং তারপরে কী ঘটবে।
|
|
|
|
|
|
আমরা যে পদ্ধতিটি ব্যবহার করব তা প্রতিটি গেমের বস্তুকে একটি আয়তক্ষেত্র হিসাবে বিবেচনা করে, ঠিক যেমন এয়ার ট্রাফিক কন্ট্রোল সিস্টেমগুলি বিমানের ট্র্যাকিংয়ের জন্য সরল জ্যামিতিক আকার ব্যবহার করে। এই আয়তক্ষেত্র পদ্ধতি সহজ মনে হতে পারে, তবে এটি গণনামূলকভাবে দক্ষ এবং বেশিরভাগ গেমের পরিস্থিতিতে ভাল কাজ করে।
|
|
|
|
|
|
### আয়তক্ষেত্রের উপস্থাপনা
|
|
|
|
|
|
প্রতিটি গেমের বস্তুর স্থানাঙ্ক সীমানা প্রয়োজন, ঠিক যেমন মঙ্গল গ্রহের পাথফাইন্ডার রোভার তার অবস্থান ম্যাপ করেছিল। এখানে আমরা এই সীমানা স্থানাঙ্কগুলি কীভাবে সংজ্ঞায়িত করি:
|
|
|
|
|
|
```javascript
|
|
|
rectFromGameObject() {
|
|
|
return {
|
|
|
top: this.y,
|
|
|
left: this.x,
|
|
|
bottom: this.y + this.height,
|
|
|
right: this.x + this.width
|
|
|
}
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**এটি ভেঙে দেখি:**
|
|
|
- **উপরের প্রান্ত**: এটি আপনার বস্তুটি উল্লম্বভাবে (এর y অবস্থান) কোথায় শুরু হয়
|
|
|
- **বাম প্রান্ত**: এটি অনুভূমিকভাবে (এর x অবস্থান) কোথায় শুরু হয়
|
|
|
- **নিচের প্রান্ত**: y অবস্থানে উচ্চতা যোগ করুন - এখন আপনি জানেন এটি কোথায় শেষ হয়!
|
|
|
- **ডান প্রান্ত**: x অবস্থানে প্রস্থ যোগ করুন - এবং আপনার সম্পূর্ণ সীমানা রয়েছে
|
|
|
|
|
|
### ইন্টারসেকশন অ্যালগরিদম
|
|
|
|
|
|
আয়তক্ষেত্রের ইন্টারসেকশন সনাক্তকরণ সেই যুক্তির মতো কাজ করে যেভাবে হাবল স্পেস টেলিস্কোপ তার দৃষ্টিপথে আকাশীয় বস্তুগুলি একে অপরের সাথে ওভারল্যাপ করছে কিনা তা নির্ধারণ করে। অ্যালগরিদমটি বিচ্ছিন্নতার জন্য পরীক্ষা করে:
|
|
|
|
|
|
```javascript
|
|
|
function intersectRect(r1, r2) {
|
|
|
return !(r2.left > r1.right ||
|
|
|
r2.right < r1.left ||
|
|
|
r2.top > r1.bottom ||
|
|
|
r2.bottom < r1.top);
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**বিচ্ছিন্নতা পরীক্ষা রাডার সিস্টেমের মতো কাজ করে:**
|
|
|
- আয়তক্ষেত্র ২ কি সম্পূর্ণভাবে আয়তক্ষেত্র ১ এর ডানদিকে?
|
|
|
- আয়তক্ষেত্র ২ কি সম্পূর্ণভাবে আয়তক্ষেত্র ১ এর বামদিকে?
|
|
|
- আয়তক্ষেত্র ২ কি সম্পূর্ণভাবে আয়তক্ষেত্র ১ এর নিচে?
|
|
|
- আয়তক্ষেত্র ২ কি সম্পূর্ণভাবে আয়তক্ষেত্র ১ এর উপরে?
|
|
|
|
|
|
যদি এই শর্তগুলির কোনোটিই সত্য না হয়, তবে আয়তক্ষেত্রগুলি অবশ্যই ওভারল্যাপ করছে। এই পদ্ধতিটি রাডার অপারেটররা কীভাবে দুটি বিমান নিরাপদ দূরত্বে রয়েছে কিনা তা নির্ধারণ করে তার সাথে সাদৃশ্যপূর্ণ।
|
|
|
|
|
|
## বস্তুর জীবনচক্র পরিচালনা
|
|
|
|
|
|
যখন একটি লেজার একটি শত্রুকে আঘাত করে, তখন উভয় বস্তু গেম থেকে সরিয়ে ফেলা প্রয়োজন। তবে, লুপের মাঝখানে বস্তু মুছে ফেলা ক্র্যাশের কারণ হতে পারে - এটি অ্যাপোলো গাইডেন্স কম্পিউটারের মতো প্রাথমিক কম্পিউটার সিস্টেমে কঠিনভাবে শেখা একটি পাঠ। পরিবর্তে, আমরা একটি "মুছে ফেলার জন্য চিহ্নিত করুন" পদ্ধতি ব্যবহার করি যা ফ্রেমগুলির মধ্যে বস্তুগুলি নিরাপদে সরিয়ে দেয়।
|
|
|
|
|
|
এখানে আমরা কীভাবে কিছু মুছে ফেলার জন্য চিহ্নিত করি:
|
|
|
|
|
|
```javascript
|
|
|
// Mark object for removal
|
|
|
enemy.dead = true;
|
|
|
```
|
|
|
|
|
|
**কেন এই পদ্ধতিটি কাজ করে:**
|
|
|
- আমরা বস্তুটিকে "মৃত" হিসাবে চিহ্নিত করি তবে এটি তৎক্ষণাৎ মুছি না
|
|
|
- এটি বর্তমান গেম ফ্রেমটি নিরাপদে শেষ করতে দেয়
|
|
|
- এমন কিছু ব্যবহার করার চেষ্টা করার কারণে কোনও ক্র্যাশ হয় না যা ইতিমধ্যে চলে গেছে!
|
|
|
|
|
|
তারপরে পরবর্তী রেন্ডার চক্রের আগে চিহ্নিত বস্তুগুলি ফিল্টার করুন:
|
|
|
|
|
|
```javascript
|
|
|
gameObjects = gameObjects.filter(go => !go.dead);
|
|
|
```
|
|
|
|
|
|
**এই ফিল্টারিং কী করে:**
|
|
|
- শুধুমাত্র "জীবিত" বস্তুগুলির একটি নতুন তালিকা তৈরি করে
|
|
|
- "মৃত" হিসাবে চিহ্নিত কিছু ফেলে দেয়
|
|
|
- আপনার গেমটি মসৃণভাবে চালিয়ে রাখে
|
|
|
- ধ্বংস হওয়া বস্তুগুলি জমা হওয়া থেকে মেমরি বর্ধিত হওয়া প্রতিরোধ করে
|
|
|
|
|
|
## লেজার মেকানিক্স বাস্তবায়ন
|
|
|
|
|
|
গেমে লেজার প্রজেক্টাইলগুলি স্টার ট্রেকের ফোটন টর্পেডোর মতো একই নীতিতে কাজ করে - এগুলি পৃথক বস্তু যা সোজা রেখায় ভ্রমণ করে যতক্ষণ না তারা কিছু আঘাত করে। প্রতিটি স্পেসবার প্রেস একটি নতুন লেজার বস্তু তৈরি করে যা স্ক্রিন জুড়ে চলে।
|
|
|
|
|
|
এটি কাজ করার জন্য, আমাদের কয়েকটি ভিন্ন অংশ সমন্বয় করতে হবে:
|
|
|
|
|
|
**বাস্তবায়নের জন্য মূল উপাদান:**
|
|
|
- **লেজার তৈরি করুন** যা নায়কের অবস্থান থেকে স্পন করে
|
|
|
- **কীবোর্ড ইনপুট পরিচালনা করুন** লেজার তৈরি ট্রিগার করতে
|
|
|
- **লেজার চলাচল এবং জীবনচক্র পরিচালনা করুন**
|
|
|
- **লেজার প্রজেক্টাইলের জন্য ভিজ্যুয়াল উপস্থাপনা বাস্তবায়ন করুন**
|
|
|
|
|
|
## ফায়ারিং রেট নিয়ন্ত্রণ বাস্তবায়ন
|
|
|
|
|
|
অসীম ফায়ারিং রেট গেম ইঞ্জিনকে অভিভূত করবে এবং গেমপ্লে খুব সহজ করে তুলবে। বাস্তব অস্ত্র ব্যবস্থাগুলি একই ধরনের সীমাবদ্ধতার মুখোমুখি হয় - এমনকি ইউএসএস এন্টারপ্রাইজের ফেজারগুলিকেও শটের মধ্যে রিচার্জ করার জন্য সময় প্রয়োজন।
|
|
|
|
|
|
আমরা একটি কুলডাউন সিস্টেম বাস্তবায়ন করব যা দ্রুত-ফায়ার স্প্যামিং প্রতিরোধ করে এবং প্রতিক্রিয়াশীল নিয়ন্ত্রণ বজায় রাখে:
|
|
|
|
|
|
```javascript
|
|
|
class Cooldown {
|
|
|
constructor(time) {
|
|
|
this.cool = false;
|
|
|
setTimeout(() => {
|
|
|
this.cool = true;
|
|
|
}, time);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
class Weapon {
|
|
|
constructor() {
|
|
|
this.cooldown = null;
|
|
|
}
|
|
|
|
|
|
fire() {
|
|
|
if (!this.cooldown || this.cooldown.cool) {
|
|
|
// Create laser projectile
|
|
|
this.cooldown = new Cooldown(500);
|
|
|
} else {
|
|
|
// Weapon is still cooling down
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**কুলডাউন কীভাবে কাজ করে:**
|
|
|
- তৈরি হলে, অস্ত্রটি "গরম" শুরু হয় (এখনও ফায়ার করতে পারে না)
|
|
|
- টাইমআউট সময়কালের পরে, এটি "ঠান্ডা" হয়ে যায় (ফায়ার করতে প্রস্তুত)
|
|
|
- ফায়ার করার আগে, আমরা পরীক্ষা করি: "অস্ত্রটি কি ঠান্ডা?"
|
|
|
- এটি স্প্যাম-ক্লিকিং প্রতিরোধ করে এবং নিয়ন্ত্রণকে প্রতিক্রিয়াশীল রাখে
|
|
|
|
|
|
✅ স্পেস গেম সিরিজের পাঠ ১-এ ফিরে যান কুলডাউন সম্পর্কে মনে করিয়ে দেওয়ার জন্য।
|
|
|
|
|
|
## সংঘর্ষ সনাক্তকরণ সিস্টেম তৈরি করা
|
|
|
|
|
|
আপনার বিদ্যমান স্পেস গেম কোড থেকে শুরু করে, আপনি একটি সংঘর্ষ সনাক্তকরণ সিস্টেম তৈরি করবেন। ঠিক যেমন আন্তর্জাতিক স্পেস স্টেশনের স্বয়ংক্রিয় সংঘর্ষ এড়ানোর সিস্টেম, আপনার গেমটি ক্রমাগত বস্তুগুলির অবস্থান পর্যবেক্ষণ করবে এবং ইন্টারসেকশনগুলিতে প্রতিক্রিয়া জানাবে।
|
|
|
|
|
|
আপনার আগের পাঠের কোড থেকে শুরু করে, আপনি সংঘর্ষ সনাক্তকরণ যোগ করবেন নির্দিষ্ট নিয়ম সহ যা বস্তু মিথস্ক্রিয়া পরিচালনা করে।
|
|
|
|
|
|
> 💡 **প্রো টিপ**: লেজার স্প্রাইটটি ইতিমধ্যে আপনার অ্যাসেট ফোল্ডারে অন্তর্ভুক্ত রয়েছে এবং আপনার কোডে উল্লেখ করা হয়েছে, বাস্তবায়নের জন্য প্রস্তুত।
|
|
|
|
|
|
### সংঘর্ষের নিয়ম বাস্তবায়ন
|
|
|
|
|
|
**গেম মেকানিক্স যোগ করতে হবে:**
|
|
|
1. **লেজার শত্রুকে আঘাত করে**: লেজার প্রজেক্টাইল দ্বারা আঘাত করা হলে শত্রু বস্তুটি ধ্বংস হয়ে যায়
|
|
|
2. **লেজার স্ক্রিনের সীমানায় আঘাত করে**: স্ক্রিনের উপরের প্রান্তে পৌঁছালে লেজারটি সরিয়ে ফেলা হয়
|
|
|
3. **শত্রু এবং নায়কের সংঘর্ষ**: উভয় বস্তু একে অপরের সাথে মিলে গেলে ধ্বংস হয়ে যায়
|
|
|
4. **শত্রু নিচে পৌঁছায়**: শত্রুরা স্ক্রিনের নিচে পৌঁছালে গেম ওভার শর্ত
|
|
|
|
|
|
## আপনার ডেভেলপমেন্ট পরিবেশ সেট আপ করা
|
|
|
|
|
|
ভালো খবর - আমরা ইতিমধ্যে আপনার জন্য বেশিরভাগ ভিত্তি স্থাপন করেছি! আপনার সমস্ত গেম অ্যাসেট এবং মৌলিক কাঠামো `your-work` সাবফোল্ডারে অপেক্ষা করছে, আপনার জন্য দুর্দান্ত সংঘর্ষ বৈশিষ্ট্য যোগ করার জন্য প্রস্তুত।
|
|
|
|
|
|
### প্রকল্পের কাঠামো
|
|
|
|
|
|
```bash
|
|
|
-| assets
|
|
|
-| enemyShip.png
|
|
|
-| player.png
|
|
|
-| laserRed.png
|
|
|
-| index.html
|
|
|
-| app.js
|
|
|
-| package.json
|
|
|
```
|
|
|
|
|
|
**ফাইল কাঠামো বোঝা:**
|
|
|
- **সমন্বিত** গেমের বস্তুগুলির জন্য প্রয়োজনীয় সমস্ত স্প্রাইট ইমেজ
|
|
|
- **অন্তর্ভুক্ত** প্রধান HTML ডকুমেন্ট এবং জাভাস্ক্রিপ্ট অ্যাপ্লিকেশন ফাইল
|
|
|
- **প্রদান করে** স্থানীয় ডেভেলপমেন্ট সার্ভারের জন্য প্যাকেজ কনফিগারেশন
|
|
|
|
|
|
### ডেভেলপমেন্ট সার্ভার শুরু করা
|
|
|
|
|
|
আপনার প্রকল্প ফোল্ডারে যান এবং স্থানীয় সার্ভার শুরু করুন:
|
|
|
|
|
|
```bash
|
|
|
cd your-work
|
|
|
npm start
|
|
|
```
|
|
|
|
|
|
**এই কমান্ড সিকোয়েন্স:**
|
|
|
- **ডিরেক্টরি পরিবর্তন করে** আপনার কাজের প্রকল্প ফোল্ডারে
|
|
|
- **স্থানীয় HTTP সার্ভার শুরু করে** `http://localhost:5000` এ
|
|
|
- **আপনার গেম ফাইল পরিবেশন করে** পরীক্ষার এবং ডেভেলপমেন্টের জন্য
|
|
|
- **স্বয়ংক্রিয় রিলোডিং সহ লাইভ ডেভেলপমেন্ট সক্ষম করে**
|
|
|
|
|
|
আপনার ব্রাউজার খুলুন এবং `http://localhost:5000` এ যান আপনার বর্তমান গেমের অবস্থা দেখতে যেখানে নায়ক এবং শত্রু স্ক্রিনে রেন্ডার করা হয়েছে।
|
|
|
|
|
|
### ধাপে ধাপে বাস্তবায়ন
|
|
|
|
|
|
যেমন নাসা ভয়েজার মহাকাশযান প্রোগ্রাম করার জন্য পদ্ধতিগত পদ্ধতি ব্যবহার করেছিল, আমরা সংঘর্ষ সনাক্তকরণ পদ্ধতিগতভাবে বাস্তবায়ন করব, প্রতিটি উপাদান ধাপে ধাপে তৈরি করব।
|
|
|
|
|
|
#### ১. আয়তক্ষেত্র সংঘর্ষ সীমানা যোগ করুন
|
|
|
|
|
|
প্রথমে, আমাদের গেমের বস্তুগুলিকে তাদের সীমানা বর্ণনা করতে শেখাই। আপনার `GameObject` ক্লাসে এই পদ্ধতি যোগ করুন:
|
|
|
|
|
|
```javascript
|
|
|
rectFromGameObject() {
|
|
|
return {
|
|
|
top: this.y,
|
|
|
left: this.x,
|
|
|
bottom: this.y + this.height,
|
|
|
right: this.x + this.width,
|
|
|
};
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**এই পদ্ধতি অর্জন করে:**
|
|
|
- **একটি আয়তক্ষেত্র বস্তু তৈরি করে** সুনির্দিষ্ট সীমানা স্থানাঙ্ক সহ
|
|
|
- **নিচের এবং ডান প্রান্ত গণনা করে** অবস্থান এবং মাত্রা যোগ করে
|
|
|
- **একটি বস্তু ফেরত দেয়** সংঘর্ষ সনাক্তকরণ অ্যালগরিদমের জন্য প্রস্তুত
|
|
|
- **সমস্ত গেমের বস্তুগুলির জন্য একটি মানক ইন্টারফেস প্রদান করে**
|
|
|
|
|
|
#### ২. ইন্টারসেকশন সনাক্তকরণ বাস্তবায়ন
|
|
|
|
|
|
এখন আসুন আমাদের সংঘর্ষ সনাক্তকারী তৈরি করি - একটি ফাংশন যা বলতে পারে কখন দুটি আয়তক্ষেত্র ওভারল্যাপ করছে:
|
|
|
|
|
|
```javascript
|
|
|
function intersectRect(r1, r2) {
|
|
|
return !(
|
|
|
r2.left > r1.right ||
|
|
|
r2.right < r1.left ||
|
|
|
r2.top > r1.bottom ||
|
|
|
r2.bottom < r1.top
|
|
|
);
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**এই অ্যালগরিদম কাজ করে:**
|
|
|
- **চারটি বিচ্ছিন্নতা শর্ত পরীক্ষা করে** আয়তক্ষেত্রগুলির মধ্যে
|
|
|
- **`false` ফেরত দেয়** যদি কোনও বিচ্ছিন্নতা শর্ত সত্য হয়
|
|
|
- **সংঘর্ষ নির্দেশ করে** যখন কোনও বিচ্ছিন্নতা থাকে না
|
|
|
- **নেতিবাচক যুক্তি ব্যবহার করে** দক্ষ ইন্টারসেকশন পরীক্ষা
|
|
|
|
|
|
#### ৩. লেজার ফায়ারিং সিস্টেম বাস্তবায়ন
|
|
|
|
|
|
এখানেই জিনিসগুলি উত্তেজনাপূর্ণ হয়ে ওঠে! আসুন লেজার ফায়ারিং সিস্টেম সেট আপ করি।
|
|
|
|
|
|
##### বার্তা কনস্ট্যান্ট
|
|
|
|
|
|
প্রথমে, আসুন কিছু বার্তা প্রকার সংজ্ঞায়িত করি যাতে আমাদের গেমের বিভিন্ন অংশ একে অপরের সাথে কথা বলতে পারে:
|
|
|
|
|
|
```javascript
|
|
|
KEY_EVENT_SPACE: "KEY_EVENT_SPACE",
|
|
|
COLLISION_ENEMY_LASER: "COLLISION_ENEMY_LASER",
|
|
|
COLLISION_ENEMY_HERO: "COLLISION_ENEMY_HERO",
|
|
|
```
|
|
|
|
|
|
**এই কনস্ট্যান্টগুলি প্রদান করে:**
|
|
|
- **অ্যাপ্লিকেশনের জুড়ে ইভেন্ট নাম মানক করে**
|
|
|
- **গেম সিস্টেমগুলির মধ্যে ধারাবাহিক যোগাযোগ সক্ষম করে**
|
|
|
- **ইভেন্ট হ্যান্ডলার নিবন্ধনে টাইপো প্রতিরোধ করে**
|
|
|
|
|
|
##### কীবোর্ড ইনপুট পরিচালনা
|
|
|
|
|
|
আপনার কী ইভেন্ট লিসেনারে স্পেস কী সনাক্তকরণ যোগ করুন:
|
|
|
|
|
|
```javascript
|
|
|
} else if(evt.keyCode === 32) {
|
|
|
eventEmitter.emit(Messages.KEY_EVENT_SPACE);
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**এই ইনপুট হ্যান্ডলার:**
|
|
|
- **স্পেস কী প্রেস সনাক্ত করে** keyCode 32 ব্যবহার করে
|
|
|
- **একটি মানক ইভেন্ট বার্তা প্রেরণ করে**
|
|
|
- **ডিকাপলড ফায়ারিং লজিক সক্ষম করে**
|
|
|
|
|
|
##### ইভেন্ট লিসেনার সেটআপ
|
|
|
|
|
|
আপনার `initGame()` ফাংশনে ফায়ারিং আচরণ নিবন্ধন করুন:
|
|
|
|
|
|
```javascript
|
|
|
eventEmitter.on(Messages.KEY_EVENT_SPACE, () => {
|
|
|
if (hero.canFire()) {
|
|
|
hero.fire();
|
|
|
}
|
|
|
});
|
|
|
```
|
|
|
|
|
|
**এই ইভেন্ট লিসেনার:**
|
|
|
- **স্পেস কী ইভেন্টগুলিতে প্রতিক্রিয়া জানায়**
|
|
|
- **ফায়ারিং কুলডাউন স্ট্যাটাস পরীক্ষা করে**
|
|
|
- **লেজার তৈরি ট্রিগার করে যখন অনুমোদিত হয়**
|
|
|
|
|
|
লেজার-শত্রু ইন্টারঅ্যাকশনগুলির জন্য সংঘর্ষ পরিচালনা যোগ করুন:
|
|
|
|
|
|
```javascript
|
|
|
eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
|
|
|
first.dead = true;
|
|
|
second.dead = true;
|
|
|
});
|
|
|
```
|
|
|
|
|
|
**এই সংঘর্ষ পরিচালনা:**
|
|
|
- **সংঘর্ষ ইভেন্ট ডেটা গ্রহণ করে** উভয় বস্তুর সাথে
|
|
|
- **উভয় বস্তুকে মুছে ফেলার জন্য চিহ্নিত করে**
|
|
|
- **সংঘর্ষের পরে সঠিক পরিষ্কার নিশ্চিত করে**
|
|
|
|
|
|
#### ৪. লেজার ক্লাস তৈরি করুন
|
|
|
|
|
|
একটি লেজার প্রজেক্টাইল বাস্তবায়ন করুন যা উপরের দিকে চলে এবং তার নিজস্ব জীবনচক্র পরিচালনা করে:
|
|
|
|
|
|
```javascript
|
|
|
class Laser extends GameObject {
|
|
|
constructor(x, y) {
|
|
|
super(x, y);
|
|
|
this.width = 9;
|
|
|
this.height = 33;
|
|
|
this.type = 'Laser';
|
|
|
this.img = laserImg;
|
|
|
|
|
|
let id = setInterval(() => {
|
|
|
if (this.y > 0) {
|
|
|
this.y -= 15;
|
|
|
} else {
|
|
|
this.dead = true;
|
|
|
clearInterval(id);
|
|
|
}
|
|
|
}, 100);
|
|
|
}
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**এই ক্লাস বাস্তবায়ন:**
|
|
|
- **GameObject প্রসারিত করে** মৌলিক কার্যকারিতা উত্তরাধিকারী করতে
|
|
|
- **লেজার স্প্রাইটের জন্য উপযুক্ত মাত্রা সেট করে**
|
|
|
- **`setInterval()` ব্যবহার করে স্বয়ংক্রিয় উপরের দিকে চলাচল তৈরি করে**
|
|
|
- **স্ক্রিনের শীর্ষে পৌঁছালে নিজেকে ধ্বংস করে**
|
|
|
- **তার নিজস্ব অ্যানিমেশন টাইমিং এবং পরিষ্কার পরিচালনা করে**
|
|
|
|
|
|
#### ৫. সংঘর্ষ সনাক্তকরণ সিস্টেম বাস্তবায়ন
|
|
|
|
|
|
একটি ব্যাপক সংঘর্ষ সনাক্তকরণ ফাংশন তৈরি করুন:
|
|
|
|
|
|
```javascript
|
|
|
function updateGameObjects() {
|
|
|
const enemies = gameObjects.filter(go => go.type === 'Enemy');
|
|
|
const lasers = gameObjects.filter(go => go.type === "Laser");
|
|
|
|
|
|
// Test laser-enemy collisions
|
|
|
lasers.forEach((laser) => {
|
|
|
enemies.forEach((enemy) => {
|
|
|
if (intersectRect(laser.rectFromGameObject(), enemy.rectFromGameObject())) {
|
|
|
eventEmitter.emit(Messages.COLLISION_ENEMY_LASER, {
|
|
|
first: laser,
|
|
|
second: enemy,
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
|
|
|
// Remove destroyed objects
|
|
|
gameObjects = gameObjects.filter(go => !go.dead);
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**এই সংঘর্ষ সিস্টেম:**
|
|
|
- **ধরন অনুযায়ী গেমের বস্তু ফিল্টার করে** দক্ষ পরীক্ষার জন্য
|
|
|
- **প্রতিটি লেজার এবং প্রতিটি শত্রুর মধ্যে ইন্টারসেকশন পরীক্ষা করে**
|
|
|
- **সংঘর্ষ ইভেন্ট প্রেরণ করে** যখন ইন্টারসেকশন সনাক্ত করা হয়
|
|
|
- **সংঘর্ষ প্রক্রিয়াকরণের পরে ধ্বংস হওয়া বস্তু পরিষ্কার করে**
|
|
|
|
|
|
> ⚠️ **গুরুত্বপূর্ণ**: সংঘর্ষ সনাক্তকরণ সক্ষম করতে `window.onload`-এ আপনার প্রধান গেম লুপে `updateGameObjects()` যোগ করুন।
|
|
|
|
|
|
#### ৬. নায়ক ক্লাসে কুলডাউন সিস্টেম যোগ করুন
|
|
|
|
|
|
ফায়ারিং মেকানিক্স এবং রেট সীমাবদ্ধতা সহ নায়ক ক্লাস উন্নত করুন:
|
|
|
|
|
|
```javascript
|
|
|
class Hero extends GameObject {
|
|
|
constructor(x, y) {
|
|
|
super(x, y);
|
|
|
this.width = 99;
|
|
|
this.height = 75;
|
|
|
this.type = "Hero";
|
|
|
this.speed = { x: 0, y: 0 };
|
|
|
this.cooldown = 0;
|
|
|
}
|
|
|
|
|
|
fire() {
|
|
|
gameObjects.push(new Laser(this.x + 45, this.y - 10));
|
|
|
this.cooldown = 500;
|
|
|
|
|
|
let id = setInterval(() => {
|
|
|
if (this.cooldown > 0) {
|
|
|
this.cooldown -= 100;
|
|
|
} else {
|
|
|
clearInterval(id);
|
|
|
}
|
|
|
}, 200);
|
|
|
}
|
|
|
|
|
|
canFire() {
|
|
|
return this.cooldown === 0;
|
|
|
}
|
|
|
}
|
|
|
```
|
|
|
|
|
|
**উন্নত নায়ক ক্লাস বোঝা:**
|
|
|
- **কুলডাউন টাইমার শূন্যে শুরু করে** (ফায়ার করতে প্রস্তুত)
|
|
|
- **লেজার বস্তু তৈরি করে** নায়ক জাহাজের উপরে অবস্থান করা
|
|
|
- **দ্রুত ফায়ারিং প্রতিরোধ করতে কুলডাউন সময়কাল সেট করে**
|
|
|
- **ইন্টারভাল-ভিত্তিক আপডেট ব্যবহার করে কুলডাউন টাইমার হ্রাস করে**
|
|
|
- **`canFire()` পদ্ধতির মাধ্যমে ফায়ারিং স্ট্যাটাস পরীক্ষা প্রদান করে**
|
|
|
|
|
|
### আপনার বাস্তবায়ন পরীক্ষা করা
|
|
|
|
|
|
আপনার স্পেস গেম এখন সম্পূর্ণ সংঘর্ষ সনাক্তকরণ এবং যুদ্ধ মেক
|
|
|
|
|
|
---
|
|
|
|
|
|
**অস্বীকৃতি**:
|
|
|
এই নথিটি AI অনুবাদ পরিষেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনুবাদ করা হয়েছে। আমরা যথাসাধ্য সঠিকতার জন্য চেষ্টা করি, তবে অনুগ্রহ করে মনে রাখবেন যে স্বয়ংক্রিয় অনুবাদে ত্রুটি বা অসঙ্গতি থাকতে পারে। মূল ভাষায় থাকা নথিটিকে প্রামাণিক উৎস হিসেবে বিবেচনা করা উচিত। গুরুত্বপূর্ণ তথ্যের জন্য, পেশাদার মানব অনুবাদ সুপারিশ করা হয়। এই অনুবাদ ব্যবহারের ফলে কোনো ভুল বোঝাবুঝি বা ভুল ব্যাখ্যার জন্য আমরা দায়ী থাকব না। |