76 public/js/Controller/Controller.js
View file
@@ -5,6 +5,7 @@
$ctrl.progressBar;
$ctrl.amount;
$ctrl.dayCount;
$ctrl.moodCurrent;
$ctrl.usedEvents = [];
$ctrl.randPiggy = Math.floor(Math.random() * 12) + 5;
$ctrl.randDonate = Math.floor(Math.random() * 30) + 20;
@@ -13,14 +14,12 @@

getEverything();
console.log($ctrl.eventObj);
$ctrl.selectOption = function(amount) {
$ctrl.selectOption = function(price, mood) {
// console.log(amount);
FoodFightService.changeProgressBar(amount);
FoodFightService.changeAmount(amount);
FoodFightService.changeProgressBar(price);
FoodFightService.changeAmount(price);
FoodFightService.sendMood(mood);
getEverything();
if ($ctrl.amount <= 0) {
$location.path("/results");
}
};

$ctrl.piggyBank = function() {
@@ -30,8 +29,12 @@
$ctrl.progressBar = FoodFightService.getProgressBar();
$ctrl.amount = FoodFightService.getAmount();
$(".mainProgress").attr("value", $ctrl.amount);
$("progress").attr("max", randPiggyHolder + 150);
$(".mainProgress").attr("max", randPiggyHolder + 150);
$ctrl.randPiggyUse--;
$(".piggy")
.find("img")
.attr("src", "dependencies/piggy-bank-used.svg");
$(".piggy").css("border", "3px solid grey");
} else {
//end goal => show div with error
alert("You've already taken your kids' piggy-banks!");
@@ -44,8 +47,12 @@
$ctrl.progressBar = FoodFightService.getProgressBar();
$ctrl.amount = FoodFightService.getAmount();
$(".mainProgress").attr("value", $ctrl.amount);
$("progress").attr("max", randDonateHolder + 150);
$(".mainProgress").attr("max", randDonateHolder + 150);
$ctrl.randDonateUse--;
$(".blood")
.find("img")
.attr("src", "dependencies/blood-sample-used.svg");
$(".blood").css("border", "3px solid grey");
} else {
//end goal=> show div with error
alert("You've already given blood!");
@@ -60,23 +67,23 @@
} else {
getEverything();
}
$ctrl.progressBar = FoodFightService.getProgressBar();
$ctrl.amount = FoodFightService.getAmount();
if ($ctrl.amount <= 0) {
$location.path("/results");
}
$ctrl.dayCount = FoodFightService.changeDayCount();
$ctrl.moodCurrent = FoodFightService.getMood();
$(".mainProgress").attr("value", $ctrl.amount);
$(".moodProgress").attr("value", $ctrl.moodCurrent);
var windowWidth = $(window).width();
if (windowWidth < 480) {
cashMinItems();
} else {
cashMenuItems();
}
moodIcon();
});
// $ctrl.eventObj = event;
// $ctrl.usedEvents.push(event.id);
$ctrl.progressBar = FoodFightService.getProgressBar();
$ctrl.amount = FoodFightService.getAmount();
$ctrl.dayCount = FoodFightService.changeDayCount();
$(".mainProgress").attr("value", $ctrl.amount);
var windowWidth = $(window).width();
if (windowWidth < 480) {
cashMinItems();
} else {
cashMenuItems();
}
// } else {
// getEverything();
// }
// });
}

function cashMenuItems() {
@@ -130,6 +137,27 @@
}
$(document).ready(updateSize);
$(window).resize(updateSize);

function moodIcon() {
$(".emotionWriteTo").empty();
if ($ctrl.moodCurrent >= 10) {
$(".emotionWriteTo").html('<i class="material-icons">mood</i>');
} else if ($ctrl.moodCurrent >= 7) {
$(".emotionWriteTo").html(
'<i class="material-icons">sentiment_satisfied</i>'
);
} else if ($ctrl.moodCurrent >= 4) {
$(".emotionWriteTo").html(
'<i class="material-icons">sentiment_neutral</i>'
);
} else if ($ctrl.moodCurrent >= 2) {
$(".emotionWriteTo").html(
'<i class="material-icons">sentiment_dissatisfied</i>'
);
} else {
$(".emotionWriteTo").html('<i class="material-icons">mood_bad</i>');
}
}
}
angular.module("App").controller("controllerFunction", controllerFunction);
})();
25 public/js/Service/FoodFightService.js
View file
@@ -3,6 +3,7 @@
var progressValue = 150;
var dollarValue = 150;
var dayCount = 1;
var currentMood = 10;
var event = {
eventName: "I'm an event",
text: "You've been hit with an event. Choose a thing.",
@@ -21,7 +22,9 @@
getEvents: getEvents,
breakPiggy: breakPiggy,
donateBlood: donateBlood,
getDayCount: getDayCount
getDayCount: getDayCount,
sendMood: sendMood,
getMood: getMood
};
function changeProgressBar(progressBar) {
progressValue -= progressBar;
@@ -52,16 +55,22 @@
function randNum() {
return Math.floor(Math.random() * 10) + 1;
}
function getDayCount(){
function getDayCount() {
return dayCount;
}
function sendMood(amount) {
currentMood -= amount;
}
function getMood() {
return currentMood;
}


function getEvents() {
return $http({
method:"GET",
url:"/events"
}).then(function(response){
function getEvents() {
return $http({
method: "GET",
url: "/events"
})
.then(function(response) {
//console.log("from service ",response.data);

return response.data[randNum()];
16 public/js/directives/slideup.directive.js
View file
@@ -23,10 +23,7 @@
mouseMotionType: 'gaussian'
});

$scope.$on("$destroy", function() {
console.log("destroying...");
$($element).data("plugin_parallaxify").destroy();
});


// // using the linear positioning function
// $('#other').parallaxify({
@@ -346,8 +343,8 @@
}
},
_detectViewport: function () {
this.viewportWidth = this.$viewportElement.width();
this.viewportHeight = this.$viewportElement.height();
this.viewportWidth = this.$element.width();
this.viewportHeight = this.$element.height();
if (this.useSensor) {
this.viewportFlipped = (window.orientation === 180);
this.viewportLandscape = (Math.abs(window.orientation) === 90);
@@ -757,7 +754,14 @@

// Expose the plugin class so it can be modified
window[pluginName] = Plugin;
$scope.$on("$destroy", function() {
console.log("destroying...");
Plugin(element, options);
// $($element).data(pluginName).destroy();
//$.data(this, 'plugin_' + pluginName, null);
});
}(jQuery, this, document));

}
};
}
274 public/style/main.css
View file
@@ -13,15 +13,15 @@ body {
background-size: cover;
}

#backbutton{
font-weight:normal;
#backbutton {
font-weight: normal;
font-size: 1.75em;
position:fixed;
position: fixed;
display: flex;
top:38px;
left:217px;
top: 38px;
left: 217px;
}
#removeline{
#removeline {
text-decoration: none;
}

@@ -103,7 +103,7 @@ button {
color: white;
}

progress {
.mainProgress {
background-color: crimson;
width: 100%;
height: 4px;
@@ -116,7 +116,7 @@ progress {
transition: 0.3s;
}

progress::-webkit-progress-value {
.mainProgress::-webkit-progress-value {
background-color: #dc143c;
}

@@ -174,13 +174,12 @@ a {
height: 75px;
width: 75px;
border-radius: 50%;
border: 3px solid #dc143c;
background-color: #1f1f1f;
border: 3px solid #dc143c; background-color: #1f1f1f;
}

.piggy:hover,
.blood:hover {
background-color: rgb(25, 25, 25);
background-color: rgb(22, 22, 22);
}

.blood {
@@ -217,11 +216,15 @@ a {
width: 0;
overflow-x: hidden;
overflow: hidden;
transition: 0.3s;
transition: 0.5s;
}
.needCashMenu p {
white-space: nowrap;
font-size: 1.2em;
border-top: 2px solid gray;
padding: 0;
margin: 0;
margin-left: -10px;
padding-bottom: 15px;
}

.getCash {
@@ -234,7 +237,7 @@ a {
clip-path: polygon(0 0, 25px 10px, 25px 90px, 0 100px);
border-radius: 3px;
background-color: rgba(255, 255, 255, 0.2);
transition: 0.3s;
transition: 0.5s;
}

.getCash p {
@@ -247,14 +250,15 @@ a {

.cashGrabItems {
padding: 15px;
margin-top: 40vh;
margin-top: 41vh;
transform: translateY(-50%);
}

.needCashMenu li {
list-style: none;
margin: 50px 0;
transition: 0.3s;
margin: 25px 0 0 20px;
transition: 0.5s;
margin-left: 5px !important;
}

.main {
@@ -403,7 +407,7 @@ input {
#donateDiv a {
text-decoration: none;
margin-bottom: 10px;
background-color:
/* background-color: */
}

.donateInputs {
@@ -421,8 +425,229 @@ input {
display: flex;
flex-direction: column;
}
.mood {
transform: rotate(-90deg);
display: flex;
position: absolute;
top: 75px;
left: 0;
}
.mood span {
transform: rotate(90deg);
width: 44px;
border-top: 2px solid #dc143c;
margin-right: -7px;
}
.mood span i {
font-size: 2em;
padding: 4px;
}
.moodProgress {
width: 75px;
height: 30px;
margin-top: 6px;
margin-left: 6px;
background-color: #dc143c;
}
.moodProgress::-webkit-progress-value {
background-color: #dc143c;
}
/*-=---------------------RESULT-----------------------------------------------------------------------*/
.mainResult{
overflow: hidden;
background-image: url("../images/food.png");
background-size: cover;
width: 100vw;
height: 100vh;
}
.formFocus{
display: none;
position: fixed;
top:-50px;
left:-50px;
width: 120vw;
height: 120vh;
background-color: #000000b0;
}
.formFocus i {
position: fixed;
top:30px;
right: 30px;
color: white;
}
.creditForm {
display: none;
width: 400px;
height: 350px;
background-color: #1f1f1f;
border-radius: 15px;
border: 7px solid #313131;
display: flex;
flex-direction: column;
position: absolute;
top:200px;
left:50%;
transform: translateX(-50%);
}
.form {
width: 300px;
margin: 20px auto;
}
.ccNum {
display: flex;
align-items: flex-end;
}
.ccNum div label {
font-size: 0.7em;
display: flex;
flex-direction: column;
}
.ccNum div label input {
width: 55px;
height: 25px;
margin-left:0;
border-radius: 3px;
padding-left: 5px;
}
.ccNum input {
width: 55px;
height: 25px;
margin-left: 10px;
border-radius: 3px;
padding-left: 5px;
}
.cardName {
display: flex;
align-items: flex-end;
margin-top: 10px
}
.cardName label {
font-size: 0.7em;
display: flex;
flex-direction: column;
float: left;
text-align: start;
}
.cardName label input {
width: 280px;
height: 25px;
border-radius: 3px;
padding-left: 5px;
}
.expirationLabel {
display: flex;
align-items: flex-end;
}
.expirationLabel label {
font-size: 0.7em;
display: flex;
flex-direction: column;
}
.expirationLabel label select {
width: 50px;
height: 30px;
margin-left: 0;
border-radius: 3px;
}
.expWhole select {
margin-left: 5px;
border-radius: 3px;
}
.expWhole select {
width: 50px;
height: 30px;
border-radius: 3px;
}
.expWhole {
display: flex;
flex-direction: row;
align-items: flex-end;
}
.ccvForm {
display: flex;
align-items: flex-end;
}
.ccvForm label {
font-size: 0.7em;
display: flex;
flex-direction: column;
float: left;
text-align: start;
}
.ccvForm label input {
width: 50px;
height: 25px;
border-radius: 3px;
padding-left: 5px;
}
.expCCV {
display: flex;
flex-direction: row;
justify-content: space-between;
width: 285px;
margin-top: 15px
}
.card {
width: 350px;
height: 215px;
border-radius: 5px;
margin: -150px auto 0 auto;
background: radial-gradient(circle at 100% 100%, rgb(100, 1, 100), rgb(197, 1, 148));
font-family: 'Coda', cursive;
}
.chip{
background: radial-gradient(circle at 100% 100%, #adadad, #e7e7e7);
border-top: 1px solid purple;
border-left: 1px solid purple;
border-right: 1px solid rgb(184, 0, 184);
border-bottom: 1px solid rgb(184, 0, 184);
width: 50px;
height: 35px;
border-radius:5px;
}
.chipDec {
width: 30px;
height: 17px;
margin:auto;
border-radius: 5px;
border: 3px solid grey;
margin-top: 5px;
}
.topCard {
display: flex;
justify-content: space-between;
padding: 30px 20px;
align-items: start;
}
.topCard p{
margin:0;
}
.cardNumbers{
display: flex;
margin: 0 30px;
padding: 0;
margin-top: -15px;
font-size: 1.7em;
letter-spacing: .11em;
}

.cardNameonCard{
display:flex;
font-size:0.8em;
margin: -30px 25px 0 20px;
justify-content: space-between;
}

.expOnCard div {
display:flex;

}
.expOnCard{
font-size: 1em;
display:flex;
justify-content: space-between;
margin: -30px 30px 0 30px;
}


/* ////////////////////////////////////////////////////////////////////////////////////////////////////// */
@@ -498,7 +723,7 @@ input {
.getCash {
display: none;
}
progress {
.mainProgress {
left: 119px;
height: 5px;
width: calc(100% - 119px);
@@ -623,7 +848,7 @@ input {
.secondaryButton:hover {
border-bottom: 2px solid #dc143c;
}

/* #resultsDiv {
margin: 0 auto;
}*/
@@ -664,7 +889,7 @@ input {
.getCash {
display: none;
}
progress {
.mainProgress {
left: 119px;
height: 5px;
width: calc(100% - 119px);
@@ -707,7 +932,7 @@ input {
hr {
width: 50vw;
}
footer{
footer {
transform: translateX(-50%);
}
}
@@ -825,7 +1050,7 @@ input {
.getCash {
display: none;
}
progress {
.mainProgress {
left: 119px;
height: 5px;
width: calc(100% - 119px);
@@ -868,8 +1093,7 @@ input {
hr {
width: 50vw;
}
footer{
footer {
transform: translateX(-50%);

}
}