Skip to content

Instantly share code, notes, and snippets.

@dcanchola
Last active April 27, 2016 17:36
Show Gist options
  • Save dcanchola/10d39610bee1713c6f89875470411ba2 to your computer and use it in GitHub Desktop.
Save dcanchola/10d39610bee1713c6f89875470411ba2 to your computer and use it in GitHub Desktop.
var zodiac = [
{
"name":"Aries",
"start":"March 21, 2016 00:00:00",
"end":"April 20, 2016 23:59:59"
},
{
"name":"Taurus",
"start":"April 21, 2016 00:00:00",
"end":"May 21, 2016 23:59:59"
},
{
"name":"Gemini",
"start":"May 22, 2016 00:00:00",
"end":"June 21, 2016 23:59:59"
},
{
"name":"Cancer",
"start":"June 22, 2016 00:00:00",
"end":"July 22, 2016 23:59:59"
},
{
"name":"Leo",
"start":"July 23, 2016 00:00:00",
"end":"August 22, 2016 23:59:59"
},
{
"name":"Virgo",
"start":"August 23, 2016 00:00:00",
"end":"September 23, 2016 23:59:59"
},
{
"name":"Libra",
"start":"September 24, 2016 00:00:00",
"end":"October 23, 2016 23:59:59"
},
{
"name":"Scorpio",
"start":"October 24, 2016 00:00:00",
"end":"November 22, 2016 23:59:59"
},
{
"name":"Sagittarius",
"start":"November 23, 2016 00:00:00",
"end":"December 21, 2016 23:59:59"
},
{
"name":"Capricorn",
"start":"December 22, 2016 00:00:00",
"end":"January 20, 2016 23:59:59"
},
{
"name":"Aquarius",
"start":"January 21, 2016 00:00:00",
"end":"February 19, 2016 23:59:59"
},
{
"name":"Pisces",
"start":"February 20, 2016 00:00:00",
"end":"March 20, 2016 23:59:59"
}
]
/*
This JavaScript sample was developed for a project that tells users their
zodiac signs according to the birthday they input. I created a JSON file of
the zodiac sign data including the months and timespans involved and
retreived it with an AJAX request. The data is parsed into milliseconds and
therefore becomes easily comparable to discover which zodiac sign matches
with which month.
*/
var xmlhttp = new XMLHttpRequest();
var url = "./data/zodiac.txt";
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var myArr = JSON.parse(xmlhttp.responseText);
getZodiac(myArr, convertBirthday, removeFlexItems);
}
};
//Send the request on the click of the button
window.onload = function() {
var button = document.querySelector(".submit");
button.addEventListener('click', function() {
xmlhttp.open("GET", url, true);
xmlhttp.send();
});
};
//Get zodiac sign according to birthday
function getZodiac(arr, getBirthday, removeItems) {
var birthday = getBirthday();
//Loop through the array of data to find out which zodiac sign they are
for(var i = 0; i < arr.length; i++) {
var name = arr[i].name;
var symbol = arr[i].symbol;
//Convert start & end dates to date objects and milliseconds
var start = arr[i].start;
var startDate = new Date(start);
parsedStart = Date.parse(startDate);
var end = arr[i].end;
var endDate = new Date(end);
parsedEnd = Date.parse(endDate);
//If the given birthday falls between certain dates, it finds their zodiac sign
if (birthday >= parsedStart && birthday <= parsedEnd) {
console.log("Zodiac is " + name);
var getDiv = document.getElementsByClassName("yourZodiac");
var bdayMonth = document.getElementsByClassName("month");
var bdayDay = document.getElementsByClassName("day");
getDiv[0].innerHTML = symbol + "<br>" + name + "<br>" + bdayMonth[0].value + " " + bdayDay[0].value;
}
}
//Removes the default items in the container
removeItems();
}
//Removes the default items in the container to show your zodiac
function removeFlexItems() {
var getFlex = document.getElementsByClassName("flex-item");
for(var index = 0; index < getFlex.length; index++) {
getFlex[index].style.display = "none";
}
}
//Convert birthday to date in milliseconds
function convertBirthday() {
//Get birthday month & date
var month = document.getElementsByClassName("month");
var day = document.getElementsByClassName("day");
var bdayString = month[0].value + " " + day[0].value;
//Convert to a string that could be converted to Date object
if (month[0].value == "December" && day[0].value > 21) {
bdayString += ", 2015 12:00:00";
} else {
bdayString += ", 2016 12:00:00";
}
console.log(bdayString);
var birthday = new Date(bdayString);
var parsedBday = Date.parse(birthday);
return parsedBday;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment