From ee5cc03e2884b9656e66b803bc72af416c451e92 Mon Sep 17 00:00:00 2001
From: NuclearPop <30777093+NuclearPop@users.noreply.github.com>
Date: Thu, 28 Sep 2017 23:29:15 -0700
Subject: [PATCH] Color Switcher

The changes adds a new button that sets the current color that the next class added to will be. The next class added should always be the color of that button, and clicking the button will rotate the specified color.

PS: I can't figure out how to run this website locally so I couldn't really test out the code. Is it possible to run this website locally so I can test it in future cases?
---
 antplanner2/templates/index.html | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/antplanner2/templates/index.html b/antplanner2/templates/index.html
index 9f09f8d..d033de3 100644
--- a/antplanner2/templates/index.html
+++ b/antplanner2/templates/index.html
@@ -35,6 +35,7 @@ <h1>Antplanner</h1>
           <button type="button" id="load-btn" class="btn">Load</button>
           <button type="button" id="clear-cal-btn" class="btn">Clear</button>
           <button type="button" id="resize-btn" class="btn">Size</button>
+          <button type="button" id="color-btn" class="btn">Color</button>
         </div>
       </div>
       <div id="cal"></div>
@@ -48,6 +49,10 @@ <h1>Antplanner</h1>
     <script src="{{url_for('static', filename="js/jquery.weekcalendar.js")}}"></script>
     <script src="{{url_for('static', filename="js/antplanner2.js")}}"></script>
     <script>
+      //initializes color
+      var colorPair = getRandomColorPair();
+      document.getElementById("color-btn").style.background=colorPair.color;
+      
       $(document).ready(function() {
         $('#cal').weekCalendar({
           businessHours: {start: 6, end: 24, limitDisplay: true},
@@ -141,7 +146,6 @@ <h1>Antplanner</h1>
               }
 
               // Assign a color to the courses
-              var colorPair = getRandomColorPair();
               $('.wc-cal-event').each(function(index, el) {
                 var c = $(el).data().calEvent
                 if( c.groupId.indexOf(courseCode) != -1 ) {
@@ -150,7 +154,13 @@ <h1>Antplanner</h1>
               });
             });
         });
-
+         
+        //changes the current set color and the color of the button
+        $('#color-btn').on('click', function() {
+            var colorPair = getRandomColorPair();
+            document.getElementById("color-btn").style.background=colorPair.color;
+        });
+        
         $('#save-btn').on('click', function() {
           var calData  = JSON.stringify( $('#cal').weekCalendar('serializeEvents') );