diff --git a/.github/assets/3d-architecture-collage.png b/.github/assets/3d-architecture-collage.png new file mode 100644 index 0000000..9cb8254 Binary files /dev/null and b/.github/assets/3d-architecture-collage.png differ diff --git a/.github/assets/all-demos-collage.png b/.github/assets/all-demos-collage.png new file mode 100644 index 0000000..105254d Binary files /dev/null and b/.github/assets/all-demos-collage.png differ diff --git a/.github/assets/collage-template.html b/.github/assets/collage-template.html new file mode 100644 index 0000000..db1b630 --- /dev/null +++ b/.github/assets/collage-template.html @@ -0,0 +1,350 @@ + + + + + + Screenshot Collage Creator + + + +
+

๐Ÿ–ผ๏ธ Mapbox Demo Screenshot Collages

+ +
+

๐Ÿ“‹ Instructions

+
    +
  1. First, run the screenshot capture script: node capture-screenshots.js
  2. +
  3. Click on each placeholder below to upload the corresponding screenshot
  4. +
  5. Use the download buttons to save collages as PNG files
  6. +
  7. Upload the collages to your repository and update the README
  8. +
+
+ + +
+
๐ŸŒŸ Featured Maps & Styles
+ +
+ + +
+
๐ŸŒ Globe & Terrain Views
+
+
+ +
๐Ÿ”๏ธ 3D Terrain
+
Elevation and mountains
+
+
+ +
๐Ÿ”ด Mars Surface
+
Red planet exploration
+
+
+ +
๐ŸŒ Globe with Ozone
+
Atmospheric visualization
+
+
+ +
๐Ÿช Globe Mars
+
Mars globe projection
+
+
+
+ + +
+
๐ŸŽฎ Games & Interactive Experiences
+
+
+ +
๐Ÿš Helicopter Game
+
3D flight controls
+
+
+ +
๐ŸŒ‰ Golden Gate Bridge
+
Iconic bridge visualization
+
+
+ +
๐Ÿ‰ Dragon Flight
+
Animated dragon over SF
+
+
+
+ + +
+
๐Ÿš— Vehicle Simulations
+
+
+ +
๐ŸŽ๏ธ 3D Cars
+
Interactive car models
+
+
+ +
๐ŸฆŒ 3D Bucks
+
Animated wildlife models
+
+
+ +
๐Ÿš€ SpaceX Launch
+
Rocket launch simulation
+
+
+
+ + +
+
๐ŸŒŠ Historical Events & Disasters
+
+
+ +
๐Ÿšข Suez Canal Ship
+
Ever Given container ship
+
+
+ +
๐Ÿš€ Ship Rescue
+
Rescue operation with rocket
+
+
+ +
๐ŸŒŠ Uttarakhand Flood
+
Satellite flood damage imagery
+
+
+
+ +
+

๐Ÿ’พ Download Collages

+ + + + + +
+
+ + '); + } + } + + + + + + \ No newline at end of file diff --git a/.github/assets/featured-maps-collage.png b/.github/assets/featured-maps-collage.png new file mode 100644 index 0000000..27537bd Binary files /dev/null and b/.github/assets/featured-maps-collage.png differ diff --git a/.github/assets/games-interactive-collage.png b/.github/assets/games-interactive-collage.png new file mode 100644 index 0000000..e1ae7c1 Binary files /dev/null and b/.github/assets/games-interactive-collage.png differ diff --git a/.github/assets/globe-terrain-collage.png b/.github/assets/globe-terrain-collage.png new file mode 100644 index 0000000..627fdd0 Binary files /dev/null and b/.github/assets/globe-terrain-collage.png differ diff --git a/.github/assets/screenshots/3d-buildings.png b/.github/assets/screenshots/3d-buildings.png new file mode 100644 index 0000000..b698d81 Binary files /dev/null and b/.github/assets/screenshots/3d-buildings.png differ diff --git a/.github/assets/screenshots/3d-cars.png b/.github/assets/screenshots/3d-cars.png new file mode 100644 index 0000000..da077f5 Binary files /dev/null and b/.github/assets/screenshots/3d-cars.png differ diff --git a/.github/assets/screenshots/3d-terrain.png b/.github/assets/screenshots/3d-terrain.png new file mode 100644 index 0000000..c4a285f Binary files /dev/null and b/.github/assets/screenshots/3d-terrain.png differ diff --git a/.github/assets/screenshots/dragon-flight.png b/.github/assets/screenshots/dragon-flight.png new file mode 100644 index 0000000..0bb154e Binary files /dev/null and b/.github/assets/screenshots/dragon-flight.png differ diff --git a/.github/assets/screenshots/globe-mars.png b/.github/assets/screenshots/globe-mars.png new file mode 100644 index 0000000..d298a2e Binary files /dev/null and b/.github/assets/screenshots/globe-mars.png differ diff --git a/.github/assets/screenshots/globe-ozone.png b/.github/assets/screenshots/globe-ozone.png new file mode 100644 index 0000000..6a7fbf8 Binary files /dev/null and b/.github/assets/screenshots/globe-ozone.png differ diff --git a/.github/assets/screenshots/golden-gate.png b/.github/assets/screenshots/golden-gate.png new file mode 100644 index 0000000..3009628 Binary files /dev/null and b/.github/assets/screenshots/golden-gate.png differ diff --git a/.github/assets/screenshots/helicopter-game.png b/.github/assets/screenshots/helicopter-game.png new file mode 100644 index 0000000..b4f5068 Binary files /dev/null and b/.github/assets/screenshots/helicopter-game.png differ diff --git a/.github/assets/screenshots/mapbox-satellite.png b/.github/assets/screenshots/mapbox-satellite.png new file mode 100644 index 0000000..a252b36 Binary files /dev/null and b/.github/assets/screenshots/mapbox-satellite.png differ diff --git a/.github/assets/screenshots/mapbox-standard.png b/.github/assets/screenshots/mapbox-standard.png new file mode 100644 index 0000000..eaf0f8a Binary files /dev/null and b/.github/assets/screenshots/mapbox-standard.png differ diff --git a/.github/assets/screenshots/mapbox-streets.png b/.github/assets/screenshots/mapbox-streets.png new file mode 100644 index 0000000..63ec12d Binary files /dev/null and b/.github/assets/screenshots/mapbox-streets.png differ diff --git a/.github/assets/screenshots/mars.png b/.github/assets/screenshots/mars.png new file mode 100644 index 0000000..18822f7 Binary files /dev/null and b/.github/assets/screenshots/mars.png differ diff --git a/.github/assets/vehicle-simulations-collage.png b/.github/assets/vehicle-simulations-collage.png new file mode 100644 index 0000000..1891ccf Binary files /dev/null and b/.github/assets/vehicle-simulations-collage.png differ diff --git a/.github/workflows/test-pages.yml b/.github/workflows/test-pages.yml new file mode 100644 index 0000000..d6e24c5 --- /dev/null +++ b/.github/workflows/test-pages.yml @@ -0,0 +1,199 @@ +name: Test Mapbox Pages + +on: + push: + branches: [ gh-pages, pratik/claude-code-test ] + pull_request: + branches: [ gh-pages ] + +jobs: + test-pages: + runs-on: ubuntu-latest + + steps: + - name: Checkout code + uses: actions/checkout@v4 + + - name: Setup Node.js + uses: actions/setup-node@v4 + with: + node-version: '18' + + - name: Install dependencies + run: | + npm install -g http-server + npm init -y + npm install puppeteer + + - name: Create test script + run: | + cat > test-pages.js << 'EOF' + const puppeteer = require('puppeteer'); + const fs = require('fs'); + const path = require('path'); + + async function testPage(browser, pagePath, baseUrl) { + const page = await browser.newPage(); + + // Set up console logging to catch errors + const logs = []; + page.on('console', msg => { + if (msg.type() === 'error') { + logs.push(`Console Error: ${msg.text()}`); + } + }); + + page.on('pageerror', error => { + logs.push(`Page Error: ${error.message}`); + }); + + try { + console.log(`Testing: ${pagePath}`); + + // Navigate to page with more relaxed settings + const response = await page.goto(`${baseUrl}/${pagePath}`, { + waitUntil: 'domcontentloaded', + timeout: 45000 + }); + + // Check if page loaded successfully + if (!response.ok()) { + throw new Error(`HTTP ${response.status()}: ${response.statusText()}`); + } + + // Wait for basic DOM to be ready + await new Promise(resolve => setTimeout(resolve, 2000)); + + // Check if page contains mapbox reference + const hasMapbox = await page.evaluate(() => { + return document.body.innerHTML.includes('mapbox-gl') || + document.body.innerHTML.includes('mapboxgl') || + typeof window.mapboxgl !== 'undefined'; + }); + + if (hasMapbox) { + // Try to wait for Mapbox to load, but don't fail if it doesn't + try { + await page.waitForFunction(() => { + return typeof window.mapboxgl !== 'undefined'; + }, { timeout: 5000 }); + + // Wait a bit more for map to start initializing + await new Promise(resolve => setTimeout(resolve, 3000)); + } catch (e) { + // Mapbox might not be fully loaded, but that's ok for basic testing + logs.push(`Mapbox loading timeout (non-critical): ${e.message}`); + } + } + + // Check for critical JavaScript errors only + const criticalErrors = logs.filter(log => + log.includes('SyntaxError') || + log.includes('ReferenceError') || + log.includes('TypeError') && !log.includes('mapbox') + ); + + if (criticalErrors.length > 0) { + console.warn(`โš ๏ธ Critical errors in ${pagePath}:`); + criticalErrors.forEach(log => console.warn(` ${log}`)); + } + + console.log(`โœ… ${pagePath} - OK`); + return { success: true, path: pagePath, errors: logs }; + + } catch (error) { + console.error(`โŒ ${pagePath} - FAILED: ${error.message}`); + return { success: false, path: pagePath, error: error.message, errors: logs }; + } finally { + await page.close(); + } + } + + async function findHtmlPages() { + const pages = []; + + function scanDirectory(dir, basePath = '') { + const items = fs.readdirSync(dir); + + for (const item of items) { + const fullPath = path.join(dir, item); + const relativePath = basePath ? `${basePath}/${item}` : item; + + if (fs.statSync(fullPath).isDirectory()) { + // Skip hidden directories and node_modules + if (!item.startsWith('.') && item !== 'node_modules') { + scanDirectory(fullPath, relativePath); + } + } else if (item === 'index.html') { + pages.push(basePath || '.'); + } + } + } + + scanDirectory('.'); + return pages.filter(page => page !== '.'); // Remove root if exists + } + + async function main() { + const browser = await puppeteer.launch({ + headless: 'new', + args: [ + '--no-sandbox', + '--disable-setuid-sandbox', + '--disable-dev-shm-usage', + '--disable-web-security', + '--disable-features=VizDisplayCompositor' + ] + }); + + const baseUrl = 'http://localhost:8080'; + const pages = await findHtmlPages(); + + console.log(`Found ${pages.length} pages to test:`); + pages.forEach(page => console.log(` - ${page}/index.html`)); + console.log(''); + + const results = []; + + for (const pagePath of pages) { + const result = await testPage(browser, `${pagePath}/index.html`, baseUrl); + results.push(result); + } + + await browser.close(); + + // Summary + const successful = results.filter(r => r.success).length; + const failed = results.filter(r => !r.success).length; + + console.log('\n๐Ÿ“Š Test Summary:'); + console.log(`โœ… Successful: ${successful}`); + console.log(`โŒ Failed: ${failed}`); + console.log(`๐Ÿ“„ Total: ${results.length}`); + + if (failed > 0) { + console.log('\nFailed pages:'); + results.filter(r => !r.success).forEach(r => { + console.log(` - ${r.path}: ${r.error}`); + }); + + // Don't fail the build for now, just report issues + console.log('\nโš ๏ธ Some pages had issues, but continuing...'); + } else { + console.log('\n๐ŸŽ‰ All pages loaded successfully!'); + } + } + + main().catch(console.error); + EOF + + - name: Start HTTP server + run: | + http-server . -p 8080 & + sleep 5 + + - name: Test pages + run: node test-pages.js + + - name: Stop HTTP server + run: pkill -f http-server || true \ No newline at end of file diff --git a/.gitignore b/.gitignore index e43b0f9..039a11a 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,160 @@ +# Node.js dependencies and build artifacts +node_modules/ +npm-debug.log* +yarn-debug.log* +yarn-error.log* +package-lock.json + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Coverage and test outputs +coverage/ +*.lcov +.nyc_output + +# Dependency directories +jspm_packages/ + +# Optional npm cache directory +.npm + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# Yarn Integrity file +.yarn-integrity + +# Environment variables +.env +.env.local +.env.development.local +.env.test.local +.env.production.local + +# Build outputs +.cache +.parcel-cache +.next +out +.nuxt +dist/ +build/ + +# Temporary folders +tmp/ +temp/ +screenshots-temp/ +capture-temp/ + +# Logs +logs +*.log + +# OS generated files .DS_Store +.DS_Store? +._* +.Spotlight-V100 +.Trashes +ehthumbs.db +Thumbs.db + +# IDE and editor files +.vscode/ +.idea/ +*.swp +*.swo +*~ + +# Sublime Text +*.sublime-project +*.sublime-workspace + +# VS Code (keep some settings) +.vscode/ +!.vscode/settings.json +!.vscode/tasks.json +!.vscode/launch.json +!.vscode/extensions.json + +# JetBrains IDEs +.idea/ +*.iml +*.ipr +*.iws + +# Cache directories +.cache/ +.eslintcache +.stylelintcache + +# Python (if any Python scripts are used) +__pycache__/ +*.py[cod] +*$py.class +*.so +.Python +env/ +venv/ +ENV/ +env.bak/ +venv.bak/ + +# Backup files +*.bak +*.backup +*.orig + +# Archive files +*.zip +*.tar.gz +*.rar + +# Database files +*.db +*.sqlite +*.sqlite3 + +# System files (macOS) +.fseventsd +.TemporaryItems +.VolumeIcon.icns +.com.apple.timemachine.donotpresent +.AppleDB +.AppleDesktop +Network Trash Folder +Temporary Items +.apdisk + +# Windows +desktop.ini +$RECYCLE.BIN/ +*.cab +*.msi +*.msix +*.msm +*.msp +*.lnk + +# Linux +*~ +.fuse_hidden* +.directory +.Trash-* +.nfs* + +# Keep important project assets +!.github/ +!.github/workflows/ +!.github/assets/ +!.github/assets/*.png +!.github/assets/screenshots/ +!LICENSE +!README.md diff --git a/3d-helicoptor-game/index.html b/3d-helicoptor-game/index.html index bb2bf54..658dcb2 100644 --- a/3d-helicoptor-game/index.html +++ b/3d-helicoptor-game/index.html @@ -5,8 +5,8 @@ Navigate the map with game-like controls - - + +