feat: update shader asset management by copying shaders to assets/shaders_text and adjusting paths

Author: orestesgaolin

.github/workflows/deploy.yml

@@ -34,6 +34,9 @@ jobs:
     - name: Get dependencies
       run: flutter pub get
 
+    - name: Copy shaders to assets
+      run: dart scripts/copy_shaders.dart
+
     - name: Build web
       run: flutter build web --release --base-href /shaders_gallery/
 

.gitignore

@@ -43,4 +43,4 @@ app.*.map.json
 /android/app/debug
 /android/app/profile
 /android/app/release
-assets/shaders/
+assets/shaders_text/

lib/noise_shader_builder.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_shaders/flutter_shaders.dart';
 import 'dart:ui';
 import 'shader_builder.dart';
 

lib/shader_source_viewer.dart

@@ -29,10 +29,11 @@ class _ShaderSourceViewerState extends State<ShaderSourceViewer> {
   Future<void> _loadShaderSource() async {
     try {
       // Convert shader path to asset path
-      // e.g., 'shaders/crt_shader.frag' -> 'assets/shaders/crt_shader.frag'
+      // e.g., 'shaders/crt_shader.frag' -> 'assets/shaders_text/crt_shader.frag'
       String assetPath = widget.assetKey;
       if (assetPath.startsWith('shaders/')) {
-        assetPath = 'assets/$assetPath';
+        final basename = assetPath.split('/').last;
+        assetPath = 'assets/shaders_text/$basename';
       }
 
       final source = await rootBundle.loadString(assetPath);
@@ -116,6 +117,7 @@ class _ShaderSourceViewerState extends State<ShaderSourceViewer> {
                           _sourceCode!,
                           style: const TextStyle(
                             fontFamily: 'Roboto Mono',
+                            fontFamilyFallback: <String>["Courier"],
                             fontSize: 12,
                             color: Colors.green,
                           ),

lib/widgets/shader_control_panel.dart

@@ -3,17 +3,14 @@ import 'package:shaders/shader_source_viewer.dart';
 import '../main.dart';
 
 /// A tabbed panel that displays shader controls and source code.
-/// 
+///
 /// This widget provides two tabs:
 /// - Controls: Custom shader-specific controls built by the shader builder
 /// - Source: The shader source code with syntax highlighting and copy functionality
 class ShaderControlPanel extends StatelessWidget {
   final ShaderInfo shaderInfo;
 
-  const ShaderControlPanel({
-    super.key,
-    required this.shaderInfo,
-  });
+  const ShaderControlPanel({super.key, required this.shaderInfo});
 
   @override
   Widget build(BuildContext context) {
@@ -34,14 +31,14 @@ class ShaderControlPanel extends StatelessWidget {
                   padding: const EdgeInsets.all(16),
                   child: shaderInfo.builder.buildControls(context),
                 ),
-                SizedBox()
-                // Padding(
-                //   padding: const EdgeInsets.all(16),
-                //   child: ShaderSourceViewer(
-                //     assetKey: shaderInfo.assetKey,
-                //     shaderName: shaderInfo.name,
-                //   ),
-                // ),
+
+                Padding(
+                  padding: const EdgeInsets.all(16),
+                  child: ShaderSourceViewer(
+                    assetKey: shaderInfo.assetKey,
+                    shaderName: shaderInfo.name,
+                  ),
+                ),
               ],
             ),
           ),

pubspec.yaml

@@ -32,7 +32,7 @@ flutter:
   uses-material-design: true
 
   assets:
-    - assets/shaders/
+    - assets/shaders_text/
 
   shaders:
     - shaders/crt_shader.frag

scripts/copy_shaders.dart

@@ -3,13 +3,13 @@
 import 'dart:io';
 import 'dart:async';
 
-/// Script to copy shader files from shaders/ directory to assets/shaders/
+/// Script to copy shader files from shaders/ directory to assets/shaders_text/
 /// This allows the shader source code to be viewed in the app
 Future<void> main() async {
   print('🔧 Copying shader files to assets directory...');
 
   final shaderDir = Directory('shaders');
-  final assetsShaderDir = Directory('assets/shaders');
+  final assetsShaderDir = Directory('assets/shaders_text');
 
   // Ensure assets/shaders directory exists
   if (!await assetsShaderDir.exists()) {
@@ -32,10 +32,10 @@ Future<void> main() async {
   // Copy each shader file to assets/shaders
   for (final shaderFile in shaderFiles) {
     final fileName = shaderFile.path.split('/').last;
-    final targetFile = File('assets/shaders/$fileName');
-    
+    final targetFile = File('assets/shaders_text/$fileName');
+
     await shaderFile.copy(targetFile.path);
-    print('✅ Copied $fileName to assets/shaders/');
+    print('✅ Copied $fileName to assets/shaders_text/');
   }
 
   print('🎉 Successfully copied ${shaderFiles.length} shader files!');