From 9ee2993556c410892430d3e56f3defadce75d417 Mon Sep 17 00:00:00 2001
From: Andy Hinkle <ahinkle10@gmail.com>
Date: Sat, 4 Nov 2023 22:48:48 -0500
Subject: [PATCH] Add "Include Legend" checkbox

---
 app/Livewire/CreateCode.php                    | 2 ++
 resources/views/components/legend.blade.php    | 8 ++++++--
 resources/views/livewire/create-code.blade.php | 6 +++++-
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/app/Livewire/CreateCode.php b/app/Livewire/CreateCode.php
index c062bb5..e50363c 100644
--- a/app/Livewire/CreateCode.php
+++ b/app/Livewire/CreateCode.php
@@ -7,6 +7,8 @@
 
 class CreateCode extends Component
 {
+    public bool $includeLegend = true;
+
     public string $message;
 
     protected array $symbols = [
diff --git a/resources/views/components/legend.blade.php b/resources/views/components/legend.blade.php
index 2910596..8dbef2f 100644
--- a/resources/views/components/legend.blade.php
+++ b/resources/views/components/legend.blade.php
@@ -1,8 +1,12 @@
-@props(['letters'])
+@props(['letters', 'includeLegend' => true])
 
 <div class="flex flex-wrap mt-auto">
     @foreach ($letters as $letter => $symbol)
-        <div class="flex flex-col items-center border border-white/10 print:border-gray-400 p-2">
+        <div 
+            @class([
+                'flex flex-col items-center border border-white/10 print:border-gray-400 p-2',
+                'print:hidden' => ! $includeLegend,
+            ])>
             <span class="mb-2 font-bold">{{ ucwords($letter) }}</span>
             <span class="material-symbols-outlined character">{{ $symbol }}</span>
         </div>
diff --git a/resources/views/livewire/create-code.blade.php b/resources/views/livewire/create-code.blade.php
index 7892adf..9eface2 100644
--- a/resources/views/livewire/create-code.blade.php
+++ b/resources/views/livewire/create-code.blade.php
@@ -4,6 +4,10 @@
                   class="bg-white/10 text-white py-2 px-3 rounded-xl w-full"></textarea>
 
         <div class="mt-2 flex justify-end">
+            <div class="flex items-center mr-3">
+                <input type="checkbox" wire:model.live="includeLegend" class="mr-2 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-600 ring-offset-gray-800 focus:ring-2" @disabled(! $message)>
+                <label for="includeLegend">Include Legend</label>
+            </div>
             <button type="button" @disabled(! $message) @click="window.print()" class="bg-blue-500 px-4 py-1 text-sm font-semibold rounded-md disabled:bg-gray-300">Print</button>
         </div>
     </form>
@@ -11,6 +15,6 @@ class="bg-white/10 text-white py-2 px-3 rounded-xl w-full"></textarea>
     <x-code :message="$message" :letters="$this->letters"/>
 
     @if ($message)
-        <x-legend :letters="$this->letters" />
+        <x-legend :letters="$this->letters" :includeLegend="$includeLegend" />
     @endif
 </div>