Said : Try other method..
This commit is contained in:
Bachar Said
parent
025d398a66
commit
5bfa9a0b41
11 changed files with 90 additions and 76 deletions
Binary file not shown.
|
|
@ -66,25 +66,41 @@ def stringToRGB(base64_string):
|
|||
|
||||
|
||||
|
||||
API_CARD = "http://192.168.37.69:50001/cards"
|
||||
API_CARD = "http://192.168.37.69:50001/time"
|
||||
|
||||
@app.route("/new-game", methods=['POST', 'GET'])
|
||||
def getCards():
|
||||
res = requests.get(API_CARD).json()
|
||||
card = res.get('la_carte') # our port
|
||||
cards_array = np.array(json.loads(card))
|
||||
img = Image.fromarray(np.uint8(cards_array))
|
||||
pil_img = serve_pil_image(img)
|
||||
print(type(pil_img))
|
||||
pil_img.direct_passthrough = False
|
||||
print(type(pil_img.data))
|
||||
imageStream = io.BytesIO(pil_img.data)
|
||||
imageFile = Image.open(imageStream)
|
||||
print(type(imageFile))
|
||||
card1 = res.get('first_card') # our port
|
||||
card2 = res.get('second_card')
|
||||
|
||||
card1_array = np.array(json.loads(card1))
|
||||
card2_array = np.array(json.loads(card2))
|
||||
|
||||
img1 = Image.fromarray(np.uint8(card1_array))
|
||||
img2 = Image.fromarray(np.uint8(card2_array))
|
||||
|
||||
pil_img1 = serve_pil_image(img1)
|
||||
pil_img2 = serve_pil_image(img2)
|
||||
|
||||
pil_img1.direct_passthrough = False
|
||||
pil_img2.direct_passthrough = False
|
||||
|
||||
print(type(pil_img1.data))
|
||||
|
||||
imageStream1 = io.BytesIO(pil_img1.data)
|
||||
imageFile1 = Image.open(imageStream1)
|
||||
|
||||
imageStream2 = io.BytesIO(pil_img2.data)
|
||||
imageFile2 = Image.open(imageStream2)
|
||||
|
||||
buffer = io.BytesIO()
|
||||
imageFile.save(buffer, format='JPEG')
|
||||
print(type(imageFile))
|
||||
card = imageFile.save("./static/images/temp/card1.jpg")
|
||||
imageFile1.save(buffer, format='JPEG')
|
||||
imageFile2.save(buffer, format='JPEG')
|
||||
|
||||
imageFile1.save("./static/images/temp/card1.jpg")
|
||||
imageFile2.save("./static/images/temp/card2.jpg")
|
||||
|
||||
return render_template('new-game.html')
|
||||
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 44 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 39 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 42 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 21 KiB |
BIN
IPreoject-CLientSide/static/images/temp/card2.jpg
Normal file
BIN
IPreoject-CLientSide/static/images/temp/card2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
|
|
@ -21,7 +21,7 @@ function tick(){
|
|||
sec = 0;
|
||||
min = 0;
|
||||
hrs = 0;
|
||||
ress = confirm("This part is finished! YOU SCORE IS:" + score + "Do you want to spot it again?");
|
||||
ress = confirm("This part is finished! YOU SCORE IS: " + score + " | Do you want to spot it again?");
|
||||
if(ress){
|
||||
window.location.href = "http://127.0.0.1:5000/rules";
|
||||
}
|
||||
|
|
@ -70,10 +70,13 @@ var httpRequest;
|
|||
|
||||
|
||||
var card1 = document.getElementById('clickme');
|
||||
var card2 = document.getElementById('card2');
|
||||
var card3 = document.getElementById('card3');
|
||||
var card4 = document.getElementById('card4');
|
||||
var card2 = document.getElementById('card1');
|
||||
var card3 = document.getElementById('card2');
|
||||
var card4 = document.getElementById('card');
|
||||
|
||||
|
||||
const URL = 'http://192.168.37.69:50001/cards'
|
||||
var xhr = new XMLHttpRequest();
|
||||
|
||||
function clickEvent(e) {
|
||||
// e = Mouse click event.
|
||||
|
|
@ -83,54 +86,61 @@ function clickEvent(e) {
|
|||
|
||||
// localStorage.setItem('xPosition', x);
|
||||
// localStorage.setItem('yPosition', y);
|
||||
|
||||
console.log(card4);
|
||||
|
||||
|
||||
//console.log("OK");
|
||||
httpRequest = new XMLHttpRequest();
|
||||
//httpRequest = new XMLHttpRequest();
|
||||
|
||||
if(!httpRequest) {
|
||||
alert('Giving Up! Cannot send an XMLHTTO request.');
|
||||
}
|
||||
// if(!httpRequest) {
|
||||
// alert('Giving Up! Cannot send an XMLHTTO request.');
|
||||
// }
|
||||
|
||||
httpRequest.open('POST', 'http://127.0.0.1:5000/apitest');
|
||||
//httpRequest.open('POST', 'http://127.0.0.1:5000/apitest');
|
||||
//console.log("OK");
|
||||
var data = JSON.stringify({X: x});
|
||||
//var data = JSON.stringify({X: x});
|
||||
//console.log("OK");
|
||||
httpRequest.send(data);
|
||||
//httpRequest.send(data);
|
||||
//console.log("OK");
|
||||
//console.log(data)
|
||||
|
||||
console.log("Left? : " + x + " ; Top? : " + y + ".");
|
||||
|
||||
|
||||
if( x >= 161 && x <= 219 && y >= 50 && y <= 67 ){
|
||||
if( x >= 100 && x <= 157 && y >= 79 && y <= 160 ){
|
||||
|
||||
score++;
|
||||
elScore.textContent = score;
|
||||
ress = confirm("GOOD You win :) DO YOU WANT TO PLAY AGAIN ?");
|
||||
elScore.textContent = ' '+ score;
|
||||
// ress = confirm("GOOD You win :) DO YOU WANT TO PLAY AGAIN ?");
|
||||
|
||||
if(ress){
|
||||
// if(ress){
|
||||
|
||||
// sec = localStorage.getItem('globalTime');
|
||||
// }
|
||||
// else{
|
||||
// window.location.href = "http://127.0.0.1:5000/";
|
||||
// }
|
||||
|
||||
|
||||
// xhr.onreadystatechange = function() {
|
||||
// if (xhr.readyState == XMLHttpRequest.DONE) {
|
||||
|
||||
// json = JSON.parse(xhr.response);
|
||||
// var encodedData = btoa(json["la_carte"]);
|
||||
// var image = new Image();
|
||||
// image.src = 'data:image/png;base64,'+encodedData;
|
||||
|
||||
// // alert(encodedData);
|
||||
// }
|
||||
// }
|
||||
// xhr.open('GET', URL, true);
|
||||
// xhr.send(null);
|
||||
|
||||
card2.src = card1.src;
|
||||
card1.style.display = "none";
|
||||
card3.style.display = "block";
|
||||
|
||||
|
||||
card1.style.display = "none";
|
||||
card2.style.display = "block";
|
||||
card3.style.display = "none";
|
||||
card4.style.display = "block";
|
||||
sec = localStorage.getItem('globalTime');
|
||||
}
|
||||
else{
|
||||
window.location.href = "http://127.0.0.1:5000/";
|
||||
}
|
||||
}
|
||||
|
||||
// var xhr = new XMLHttpRequest();
|
||||
// xhr.open("POST", yourUrl, true);
|
||||
// xhr.setRequestHeader('Content-Type', 'application/json');
|
||||
// xhr.send(JSON.stringify({
|
||||
// x: x,
|
||||
// y: y
|
||||
// }))
|
||||
}
|
||||
|
||||
function restartGame() {
|
||||
|
|
@ -145,28 +155,17 @@ function clickEvent2(e) {
|
|||
var x = e.clientX - rect.left;
|
||||
var y = e.clientY - rect.top;
|
||||
|
||||
httpRequest = new XMLHttpRequest();
|
||||
|
||||
if(!httpRequest) {
|
||||
alert('Giving Up! Cannot send an XMLHTTO request.');
|
||||
}
|
||||
httpRequest.open('POST', 'http://127.0.0.1:5000/apitest');
|
||||
var data = JSON.stringify({X: x});
|
||||
httpRequest.send(data);
|
||||
console.log("Left? : " + x + " ; Top? : " + y + ".");
|
||||
if( x >= 126 && x <= 218 && y >= 26 && y <= 276 ){
|
||||
score++;
|
||||
elScore.textContent = score;
|
||||
ress = confirm("GOOD You win :) DO YOU WANT TO PLAY AGAIN ?");
|
||||
|
||||
if(ress){
|
||||
sec = localStorage.getItem('globalTime');
|
||||
}
|
||||
else{
|
||||
window.location.href = "http://127.0.0.1:5000/";
|
||||
}
|
||||
}
|
||||
|
||||
if( x >= 74 && x <= 198 && y >= 71 && y <= 196 ){
|
||||
score++;
|
||||
elScore.textContent = ' '+ score;
|
||||
|
||||
card2.src = card3.src;
|
||||
card3.style.display = "none";
|
||||
card4.style.display = "block";
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
<i class="fa fa-star gold-star"></i>
|
||||
</li>
|
||||
</ul>
|
||||
<span class="moves">Score :</span><span id="score"> 0</span>
|
||||
<span class="moves">Score : </span><span id="score"> 0</span>
|
||||
<div class="restart">
|
||||
<i class="fa fa-repeat" onclick="restartGame()"></i> Restart game
|
||||
</div>
|
||||
|
|
@ -33,20 +33,19 @@
|
|||
<div id="basicUsage" style="text-align: center;"><i style="display: inline-block; margin-right: 6px;" class="fa fa-clock-o"></i><h5 style="display: inline-block;" ><time></time></h5></div>
|
||||
<ul class="deck1" style="justify-content: center; display: flex; position: relative;">
|
||||
<h4 style="position: absolute; color: white; top: -15px; left: 32%; width: 100%;">Click on the common object here</h4>
|
||||
<!-- <img src="../static/images/card11.png" alt="simple card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)"> -->
|
||||
<!-- <img src="../static/images/card11.png" alt="simpl console.log(typeof(image));
|
||||
document.getElementById('test').appendChild(image)e card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)"> -->
|
||||
<img src="../static/images/temp/card1.jpg" alt="simple card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)">
|
||||
<!-- <img src="../static/images/card1.png" alt="simple card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)">
|
||||
<img src="../static/images/card3.png" alt="simple card" id="card2" style="cursor: pointer; margin-top: 10px; display: none;" onclick="clickEvent2(event)"> -->
|
||||
<!-- <img src="../static/images/icon.png" alt="simple card" class="gcard diapo" onclick="boutons(-1)"> -->
|
||||
<img src="../static/images/card11.png" alt="simple card" id="card2" style="cursor: pointer; margin-top: 10px; display: none;" onclick="clickEvent2(event)">
|
||||
<img src="../static/images/card22.png" alt="simple card" id="card" class="card-spe" style="cursor: pointer; margin-top: 10px; display: none;">
|
||||
|
||||
</ul>
|
||||
|
||||
<hr style="border: #44464778 dashed 1px; width: 80%; margin: 19px 0 9px;">
|
||||
|
||||
<ul class="deck2" style="justify-content: center; display: flex; position: relative;">
|
||||
<h4 style="position: absolute; color: white; top: -8px; left: 42%; width: 100%;">Central Card</h4>
|
||||
<img src="../static/images/card22.png" alt="simple card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)">
|
||||
<!-- <img src="../static/images/card2.png" id="card3" alt="simple card" style="margin-top: 10px;">
|
||||
<img src="../static/images/card1.png" alt="simple card" id="card4" style="cursor: pointer; margin-top: 10px; display: none;" onclick="clickEvent(event)"> -->
|
||||
<img src="../static/images/temp/card2.jpg" alt="simple card" id="card1" style="cursor: pointer; margin-top: 10px;">
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue