AntDX316 commited on
Commit
fc30dd6
ยท
1 Parent(s): a143487
Files changed (1) hide show
  1. README.md +171 -0
README.md CHANGED
@@ -6,3 +6,174 @@ colorTo: green
6
  sdk: static
7
  pinned: false
8
  ---
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
6
  sdk: static
7
  pinned: false
8
  ---
9
+
10
+ # Battlefield Simulator
11
+
12
+ Battlefield Simulator is an immersive real-time military strategy game that runs directly in your web browser, featuring autonomous Blue and Red forces battling across an interactive map.
13
+
14
+ Watch as 14 different unit typesโ€”from basic infantry and tanks to elite special forces and missile batteriesโ€”engage in dynamic combat with realistic movement patterns, health systems, and tactical AI.
15
+
16
+ The game progresses through days and hours, unlocking new unit types over time while tracking detailed battle statistics including casualties, reinforcements, territory control, and active engagements.
17
+
18
+ With its intuitive click-to-inspect interface, pause/resume controls, and visually striking battle animations, this simulation offers an engaging strategic experience where you can observe complex military scenarios unfold in real-time without requiring any downloads or installations..
19
+
20
+ ## ๐ŸŽฎ Features
21
+
22
+ ### Core Gameplay
23
+ - **Real-time Simulation**: Units move, engage, and battle autonomously in real-time
24
+ - **Interactive Map**: Built with Leaflet.js for smooth map interactions
25
+ - **Dynamic Combat**: Units engage in battles based on proximity and attack ranges
26
+ - **Unit Progression**: 14 different unit types that unlock over time
27
+ - **Day/Night Cycle**: Time progression affects unit availability and events
28
+
29
+ ### Unit Types
30
+ - **Base Units** (Available from start):
31
+ - Infantry Battalion ๐Ÿ‘ค
32
+ - Tank Division ๐Ÿ›ก๏ธ
33
+ - Artillery Battery ๐Ÿ’ฅ
34
+ - Reconnaissance Unit ๐Ÿ”
35
+ - Air Defense Unit ๐Ÿš€
36
+ - Command Center โญ
37
+ - Medical Corps ๐Ÿฉบ
38
+
39
+ - **Advanced Units** (Unlock over time):
40
+ - Airborne Division ๐Ÿช‚ (Day 2)
41
+ - Special Forces ๐Ÿฅท (Day 3)
42
+ - Mechanized Infantry ๐Ÿšœ (Day 4)
43
+ - Combat Engineers ๐Ÿ”ง (Day 5)
44
+ - Naval Support โš“ (Day 6)
45
+ - Air Squadron โœˆ๏ธ (Day 7)
46
+ - Missile Battery ๐Ÿš€ (Day 10)
47
+ - Elite Force ๐Ÿ‘‘ (Day 15)
48
+
49
+ ### Battle Mechanics
50
+ - **Strength-based Combat**: Unit strength affects combat effectiveness
51
+ - **Range-based Engagement**: Different unit types have varying attack ranges
52
+ - **Health System**: Units take damage and can be eliminated
53
+ - **Reinforcements**: New units spawn periodically
54
+ - **Territory Control**: Visual representation of battlefield dominance
55
+
56
+ ### Statistics & Monitoring
57
+ - **Real-time Stats**: Active units, casualties, reinforcements
58
+ - **Battle Tracking**: Monitor ongoing engagements
59
+ - **Territory Control Bar**: Visual battlefield control indicator
60
+ - **Unit Information Panel**: Detailed stats for selected units
61
+
62
+ ## ๐Ÿš€ Getting Started
63
+
64
+ ### Prerequisites
65
+ - Modern web browser (Chrome, Firefox, Safari, Edge)
66
+ - No additional software installation required
67
+
68
+ ### Installation
69
+ 1. Clone or download this repository
70
+ 2. Open `index.html` in your web browser
71
+ 3. The simulation will start automatically
72
+
73
+ ### File Structure
74
+ ```
75
+ HF-Map/
76
+ โ”œโ”€โ”€ index.html # Main HTML structure
77
+ โ”œโ”€โ”€ script.js # Game logic and simulation engine
78
+ โ”œโ”€โ”€ style.css # Styling and animations
79
+ โ””โ”€โ”€ README.md # This file
80
+ ```
81
+
82
+ ## ๐ŸŽฏ How to Play
83
+
84
+ ### Basic Controls
85
+ - **Click on units**: View detailed information in the info panel
86
+ - **Pause/Resume**: Use the pause button to stop/start the simulation
87
+ - **Observe**: Watch as battles unfold automatically
88
+
89
+ ### Understanding the Interface
90
+
91
+ #### Map View
92
+ - **Blue circles**: Blue faction units
93
+ - **Red circles**: Red faction units
94
+ - **Size**: Larger circles represent stronger units
95
+ - **Animations**: Battle effects appear during combat
96
+
97
+ #### Information Panel
98
+ - **Unit Information**: Click any unit to see its details
99
+ - **Battle Statistics**: Real-time combat metrics
100
+ - **Territory Control**: Visual bar showing battlefield dominance
101
+
102
+ #### Statistics Tracked
103
+ - **Active Units**: Current operational forces per faction
104
+ - **Casualties**: Units eliminated in combat
105
+ - **Reinforcements**: New units added to the battlefield
106
+ - **Active Battles**: Ongoing combat engagements
107
+ - **Territory Control**: Percentage control by each faction
108
+
109
+ ## ๐Ÿ”ง Technical Details
110
+
111
+ ### Technologies Used
112
+ - **HTML5**: Structure and layout
113
+ - **CSS3**: Styling, animations, and responsive design
114
+ - **JavaScript (ES6+)**: Game logic and simulation engine
115
+ - **Leaflet.js**: Interactive mapping library
116
+ - **OpenStreetMap**: Map tile provider
117
+
118
+ ### Key Features Implementation
119
+ - **Unit AI**: Autonomous movement and target selection
120
+ - **Combat System**: Range-based engagement with damage calculations
121
+ - **Event System**: Random events and environmental effects
122
+ - **Time Management**: Day/hour progression with unlockable content
123
+ - **Visual Effects**: Battle animations and unit status indicators
124
+
125
+ ### Performance Optimizations
126
+ - Efficient unit movement calculations
127
+ - Optimized battle detection algorithms
128
+ - Smooth animations with CSS transitions
129
+ - Responsive design for various screen sizes
130
+
131
+ ## ๐ŸŽจ Customization
132
+
133
+ ### Modifying Unit Types
134
+ Edit the `unitTypes` object in `script.js` to adjust:
135
+ - Movement speed
136
+ - Attack power
137
+ - Attack range
138
+ - Unlock timing
139
+ - Visual icons
140
+
141
+ ### Adjusting Game Balance
142
+ Modify these variables in `script.js`:
143
+ - Initial unit counts
144
+ - Spawn rates
145
+ - Battle mechanics
146
+ - Time progression speed
147
+
148
+ ### Styling Changes
149
+ Update `style.css` to customize:
150
+ - Color schemes
151
+ - Unit appearance
152
+ - UI layout
153
+ - Animation effects
154
+
155
+ ## ๐Ÿ› Known Issues
156
+ - Map interactions are disabled to prevent interference with unit selection
157
+ - Performance may decrease with very large numbers of units
158
+ - Mobile responsiveness could be improved for smaller screens
159
+
160
+ ## ๐Ÿ”ฎ Future Enhancements
161
+ - Save/load game states
162
+ - Multiplayer functionality
163
+ - More detailed unit customization
164
+ - Advanced AI strategies
165
+ - Sound effects and music
166
+ - Mobile app version
167
+
168
+ ## ๐Ÿ“„ License
169
+ This project is open source and available under the MIT License.
170
+
171
+ ## ๐Ÿค Contributing
172
+ Contributions are welcome! Please feel free to submit pull requests or open issues for bugs and feature requests.
173
+
174
+ ## ๐Ÿ“ง Contact
175
+ For questions or feedback about this project, please open an issue in the repository.
176
+
177
+ ---
178
+
179
+ **Enjoy the battle!** ๐ŸŽ–๏ธ