Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / NewStats: 3,152,446 members, 7,816,028 topics. Date: Thursday, 02 May 2024 at 11:59 PM |
Nairaland Forum / Science/Technology / Programming / Tic Tac Toe Online Game With AI (4680 Views)
A Simple Tic-tac-toe Game Using Javafx / Html/css/javascript Tic-tac-toe Project / Advanced Tic Tac Toe Online Game (2) (3) (4)
Tic Tac Toe Online Game With AI by FincoApps(m): 6:08am On Aug 16, 2015 |
For a long time, I have been waiting for the opportunity to do a project that implements Artificial Intelligence or Realtime programming using sockets. And recently, I got the opportunity to implement both of these at once. The game I made is just similar to every other Tic Tac Toe game, however, you require 5 consecutive Xs or Os to win instead of 3. Additionally, you have the ability to play with other players over the internet. Check the game out from the link: http://fincoapps.com/tic-tac-toe-online-game-with-ai/. Features include ✔ Ability to set AI difficulty. ✔ Realistic AI (It plays like a real human). ✔ Ability to play with other players online. One issue I have is that sometimes, there would be 11 tiles in a row instead of 12 depending on the screen size. A solution to this would be greatly appreciated 1 Like 1 Share |
Re: Tic Tac Toe Online Game With AI by Nobody: 6:22am On Aug 16, 2015 |
In case this makes FP. . . . |
Re: Tic Tac Toe Online Game With AI by Nobody: 6:27am On Aug 16, 2015 |
I just played now, and with all my great skills - i was declared loser. I have attached the screenshot as evidence. 1 Like
|
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 6:46am On Aug 16, 2015 |
dhtml18: lol pele, see the quote FincoApps: That was the issue in your case. Try to expand your browser window so the space on the right would not be there. |
Re: Tic Tac Toe Online Game With AI by Nobody: 8:05am On Aug 16, 2015 |
abeg nothing dey wrong with my browser window. I am using a 15in screen, what if i was using a mini laptop or an ipad? I think what you need to do is to reduce the size of the boxes jor. |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 8:20am On Aug 16, 2015 |
dhtml18: No, I didn't say something is wrong with your browser window, It's actually a phone app so it works well on phones. Just try to make sure the height of your browser is longer than the width. I changed the iframe dimensions so try it now |
Re: Tic Tac Toe Online Game With AI by Nobody: 8:51am On Aug 16, 2015 |
I have solved the width bug, i had to first duplicate all the game on my localserver first. I dont know what the total height is expected to be, but this my fix will make sure there are actually 12 columns no matter the resolution, it solves the bug of why width = width/12; is not actually generating 12 columns - and it works irregardless of the size of your screen. Here is how to solve it. Step 1: Open your js/script.js and Change below var width = window.innerWidth; into var width = $('div.body').width(); inside arrangeTiles() and $(window).resize(function() Step 2: Open your newAi.html and scroll to the bottom add setTimeout(function() { $(window).trigger('resize'); },400); after arrangeTiles(); so that you now have: <script type="text/javascript"> $(function() { arrangeTiles(); setTimeout(function() { $(window).trigger('resize'); },400); }); </script> Step 3: Then add somewhere in the code - patch provided by dhtml18 (a nairaland troll) |
Re: Tic Tac Toe Online Game With AI by Nobody: 9:13am On Aug 16, 2015 |
I can see you have solved the problem yourself, that is good. So what did you change? But wait o, that your fix is not really perfect because when you open the game directly into the browser it misbehaves. But my fix will work for all screen sizes, i have tested it out on various browsers already - even mobile browsers and it shows the 12 columns properly. |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 9:14am On Aug 16, 2015 |
dhtml18: Okay, thanks, but that didn't work. Like I said, the issue is caused by the scroll bar which is about 2px. So subtracting 2 from width/12 actually works, but like I said, it's for mobile and mobile browser scrollbars are negligible. |
Re: Tic Tac Toe Online Game With AI by Nobody: 9:23am On Aug 16, 2015 |
Wait, before i post. . .brb |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 9:32am On Aug 16, 2015 |
Same thing on your server.
|
Re: Tic Tac Toe Online Game With AI by Nobody: 9:35am On Aug 16, 2015 |
Here are the options, you can decide to show scrollbar always like i did in my screenshot. On use jqueryscrollpane - http://jscrollpane.kelvinluck.com/ to handle scrollbars for you.
|
Re: Tic Tac Toe Online Game With AI by Nobody: 9:38am On Aug 16, 2015 |
The cause of the problem is because the scrollbar was placed on auto previously - so that changes the width of the display erratically. I solved that the simply way by enabling the vertical scrollbar permanently insinde index.css. So no matter how you resize, the app will always fill the screen. body { 1 Like |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 9:52am On Aug 16, 2015 |
dhtml18: okay let me try it |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 9:56am On Aug 16, 2015 |
dhtml18: It worked, thanks mehn. I used both the Js and CSS solution 1 Like |
Re: Tic Tac Toe Online Game With AI by jacob05(m): 11:21am On Aug 16, 2015 |
Wow, Lovely Game i must say... thumbs up FincoApps.. would love to do AI too when i grow up I'd love if when Daddy plays, some kind of glow fades in and out for probably 2000ms on the played tile. This is to easily know Daddy's current move when the played tiles are many. But I think the bug isn't fixed, on the site, yet... 1 Like
|
Re: Tic Tac Toe Online Game With AI by Nobody: 12:14pm On Aug 16, 2015 |
FincoApps:You are welcome. Next, you need to clean up the newAI.html. You need to avoid duplication of javascript inserts. Please refer the new version on my server. Then the setTimeout on the footer is not required anymore since we have solved that bug with CSS. And when you are done let me know so that I can delete the scripts from my server. |
Re: Tic Tac Toe Online Game With AI by Nobody: 12:33pm On Aug 16, 2015 |
Then cordova.js returns 404 error. You can create a temporary blank file to solve that, or remove it from your newAI.html totally. |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 12:58pm On Aug 16, 2015 |
Thanks dude . I just fixed it now, I won't make further updates to the web version jacob05: |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 12:59pm On Aug 16, 2015 |
I used setTimeout a lot, I'm not sure which of them you mean dhtml18: |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 1:02pm On Aug 16, 2015 |
And also, I will do highlighting the last move on the mobile version. It became confusing too when I was playing with someone FincoApps: 1 Like |
Re: Tic Tac Toe Online Game With AI by jacob05(m): 1:04pm On Aug 16, 2015 |
FincoApps: You're welcome... But why are you not considering us, the PC users... it's not FAIR oooo |
Re: Tic Tac Toe Online Game With AI by Nobody: 1:04pm On Aug 16, 2015 |
FincoApps:It was the one i introduced in one of my posts above. Anyway, it doesn't matter, just replace the newAI.html with the version on my server. That is all. |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 1:27pm On Aug 16, 2015 |
lol the features it has now is okay, on BlackBerry World, I wanna put some advanced features for only pro users. That's why jacob05: |
Re: Tic Tac Toe Online Game With AI by Nobody: 2:24pm On Aug 16, 2015 |
Keep up the good work. I am mightily impressed by your efforts. I assume you got all the corrections because I have wiped it off my server and localhost. It is your original work and it should stay so. |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 2:41pm On Aug 16, 2015 |
Thanks dude. Yea, I got the corrections and I'm particularly happy about fixing the tile arrangement bug. Thanks once again dhtml18: |
Re: Tic Tac Toe Online Game With AI by Nobody: 2:49pm On Aug 16, 2015 |
FincoApps:You are welcome o. I am glad i was able to provide some support at least. |
Re: Tic Tac Toe Online Game With AI by Nobody: 2:56pm On Aug 16, 2015 |
Suggestion. When the game loads, and your connection is slow or you have been disconnected from internet. When you play, you may not get sound or see a cross. Suggestion: cache the images and sound in the browser so that they can be loaded on demand without necessarily going to the server. 1 Like |
Re: Tic Tac Toe Online Game With AI by FincoApps(m): 3:33pm On Aug 16, 2015 |
lol ha you just want me to keep working on this web version o. I'll try dhtml18: |
Re: Tic Tac Toe Online Game With AI by ghettodreamz(m): 8:06pm On Aug 16, 2015 |
Nice ... More speed to your coding fingers. I enjoyed playing the web version of the game. |
Re: Tic Tac Toe Online Game With AI by jacob05(m): 12:27am On Aug 17, 2015 |
Can't sleep, , so i decide to view your code... (was afraid before..lol... make person head no come turn...) I observe you repeat similar try .... catch blocks which greatly increase the size of your code (bad) and causes a lot of duplication... so I'd like to suggest this.. (Not Tested.... but should be of help.... i guess ) CheckWon
Usage
This Can also be tweaked to work for other functions like checkWinningMoveAI and the rest... |
Re: Tic Tac Toe Online Game With AI by Nobody: 2:08am On Aug 17, 2015 |
^^^joblessness at its peak! 1 Like |
Creating A New Face For Nl / Rynga Voip Issues - The Call Failed Due To Sound Device Problem On This Computer / Simple Server
(Go Up)
Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health religion celebs tv-movies music-radio literature webmasters programming techmarket Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10) Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 40 |