Show HN: Peg Solitaire implemented in HTML, JavaScript, CSS | Hacker News Reader

Show HN: Peg Solitaire implemented in HTML, JavaScript, CSS

ask5.github.io

19 pointsrobofanatic17 comments

Nice game! Congrats.

I only have one suggestion. The contrast between the pieces and the holes should be increased. Maybe the hole background could be almost flat black/near black?

Thanks for this nostalgia!

Thank you! I will change the hole background.

Yeah came here to say this. The different states are almost indistinguishable. I also didn't understand that they where supposed to be holes. I'd make the shadow effect much more subtle and have the holes in the background color so they seem like cut out of the red board vs very bright white pieces. Also the selected indicator would be more noticeable in an entirely different color like yellow.

If you want to make it really cool implement drag and drop. When you start dragging a piece add a sublte hightlight to the allowed destination holes.

thank you so much!

for now I changed the peg color to blue and also changed the highlight color. I thought about drag and drop initially and decided to do it when I get more time. But any way I am super excited to see people's feedback

Looks way better! Anyway had fun playing this and did not yet manage to win hehe... Keep it up!

Another layout improvement I'd do is loose the border around the board and extend the red to the whole page background, also center the board on the page and scale it to the available space. Looks way more fun and playful with the blue pieces and the white dot highlight is a nice touch!

Thanks again for great UI suggestion. I really appreciate it and will make these changes soon

Author here. Just implemented this popular board game in pure JS and CSS. Works well on modern desktop browsers. Sorry IE users. It might work on mobile devices but not really optimized for small screen devices.

I would really appreciate your feedback!

The game board doesn’t display for me at all on iPad, but it’s usable on android.

Pretty neat! The pegs would be much easier to distinguish from the holes if they were a different colour, e.g. "peg black" -> "peg blue". You have a typo in the move log: "eliminited" -> "eliminated".

thank you!

Doesn't work in Safari (MacOS 10.14.6, Safari 13.0.2)

[Error] SyntaxError: Unexpected token '='. Expected an opening '(' before a method's parameter list.

(anonymous function) (solitaire.js:3)

unfortunately that browser doesn't support es6 javascript classes :-(

Doesn't do anything for me on Firefox on Android.

Also Safari on IpadOS

FF should work unless it's not updated for long time

Reply on news.ycombinator.com