Issue with leap years #7
Description
Hello Paul,
I’m Alex Munoz a candidate member of Mexico Tolkiendili Association. Actually I’m working on a project where we want to integrate a calendar to our web page. So I started working with your examples from shire-reckoning site. I’m not a JS or HTML programmer even though I do more VBScript; I think I have something that is able to work for us. But I have some doubts regarding leap-years; right now all is working so good for the shire calendar except the leap-years.
If I put the June 25 2016 date it does not show the Overlithe day, I'm thinking that the issue can be something with the calendar rules I'm using these ones:
calendarRules: TolkienCalendars.GondorCalendar.RECKONING_RULES_GREGORIAN,
I will appreciate your support on this.
This is the code that I'm using now:
<title>Calendarios de Tolkien</title>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/react@16/umd/react.production.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/react-dom@16/umd/react-dom.production.min.js"></script>
<link rel="stylesheet" href="../lib/TolkienCalendars.css"/>
<script type="text/javascript" src="../lib/TolkienCalendars.js"></script>
<style>
.myDiv {
border: 5px outset black;
background-color: rgb(209, 243, 248);
text-align: left;
width: 550px;
height: 210px
}
.myDiv2 {
border: 5px outset black;
background-color: white;
text-align: left;
width: 550px;
height: 150px
}
</style>
</head>
<body onload="myFunction(new Date(),0)">
<div class="myDiv2">
<h1 style="font-size:25px;"> Sociedad Tolkiendili de México, AC. <img align="middle" src="LogoSTOLKMEX.jpg" width="150" height="130"> </h1>
</div>
<p></p>
<div class="myDiv">
<p id="CurrentDate" style="text-align:left; font-weight: bold;" ></p>
<form>
<label for="Today_2"> Fecha Calendario Gregoriano Moderno:</label>
<input type="date" id="Today_2" name="Today_2" onchange="myFunction(this.value,1,0)">
</form>
<p></p>
<from method="get">
<label for="region"> Seleccione el tipo de Nombres:</label>
<input list="Myregions" name="region" id="region" value="Nombres de la Comarca" onchange="myFunction(0,1,this.value)" onclick="ClearMyList()">
<datalist id="Myregions">
<option value="Nombres de la Comarca">
<option value="Nombres de Bree">
<option value="Nombres de Tolkien">
</datalist>
</from>
<form action="/action_page.php">
<p>Mostrar:</p>
<input type="radio" id="year1" name="ShowSelect" value=1 onclick="myFunction(0,0,0)">
<label for="year1">Año Completo</label><br>
<input type="radio" id="month1" name="ShowSelect" value=0 onclick="myFunction(0,0,0)" checked>
<label for="month1">Solo el Mes</label><br>
</form>
</div>
<script>
const d = new Date();
document.getElementById("CurrentDate").innerHTML = "Fecha Actual: " + d.toDateString();
</script>
<p></p>
<script type="text/javascript">
function ClearMyList(){
document.getElementById("region").value="" //text-align: left;
}
</script>
<div id="shire-calendar"></div>
<script type="text/javascript">
function myFunction(val, extra, regionType) {
const gregorianStartDate = new Date(1, 0, 1, 0, 0, 0);
gregorianStartDate.setFullYear(1, 11, 21);
let Today_1;
switch (val) {
case 0:
//alert("Day: " + Today_1);
break;
default:
Today_1 = new Date(val); //new Date(2016, 5, 24, 0, 0, 0); //
Today_1.setDate(Today_1.getDate()+extra);
break;
}
let MyregionType;
switch (regionType) {
case "Nombres de la Comarca":
MyregionType = "shire";
break;
case "Nombres de Bree":
MyregionType = "bree";
break;
case "Nombres de Tolkien":
MyregionType = "tolkien";
break;
case 0:
//alert("Region: " + MyregionType);
break;
default:
MyregionType = "shire";
break;
}
let YearShow;
YearShow=document.getElementById("year1").checked
//alert(YearShow);
ReactDOM.render(
React.createElement(TolkienCalendars.ShireCalendar, {
startDate: gregorianStartDate,
className: "shire-calendar",
caption: "Calendario de la Comarca",
monthViewLayout: "VERTICAL",
// monthView: 0,
yearView: YearShow,
region:MyregionType,
date: Today_1,
calendarRules: TolkienCalendars.GondorCalendar.RECKONING_RULES_GREGORIAN,
}),
document.getElementById("shire-calendar")
);}
</script>
</body>
Your example:
My example:
