JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css">
<script src="http://underscorejs.org/underscore.js"></script>
<div class="container-fluid"> <pre class="response"></pre>
<div class="alert hide">
<h1>test</h1>
<p>test</p>
</div>
<a href="#" class="btn btn-success loginBtn">Login</a>
<a href="#" class="btn btn-success meBtn">getMe</a>
<br/>
<h4>New User</h4>
<input type="text" name="newUserEmail" value="" />user email
<input type="text" name="newUserPassword" value="" />user Password
<input type="text" name="newUserFName" value="" />first name
<input type="text" name="newUserLName" value="" />last name
<h5>access</h5>
<ul class="features">
</ul>
<br/> <a href="#" class="btn btn-success createBtn">Create User</a>
<h4>Get USER</h4>
<input type="test" name="id" />user ID
<br/> <a href="#" class="btn btn-success getBtn">Get User</a>
</div>
CSS
.container-fluid {
margin: 20px
}
JavaScript
var adminUser = {
email: "[email protected]",
password: "changeme",
app: "NUTRILITE_APP"
};
var features = {
createUser:true,
getUser:true,
deleteUser:true,
editUser:true,
createProduct:true,
editProduct:true,
deleteProduct:true,
createQuestion:true,
editQuestion:true,
deleteQuestion:true,
createAssessment:true,
editAssessment:true,
deleteAssessment:true
}
for(var feature in features){
$('.features').append('<li><input type="checkbox" name="'+feature+'" value="true">'+feature+'</li>');
}
$('.loginBtn').click(loginUser);
$('.createBtn').click(createUser);
$('.getBtn').click(getMe);
$('.meBtn').click(getMe);
function createUser() {
doRequest({
url: url('/users'),
type: "POST",
data: {
email: getVal("newUserEmail"),
password: getVal("newUserPassword"),
firstName: getVal("newUserFName"),
lastName: getVal("newUserLName"),
app: adminUser.app,
features: {
createUser: getVal("createUser"),
getUser: getVal("getUser"),
deleteUser: getVal("deleteUser"),
editUser: getVal("editUser"),
createProduct:getVal("createProduct"),
editProduct:getVal("editProduct"),
deleteProduct:getVal("deleteProduct"),
createQuestion:getVal("createQuestion"),
editQuestion:getVal("editQuestion"),
deleteQuestion:getVal("deleteQuestion"),
createAssessment:getVal("createAssessment"),
editAssessment:getVal("editAssessment"),
deleteAssessment:getVal("deleteAssessment")
}
}
}, function(err, data){
$('.response').text(JSON.stringify(data));
console.log(arguments);
})
}
function getVal(name) {
return $('[name="' + name + '"]').val();
}
function loginUser() {
doRequest({
...