From d98e42a936ba855e4ba215e32818ab439cedb228 Mon Sep 17 00:00:00 2001
From: Jonathan Miller <230051081+jmiller-moko@users.noreply.github.com>
Date: Thu, 2 Apr 2026 22:01:45 -0500
Subject: [PATCH] Development mode controls CSS/JS minification

- When dev mode OFF (default): loads template.min.css,
  template.min.js, minified theme CSS, and minified FA7
- When dev mode ON: loads unminified sources for debugging
- Uncommented developmentmode field in templateDetails.xml
  with default set to 0 (off) for production use
- Updated language strings to describe minification behavior
- Resolved hero-card-max-width to 800px

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/index.php                             | 24 +++++++++++++----------
 src/language/en-GB/tpl_mokocassiopeia.ini |  2 +-
 src/language/en-US/tpl_mokocassiopeia.ini |  2 +-
 src/templateDetails.xml                   |  4 +---
 4 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/src/index.php b/src/index.php
index b801654..b4ddd06 100644
--- a/src/index.php
+++ b/src/index.php
@@ -70,11 +70,14 @@ if ($params_favicon_source) {
     }
 }
 
-// Core template CSS
-$wa->useStyle('template.base');   // css/template.css
-
-// Scripts
-$wa->useScript('template.js');
+// Core template CSS + JS — use minified when not in development mode
+if ($params_developmentmode) {
+	$wa->useStyle('template.base');       // css/template.css
+	$wa->useScript('template.js');        // js/template.js
+} else {
+	$wa->useStyle('template.base.min');   // css/template.min.css
+	$wa->useScript('template.js.min');    // js/template.min.js
+}
 
 // Load Osaka font for site title
 $wa->useStyle('template.font.osaka');
@@ -215,18 +218,19 @@ if ($this->params->get('fA6KitCode')) {
 $params_leftIcon           = htmlspecialchars($this->params->get('drawerLeftIcon', 'fa-solid fa-chevron-left'), ENT_COMPAT, 'UTF-8');
 $params_rightIcon          = htmlspecialchars($this->params->get('drawerRightIcon', 'fa-solid fa-chevron-right'), ENT_COMPAT, 'UTF-8');
 
-// Load theme palette stylesheets based on configuration
-$wa->useStyle('template.light.standard');      // css/theme/light.standard.css
-$wa->useStyle('template.dark.standard');       // css/theme/dark.standard.css
+// Load theme palette stylesheets — minified when not in development mode
+$suffix = $params_developmentmode ? '' : '.min';
+$wa->useStyle('template.light.standard' . $suffix);
+$wa->useStyle('template.dark.standard' . $suffix);
 
 // Load custom palettes only if selected in template configuration AND files exist
 if ($params_LightColorName === 'custom' && file_exists(JPATH_ROOT . '/media/templates/site/mokocassiopeia/css/theme/light.custom.css'))
 {
-	$wa->useStyle('template.light.custom');
+	$wa->useStyle('template.light.custom' . $suffix);
 }
 if ($params_DarkColorName === 'custom' && file_exists(JPATH_ROOT . '/media/templates/site/mokocassiopeia/css/theme/dark.custom.css'))
 {
-	$wa->useStyle('template.dark.custom');
+	$wa->useStyle('template.dark.custom' . $suffix);
 }
 
 // Load user assets last (after all other styles and scripts)
diff --git a/src/language/en-GB/tpl_mokocassiopeia.ini b/src/language/en-GB/tpl_mokocassiopeia.ini
index bf9acee..0eb79cc 100644
--- a/src/language/en-GB/tpl_mokocassiopeia.ini
+++ b/src/language/en-GB/tpl_mokocassiopeia.ini
@@ -6,7 +6,7 @@
 
 ; ===== System / layout =====
 TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_LABEL="Development Mode"
-TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_DESC="If 'Development Mode' is active, certain features may be disabled, such as Google Tag Manager and Google Analytics."
+TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_DESC="When enabled, unminified CSS and JavaScript files are loaded for easier debugging. When disabled, minified assets are served for faster page loads. Google Tag Manager and Google Analytics may also be disabled in development mode."
 TPL_MOKOCASSIOPEIA_FLUID_LABEL="Layout"
 TPL_MOKOCASSIOPEIA_STATIC="Static"
 TPL_MOKOCASSIOPEIA_FLUID="Fluid"
diff --git a/src/language/en-US/tpl_mokocassiopeia.ini b/src/language/en-US/tpl_mokocassiopeia.ini
index 089c689..13332c5 100644
--- a/src/language/en-US/tpl_mokocassiopeia.ini
+++ b/src/language/en-US/tpl_mokocassiopeia.ini
@@ -6,7 +6,7 @@
 
 ; ===== System / layout =====
 TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_LABEL="Development Mode"
-TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_DESC="If 'Development Mode' is active, certain features may be disabled, such as Google Tag Manager and Google Analytics."
+TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_DESC="When enabled, unminified CSS and JavaScript files are loaded for easier debugging. When disabled, minified assets are served for faster page loads. Google Tag Manager and Google Analytics may also be disabled in development mode."
 TPL_MOKOCASSIOPEIA_FLUID_LABEL="Layout"
 TPL_MOKOCASSIOPEIA_STATIC="Static"
 TPL_MOKOCASSIOPEIA_FLUID="Fluid"
diff --git a/src/templateDetails.xml b/src/templateDetails.xml
index e7c9883..0b0d4a4 100644
--- a/src/templateDetails.xml
+++ b/src/templateDetails.xml
@@ -105,12 +105,10 @@
 		<fields name="params">
 			<!-- Advanced tab (non-theme/system options only) -->
 			<fieldset name="advanced">
-				<!--
-				<field name="developmentmode" type="radio" label="TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_LABEL" description="TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_DESC" default="1" layout="joomla.form.field.radio.switcher" filter="boolean">
+					<field name="developmentmode" type="radio" label="TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_LABEL" description="TPL_MOKOCASSIOPEIA_DEVELOPMENTMODE_DESC" default="0" layout="joomla.form.field.radio.switcher" filter="boolean">
 					<option value="0">JNO</option>
 					<option value="1">JYES</option>
 				</field>
-			-->
 				<field name="fluidContainer" type="radio" layout="joomla.form.field.radio.switcher" default="0" label="TPL_MOKOCASSIOPEIA_FLUID_LABEL">
 					<option value="0">TPL_MOKOCASSIOPEIA_STATIC</option>
 					<option value="1">TPL_MOKOCASSIOPEIA_FLUID</option>