Skip to content

taylorjg/mastermind-svg-vue

Repository files navigation

Description

I previously implemented Mastermind in React. However, the UI is very poor. I decided to try to improve it by using SVG. I created this separate repo to play around with it.

TODO

UI things

  • Add HTML "New Game" button
  • Add HTML "Enter" button to enter a guess
  • Show/hide secret panel cover
  • Allow selection of a peg colour from a colour menu
  • Add focus circles to the large peg holes for the active row
  • Use SVG buttons instead of HTML buttons
  • Add some fanfare around game won/lost
  • Add shine/gloss to large/small pegs
  • Add animations (e.g. when revealing the secret code)
  • Responsive UI: size of device
  • Responsive UI: orientation of device
  • Provide a UI mechanism to toggle autosolve mode

Non-UI things

  • Add basic game logic
  • Use Vue.js (my first Vue.js app!)
  • Deploy to gh-pages
  • Implement autosolve mode

Links