* Transposition: Make more usable

1 files changed, 10 insertions, 4 deletions

diff --git a/laravel/resources/views/song.blade.php b/laravel/resources/views/song.blade.php
index a8e31c0..025c14e 100644
--- a/laravel/resources/views/song.blade.php
+++ b/laravel/resources/views/song.blade.php
@@ -40,7 +40,7 @@
             ] ) }}'>edit this song</a>
     @endcan
 
-    <form>
+    <form style="display: inline-block">
     <select name="transp" id="transp"
         value = "<?php echo $transp;?>"
     >
@@ -59,11 +59,17 @@
         ?>
     @endif
     </select>
-    <noscript>
         <button>Transpose</button>
-    </noscript>
     </form>
-    
+    @foreach (['G','D','C'] as $possibleKey)
+        @if($possibleKey != ($_GET['transp'] ?? $song->key))
+            <form style="display: inline-block;">
+                <button>Transpose to {{$possibleKey}}</button>
+                <input type='hidden' name='transp' value='{{$possibleKey}}'>
+            </form>
+        @endif
+    @endforeach
+
     <pre>{!! $song['escapedText'] !!}</pre>
     <div id="chordarea">
         <canvas id='guitarregion' width="100" height="100" onclick="cycle(guitarObj);"></canvas>