added calendar

app/views/welcome/index.html.erb

@@ -32,9 +32,66 @@ Hi! I'm Agnes (Agnes the Alien!). I'm a freakdyke alien in its mid 20s trying to
 
 <h3>FUN!</h3>
 <iframe src="https://petrapixel.neocities.org/widgets/lastfm?center=0&marquee=0&font-family=MS Gothic&font-weight:900&font-size=16px&color=#000&username=keegbovo&swapPositions=1&deulmiter=~&underulne=1" height="20px" frameborder="0" title="Last.Fm Status" id="ulnkjesus" style="color:#fff;"></iframe><iframe src="https://free.timeanddate.com/clock/ia8kdkgg/n77/fn6/fs16/fcf99/tc000/ftbi/bas2/bat1/bac0f9/pa8/tt0/tw1/th1/ta1/tb4" frameborder="0" width="210" height="66"></iframe><!-- © wdisseny --><div id="contain_moon" style="text-align:center;padding-top:5px;padding-bottom:5px;"><div style="font-weight:bold">The moon today</div><div style="margin-top:-7px;margin-bottom:-15px;padding:30px;filter:drop-shadow(0 0 30px hsl(220,100%,15%))"></div><div>.</div><div style="font-size:small">.</div></div><script>(function(){var d=new Date().getDate();var m=document.querySelectorAll("#contain_moon div");var a=new XMLHttpRequest();var url="https://www.icalendar37.net/lunar/api/?lang=en&month="+(new Date().getMonth()+1)+"&year="+(new Date().getFullYear())+"&size=100&lightColor=rgb(245,245,245)&shadeColor=rgb(17,17,17)&LDZ="+new Date(new Date().getFullYear(),new Date().getMonth(),1)/1000+"";m[1].style.height="100px";a.onreadystatechange=function(){if(a.readyState==4&&a.status==200){var b=JSON.parse(a.responseText);m[1].innerHTML=b.phase[d].svg;if(typeof moon_widget_loaded=="function")moon_widget_loaded(b);m[2].innerHTML=b.phase[d].npWidget;m[3].innerHTML="Next full moon<br>"+b.nextFullMoon}};a.open("GET",url,true);a.send()})()</script><script src="https://cdn.commoninja.com/sdk/latest/commonninja.js" defer></script>
-<div class="commonninja_component pid-105395c7-5fec-4896-9d96-13ef43c07011"></div>
+<script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.1.20/index.global.min.js'></script><script src='cdn.jsdelivr.net'></script>
+
+<div id="calendar"></div>
+
+<div id="eventModal" class="modal">
+  <div class="modal-content">
+    <span id="closeModal" class="close">&times;</span>
+    <h2 id="modalTitle"></h2>
+    <p id="modalDate"></p>
+    <p id="modalDescription"></p>
+  </div>
+</div>
+
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+  var calendarEl = document.getElementById('calendar');
+
+  var calendar = new FullCalendar.Calendar(calendarEl, {
+    initialView: 'dayGridMonth',
+    events: [
+      {
+        title: 'Candy Hearts Due',
+        start: '2026-02-07',
+        description: 'https://candyheartsex.dreamwidth.org/'
+      },
+      {
+        title: 'Seasons of Drabbles due',
+        start: '2026-01-31',
+        description: 'https://seasonsofdrabbles.dreamwidth.org'
+      },
+       {
+        title: 'With Mama Flash Due',
+        start: '2026-01-23',
+        description: 'https://archiveofourown.org/collections/withmamaflash2026/profile'
+      },
+    ],
+    eventClick: function(info) {
+      info.jsEvent.preventDefault();
+      document.getElementById('modalTitle').textContent = info.event.title;
+      document.getElementById('modalDate').textContent = info.event.start.toLocaleString();
+      document.getElementById('modalDescription').textContent = info.event.extendedProps.description || '';
+      document.getElementById('eventModal').style.display = 'block';
+    }
+  });
+
+  calendar.render();
+
+  document.getElementById('closeModal').onclick = function() {
+    document.getElementById('eventModal').style.display = 'none';
+  };
+
+  window.onclick = function(e) {
+    if (e.target === document.getElementById('eventModal')) {
+      document.getElementById('eventModal').style.display = 'none';
+    }
+  };
+});
+    </script>
 </center>
 </section><section class="bottomindex"> 
 <h2>Guestbook</h2>
 <iframe style="border:1px #FFFFFF none" src="https://gayaliens420.atabook.org/" title="iFrame" width="100%" height="350" scrolling="yes" frameborder="no" allow=""></iframe>
-</section>
+</section><br>