memory-game
Classic memory game as Custom Component
Memory Game
WebComponent
This is a classic Memory Game that can be simply included in any html page like
this:
<html>
<head>
<script src="//unpkg.com/mini-memory@latest/public/mini-memory.min.js"></script>
</head>
<body>
<div class="container"><mini-memory matrix="2x2"></mini-memory></div>
</body>
</html>
Quick Intro
Playground : at codepen.io
Documentation : https://softberry.github.io/memory-game/
Use your own images : Images in this game are obtained from picsum.photos which is a free place holder service. If you would like to use your own images, you will need a decicated image server for this purpose. There is an another project Custom image server developed with nodejs/express, can be used for this purpose.
If you do not define your image server in manifest.json or your image server does not responses, game falls back to https://picsum.photos, which is a free image place holder service and may take long time to get images.
Please note only Native Support of Custome Elements covered.
It has not been tested for IE 11 / Edge and therefore are not supported
Attributes
matrix columns and rows count in format of 2x2. Accepted values minimum 2x2 and maximum 10x10
<mini-memory matrix="2x2"></mini-memory>
lang Language selection. Current available languages are English, German and Turkish
<mini-memory matrix="2x2" lang="de"></mini-memory>
view set options for views. Currently have only one option which is fullscreen
<mini-memory matrix="2x2" view="fullscreen"></mini-memory>
settings hides settings panel if this value set to no. Default is visible.
<mini-memory matrix="2x2" settings="no"></mini-memory>
challenge Turns challenge mode on or off. Default is on.
<mini-memory matrix="2x2" challenge="off"></mini-memory>
Game starts with initially given matrix dimensions and it's increased one by one at each completed level.
If this value set to off game repeats always same level.
<mini-memory matrix="2x2" challenge="off"></mini-memory>
Documentation
Contributors are welcome. See the Documentation. Fork this repo, pick yourself an open Issue, and go ahead...
Open Issues:
See open issues at GitHub open Issue
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Dependencies
- Released
- 2019-04-10
- Maturity
- IMPORTED
- License
- MIT License
Compatibility
- Framework
- Browser
- Browser Independent