Skip to content

Commit

Permalink
edited the CSS to follow the required specs for the seats coloring, h…
Browse files Browse the repository at this point in the history 
…andled timeout in the updateView function, handled the refresh action by pressing f5
  • Loading branch information
@mohamedtourab
mohamedtourab committed Jun 8, 2019
1 parent cdaddde commit 2af621d
Show file tree
Hide file tree
Showing 4 changed files with 138 additions and 39 deletions.
104 changes: 73 additions & 31 deletions .idea/workspace.xml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion Controller/Controller.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -200,7 +200,8 @@ function updateView(){
if (isset($_SESSION['LAST_ACTIVITY']) && (time() - $_SESSION['LAST_ACTIVITY']) > $timeDuration) {
$_SESSION=array();
session_destroy();
return 'timeout';
array_push($myArray,['timeoutRespone'=>'timeout']);
return json_encode($myArray);
}

$result = $myModel->select("SELECT * FROM airlinedatabase.Seats");
Expand Down
68 changes: 61 additions & 7 deletions View/functions.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ function sendSignUpForm(){
dataType:"text",
success: function (response) {
loggedinResponse(response);
localStorage.setItem("email", response);
},
error: function (xhr) {
document.write("Error while signup");
Expand All @@ -47,6 +48,7 @@ function sendLoginForm() {
success: function (response) { //logged in correctly
if(response.toString()=== user_name.toString()){
loggedinResponse(response);
localStorage.setItem("email", response);
}
else { //failed to log in
loginFailedResponse();
Expand All @@ -71,7 +73,7 @@ function sendLogoutRequest() {
success: function (response) {
console.log(response);
if(response.toString() === 'Done'){
logOutSuccessesResponse();
logOutSuccessesResponse()
}
},
error: function (xhr) {
Expand All @@ -95,18 +97,20 @@ function selectSeat(seat) {
dataType:'text',
success: function (response) {
if(response.toString() === 'timeout'){
logOutSuccessesResponse();
timeOutRespone();
}
else {
if (response.toString() === 'free') {

document.getElementById((seatID+'L')).style.backgroundColor="yellow";
} else if (response.toString() === 'selected') {//selected but not by me

document.getElementById((seatID+'L')).style.backgroundColor="yellow";
} else if (response.toString() === 'already_selected'){//selected by me that's mean that I want to unselect the seat because I pressed twice
seat.checked=false;

document.getElementById((seatID+'L')).style.backgroundColor="green";
} else if (response.toString() === 'purchased') {
seat.disabled = true;
document.getElementById((seatID+'L')).style.backgroundColor="red";

}
}

Expand All @@ -123,6 +127,9 @@ function buySeat() {
data: {purchaseSeatRequest: 'yes'},
dataType:"text",
success: function (response) {
if(response.toString() === 'timeout'){
timeOutRespone();
}
document.getElementById("welcomeParagraph").innerHTML= response;
document.getElementById("welcomeParagraph").style.display = "block";
updateView();
Expand All @@ -134,6 +141,16 @@ function buySeat() {
});
}
function updateView(){

let timeOutR;
//This part to handle the web browser refresh to keep the welcome message appear to the user
const userId = localStorage.getItem("email");
if (userId && userId !== undefined) {
loggedinResponse(userId);
}
else {
welcomingRespone();
}
let seatID;
let color;
$.ajax({
Expand All @@ -142,22 +159,31 @@ function updateView(){
data: {updateView: 'yes'},
dataType:'json',
success: function (JSONObject) {
for (var key in JSONObject) {

for (let key in JSONObject) {
if (JSONObject.hasOwnProperty(key)){
timeOutR = JSONObject[key]['timeoutRespone'];
if(timeOutR=='timeout'){
timeOutRespone();
break;
}
color = JSONObject[key]['color'];
seatID = JSONObject[key]['seatID'];
console.log(color);
if(color == 'Green'){
document.getElementById(seatID).checked = false;
document.getElementById((seatID+'L')).style.backgroundColor="green";
}
else if (color == 'Red'){
document.getElementById(seatID).disabled = true;
document.getElementById((seatID+'L')).style.backgroundColor="red";
}
else if(color == 'Yellow'){
document.getElementById(seatID).checked = true;
document.getElementById((seatID+'L')).style.backgroundColor="yellow";
}
else if(color == 'Orange'){
document.getElementById(seatID).checked = true;
document.getElementById((seatID+'L')).style.backgroundColor="orange";
}
}
}
Expand Down Expand Up @@ -197,6 +223,7 @@ function initSeat(){
innerItemList.appendChild(inputElement);
let labelElement = document.createElement("label");
labelElement.setAttribute("for",currentId);
labelElement.setAttribute("id",currentId+'L');
let textElement = document.createTextNode(currentId.toString());
labelElement.appendChild(textElement);
innerItemList.appendChild(labelElement);
Expand All @@ -220,6 +247,8 @@ function logOutSuccessesResponse() {
document.getElementById("updateID").style.display="none";
document.getElementById("welcomeParagraph").innerHTML = "You are logged out !";
document.getElementById("welcomeParagraph").style.display = "block";
console.log(localStorage.getItem("email"));
localStorage.clear();
}

function loggedinResponse(response){
Expand All @@ -243,4 +272,29 @@ function loginFailedResponse(){
document.getElementById("updateID").style.display="none";
document.getElementById("welcomeParagraph").innerHTML = "Wrong username or password please try again. ";
document.getElementById("welcomeParagraph").style.display = "block";
}
function welcomingRespone(){
document.getElementById("formSignUp").style.display="none";
document.getElementById("formLogin").style.display="none";
document.getElementById("signUpA").style.display="block";
document.getElementById("loginA").style.display="block";
document.getElementById("logoutID").style.display = "none";
document.getElementById("buyID").style.display="none";
document.getElementById("updateID").style.display="none";
document.getElementById("welcomeParagraph").innerHTML = "Please Login or Sign up to start buying seats.";
document.getElementById("welcomeParagraph").style.display = "block";
console.log(localStorage.getItem("email"));
}
function timeOutRespone() {
document.getElementById("formSignUp").style.display="none";
document.getElementById("formLogin").style.display="none";
document.getElementById("signUpA").style.display="block";
document.getElementById("loginA").style.display="block";
document.getElementById("logoutID").style.display = "none";
document.getElementById("buyID").style.display="none";
document.getElementById("updateID").style.display="none";
document.getElementById("welcomeParagraph").innerHTML = "You are logged out for timeout.";
document.getElementById("welcomeParagraph").style.display = "block";
console.log(localStorage.getItem("email"));
localStorage.clear();
}
2 changes: 2 additions & 0 deletions View/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -146,10 +146,12 @@ ol {
box-sizing: border-box;
}
/*checked+label means that the style will be applied for the checked button and its label*/
/*
.seat input[type=checkbox]:checked + label {
background: yellow;
box-sizing: border-box;
}
*/

.seat input[type=checkbox]:disabled + label {
background: red;
Expand Down

0 comments on commit 2af621d

Please sign in to comment.