From 59e04e516c3fafa5e3b95e9f29b066440a635df7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joachim=20L=C3=B8vgaard?= <joachim@loevgaard.dk>
Date: Wed, 24 Jan 2024 12:45:21 +0100
Subject: [PATCH] Add color and background color to the callout

---
 src/Form/Type/CalloutType.php                 |  8 ++++
 src/Model/Callout.php                         | 24 ++++++++++
 src/Model/CalloutInterface.php                |  8 ++++
 .../config/doctrine/model/Callout.orm.xml     |  2 +
 src/Resources/config/validation/Callout.xml   | 44 +++++++++++++++++++
 src/Resources/translations/messages.en.yml    |  2 +
 .../views/Admin/Callout/_form.html.twig       | 17 ++++++-
 7 files changed, 103 insertions(+), 2 deletions(-)

diff --git a/src/Form/Type/CalloutType.php b/src/Form/Type/CalloutType.php
index a03bae3..3bd23c9 100644
--- a/src/Form/Type/CalloutType.php
+++ b/src/Form/Type/CalloutType.php
@@ -75,6 +75,14 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
                 },
                 'placeholder' => 'setono_sylius_callout.form.callout.select_position',
             ])
+            ->add('color', TextType::class, [
+                'label' => 'setono_sylius_callout.form.callout.color',
+                'required' => false,
+            ])
+            ->add('backgroundColor', TextType::class, [
+                'label' => 'setono_sylius_callout.form.callout.background_color',
+                'required' => false,
+            ])
             ->add('enabled', CheckboxType::class, [
                 'label' => 'setono_sylius_callout.form.callout.enabled',
                 'required' => false,
diff --git a/src/Model/Callout.php b/src/Model/Callout.php
index 1bd5eae..f869d9f 100644
--- a/src/Model/Callout.php
+++ b/src/Model/Callout.php
@@ -39,6 +39,10 @@ class Callout implements CalloutInterface
 
     protected ?string $position = self::DEFAULT_KEY;
 
+    protected ?string $color = null;
+
+    protected ?string $backgroundColor = null;
+
     /** @var Collection<array-key, BaseChannelInterface> */
     protected Collection $channels;
 
@@ -142,6 +146,26 @@ public function setPosition(?string $position): void
         $this->position = $position;
     }
 
+    public function getColor(): ?string
+    {
+        return $this->color;
+    }
+
+    public function setColor(?string $color): void
+    {
+        $this->color = $color;
+    }
+
+    public function getBackgroundColor(): ?string
+    {
+        return $this->backgroundColor;
+    }
+
+    public function setBackgroundColor(?string $backgroundColor): void
+    {
+        $this->backgroundColor = $backgroundColor;
+    }
+
     public function getText(): ?string
     {
         return $this->getCalloutTranslation()->getText();
diff --git a/src/Model/CalloutInterface.php b/src/Model/CalloutInterface.php
index ceae905..73c3471 100644
--- a/src/Model/CalloutInterface.php
+++ b/src/Model/CalloutInterface.php
@@ -57,6 +57,14 @@ public function getPosition(): ?string;
 
     public function setPosition(?string $position): void;
 
+    public function getColor(): ?string;
+
+    public function setColor(?string $color): void;
+
+    public function getBackgroundColor(): ?string;
+
+    public function setBackgroundColor(?string $backgroundColor): void;
+
     public function getText(): ?string;
 
     public function setText(string $text): void;
diff --git a/src/Resources/config/doctrine/model/Callout.orm.xml b/src/Resources/config/doctrine/model/Callout.orm.xml
index d9f8d24..628631d 100755
--- a/src/Resources/config/doctrine/model/Callout.orm.xml
+++ b/src/Resources/config/doctrine/model/Callout.orm.xml
@@ -17,6 +17,8 @@
         <field name="priority" type="integer"/>
         <field name="elements" type="json"/>
         <field name="position" type="string"/>
+        <field name="color" type="string" nullable="true"/>
+        <field name="backgroundColor" type="string" nullable="true"/>
         <field name="enabled" type="boolean"/>
         <field name="createdAt" column="created_at" type="datetime">
             <gedmo:timestampable on="create"/>
diff --git a/src/Resources/config/validation/Callout.xml b/src/Resources/config/validation/Callout.xml
index bb0d416..c570890 100644
--- a/src/Resources/config/validation/Callout.xml
+++ b/src/Resources/config/validation/Callout.xml
@@ -72,5 +72,49 @@
                 </option>
             </constraint>
         </property>
+
+        <property name="color">
+            <constraint name="CssColor">
+                <option name="formats">
+                    <value>hex_long</value>
+                    <value>hex_long_with_alpha</value>
+                    <value>hex_short</value>
+                    <value>hex_short_with_alpha</value>
+                    <value>basic_named_colors</value>
+                    <value>extended_named_colors</value>
+                    <value>system_colors</value>
+                    <value>keywords</value>
+                    <value>rgb</value>
+                    <value>rgba</value>
+                    <value>hsl</value>
+                    <value>hsla</value>
+                </option>
+                <option name="groups">
+                    <value>setono_sylius_callout</value>
+                </option>
+            </constraint>
+        </property>
+
+        <property name="backgroundColor">
+            <constraint name="CssColor">
+                <option name="formats">
+                    <value>hex_long</value>
+                    <value>hex_long_with_alpha</value>
+                    <value>hex_short</value>
+                    <value>hex_short_with_alpha</value>
+                    <value>basic_named_colors</value>
+                    <value>extended_named_colors</value>
+                    <value>system_colors</value>
+                    <value>keywords</value>
+                    <value>rgb</value>
+                    <value>rgba</value>
+                    <value>hsl</value>
+                    <value>hsla</value>
+                </option>
+                <option name="groups">
+                    <value>setono_sylius_callout</value>
+                </option>
+            </constraint>
+        </property>
     </class>
 </constraint-mapping>
diff --git a/src/Resources/translations/messages.en.yml b/src/Resources/translations/messages.en.yml
index 2e4fca0..83c1846 100755
--- a/src/Resources/translations/messages.en.yml
+++ b/src/Resources/translations/messages.en.yml
@@ -1,8 +1,10 @@
 setono_sylius_callout:
     form:
         callout:
+            background_color: Background color
             channels: Channels
             code: Code
+            color: Color
             elements: Element
             element_labels:
                 default: Default
diff --git a/src/Resources/views/Admin/Callout/_form.html.twig b/src/Resources/views/Admin/Callout/_form.html.twig
index 3677314..58ab9e9 100755
--- a/src/Resources/views/Admin/Callout/_form.html.twig
+++ b/src/Resources/views/Admin/Callout/_form.html.twig
@@ -24,8 +24,21 @@
         </div>
         <div class="ui segment">
             <h4 class="ui dividing header">{{ 'setono_sylius_callout.form.callout.layout'|trans }}</h4>
-            {{ form_row(form.elements) }}
-            {{ form_row(form.position) }}
+
+            <div class="ui two column stackable grid">
+                <div class="column">
+                    <div class="ui segment">
+                        {{ form_row(form.elements) }}
+                        {{ form_row(form.position) }}
+                    </div>
+                </div>
+                <div class="column">
+                    <div class="ui segment">
+                        {{ form_row(form.color) }}
+                        {{ form_row(form.backgroundColor) }}
+                    </div>
+                </div>
+            </div>
         </div>
         <div class="ui segment">
             <h4 class="ui dividing header">{{ 'setono_sylius_callout.form.callout.rules'|trans }}</h4>