Next saas-starter
⚡️ Free Next.js responsive landing page template for SaaS products made using JAMStack architecture.
Periotris.js is a TypeScript porting of CSharperMantle's Periotris game.
English | 中文
Get familiar with the Periodic Table of Elements in a fun way, directly in your browsers.
Periotris.js v2.0.1
Instances of Periotris.js are hosted on GitHub Pages and Vercel.
The game is a Progressive Web App, providing a native-app-like experience. See your browser's manual for more information.
For desktop platforms, keyboard is the recommended way to control the game.
W
: RotateA
: Move leftD
: Move rightS
: Move downSpace
: Instant dropFor touching-enabled platforms, use the finger to play.
Tap
: RotateSwipe left
: Move leftSwipe right
: Move rightSwipe down
: Move downLong press
: Instant dropPeriotris.js provides several ways to customize the game. You can:
... and more!
Most of these settings can be edited on the "Settings" page of the game. The settings are saved in the browser's local storage and are not uploaded to any server.
Most settings are saved and validated real-time, so when you make a change to the settings, the game will immediately reflect the change.
If you encounter any problems with your file format, please check the structure of your file.
Game maps defines the game area that you need to fill. It specifies how large the game area is, which element should cells represent, and which cells are left blank.
A game map is represented in a text file in the format named JavaScript Object Notation (JSON). You will need to write your own map in the structure listed below.
map
: A row-major 2D array containing all blocks. Each block is represented by an object with these properties:atomicNumber
: An integer indicating the element the cell representsfilledBy
: An integer. 7
for a free block, 8
for an unavailable block.totalAvailableBlocksCount
: An integer representing the total number of blocks that can be filled in the map, that is, the number of blocks where filledBy
equals 7
.playAreaSize
: An object It representing the visible size of the map with two properties:width
: An integer.height
: An integer.For an example file, which is also the default map in the game, see DefaultMap.json.
For a formal description of the structure of the map in JSON Schema, see Map.json.schema.
Color themes define a set of rules that cells should be colored according to.
A color theme file is also represented in JSON. You will need to write your own color theme in the structure listed below.
rules
: An array of objects. Each object represents a rule. Each rule is represented by an object with these properties:atomicNumberRange
: An object indicating the range of elements the rule applies to from from
to to
(both inclusive).color
: A valid CSS color.For an example file, which is also the default color theme in the game, see DefaultColorScheme.json.
For a formal description of the structure of the map in JSON Schema, see ColorScheme.json.schema.
git clone --depth 1 -- https://github.com/CSharperMantle/periotrisjs.git
cd periotrisjs
You may omit the --depth=1
flag if you want a complete commit history rather than a grafted shallow history (which saves disk space). Reminder: Do not use 'Download ZIP' button! Make sure that you have your git repository initialized or Periotris.js will fail to determine its revision.
Dependencies that need to be installed manually:
Once you have installed all above, run the following commands:
yarn install --immutable
Run the following command to build and serve a publish-ready site (the same as you get from GH Pages and Vercel instances):
yarn run build && yarn run serve
Or you can run the following command to build and serve a development site:
yarn run develop
Follow the instructions printed in the terminal to enjoy your local instance.
yarn run test
This command will run all tests and will print the results. Normally all tests should pass.
⚡️ Free Next.js responsive landing page template for SaaS products made using JAMStack architecture.
Non-blocking PostgreSQL client for Node.js written in TypeScript.
Fast and lightweight JavaScript game engine built on WebGL and glTF
Implement Flamework remotes with classes
IOS Android Web cross platform app for real time collaborative music listening session and playlist editing. Using...
A social media platform to create communities and make friends
Vue is a JavaScript framework for building websites. The...
TypeScript is an open source programming...
React Native is a JavaScript mobile framework developed...
React (also known as React.js or ReactJS) is a JavaScript...
Python is a dynamically typed programming language...
PHP is a popular general-purpose scripting language...
Node.js is a tool for executing JavaScript in a variety...
iOS is the operating system for all of Apple’s mobile...
Released in 2016, Angular is a rewrite of AngularJS. It...
Android was designed and built by Google in 2008. The...