diff --git a/docs/README.md b/docs/README.md index bb876c9..95c7c3a 100644 --- a/docs/README.md +++ b/docs/README.md @@ -40,6 +40,12 @@ This directory contains comprehensive documentation for the Moko-Cassiopeia Joom * Joomla extension packaging * Multi-version testing +* **[Roadmap](ROADMAP.md)** - Version-specific roadmap + * Current features (v03.05.00) + * Feature evolution timeline + * Planned enhancements + * Development priorities + ### User Documentation For end-user documentation, installation instructions, and feature guides, see the main [README.md](../README.md) in the repository root. @@ -52,7 +58,8 @@ moko-cassiopeia/ │ ├── README.md # This file - documentation index │ ├── QUICK_START.md # Quick start guide for developers │ ├── WORKFLOW_GUIDE.md # Development workflow guide -│ └── JOOMLA_DEVELOPMENT.md # Joomla-specific development guide +│ ├── JOOMLA_DEVELOPMENT.md # Joomla-specific development guide +│ └── ROADMAP.md # Version-specific roadmap ├── src/ # Template source code │ ├── templates/ # Joomla template files │ └── media/ # Assets (CSS, JS, images) diff --git a/docs/ROADMAP.md b/docs/ROADMAP.md new file mode 100644 index 0000000..369e45c --- /dev/null +++ b/docs/ROADMAP.md @@ -0,0 +1,511 @@ + + +# Moko-Cassiopeia Roadmap (VERSION: 03.05.00) + +This document provides a comprehensive, version-specific roadmap for the Moko-Cassiopeia Joomla template, tracking feature evolution, current capabilities, and planned enhancements. + +## Table of Contents + +- [Version Timeline](#version-timeline) +- [Current Release (v03.05.00)](#current-release-v030500) +- [Implemented Features](#implemented-features) +- [Planned Features](#planned-features) +- [Development Priorities](#development-priorities) +- [Long-term Vision](#long-term-vision) +- [External Resources](#external-resources) + +--- + +## Version Timeline + +### v03.05.01 (2026-01-09) - Standards & Security +**Status**: Current Release + +**Added**: +- Dependency review workflow for vulnerability scanning +- Standards compliance workflow for MokoStandards validation +- Dependabot configuration for automated security updates +- Documentation index (`docs/README.md`) + +**Changed**: +- Removed custom CodeQL workflow (using GitHub's default setup) +- Enforced repository compliance with MokoStandards +- Improved security posture with automated scanning + +### v03.05.00 (2026-01-04) - Workflow & Governance +**Added**: +- `.github/workflows` directory structure +- CODE_OF_CONDUCT.md from MokoStandards +- CONTRIBUTING.md from MokoStandards + +**Changed**: +- TODO items to be split to separate file (tracked) + +### v03.01.00 (2025-12-16) - CI/CD Foundation +**Added**: +- Initial GitHub Actions workflows + +### v03.00.00 (2025-12-09) - Font Awesome 7 Upgrade +**Updated**: +- Copyright headers to MokoCodingDefaults standards +- Fixed color style injection in `index.php` +- Upgraded Font Awesome 6 to Font Awesome 7 Free +- Added Font Awesome 7 Free style fallback + +**Removed**: +- Deprecated CODE_OF_CONDUCT.md +- Deprecated CONTRIBUTING.md + +### v02.01.05 (2025-09-04) - CSS Refinement +**Fixed**: +- Removed vmbasic.css +- Repaired template.css and colors_standard.css + +### v02.00.00 (2025-08-30) - Dark Mode & TOC +**Major Features**: +- **Dark Mode Toggle System** + - Frontend toggle switch with localStorage persistence + - Admin-configurable default mode + - CSS rules for light/dark themes + - JavaScript-powered mode switching + +- **Enhanced Template Parameters** + - Logo parameter support + - GTM container ID configuration + - Dark mode defaults in settings + - Updated metadata and copyright headers + +- **Expanded Table of Contents** + - Automatic TOC injection + - User-selectable placement (`toc-left` or `toc-right`) + - Article options integration + +**Improvements**: +- Cleaned up `index.php` (removed duplicate skip-to-content calls) +- Consolidated JavaScript asset loading +- Streamlined CSS for toggle switch +- Accessibility refinements (typography, color contrast) +- Fixed missing logo parameter in header +- Corrected stylesheet inconsistencies +- Patched redundant script includes + +### v01.00.00 - Initial Public Release +**Core Features**: +- Font Awesome 6 integration +- Bootstrap 5 helpers and utilities +- Automatic Table of Contents (TOC) utility +- Moko Expansions: Google Tag Manager / GA4 hooks +- Built on Joomla's Cassiopeia template + +--- + +## Current Release (v03.05.00) + +### System Requirements +- **Joomla**: 4.4.x or 5.x +- **PHP**: 8.0+ +- **Database**: MySQL/MariaDB compatible + +### Architecture +- **Base Template**: Joomla Cassiopeia +- **Enhancement Layer**: Non-invasive overrides +- **Asset Management**: Joomla Web Asset Manager (WAM) +- **Frontend Framework**: Bootstrap 5 +- **Icon Library**: Font Awesome 7 Free + +--- + +## Implemented Features + +### 🎨 Theming & Visual Design + +#### Color Palette System +- **3 Built-in Palettes**: Standard, Alternative, Custom +- **Dual Mode Support**: Separate light and dark configurations +- **Custom Palettes**: User-definable via `colors_custom.css` +- **Location**: `src/media/css/colors/{light|dark}/` + +#### Dark Mode System +- **Toggle Controls**: Switch (Light↔Dark) or Radios (Light/Dark/System) +- **Default Mode**: Admin-configurable (system, light, or dark) +- **Persistence**: localStorage for user preferences +- **Auto-Detection**: Optional system preference detection +- **Meta Tags**: `color-scheme` and `theme-color` support +- **ARIA Bridge**: Bootstrap ARIA compatibility + +#### Typography +- **Font Schemes**: + - Local: Roboto + - Web (Google Fonts): Fira Sans, Roboto + Noto Sans +- **Admin-Configurable**: Template settings dropdown + +#### Branding +- **Logo Support**: Custom logo upload +- **Site Title**: Text-based branding option +- **Site Description**: Tagline/subtitle field +- **Font Awesome Kit**: Optional custom kit integration + +### 📐 Layout & Structure + +#### Module Positions (23 Total) +**Header Area**: +- topbar, below-topbar, below-logo, menu, search, banner + +**Content Area**: +- top-a, top-b, main-top, main-bottom, breadcrumbs +- sidebar-left, sidebar-right + +**Footer Area**: +- bottom-a, bottom-b, footer-menu, footer + +**Special**: +- debug, offline-header, offline, offline-footer +- drawer-left, drawer-right + +#### Layout Options +- **Container Type**: Fluid or Static +- **Sticky Header**: Optional fixed navigation +- **Back-to-Top Button**: Scrollable page support + +### 📝 Content Features + +#### Table of Contents (TOC) +- **Automatic Generation**: From article headings +- **Placement Options**: `toc-left` or `toc-right` layouts +- **Article Integration**: Via Options → Layout dropdown +- **Responsive**: Mobile-friendly sidebar placement + +#### Article Layouts +- **Default**: Standard Cassiopeia layout +- **TOC Variants**: Left-sidebar or right-sidebar TOC +- **Custom Overrides**: Located in `html/com_content/article/` + +### 📊 Analytics & Tracking + +#### Google Tag Manager (GTM) +- **Enable/Disable**: Admin toggle +- **Container ID**: Template parameter field +- **Implementation**: Head and body script injection +- **GDPR-Ready**: Configurable consent defaults + +#### Google Analytics 4 (GA4) +- **Enable/Disable**: Admin toggle +- **Property ID**: Template parameter field +- **Universal Analytics Fallback**: Legacy UA support +- **Privacy-First**: Conditional loading based on settings + +### 🎛️ Customization & Developer Tools + +#### Custom Code Injection +- **Head Start**: Custom HTML/JS before `` +- **Head End**: Custom HTML/JS at end of `` +- **Raw HTML**: Unfiltered code injection for advanced users + +#### Drawer System +- **Left/Right Drawers**: Offcanvas menu areas +- **Icon Customization**: Font Awesome icon selection +- **Default Icons**: + - Left: `fa-solid fa-chevron-right` + - Right: `fa-solid fa-chevron-left` + +#### Asset Management +- **Joomla WAM**: Complete asset registry in `joomla.asset.json` +- **Development/Production Modes**: Minified and unminified assets +- **Dependency Management**: Automatic script/style loading + +### 🏗️ Template Overrides + +#### Component Overrides +**Content (com_content)**: +- Article layouts (default, toc-left, toc-right) +- Category layouts (blog, list) +- Featured articles + +**Contact (com_contact)**: +- Contact form layouts + +**Engage (com_engage)**: +- Comment system integration + +#### Module Overrides +**Menu (mod_menu)**: +- Metis dropdown menu +- Offcanvas navigation + +**VirtueMart**: +- Product display (`mod_virtuemart_product`) +- Shopping cart (`mod_virtuemart_cart`) +- Manufacturer display (`mod_virtuemart_manufacturer`) +- Category display (`mod_virtuemart_category`) +- Currency selector (`mod_virtuemart_currencies`) + +**Other Modules**: +- Custom HTML (`mod_custom`) +- GABble social integration (`mod_gabble`) + +**Membership System (OS Membership)**: +- Plan layouts (default, pricing tables) +- Member management interfaces + +### 🔧 Configuration Parameters + +#### Theme Tab +**General**: +- `theme_enabled` - Enable/disable theme system +- `theme_control_type` - Toggle UI type (switch/radios/none) +- `theme_default_choice` - Default mode (system/light/dark) +- `theme_auto_dark` - Auto-detect system preference +- `theme_meta_color_scheme` - Inject `color-scheme` meta tag +- `theme_meta_theme_color` - Inject `theme-color` meta tag +- `theme_bridge_bs_aria` - Bootstrap ARIA compatibility + +**Variables & Palettes**: +- `colorLightName` - Light mode color scheme +- `colorDarkName` - Dark mode color scheme + +**Typography**: +- `useFontScheme` - Font selection (local/web) + +**Branding & Icons**: +- `brand` - Show/hide branding +- `logoFile` - Logo upload path +- `siteTitle` - Site title text +- `siteDescription` - Site tagline +- `fA6KitCode` - Font Awesome kit code + +**Header & Navigation**: +- `stickyHeader` - Fixed navigation +- `backTop` - Back-to-top button + +**Toggle UI**: +- `theme_fab_enabled` - Floating action button for theme toggle +- `theme_fab_pos` - FAB position (br/bl/tr/tl) + +#### Google Tab +- `googletagmanager` - Enable GTM +- `googletagmanagerid` - GTM container ID +- `googleanalytics` - Enable GA4 +- `googleanalyticsid` - GA4 property ID + +#### Custom Code Tab +- `custom_head_start` - Custom code at head start +- `custom_head_end` - Custom code at head end + +#### Drawers Tab +- `drawerLeftIcon` - Left drawer icon (Font Awesome class) +- `drawerRightIcon` - Right drawer icon (Font Awesome class) + +#### Advanced Tab +- `fluidContainer` - Container layout (static/fluid) + +### 🛠️ Development Tools + +#### Quality Assurance +- **Codeception**: Automated testing framework +- **PHPStan**: Static analysis (level 8+) +- **PHPCS**: Code style validation (PSR-12) +- **PHPCompatibility**: PHP 8.0+ compatibility checks + +#### CI/CD Workflows +- **Dependency Review**: Vulnerability scanning +- **Standards Compliance**: MokoStandards validation +- **CodeQL**: Security analysis (GitHub default) +- **Dependabot**: Automated dependency updates + +#### Documentation +- **Quick Start**: 5-minute developer setup +- **Workflow Guide**: Git strategy, branching, releases +- **Joomla Development**: Testing, packaging, multi-version support + +--- + +## Planned Features + +### 🚧 In Development + +#### Soft Offline Mode (v2.1.5 - Mentioned) +**Status**: Planned/In Development +**Description**: Keep selected categories accessible during maintenance mode +**Use Cases**: +- Legal documents remain viewable during downtime +- Policy pages accessible for compliance +- Terms of service always available +**Configuration**: +- Admin-selectable categories +- Per-category offline access control + +#### TODO Tracking System +**Status**: Mentioned in CHANGELOG (v03.05.00) +**Description**: Separate TODO tracking file +**Purpose**: Centralized issue and feature tracking outside changelog + +### 🔮 Future Enhancements + +#### Development Mode (Commented Out) +**Status**: Code exists but disabled +**Location**: `templateDetails.xml` line 91 +**Description**: Comprehensive development mode toggle +**Potential Features**: +- Unminified asset loading +- Debug output +- Performance profiling +- Template cache bypass + +#### Potential Features (Community Requested) +*Note: These are conceptual and not yet officially planned* + +**Enhanced Accessibility**: +- WCAG 2.1 AAA compliance mode +- High-contrast themes +- Screen reader optimizations +- Keyboard navigation improvements + +**Performance Optimizations**: +- Critical CSS inlining +- Lazy loading for below-the-fold content +- WebP image support with fallbacks +- Service worker for offline functionality + +**Additional Integrations**: +- More e-commerce platform support +- Newsletter integration (Mailchimp, Sendinblue) +- Social media feed aggregation +- Advanced SEO tools + +**Content Builder**: +- Visual page builder integration +- Drag-and-drop layout editor +- Preset layout templates +- Style presets library + +--- + +## Development Priorities + +### High Priority (Next Release) +1. **TODO Tracking System**: Implement separate file for issue tracking +2. **Soft Offline Mode**: Complete category-based offline access +3. **Security Updates**: Maintain Dependabot and CodeQL scans +4. **Documentation**: Keep docs synchronized with features + +### Medium Priority (Future Releases) +1. **Development Mode**: Enable and enhance developer experience +2. **Performance**: Optimize asset loading and rendering +3. **Accessibility**: WCAG 2.1 compliance improvements +4. **Testing**: Expand Codeception test coverage + +### Low Priority (Long-term) +1. **Visual Builder**: Integrate page builder functionality +2. **Advanced SEO**: Schema markup and meta optimization +3. **Multi-language**: Enhanced RTL and translation support +4. **Theme Marketplace**: Community-contributed color schemes + +--- + +## Long-term Vision + +### Mission Statement +Moko-Cassiopeia aims to be the **most developer-friendly, user-customizable, and standards-compliant Joomla template** while maintaining minimal core overrides for maximum upgrade compatibility. + +### Core Principles +1. **Non-Invasive**: Minimal Cassiopeia overrides +2. **Standards-First**: MokoStandards compliance +3. **Accessibility**: WCAG 2.1 compliance +4. **Performance**: Fast, optimized delivery +5. **Security**: Proactive vulnerability management +6. **Developer Experience**: Clear docs, easy setup, powerful tools + +### Strategic Goals + +#### 2026 +- Complete soft offline mode implementation +- Achieve 100% WCAG 2.1 AA compliance +- Expand Codeception test coverage to 80%+ +- Release community style pack (5+ color schemes) + +#### 2027 +- Visual page builder integration +- Advanced SEO module +- Multi-site template synchronization +- Enterprise support tier + +#### 2028+ +- Joomla 6.x compatibility (when released) +- AI-powered accessibility checker +- Headless CMS mode (API-first rendering) +- Marketplace ecosystem for extensions + +--- + +## External Resources + +### Official Links +- **Full Roadmap**: [https://mokoconsulting.tech/support/joomla-cms/moko-cassiopeia-roadmap](https://mokoconsulting.tech/support/joomla-cms/moko-cassiopeia-roadmap) +- **Repository**: [https://github.com/mokoconsulting-tech/moko-cassiopeia](https://github.com/mokoconsulting-tech/moko-cassiopeia) +- **Issue Tracker**: [GitHub Issues](https://github.com/mokoconsulting-tech/moko-cassiopeia/issues) +- **Changelog**: [CHANGELOG.md](../CHANGELOG.md) + +### Community +- **Email Support**: hello@mokoconsulting.tech +- **Contributing**: [CONTRIBUTING.md](../CONTRIBUTING.md) +- **Code of Conduct**: [CODE_OF_CONDUCT.md](../CODE_OF_CONDUCT.md) + +### Documentation +- **Quick Start**: [docs/QUICK_START.md](./QUICK_START.md) +- **Workflow Guide**: [docs/WORKFLOW_GUIDE.md](./WORKFLOW_GUIDE.md) +- **Joomla Development**: [docs/JOOMLA_DEVELOPMENT.md](./JOOMLA_DEVELOPMENT.md) +- **Main README**: [README.md](../README.md) + +--- + +## Contributing to the Roadmap + +Have ideas for future features? We welcome community input! + +**How to Suggest Features**: +1. Check the [GitHub Issues](https://github.com/mokoconsulting-tech/moko-cassiopeia/issues) for existing requests +2. Open a new issue with the `enhancement` label +3. Provide clear use cases and benefits +4. Engage in community discussion + +**Feature Evaluation Criteria**: +- Alignment with core principles +- User demand and use cases +- Technical feasibility +- Maintenance burden +- Performance impact +- Security implications + +--- + +## Metadata + +* Document: docs/ROADMAP.md +* Repository: [https://github.com/mokoconsulting-tech/moko-cassiopeia](https://github.com/mokoconsulting-tech/moko-cassiopeia) +* Path: /docs/ROADMAP.md +* Owner: Moko Consulting +* Version: 03.05.00 +* Status: Active +* Last Updated: 2026-01-27 +* Classification: Public Open Source Documentation + +## Revision History + +| Date | Change Summary | Author | +| ---------- | ----------------------------------------------------- | --------------- | +| 2026-01-27 | Initial version-specific roadmap generated from codebase scan. | GitHub Copilot |