Skip to content

GitLab

Commit cda02eed authored by Sascha Schefenacker's avatar Sascha Schefenacker
Browse files

adding profile page

parent b06a9c43
Show whitespace changes
Inline Side-by-side
Showing with 158 additions and 109 deletions
views/index.html
View file @ cda02eed
...@@ -5,117 +5,62 @@ ...@@ -5,117 +5,62 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hello World</title> <title>lifeApp</title>
<!-- Bootstrap -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link href="styles.css" rel="stylesheet">
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="js/lib/jquery.i18n/jquery.i18n.js"></script>
<script src="js/lib/jquery.i18n/jquery.i18n.messagestore.js"></script>
<script src="js/lib/jquery.i18n/jquery.i18n.fallbacks.js"></script>
<script src="js/lib/jquery.i18n/jquery.i18n.language.js"></script>
<script src="js/lib/jquery.i18n/jquery.i18n.parser.js"></script>
<script src="js/lib/jquery.i18n/jquery.i18n.emitter.js"></script>
<script src="js/lib/jquery.i18n/jquery.i18n.emitter.bidi.js"></script>
<script src="antixss.js" type="text/javascript"></script>
<script>
$( document ).ready(function() {
$.i18n().load( {
en: {
"welcome": "Welcome.",
"name": "name",
"what_is_your_name": "What is your name?",
"hello": "Hello $1",
"added_to_database": "Hello $1, I've added you to the database!",
"database_contents": "Database contents: "
},
ja: {
"welcome": "ようこそ。",
"name": "名前",
"what_is_your_name": "お名前を教えてください。",
"hello": "こんにちは $1",
"added_to_database": "こんにちは $1 さん、あなたをデータベースに追加しました。",
"database_contents": "データベースの内容: "
}
} );
$('body').i18n();
$('#user_name').attr("placeholder", $.i18n('name') );
});
</script>
</head> </head>
<body> <body>
<div class="container" id="container"> <table style="width:100%">
<h1 data-i18n="welcome"></h1> <!-- Welcome --> <tr style="background-color:#34a8eb">
<div id="nameInput" class="input-group-lg center-block helloInput"> <td>
<p class="lead" data-i18n="what_is_your_name"></p> <table style="width:100%">
<input id="user_name" type="text" class="form-control" aria-describedby="sizing-addon1" value="" /> <tr style="background-color:#34a8eb">
</div> <td><b>lifeApp Logo</b></td>
<p id="response" class="lead text-center"></p> <td>
<a href="protected/userProfile.html">userProfile</a>
</td>
<td>
<a href="/auth/google">Login</a>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<p id="databaseNames" class="lead text-center"></p> <h2>Call for Code 2020:</h2>
</div> <h1>
<footer class="footer"> <br />
<div class="container"> Welcome - LifeApp
<span><a href="https://console.bluemix.net/docs/tutorials/index.html" target="_blank">Looking for more tutorials?</a></span> </h1>
</div>
</footer>
<h2>
<br />
Problem:
</h2>
<p>
There are lots of recommendations available how to provide for
disasters (e.g. how much water, food, and medicine to stock) but only
few people abide by these recommendations. In case of disaster, most
people need immediate help and there is limited information available
on who needs help most.
<br />
</p>
<h1>
<br />
The Team
</h1>
<p>
<ul>
<li>Sascha Schefenacker</li>
</ul>
</p>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
</body> </body>
</html> </html>
\ No newline at end of file
<script>
//Submit data when enter key is pressed
$('#user_name').keydown(function(e) {
var name = $('#user_name').val();
if (e.which == 13 && name.length > 0) { //catch Enter key
//POST request to API to create a new visitor entry in the database
$.ajax({
method: "POST",
url: "./api/visitors",
contentType: "application/json",
data: JSON.stringify({name: name })
})
.done(function(data) {
if(data && data.name){
if(data._id)
$('#response').html($.i18n('added_to_database', AntiXSS.sanitizeInput(data.name)));
else
$('#response').html($.i18n('hello', AntiXSS.sanitizeInput(data.name)));
}
else {
$('#response').html(AntiXSS.sanitizeInput(data));
}
$('#nameInput').hide();
getNames();
});
}
});
//Retrieve all the visitors from the database
function getNames(){
$.get("./api/visitors")
.done(function(data) {
if(data.length > 0) {
data.forEach(function(element, index) {
data[index] = AntiXSS.sanitizeInput(element)
});
$('#databaseNames').html($.i18n('database_contents') + JSON.stringify(data));
}
});
}
//Call getNames on page load.
getNames();
</script>
\ No newline at end of file
views/protected/userProfile.html 0 → 100644
View file @ cda02eed
<!DOCTYPE html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
crossorigin="anonymous"></script>
</head>
<body>
<table style="width:100%">
<tr style="background-color:#34a8eb">
<td>
<table style="width:100%">
<tr style="background-color:#34a8eb">
<td><b>lifeApp Logo</b></td>
<td>
<a href="./index.html">Landing</a>
</td>
<td style="text-align:right">
<div class="login_state"></div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<h2>Call for Code 2020:</h2>
<p>My Profile Date</p>
<br>
The username out of the browser session storage: <div id="result"></div>
<script>
// Check browser support
if (typeof(Storage) !== "undefined") {
// Retrieve
document.getElementById("result").innerHTML = sessionStorage.getItem("lastname");
} else {
document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Storage...";
}
</script>
<br>
<hr></hr>
<script type="text/javascript">
//get the data from login
$.getJSON("https://saschastarter.eu-de.mybluemix.net/profile",
function (data) {
console.log("process response");
if (data.emails[0].value != null) {
$(".login_state").html('<a href="https://saschastarter.eu-de.mybluemix.net/profile">'+data.emails[0].value+'</a>');
} else {
$(".login_state").html('<a href="https://saschastarter.eu-de.mybluemix.net/auth/google">Login</a>');
}
// Check browser support
if (typeof(Storage) !== "undefined") {
// Store
sessionStorage.setItem("lastname", data.displayName);
sessionStorage.setItem("email", data.emails[0].value);
} else {
document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Storage...";
}
console.log("sessionStorage done "+data.displayName);
}
);
$.fn.serializeObject = function()
{
var o = {};
var jsonString ="{";
var a = this.serializeArray();
$.each(a, function() {
console.log("name: "+this.name+" value: "+this.value);
if (o[this.name]) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
jsonString=jsonString+"\""+this.name+"\":\""+this.value+"\",";
}
});
jsonString=jsonString.substring(0, jsonString.length - 1);
jsonString=jsonString+"}";
console.log("jsonString: "+jsonString);
return jsonString;
};
</script>
<hr></hr>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
</body>
</html>
  • Sascha Schefenacker @sascha.schefenacker ·
    Maintainer

    IBM Cloud toolchain: Delivery Pipeline deployed saschaStarter to saschaDev, including this commit

Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment