start work on schedules tab

layout.html

@@ -83,9 +83,9 @@
             			border: 1px solid white;
         		}
 
-        		.readyToDrop {
+			.readyToDrop {
-            			background-color: green;
+					background-color: green;
-        		}
+			}
 
 			::backdrop {
 			  background-image: linear-gradient(
@@ -283,6 +283,17 @@
 				<button class="media_item_edl_jump_insert">-&gt;</button>
 			</li>
 		</template>
+		<template id="schedules_template">
+			<h2>Schedules</h2>
+			<section id="schedules_time_range_section">
+				<button id="previous_week_button">&lt;</button>
+				<p id="current_week_indicator"></p>
+				<button id="next_week_button">&gt;</button>
+			</section>
+			<section id="schedules_grid">
+				
+			</section>
+		</template>
 		<script>
 			const init_library = () => {
 				// set up handler for library filtering
@@ -579,7 +590,22 @@
 				tab_content.appendChild(template_clone);
 				fetch_tags();
 			});
-			
+
+			document.getElementById("schedules_tab").addEventListener("click", (e) => {
+				setActiveTab(e);
+				const tab_content = document.querySelector("#tab_content");
+				tab_content.innerHTML = "";
+				const template = document.querySelector("#schedules_template");
+				const template_clone = template.content.cloneNode(true);
+				tab_content.appendChild(template_clone);
+				init_schedules();
+			});
+
+			const init_schedules = () => {
+				const today = new Date(Date.now()).getDay();
+				console.log(today);
+			}
+
 			const tag_editor_handlers = () => {
 				document.querySelector("#save_tag_button").addEventListener("click", (e) => {
 					e.preventDefault();