Members
(constant) backgroundMusic :string
stores the id of the new user's password
Type:
- string
- Source:
(constant) constellationList
Properties:
Name | Type | Description |
---|---|---|
init |
function | retrieves info from previous page |
initializeConstellation |
function | initalize constellations |
- Source:
(constant) constellationsPath :string
stores backend file path to the icon images
Type:
- string
- Source:
loginStatus :boolean
stores if the user is logged in or not
Type:
- boolean
- Source:
req :XMLHttpRequest
GET request to server to fetch database user data
Type:
- XMLHttpRequest
- Source:
Methods
animate()
Properties:
Name | Type | Description |
---|---|---|
Animation |
function | loop to update the skymap |
- Source:
animateText(answer, textElement)
Function to show the response text word by word.
Parameters:
Name | Type | Description |
---|---|---|
answer |
string | The response answer. |
textElement |
HTMLElement | The text element to animate. |
- Source:
confirmPassword()
Checks if the confirmation password and password matches.
- Source:
createDateCard(dateJSON)
Creates fortune cards and all the fortune buttons for user's database entries on the given date.
Parameters:
Name | Type | Description |
---|---|---|
dateJSON |
string | JSON array holding the user's database information for each fortune |
- Source:
displayText(answer, textElement)
Function to display text.
Parameters:
Name | Type | Description |
---|---|---|
answer |
string | The text to display. |
textElement |
HTMLElement | The text element to display the text in. |
- Source:
fetchResponses(questionInput, chosenConstellation) → {Promise.<string>}
Function to fetch response from the JSON file.
Parameters:
Name | Type | Description |
---|---|---|
questionInput |
string | The question input. |
chosenConstellation |
string | The chosen constellation. |
- Source:
Returns:
A promise that resolves with the fetched response.
- Type
- Promise.<string>
formatJSON(dbJSONArr)
Formats the db data to match what is displayed and used by user history.
Parameters:
Name | Type | Description |
---|---|---|
dbJSONArr |
string | JSON file from the database |
- Source:
getBlankButton()
Creates a blank fortune button and handles when it is clicked.
- Source:
getCareerButton(careerJSON)
Creates a Career fortune button and handles when it is clicked.
Parameters:
Name | Type | Description |
---|---|---|
careerJSON |
string | JSON array holding database information for the Career fortune |
- Source:
getHealthButton(healthJSON)
Creates a Health fortune button and handles when it is clicked.
Parameters:
Name | Type | Description |
---|---|---|
healthJSON |
string | JSON array holding database information for the Health fortune |
- Source:
getHoroscopeButton(horoscopeJSON)
Creates a Horoscope fortune button and handles when it is clicked.
Parameters:
Name | Type | Description |
---|---|---|
horoscopeJSON |
string | JSON array holding database information for the Horoscope fortune |
- Source:
getRelationshipButton(relationshipJSON)
Creates a Relationship fortune button and handles when it is clicked.
Parameters:
Name | Type | Description |
---|---|---|
relationshipJSON |
string | JSON array holding database information for the Relationship fortune |
- Source:
getStarPath(constellation)
Returns the corresponding constellation title in string based on its backend format.
Parameters:
Name | Type | Description |
---|---|---|
constellation |
string | constellation of the selected fortune in user history |
- Source:
handleClickCanvas(event, constellation_arr, sky_background)
Handle click when the user click on the canvas to trigger the
star click and count the total if clicked on the star.
Parameters:
Name | Type | Description |
---|---|---|
event |
Event | |
constellation_arr |
Constellation | |
sky_background |
Background |
- Source:
handleSelection(element)
Handle selection of categories to make sure only one category
is selected at one time, update icon image accordingly, and
store the category into local storage
Parameters:
Name | Type | Description |
---|---|---|
element |
Element | category button |
- Source:
init()
Retrieves info from previous page
- Source:
init()
Properties:
Name | Type | Description |
---|---|---|
Starts |
function | the program, all function calls trace back here |
- Source:
init()
Play background music, all function calls in selection page trace back here
- Source:
init()
Sends a POST request with the new user's username and password to the database, and handles request status.
- Source:
(async) init()
Properties:
Name | Type | Description |
---|---|---|
Starts |
function | the program, all function calls trace back here |
- Source:
init()
Play background music on starting page and save the music
time to make it continuous when naviate to another page
- Source:
init()
Play background music, all function calls in thankyou page trace back here
- Source:
initializeConstellation()
Initialize the info from the previuos page
- Source:
loadCards(formattedJSON)
Create and display the user history cards.
Parameters:
Name | Type | Description |
---|---|---|
formattedJSON |
string | JSON array holding database information formatted for the user history |
- Source:
(async) loadJsonData()
Properties:
Name | Type | Description |
---|---|---|
Helper |
function | function to load json data for constellation and stars |
- Source:
Returns:
cloc, connect constellation location and connect
makePostRequest()
Function makes a post request to add horoscope entry into database, handles request status
adds category, constellation, response text as new row for user
- Source:
openPopup(constellation, textbody)
Function that loads constellation and text body to the popup display.
Parameters:
Name | Type | Description |
---|---|---|
constellation |
string | constellation of the selected fortune in user history |
textbody |
string | text corresponding to the constellation |
- Source:
redirectToPage(url)
Function to redirect to a page.
Parameters:
Name | Type | Description |
---|---|---|
url |
string | The URL of the page to redirect to. |
- Source:
setCanvasPanning(canvas, sky_background)
Set up canvas with panning
Parameters:
Name | Type | Description |
---|---|---|
canvas |
HTMLCanvasElement | |
sky_background |
Background |
- Source:
Returns:
cameraOffset
Reference: https://codepen.io/chengarda/pen/wRxoyB
setRatio()
Properties:
Name | Type | Description |
---|---|---|
Calculate |
function | background ratio according to the user screen size (2:1 of the screen size) |
- Source: