Add TODO document for CS2.WTF rewrite

Reviewed-on: https://git.harting.dev/CSGOWTF/csgowtf/pulls/72

.browserslistrc

@@ -1,3 +0,0 @@
-> 1%
-last 2 versions
-not dead

.editorconfig

@@ -1,10 +0,0 @@
-root = true
-
-[*]
-end_of_line = lf
-insert_final_newline = true
-
-[*.{js,json,yml}]
-charset = utf-8
-indent_style = space
-indent_size = 2

.eslintrc.js

@@ -1,17 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  'extends': [
-    'plugin:vue/vue3-essential',
-    'eslint:recommended'
-  ],
-  parserOptions: {
-    parser: 'babel-eslint'
-  },
-  rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-  }
-}

.gitignore

@@ -1,286 +0,0 @@
-# Created by https://www.toptal.com/developers/gitignore/api/webstorm+all,yarn,windows,linux,node,vuejs
-# Edit at https://www.toptal.com/developers/gitignore?templates=webstorm+all,yarn,windows,linux,node,vuejs
-
-### Linux ###
-*~
-
-# temporary files which can be created if a process still has a handle open of a deleted file
-.fuse_hidden*
-
-# KDE directory preferences
-.directory
-
-# Linux trash folder which might appear on any partition or disk
-.Trash-*
-
-# .nfs files are created when an open file is removed but is still being accessed
-.nfs*
-
-### Node ###
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-lerna-debug.log*
-.pnpm-debug.log*
-
-# Diagnostic reports (https://nodejs.org/api/report.html)
-report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
-
-# Runtime data
-pids
-*.pid
-*.seed
-*.pid.lock
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-*.lcov
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (https://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
-node_modules/
-jspm_packages/
-
-# Snowpack dependency directory (https://snowpack.dev/)
-web_modules/
-
-# TypeScript cache
-*.tsbuildinfo
-
-# Optional npm cache directory
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Microbundle cache
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-
-# Optional REPL history
-.node_repl_history
-
-# Output of 'npm pack'
-*.tgz
-
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variables file
-.env
-.env.test
-.env.production
-
-# parcel-bundler cache (https://parceljs.org/)
-.cache
-.parcel-cache
-
-# Next.js build output
-.next
-out
-
-# Nuxt.js build / generate output
-.nuxt
-dist
-
-# Gatsby files
-.cache/
-# Comment in the public line in if your project uses Gatsby and not Next.js
-# https://nextjs.org/blog/next-9-1#public-directory-support
-# public
-
-# vuepress build output
-.vuepress/dist
-
-# Serverless directories
-.serverless/
-
-# FuseBox cache
-.fusebox/
-
-# DynamoDB Local files
-.dynamodb/
-
-# TernJS port file
-.tern-port
-
-# Stores VSCode versions used for testing VSCode extensions
-.vscode-test
-
-# yarn v2
-.yarn/cache
-.yarn/unplugged
-.yarn/build-state.yml
-.yarn/install-state.gz
-.pnp.*
-
-### Node Patch ###
-# Serverless Webpack directories
-.webpack/
-
-### Vuejs ###
-# Recommended template: Node.gitignore
-
-dist/
-npm-debug.log
-yarn-error.log
-
-### WebStorm+all ###
-# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio, WebStorm and Rider
-# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
-
-# User-specific stuff
-.idea/**/workspace.xml
-.idea/**/tasks.xml
-.idea/**/usage.statistics.xml
-.idea/**/dictionaries
-.idea/**/shelf
-
-# AWS User-specific
-.idea/**/aws.xml
-
-# Generated files
-.idea/**/contentModel.xml
-
-# Sensitive or high-churn files
-.idea/**/dataSources/
-.idea/**/dataSources.ids
-.idea/**/dataSources.local.xml
-.idea/**/sqlDataSources.xml
-.idea/**/dynamic.xml
-.idea/**/uiDesigner.xml
-.idea/**/dbnavigator.xml
-
-# Gradle
-.idea/**/gradle.xml
-.idea/**/libraries
-
-# Gradle and Maven with auto-import
-# When using Gradle or Maven with auto-import, you should exclude module files,
-# since they will be recreated, and may cause churn.  Uncomment if using
-# auto-import.
-# .idea/artifacts
-# .idea/compiler.xml
-# .idea/jarRepositories.xml
-# .idea/modules.xml
-# .idea/*.iml
-# .idea/modules
-# *.iml
-# *.ipr
-
-# CMake
-cmake-build-*/
-
-# Mongo Explorer plugin
-.idea/**/mongoSettings.xml
-
-# File-based project format
-*.iws
-
-# IntelliJ
-out/
-
-# mpeltonen/sbt-idea plugin
-.idea_modules/
-
-# JIRA plugin
-atlassian-ide-plugin.xml
-
-# Cursive Clojure plugin
-.idea/replstate.xml
-
-# Crashlytics plugin (for Android Studio and IntelliJ)
-com_crashlytics_export_strings.xml
-crashlytics.properties
-crashlytics-build.properties
-fabric.properties
-
-# Editor-based Rest Client
-.idea/httpRequests
-
-# Android studio 3.1+ serialized cache file
-.idea/caches/build_file_checksums.ser
-
-### WebStorm+all Patch ###
-# Ignores the whole .idea folder and all .iml files
-# See https://github.com/joeblau/gitignore.io/issues/186 and https://github.com/joeblau/gitignore.io/issues/360
-
-.idea/
-
-# Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-249601023
-
-*.iml
-modules.xml
-.idea/misc.xml
-*.ipr
-
-# Sonarlint plugin
-.idea/sonarlint
-
-### Windows ###
-# Windows thumbnail cache files
-Thumbs.db
-Thumbs.db:encryptable
-ehthumbs.db
-ehthumbs_vista.db
-
-# Dump file
-*.stackdump
-
-# Folder config file
-[Dd]esktop.ini
-
-# Recycle Bin used on file shares
-$RECYCLE.BIN/
-
-# Windows Installer files
-*.cab
-*.msi
-*.msix
-*.msm
-*.msp
-
-# Windows shortcuts
-*.lnk
-
-### yarn ###
-# https://yarnpkg.com/advanced/qa#which-files-should-be-gitignored
-
-.yarn/*
-!.yarn/releases
-!.yarn/plugins
-!.yarn/sdks
-!.yarn/versions
-
-# if you are NOT using Zero-installs, then:
-# comment the following lines
-#!.yarn/cache
-
-# and uncomment the following lines
-.pnp.*
-
-# End of https://www.toptal.com/developers/gitignore/api/webstorm+all,yarn,windows,linux,node,vuejs
-
-

.woodpecker.yml

@@ -0,0 +1,43 @@
+pipeline:
+  install dependencies:
+    image: node:19
+    commands:
+      - yarn install --immutable
+    pull: true
+
+  build:
+    image: node:19
+    commands:
+      - yarn build
+    secrets: [ vue_app_api_url, vue_app_track_url, vue_app_track_id, vue_app_tracking ]
+    pull: true
+
+  deploy:
+    image: cschlosser/drone-ftps
+    settings:
+      hostname:
+        from_secret: ftp_host
+      src_dir: "/dist/"
+      clean_dir: true
+    secrets: [ ftp_username, ftp_password ]
+    when:
+      branch: master
+      event: [ push, tag ]
+      status: success
+
+  deploy (dev):
+    image: cschlosser/drone-ftps
+    settings:
+      hostname:
+        from_secret: ftp_host
+      src_dir: "/dist/"
+      clean_dir: true
+    secrets:
+      - source: ftp_username_dev
+        target: ftp_username
+      - source: ftp_password_dev
+        target: ftp_password
+    when:
+      branch: dev
+      event: [push, tag]
+      status: success

.yarnrc.yml

@@ -1,7 +0,0 @@
-nodeLinker: node-modules
-
-plugins:
-  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
-    spec: "@yarnpkg/plugin-interactive-tools"
-
-yarnPath: .yarn/releases/yarn-3.0.2.cjs

Jenkinsfile

@@ -1,60 +0,0 @@
-pipeline {
-    agent any
-
-    environment {
-        FTP_HOST = credentials('csgowtf-deploy-host')
-        LFTP_PASSWORD = credentials('csgowtf-deploy-password')
-        API_HOST = credentials('csgowtf-api-host')
-        TRACK_HOST = credentials('csgowtf-track-host')
-        TRACK_ID = credentials('csgowtf-track-id')
-        TRACK_DOMAINS = credentials('csgowtf-track-domains')
-        TRACK = credentials('csgowtf-track')
-    }
-
-    stages {
-        stage('Prepare') {
-             steps {
-                writeFile file: '.env.production', text: 'VUE_APP_API_URL=$API_HOST\nVUE_APP_TRACK_URL=$TRACK_HOST\nVUE_APP_TRACK_ID=$TRACK_ID\nVUE_APP_TRACK_DOMAINS=$TRACK_DOMAINS\nVUE_APP_TRACKING=$TRACK'
-            }
-        }
-        stage('Install Dependencies') {
-            steps {
-                sh 'yarn install'
-           }
-        }
-        stage('Build') {
-            steps {
-                sh 'yarn build'
-                archiveArtifacts artifacts: '**/dist/**', excludes: '**/node_modules/**'
-            }
-        }
-        stage('Deploy') {
-            when {
-                branch 'master'
-                expression {
-                    currentBuild.result == null || currentBuild.result == 'SUCCESS'
-                }
-            }
-            environment {
-                FTP_USERNAME = credentials('csgowtf-deploy-user')
-            }
-            steps {
-                sh 'lftp -u $FTP_USERNAME --env-password -e \'mirror --reverse --verbose --delete --recursion=always dist/ /\' $FTP_HOST'
-            }
-        }
-        stage('Deploy Dev') {
-            when {
-                branch 'dev'
-                expression {
-                    currentBuild.result == null || currentBuild.result == 'SUCCESS'
-                }
-            }
-            environment {
-                FTP_USERNAME = credentials('csgowtf-deploy-user-dev')
-            }
-            steps {
-                sh 'lftp -u $FTP_USERNAME --env-password -e \'mirror --reverse --verbose --delete --recursion=always dist/ /\' $FTP_HOST'
-            }
-        }
-    }
-}

README.md

@@ -1,7 +1,17 @@
 # CSGOW.TF
-[![](https://img.shields.io/badge/license-GPL3-blue)](https://git.harting.dev/CSGOWTF/csgowtf/src/branch/master/LICENSE) [![](https://img.shields.io/liberapay/patrons/CSGOWTF.svg?logo=liberapay)](https://liberapay.com/CSGOWTF/)
 
-Statistics for CS:GO matchmaking matches.
+[![Vue3](https://img.shields.io/badge/created%20with-Vue3-%2342b883?style=flat-square)](https://vuejs.org/)
+[![Go](https://img.shields.io/badge/created%20with-Go-%2379d4fd?style=flat-square)](https://go.dev/)
+[![GPL3](https://img.shields.io/badge/licence-GPL3-%23007ec6?style=flat-square)](https://git.harting.dev/CSGOWTF/csgowtf/src/branch/master/LICENSE)
+[![Liberapay](https://img.shields.io/badge/donate%20on-LiberaPay-%23f6c915?style=flat-square)](https://liberapay.com/CSGOWTF/)
+[![Liberapay patrons](https://img.shields.io/liberapay/patrons/csgowtf?style=flat-square)](https://liberapay.com/CSGOWTF/)
+[![Website](https://img.shields.io/website?down_message=down&label=csgow.tf&style=flat-square&up_message=up&url=https%3A%2F%2Fcsgow.tf)](https://csgow.tf/)
+<!--[![Typescript](https://img.shields.io/badge/created%20with-typescript-%233178c6?style=flat-square)](https://www.typescriptlang.org/)-->
+[![status-badge](https://ci.somegit.dev/api/badges/CSGOWTF/csgowtf/status.svg?branch=master)](https://ci.somegit.dev/CSGOWTF/csgowtf)
+
+### Statistics for CS:GO matchmaking matches.
+
+---
 
 ## Backend
 This is the frontend to the [csgowtfd](https://git.harting.dev/CSGOWTF/csgowtfd) backend. 

TODO.md

@@ -0,0 +1,93 @@
+# CS2.WTF Rewrite TODO
+
+## Phase 0 – Kickoff & Research
+- [ ] Create and push the `cs2-port` branch from the current default branch.
+- [ ] Capture the legacy stack (Vue 3 SPA + Go backend) and existing route map (`/`, `/matches`, `/player/[id]`, `/match/[id]/{economy|details|flashes|damage|chat}`) for reference.
+- [ ] Host workshops with stakeholders, shoutcasters, and data consumers to gather CS2-specific requirements (new stats, volumetric smokes, MR12 changes).
+- [ ] Audit the `csgowtfd` backend APIs and data models; decide whether to extend or replace services for CS2 telemetry.
+- [ ] Document CS2 demo parsing pipeline expectations, storage strategy, and data freshness SLAs.
+
+## Phase 1 – Technical Foundations
+- [ ] Standardize on Node.js ≥ 18 (add `.nvmrc` / `.tool-versions`) and npm or yarn (lock the choice in documentation).
+- [ ] Scaffold a new SvelteKit project with TypeScript in strict mode and commit the baseline to `cs2-port`.
+- [ ] Integrate Tailwind CSS with DaisyUI; configure theme tokens, base styles, and dark/light mode support.
+- [ ] Add project tooling: ESLint (with Svelte + TypeScript rules), Prettier, `svelte-check`, Stylelint (for Tailwind), and git hooks via Husky + lint-staged.
+- [ ] Configure Vitest for unit/component tests and Playwright for E2E smoke tests (headless + CI modes).
+- [ ] Set up Vite aliases, environment variable handling, and TypeScript path mappings for domain-driven organization.
+- [ ] Update Woodpecker (or preferred CI) pipelines to run install, lint, type-check, test, and build jobs on every push.
+
+## Phase 2 – Design System & UX Direction
+- [ ] Produce a Figma (or Penpot) design system: typography scale, spacing, color ramps, iconography inspired by modern Counter-Strike 2 visuals.
+- [ ] Define DaisyUI themes aligned with CS2 branding, including semantic color tokens for teams, utility types, and economy states.
+- [ ] Establish responsive layout grids (mobile-first up to ultrawide) and interaction patterns (hover, focus, press states).
+- [ ] Design core components: global navigation, search, tabs, data tables, filters, cards, charts, modals, toasts, and timeline elements.
+- [ ] Create motion guidelines (micro-interactions, transitions) that reinforce hierarchy without compromising performance.
+- [ ] Run accessibility review on mockups (contrast, color blindness variants, keyboard flows).
+
+## Phase 3 – Domain Modeling & Data Layer
+- [ ] Define TypeScript interfaces and Zod schemas for CS2 entities: matches, rounds, players, utility events, economy states, chat logs, and metadata.
+- [ ] Decide on data access strategy (REST, GraphQL, WebSocket) and outline API contracts with backend engineers.
+- [ ] Build a typed API client module with error boundaries, retry/backoff, caching, and cancellation support.
+- [ ] Prepare mocked fixtures and MSW handlers for offline development and automated tests.
+- [ ] Explore real-time update requirements (live match polling or push) and capture API changes needed on the backend.
+
+## Phase 4 – Application Architecture & Routing
+- [ ] Plan a route hierarchy using SvelteKit layouts (`src/routes/+layout.svelte`, `routes/matches/+page.svelte`, nested `routes/match/[id]/+page.svelte`, etc.).
+- [ ] Implement the global shell: header, footer, persistent search, language switcher, theme toggle, and notification area.
+- [ ] Configure `load` functions, universal load guards, and error/skeleton states per route for resilient UX.
+- [ ] Introduce cross-route state management (Svelte stores) for filters, user preferences, and shared data caches.
+- [ ] Establish analytics and consent handling architecture compatible with SSR.
+
+## Phase 5 – Feature Delivery (Parity + Enhancements)
+- [ ] Home/Dashboard: featured matches, live queue, top performers, and quick filters with real-time indicators.
+- [ ] Matches Index: searchable, filterable list with virtualized tables, map/side filters, rank tiers, and date range pickers.
+- [ ] Player Profile (`/player/[id]`): career summary, map win rates, weapon performance, clutch stats, and timeline cards.
+- [ ] Match Overview (`/match/[id]`): scoreboard, round-by-round timeline, win probability graph, and MR12 adjustments.
+- [ ] Economy View: spend/equipment charts, save rounds, utility purchases, and loss-bonus visualization.
+- [ ] Utility/Flashes View: breakdown of utility effectiveness, pop flash timings, volumetric smoke coverage (heatmap/webgl overlays).
+- [ ] Damage View: per-round damage charts, headshot percentages, spatial heatmaps using Canvas/WebGL.
+- [ ] Chat View: chronological chat feed with role badges, highlight detection, and translation toggle.
+- [ ] Introduce CS2-exclusive insights (sky smoke bloom, loadout value changes, new grenade types) and align labels accordingly.
+- [ ] Add sharing/export features (downloadable stats, social cards) respecting privacy constraints.
+
+## Phase 6 – Localization & Personalization
+- [ ] Integrate `sveltekit-i18n` (or equivalent) for multi-language support, starting with English plus priority locales.
+- [ ] Externalize all copy into translation files, including validation messages and chart labels.
+- [ ] Persist language preference (cookie/localStorage) and sync with SSR.
+- [ ] Localize formatting (dates, currency, ranks) using `Intl` APIs and server-aware utilities.
+- [ ] Provide user preference storage for theme, metric units, and favorite players/teams.
+
+## Phase 7 – Performance, Accessibility & Observability
+- [ ] Define and enforce performance budgets (LCP ≤ 2.5s, CLS ≤ 0.1, TTI ≤ 4s) with automated Lighthouse checks.
+- [ ] Optimize assets: code splitting, prefetching strategies, image/CDN pipeline, and font loading.
+- [ ] Implement progressive enhancement for charts/tables and graceful degradation when JS is disabled.
+- [ ] Add runtime error monitoring (e.g., Sentry), structured logging, and privacy-aware analytics.
+- [ ] Conduct comprehensive accessibility audits with axe, manual keyboard testing, and screen reader passes.
+
+## Phase 8 – Testing & Quality Assurance
+- [ ] Write unit tests for components, stores, and utilities (Vitest + Testing Library).
+- [ ] Develop integration/E2E scenarios (Playwright) covering match search, player view, and match detail tabs.
+- [ ] Set up visual regression snapshots for critical pages via Playwright or Loki.
+- [ ] Build load-testing scripts for APIs powering live dashboards (k6 or artillery).
+- [ ] Coordinate QA playbook: test matrices, release checklists, and bug triage workflow.
+
+## Phase 9 – Deployment & Release Strategy
+- [ ] Choose hosting strategy (Node SSR on Fly.io/Vercel/Render or self-hosted) and provision staging/production environments.
+- [ ] Configure CI/CD deployment pipelines with environment promotion gates and feature flag toggles.
+- [ ] Establish secrets management (e.g., Doppler, Vault, SSM) for API keys and telemetry tokens.
+- [ ] Plan data migration/backfill from CS:GO to CS2, including schema evolution and archive policies.
+- [ ] Organize beta program, feedback channels, and phased rollout (legacy vs CS2 opt-in).
+
+## Phase 10 – Documentation & Handover
+- [ ] Update `README.md` with setup, development, testing, and deployment instructions for CS2.WTF.
+- [ ] Create architecture decision records (ADRs) for key choices (SvelteKit adoption, data strategy, hosting).
+- [ ] Document API contracts, rate limits, and error semantics in an accessible format (OpenAPI + human-readable docs).
+- [ ] Prepare contributor guidelines, coding standards, and project board workflow.
+- [ ] Schedule knowledge transfer sessions and record walkthrough videos for onboarding.
+
+## Stretch Goals
+- [ ] Add authenticated user features: saved searches, match alerts, personalized dashboards.
+- [ ] Offer real-time live match viewer with timeline scrubbing and auto-updating stats.
+- [ ] Deliver PWA enhancements (offline read-only cache, push notifications when favorites go live).
+- [ ] Explore integrations with tournament APIs (Valve, HLTV, FACEIT) to enrich match context.
+

babel.config.js

@@ -1,5 +0,0 @@
-module.exports = {
-  presets: [
-    '@vue/cli-plugin-babel/preset'
-  ]
-}

package.json

@@ -1,43 +0,0 @@
-{
-  "name": "csgowtf",
-  "version": "1.0.6",
-  "private": true,
-  "scripts": {
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build --mode production",
-    "lint": "vue-cli-service lint"
-  },
-  "dependencies": {
-    "@popperjs/core": "^2.11.2",
-    "axios": "^0.25.0",
-    "bootstrap": "^5.1.3",
-    "core-js": "^3.21.0",
-    "dotenv-webpack": "^7.1.0",
-    "echarts": "^5.3.0",
-    "fork-awesome": "^1.2.0",
-    "http-status-codes": "^2.2.0",
-    "iso-639-1": "^2.1.13",
-    "jquery": "^3.6.0",
-    "luxon": "^2.3.0",
-    "string-sanitizer": "^2.0.2",
-    "vue": "^3.2.30",
-    "vue-matomo": "^4.1.0",
-    "vue-router": "^4.0.12",
-    "vue3-cookies": "^1.0.6",
-    "vuex": "^4.0.2"
-  },
-  "devDependencies": {
-    "@vue/cli-plugin-babel": "~4.5.15",
-    "@vue/cli-plugin-eslint": "~4.5.15",
-    "@vue/cli-plugin-router": "~4.5.15",
-    "@vue/cli-plugin-vuex": "~4.5.15",
-    "@vue/cli-service": "~4.5.15",
-    "@vue/compiler-sfc": "^3.2.30",
-    "babel-eslint": "^10.1.0",
-    "eslint": "^6.8.0",
-    "eslint-plugin-vue": "^7.20.0",
-    "sass": "^1.49.7",
-    "sass-loader": "^10.2.1"
-  },
-  "packageManager": "yarn@3.0.2"
-}