Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 37 additions & 0 deletions Projects/Chrono Sweeper/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
# Chrono-Sweeper Dashboard // Proximity Vector Analytics

Chrono-Sweeper Dashboard is an advanced, cyberpunk strategic puzzle system built to fulfill the algorithmic tracking constraints outlined in tracking item **Issue #173**. Combining classic matrix sweeps with a cascading action timer interval, the system challenges players to calculate grid safety pathways rapidly while avoiding automated grid explosions. Built entirely client-side using pure vanilla technologies.

---

## Technical Capabilities & Core Specifications

### 1. Cyberpunk Scaffolding & Theme Geometry (`style.css`)

- **Strict Resolution Bound Constraint:** Wraps all operational components within an anti-shiver panel wrapper (`max-width: 1200px`, `height: 760px`) to prevent visual shifting across varying client monitors.
- **Jitter-Proof Monospaced Typography:** Interval countdown tickers, cell numeric vectors, score counts, and threat density indicators use explicit monospaced font declarations (`ui-monospace`, `Consolas`), ensuring numerical mutations cause zero layout distortion.
- **Interactive Component Visual Modifiers:**
- `.cell.unrevealed`: High-tech dark elevated panels featuring crisp tactile `:hover` background lighting overrides.
- `.cell.flagged`: Injects a distinctive amber/crimson indicator block utilizing custom secondary mouse click interceptions.
- `.cell.revealed-zero`: Triggers a muted, flat backing style mapping completely safe zones discovered via recursive passes.
- `.matrix-grid.exploding`: Fires a violent viewport shake and full-grid distortion animation filter (`@keyframes matrix-shatter`) upon deadline breach or threat impact.

### 2. Recursive Graph & Interval Engines (`script.js`)

- **Multi-Dimensional Threat Core Mapping:** Models the logic grid internally using a 2-D array architecture. Upon initialization, the engine scatters discrete hazard markers, then performs an immediate vector scanning loop across all neighboring cells to pre-calculate proximity vector indices.
- **Recursive Flood-Fill Clearance Algorithm:** Clicking a cell containing a zero-proximity signature triggers a high-performance recursive graph traversal routine. The call stack automatically branches outwards in all 8 cardinal and diagonal direction tracks (`row + i`, `col + j`), instantly unmasking contiguous safe regions until encountering nonzero analytical borders.
- **Chrono-Interval Action Ticking Loop:** Implements an unyielding countdown clock timer thread utilizing strict client-side tracking. Users are granted a specific, micro-window interval per step; failing to commit an authentic reveal or flag transaction before the countdown matches `0ms` triggers an instant full-board cascade detonation.
- **Advanced Mouse Event Interceptors:** Disables browser default layout context menus on the canvas playground, binding custom right-click actions seamlessly to handle vector flag allocations without leaking mouse capture scopes.

---

## Workspace Directory Layout

```text
Chrono-Sweeper Dashboard/
├── index.html # Structural Semantic Dashboard Framing and Matrix Cells
├── style.css # Cyberpunk Aesthetic Color Tokens, Shaders, and Shatter Animations
├── script.js # Recursive Flood-Fill Pathing and Chrono-Interval Control Engine
├── project.json # Architecture Manifest Descriptor Metadata
└── README.md # Technical Engineering Specifications Documentation
```
59 changes: 59 additions & 0 deletions Projects/Chrono Sweeper/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Chrono-Sweeper — Proximity Vector Analytics</title>
<link rel="stylesheet" href="style.css">
</head>
<body>

<div id="app">
<header id="header">
<div id="brand">
<span class="brand-icon">&#x26A1;</span>
<span class="brand-text">CHRONO-SWEEPER</span>
<span class="brand-sub">v2.4.2</span>
</div>
<div id="timer-section">
<div id="timer-bar-container">
<div id="timer-bar"></div>
<span id="timer-text">5.0s</span>
</div>
</div>
</header>

<main id="main">
<section id="grid-section">
<div id="grid-container"></div>
</section>

<aside id="sidebar">
<div id="stats">
<div class="stat-block">
<span class="stat-label">SAFE REMAINING</span>
<span class="stat-value" id="safe-count">88</span>
</div>
<div class="stat-block">
<span class="stat-label">FLAGS PLACED</span>
<span class="stat-value" id="flag-count">0 / 15</span>
</div>
<div class="stat-block" id="status-block">
<span class="stat-label">STATUS</span>
<span class="stat-value" id="status-text">SYSTEM STABLE</span>
</div>
</div>

<div id="log-panel">
<div class="log-header">&#x25B6; LIVE LOG</div>
<div id="log-entries"></div>
</div>

<button id="restart-btn">&#x21BB; RESTART TERMINAL</button>
</aside>
</main>
</div>

<script src="script.js"></script>
</body>
</html>
14 changes: 14 additions & 0 deletions Projects/Chrono Sweeper/project.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"title": "Chrono Sweeper",
"description": "A high-end cyberpunk redesign of the classic minefield sweeper puzzle optimized around high-frequency recursive graph traversals and real-time proximity vector analytics. Running cleanly inside isolated client-side browser layers, the platform instantiates a hidden data array matrix tracking threat coordinate vectors. Selecting cells recalculates proximity counts dynamically, while a strict ticking countdown interval mandates action steps—triggering an automated board explosion canvas animation sequence upon clock expiration or threat intersection.",
"entry": "index.html",
"tags": [
"HTML",
"CSS",
"JavaScript"
],
"author": {
"name": "Shruti Narsulwar",
"github": "shrutiii01"
}
}
Loading
Loading