LabinatorSolutions / stockfish-chess-web-gui

Responsive chess web GUI to play against the Stockfish 16 chess engine. Multiple web GUI implementations have also been included.
https://labinatorsolutions.github.io/stockfish-chess-web-gui/
GNU Affero General Public License v3.0
58 stars 40 forks source link

Corywritescode/issue19/toggle not working on mobile #22

Closed CoryWritesCode closed 5 years ago

CoryWritesCode commented 5 years ago

Styling updates:

Before:

Screen Shot 2019-10-28 at 10 25 33 AM

After:

Screen Shot 2019-10-28 at 10 25 50 AM

JS updates

The .click() jquery method is great for desktop applications. Since it's listening for a mouse event it's not going to pick up on a touch event. Per reading this article I swapped the .click() events to .on("click touchstart", ...) which should capture both click and touch events.

CoryWritesCode commented 5 years ago

this satisfies #19

LabinatorSolutions commented 5 years ago

After testing the commit, I couldn't manage to make it work. The button are flashing on and off then returning back to their original state. The AI button is still not working. Is it working on your mobile device? (or you can even test it using your browser without a mobile device by enabling the touch-based support from your dev console).

CoryWritesCode commented 5 years ago

@LabinatorSolutions I think I see the issue. Should have used tap not touchstart. My bad. I didn't find a way to serve the JS up to the browser. I could load the page but the JS wasn't working. Is there a way to do that so I can check my fix?

LabinatorSolutions commented 5 years ago

@CoryWritesCode : Thank you for your message.

The best way to check your fix is to launch the app locally using a localhost stack. XAMPP works well but there are many other ways as well. Bitnami also offers ready-made stacks and modules that you can deploy instantly and locally for testing. You basically need a web server to test it up. An Apache webserver should be sufficient since we don't even have a database for this app.

Please note that your browser by itself will not load JS or the engine. You can also visit the live URL of this repository without installing anything if you need to check the bug right away.

LabinatorSolutions commented 5 years ago

@CoryWritesCode : Replacing touchstart with tap helps in solving the bug that got emerged after the last commit but it does not make the "AI" button work. It is still doing nothing. Most probably, the board actions are not assigned to the board that is used in the touch-based devices.

CoryWritesCode commented 5 years ago

I can take a look at that too. Now that I'm able to serve it up locally it should be easier to debug.