-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #36 from CYPIAPT-LNDSE/WTC-10-personality-page
WTC-10-personality page, relates is issue #10
- Loading branch information
Showing
9 changed files
with
210 additions
and
27 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,53 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Henny+Penny|Montserrat+Alternates" > | ||
<link rel="stylesheet" href="main.css"> | ||
<script src="https://hammerjs.github.io/dist/hammer.js"></script> | ||
<title>Welcome to CAMHS</title> | ||
</head> | ||
<body> | ||
<div class="personality"> | ||
<div class="personality__text"> | ||
<h2 class="personality__title">How would you describe yourself?</h2> | ||
</div> | ||
<div class="personality__types emotions"> | ||
<div class="row"> | ||
<div class="personality__shape rotate-10"> | ||
<p class="characteristics">fun</p> | ||
</div> | ||
<div class="personality__shape rotate-45"> | ||
<p class="characteristics">sad</p> | ||
</div> | ||
<div class="personality__shape"> | ||
<p class="characteristics">angry</p> | ||
</div> | ||
</div> | ||
<div class="personality__shape rotate-330"> | ||
<p class="characteristics">friendly</p> | ||
</div> | ||
<div class="personality__shape rotate-10"> | ||
<p class="characteristics">kind</p> | ||
</div> | ||
<div class="personality__shape rotate-330"> | ||
<p class="characteristics">sociable</p> | ||
</div> | ||
<div class="personality__shape rotate-10"> | ||
<p class="characteristics">boring</p> | ||
</div> | ||
<div class="personality__shape rotate-330"> | ||
<p class="characteristics">crazy</p> | ||
</div> | ||
<div class="personality__shape"> | ||
<p class="characteristics">loving</p> | ||
</div> | ||
</div> | ||
<div class="personality__text"> | ||
<p>Other:<p> | ||
<input class="text-input" type="text" autofocus=""> | ||
</div> | ||
<script src="swipe.js"></script> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,58 @@ | ||
function swipe(direction){ | ||
var endpoint = window.location.href.split('/')[7]; | ||
var forward, backward; | ||
|
||
// Homepage to choose an avatar page | ||
if (endpoint === 'index.html'){ | ||
forward = 'choose-an-avatar.html', | ||
backward = '' | ||
}; | ||
|
||
// Avatar to introduction page | ||
if (endpoint === 'choose-an-avatar.html'){ | ||
forward = 'introduction.html', | ||
backward = 'index.html' | ||
}; | ||
|
||
// Introduction to feelings page | ||
if (endpoint === 'introduction.html'){ | ||
forward = 'feelings.html', | ||
backward = 'choose-an-avatar.html' | ||
}; | ||
|
||
// Feelings page to eating page | ||
if (endpoint === 'feelings.html'){ | ||
forward = 'eating.html', | ||
backward = 'introduction.html' | ||
}; | ||
|
||
// Eating page to finish page | ||
if (endpoint === 'eating.html'){ | ||
forward = 'personality.html', | ||
backward = 'feelings.html' | ||
}; | ||
|
||
// Eating page to finish page | ||
if (endpoint === 'personality.html'){ | ||
forward = 'finished.html', | ||
backward = 'eating.html' | ||
}; | ||
|
||
// Eating page to finish page | ||
if (endpoint === 'finished.html'){ | ||
forward = '', | ||
backward = 'eating.html' | ||
}; | ||
|
||
if(direction === "swipeleft" && event.target.tagName !== 'IMG'){ | ||
window.location.href = forward; | ||
} | ||
|
||
if(direction === "swiperight" && event.target.tagName !== 'IMG'){ | ||
window.location.href = backward; | ||
} | ||
} | ||
|
||
// The if statement stops the carousel from triggering the page swipe | ||
Hammer(document.body).on("swipeleft", function(){ swipe("swipeleft") }); | ||
Hammer(document.body).on("swiperight", function(){ swipe("swiperight") }); |