Update index.html

gatewayprogrammingschool · Apr 8, 2024 · 7cad490 · 7cad490
1 parent 4f60c9f
commit 7cad490
Showing 1 changed file with 18 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -6,16 +6,25 @@
     <dir style='height: 5%; display: flex;'>
       <button type='button' onclick='showMajor()'>Major</button>
       <button type='button' onclick='showChromatic()'>Chromatic</button>
+      <button type='button' onclick='showPentatonic()'>Pentatonic</button>
     </dir>
     <script type='text/javascript'>
       function showMajor() {
         document.getElementById('major').style='display: block;';
         document.getElementById('chromatic').style='display: none;';
+        document.getElementById('pentatonic').style='display: none;';
       }
 
       function showChromatic() {
         document.getElementById('major').style='display: none;';
         document.getElementById('chromatic').style='display: block;';
+        document.getElementById('pentatonic').style='display: none;';
+      }
+
+      function showPentatonic() {
+        document.getElementById('major').style='display: none;';
+        document.getElementById('chromatic').style='display: none;';
+        document.getElementById('pentatonic').style='display: block;';
       }
     </script>
     <div id="major">
@@ -28,6 +37,14 @@
       <div class="pitch major major-d">D 2</div>
       <div class="pitch major major-c">C 1</div>
     </div>
+    <div id="pentatonic" style='display:none'>
+      <div class="pitch major major-c">C 8</div>
+      <div class="pitch major major-a">A 6</div>
+      <div class="pitch major major-g">G 5</div>
+      <div class="pitch major major-e">E 3</div>
+      <div class="pitch major major-d">D 2</div>
+      <div class="pitch major major-c">C 1</div>
+    </div>
     <div id="chromatic" style='display: none;'>
       <div class="pitch chromatic chromatic-b">B 7</div>
       <div class="pitch chromatic chromatic-as">A# Bb</div>
@@ -40,7 +57,7 @@
       <div class="pitch chromatic chromatic-ds">D# Eb</div>
       <div class="pitch chromatic chromatic-d">D 2</div>
       <div class="pitch chromatic chromatic-cs">C# Db</div>
-      <div class="pitch chromatic-c">C 1</div>
+      <div class="pitch chromatic chromatic-c">C 1</div>
     </div>
   </body>
 </html>