Skip to content

Commit

Permalink
Fleshed out the Borrow Entry Input form and completed the pipeline to…
Browse files Browse the repository at this point in the history 
… the database.
  • Loading branch information
@WilliamRADFunk
WilliamRADFunk committed Jan 21, 2016
1 parent f0b35b7 commit 62431ae
Show file tree
Hide file tree
Showing 6 changed files with 287 additions and 16 deletions.
13 changes: 11 additions & 2 deletions css/styles.css
View file
Expand Up @@ -199,7 +199,7 @@ footer
}
/**
*
* Styles for income entry form
* Styles for income, expense, and borrow entry forms
*
**/
.input
Expand All @@ -210,7 +210,7 @@ footer
.input input[type="text"],
.input input[type="number"]
{
width: 96%;
width: 94%;
}
.input input[type="date"]
{
Expand All @@ -221,6 +221,15 @@ footer
height: 34px;
width: 100%;
}
.input-full
{
display: inline-block;
width: 100%;
}
.input-full input[type="text"]
{
width: 95%;
}
.middle
{
margin-left: 5%;
Expand Down
27 changes: 27 additions & 0 deletions js/data.js
View file
Expand Up @@ -83,5 +83,32 @@ function expenseEntry(expensePackage)
}
});

return result;
}
/* Inserts the new borrow entry into the database */
function borrowEntry(borrowPackage)
{
var result = "false";

$.ajax({
type:'POST',
url:'http://www.williamrobertfunk.com/applications/financial-tracking-repository/actions/addBorrow.php',
data: JSON.stringify(borrowPackage),
contentType:'application/x-www-form-urlencoded; charset=utf-8',
dataType:'text',
async: false,
success:function(responseData)
{
result = JSON.parse(responseData).success;
},
error:function(error)
{
console.log(error);
console.log(error.responseText);
console.log(error.status);
console.log(error.statusText);
}
});

return result;
}
57 changes: 51 additions & 6 deletions js/development/reactScripts.js
View file
Expand Up @@ -268,8 +268,8 @@ var Income = React.createClass
<div className="input right">
<p><label htmlFor="income_country">Country:</label></p>
<select id="income_country">
<option id="usa" value="usa">USA</option>
<option id="canada" value="canada">Canada</option>
<option value="usa">USA</option>
<option value="canada">Canada</option>
</select>
</div>
<div className="input left">
Expand Down Expand Up @@ -414,8 +414,8 @@ var Expense = React.createClass
<div className="input right">
<p><label htmlFor="expense_country">Country:</label></p>
<select id="expense_country">
<option id="usa" value="usa">USA</option>
<option id="canada" value="canada">Canada</option>
<option value="usa">USA</option>
<option value="canada">Canada</option>
</select>
</div>
<div className="input left">
Expand Down Expand Up @@ -461,7 +461,7 @@ var Borrow = React.createClass
{
if(e.currentTarget.innerHTML === "Homepage") this.props.onPhaseChange("Navigate");
else if(e.currentTarget.innerHTML === "Entry type") this.props.onPhaseChange("InputType");
else if(e.currentTarget.value === "SUBMIT") this.handleSubmissionResponse(processExpenseEntry(e));
else if(e.currentTarget.value === "SUBMIT") this.handleSubmissionResponse(processBorrowEntry(e));
},
render: function()
{
Expand All @@ -471,7 +471,52 @@ var Borrow = React.createClass
<li className="breadcrumb"><span className="breadcrumb-label" onClick={this.handleClick}>Entry type</span>&nbsp;&nbsp;&gt;&nbsp;&nbsp;</li>
<li className="breadcrumb"><span className="breadcrumb-label" onClick={this.handleClick}>Borrow</span></li>
</ul>
<p>Borrow Entry</p>
<SuccessModal display={this.state.modalSuccess}/>
<FailedModal display={this.state.modalFail}/>
<NoKeyModal display={this.state.modalNoKey}/>
<form id="form_borrow" method="post">
<h2>Expense</h2>
<div className="content">
<div className="input left">
<p><label htmlFor="subtracted">Subtract:</label></p>
<input id="subtracted" type="text"/>
</div>
<div className="input middle">
<p><label htmlFor="borrowed">Borrowed:</label></p>
<input id="borrowed" type="text"/>
</div>
<div className="input right">
<p><label htmlFor="added">Added:</label></p>
<input id="added" type="text"/>
</div>
<div className="input left">
<p><label htmlFor="borrow_country">Country:</label></p>
<select id="borrow_country">
<option value="usa">USA</option>
<option value="canada">Canada</option>
</select>
</div>
<div className="input middle">
<p><label htmlFor="borrow_person">Person:</label></p>
<select id="borrow_person">
<option id="borrow_local" value="local">Local</option>
<option id="borrow_fam" value="fam">Fam</option>
<option id="borrow_omar" value="omar">Omar</option>
<option id="borrow_taxes" value="taxes">Taxes</option>
</select>
</div>
<div className="input right">
<p><label htmlFor="date-trans">Date of Transaction:</label></p>
<input id="date-trans" type="date"/>
</div>
<div className="input-full left">
<p><label htmlFor="purpose">Purpose:</label></p>
<input id="purpose" type="text"/>
</div>
<hr/>
<input id="btn_subbor" className="btn_submit" type="submit" onClick={this.handleClick} value="SUBMIT"/>
</div>
</form>
</div>);
}
});
Expand Down
22 changes: 22 additions & 0 deletions js/development/scripts.js
View file
Expand Up @@ -53,6 +53,28 @@ function processExpenseEntry(e)
document.getElementById("form_expense").reset();
return expenseEntry(expensePackage);
}
function processBorrowEntry(e)
{
killDefaultEvent(e);
var purpose = (document.getElementById("purpose").value).replace(/[^\w\s]/gi, '');
var person = (document.getElementById("borrow_person").value).replace(/[^\w\s]/gi, '');
var country = (document.getElementById("borrow_country").value).replace(/[^\w\s]/gi, '');
var transDate = (document.getElementById("date-trans").value).replace(/[^\w\s]/gi, '');
var subtract = (document.getElementById("subtracted").value).replace(/[^\w\s]/gi, '');
var add = (document.getElementById("added").value).replace(/[^\w\s]/gi, '');
var borrow = (document.getElementById("borrowed").value).replace(/[^\w\s]/gi, '');
var borrowPackage = {
purpose: purpose,
person: person,
country: country,
transDate: transDate,
subtracted: subtract,
added: add,
borrowed: borrow
};
document.getElementById("form_borrow").reset();
return borrowEntry(borrowPackage);
}
function killDefaultEvent(e)
{
e.preventDefault();
Expand Down
163 changes: 155 additions & 8 deletions js/reactScripts.js
View file
Expand Up @@ -464,12 +464,12 @@ var Income = React.createClass({
{ id: "income_country" },
React.createElement(
"option",
{ id: "usa", value: "usa" },
{ value: "usa" },
"USA"
),
React.createElement(
"option",
{ id: "canada", value: "canada" },
{ value: "canada" },
"Canada"
)
)
Expand Down Expand Up @@ -924,12 +924,12 @@ var Expense = React.createClass({
{ id: "expense_country" },
React.createElement(
"option",
{ id: "usa", value: "usa" },
{ value: "usa" },
"USA"
),
React.createElement(
"option",
{ id: "canada", value: "canada" },
{ value: "canada" },
"Canada"
)
)
Expand Down Expand Up @@ -978,7 +978,7 @@ var Borrow = React.createClass({
}
},
handleClick: function (e) {
if (e.currentTarget.innerHTML === "Homepage") this.props.onPhaseChange("Navigate");else if (e.currentTarget.innerHTML === "Entry type") this.props.onPhaseChange("InputType");else if (e.currentTarget.value === "SUBMIT") this.handleSubmissionResponse(processExpenseEntry(e));
if (e.currentTarget.innerHTML === "Homepage") this.props.onPhaseChange("Navigate");else if (e.currentTarget.innerHTML === "Entry type") this.props.onPhaseChange("InputType");else if (e.currentTarget.value === "SUBMIT") this.handleSubmissionResponse(processBorrowEntry(e));
},
render: function () {
return React.createElement(
Expand Down Expand Up @@ -1017,10 +1017,157 @@ var Borrow = React.createClass({
)
)
),
React.createElement(SuccessModal, { display: this.state.modalSuccess }),
React.createElement(FailedModal, { display: this.state.modalFail }),
React.createElement(NoKeyModal, { display: this.state.modalNoKey }),
React.createElement(
"p",
null,
"Borrow Entry"
"form",
{ id: "form_borrow", method: "post" },
React.createElement(
"h2",
null,
"Expense"
),
React.createElement(
"div",
{ className: "content" },
React.createElement(
"div",
{ className: "input left" },
React.createElement(
"p",
null,
React.createElement(
"label",
{ htmlFor: "subtracted" },
"Subtract:"
)
),
React.createElement("input", { id: "subtracted", type: "text" })
),
React.createElement(
"div",
{ className: "input middle" },
React.createElement(
"p",
null,
React.createElement(
"label",
{ htmlFor: "borrowed" },
"Borrowed:"
)
),
React.createElement("input", { id: "borrowed", type: "text" })
),
React.createElement(
"div",
{ className: "input right" },
React.createElement(
"p",
null,
React.createElement(
"label",
{ htmlFor: "added" },
"Added:"
)
),
React.createElement("input", { id: "added", type: "text" })
),
React.createElement(
"div",
{ className: "input left" },
React.createElement(
"p",
null,
React.createElement(
"label",
{ htmlFor: "borrow_country" },
"Country:"
)
),
React.createElement(
"select",
{ id: "borrow_country" },
React.createElement(
"option",
{ value: "usa" },
"USA"
),
React.createElement(
"option",
{ value: "canada" },
"Canada"
)
)
),
React.createElement(
"div",
{ className: "input middle" },
React.createElement(
"p",
null,
React.createElement(
"label",
{ htmlFor: "borrow_person" },
"Person:"
)
),
React.createElement(
"select",
{ id: "borrow_person" },
React.createElement(
"option",
{ id: "borrow_local", value: "local" },
"Local"
),
React.createElement(
"option",
{ id: "borrow_fam", value: "fam" },
"Fam"
),
React.createElement(
"option",
{ id: "borrow_omar", value: "omar" },
"Omar"
),
React.createElement(
"option",
{ id: "borrow_taxes", value: "taxes" },
"Taxes"
)
)
),
React.createElement(
"div",
{ className: "input right" },
React.createElement(
"p",
null,
React.createElement(
"label",
{ htmlFor: "date-trans" },
"Date of Transaction:"
)
),
React.createElement("input", { id: "date-trans", type: "date" })
),
React.createElement(
"div",
{ className: "input-full left" },
React.createElement(
"p",
null,
React.createElement(
"label",
{ htmlFor: "purpose" },
"Purpose:"
)
),
React.createElement("input", { id: "purpose", type: "text" })
),
React.createElement("hr", null),
React.createElement("input", { id: "btn_subbor", className: "btn_submit", type: "submit", onClick: this.handleClick, value: "SUBMIT" })
)
)
);
}
Expand Down

0 comments on commit 62431ae

Please sign in to comment.