FOUR-18323 | Implement CSS Application Logic

ProcessMaker/Helpers/ScreenTemplateHelper.php

@@ -250,4 +250,71 @@ private static function flattenNestedItems($items)
 
         return $flattenedItems;
     }
+
+    // Parse the CSS string into an associative array
+    public static function parseCss($cssString)
+    {
+        $rules = [];
+        // Regex to match complex CSS selectors, allowing for any selector pattern
+        preg_match_all('/([^{}]+)\s*\{([^}]*)\}/', $cssString, $matches, PREG_SET_ORDER);
+
+        foreach ($matches as $match) {
+            $fullSelector = trim($match[1]); // Full CSS selector
+            $propertiesString = trim($match[2]); // Properties between the brackets
+
+            // Split properties into key-value pairs
+            $propertiesArray = explode(';', $propertiesString);
+            $properties = [];
+
+            foreach ($propertiesArray as $property) {
+                $propertyParts = explode(':', $property);
+                if (count($propertyParts) == 2) {
+                    $key = trim($propertyParts[0]);
+                    $value = trim($propertyParts[1]);
+                    if (!empty($key) && !empty($value)) {
+                        $properties[$key] = $value;
+                    }
+                }
+            }
+
+            // Add rule for the selector
+            $rules[$fullSelector] = $properties;
+        }
+
+        return $rules;
+    }
+
+    // Merge the two CSS arrays
+    public static function mergeCss($currentCss, $templateCss)
+    {
+        foreach ($templateCss as $selector => $properties) {
+            if (isset($currentCss[$selector])) {
+                // Merge properties from Template CSS into the Current Screen CSS for the same selector
+                $currentCss[$selector] = array_merge($currentCss[$selector], $properties);
+            } else {
+                // Add new selector and properties from Template CSS
+                $currentCss[$selector] = $properties;
+            }
+        }
+
+        return $currentCss;
+    }
+
+    public static function generateCss($cssArray)
+    {
+        // Convert the CSS array back into a string and output the final CSS
+        $cssString = '';
+
+        foreach ($cssArray as $selector => $properties) {
+            $cssString .= "$selector {\n";
+
+            foreach ($properties as $key => $value) {
+                $cssString .= " $key: $value;\n";
+            }
+
+            $cssString .= "}\n\n";
+        }
+
+        return $cssString;
+    }
 }

ProcessMaker/Http/Controllers/Api/TemplateController.php

@@ -242,6 +242,11 @@ public function deleteMediaImages(string $type, Request $request)
         return $this->template->deleteMediaImages($type, $request);
     }
 
+    public function applyTemplate(string $type, Request $request)
+    {
+        return $this->template->applyTemplate($type, $request);
+    }
+
     private function validateImportedFile($content, $request, $type)
     {
         $decoded = null;

ProcessMaker/Models/Template.php

@@ -101,6 +101,11 @@ public function deleteMediaImages(string $type, Request $request)
         return (new $this->types[$type][1])->deleteMediaImages($request);
     }
 
+    public function applyTemplate(string $type, Request $request)
+    {
+        return (new $this->types[$type][1])->applyTemplate($request);
+    }
+
     public function user()
     {
         return $this->belongsTo(User::class, 'user_id');

ProcessMaker/Templates/ScreenTemplate.php

@@ -677,6 +677,39 @@ public function syncProjectAssets($data, int $newScreenId): void
         }
     }
 
+    // Applies the template to an existing screen in screen builder
+    public function applyTemplate($request)
+    {
+        // Get the selected template
+        $templateId = (int) $request->id;
+        $template = ScreenTemplates::findOrFail($templateId);
+
+        // Get the selected template options
+        $templateOptions = $request->get('templateOptions');
+        // Get the current screen to apply the template
+        $screenId = $request->get('screenId');
+        $screen = Screen::where('id', $screenId)->first();
+        // Define available options and their corresponding components
+        $availableOptions = ScreenComponents::getComponents();
+
+        if (is_array($templateOptions)) {
+            // Iterate through available options to handle each one
+            foreach ($availableOptions as $option => $components) {
+                // Apply the CSS to the current screen
+                if ($option == 'CSS' && in_array($option, $templateOptions)) {
+                    $currentScreenCssArray = ScreenTemplateHelper::parseCss($screen->custom_css);
+                    $templateCssArray = ScreenTemplateHelper::parseCss($template->screen_custom_css);
+                    $mergedCss = ScreenTemplateHelper::mergeCss($currentScreenCssArray, $templateCssArray);
+
+                    $finalCss = ScreenTemplateHelper::generateCss($mergedCss);
+                    $screen->custom_css = $finalCss;
+                }
+
+                $screen->save();
+            }
+        }
+    }
+
     private function syncTemplateMedia($template, $media)
     {
         // Get the UUIDs of updated media

routes/api.php

@@ -330,6 +330,7 @@
     Route::get('modeler/templates/{type}/{id}', [TemplateController::class, 'show'])->name('modeler.template.show')->middleware('template-authorization');
     Route::post('templates/{type}/import/validation', [TemplateController::class, 'preImportValidation'])->name('template.preImportValidation')->middleware('template-authorization');
     Route::post('template/{type}/{id}/publish', [TemplateController::class, 'publishTemplate'])->name('template.publishTemplate')->middleware('can:publish-screen-templates');
+    Route::post('template/{type}/{id}/apply', [TemplateController::class, 'applyTemplate'])->name('template.applyTemplate')->middleware('template-authorization');
     Route::get('screen-builder/{type}/{id}', [TemplateController::class, 'show'])->name('screenBuilder.template.show')->middleware('template-authorization');
 
     // Wizard Templates