English / 한국어
DISCLAIMER: This README is currently NOT BEING UPDATED.
DISCLAIMER: catbulb is currently in its earliest stage of development. As such, some features mentioned in this README may not have been implemented yet. Such features (unless explicitly marked otherwise, such as with checkboxes in the Features section) are marked with
a strikethrough.
catbulb.js is a JavaScript framework for jrpg-esque adventure games on the web. (demo) Powered by PixiJS, it has full support for both WebGL and the HTML5 Canvas API. It can also be ported effortlessly to desktop using something like Electron.
catbulb allows you to develop games codelessly[1], loading all data from a single JSON file and supporting Tiled map files (.json). On the other hand, it is also easily and extensively customizable, making use of ES6 Classes.
Currently, catbulb is its earliest stage of development and lacks many basic features. Therefore, I highly discourage you use catbulb for production at this point in time. (Which is why, at the moment, there is no LICENSE file in this repository) However, if for some reason you need to use catbulb in your own project, please open an issue.
Assuming you have Python installed on your system, you can use the following commands to grab a copy of catbulb and set up a development web server.
git clone https://github.com/M00nR4bb1t/catbulb.js.git
cd catbulb.js
python -m http.server 5000Or, if you are using Python 2.* or below,
git clone https://github.com/M00nR4bb1t/catbulb.js.git
cd catbulb.js
python -m SimpleHTTPServer 5000Afterwards, just navigate to localhost:5000.
First, get youself a copy of catbulb by running git clone.
git clone https://github.com/M00nR4bb1t/catbulb.js.git You will see a working demo of catbulb under catbulb.js/.
This is what the directory structure looks like (ignoring Git-related files, README files, etc.):
catbulb.js/
├── sources/
│ ├── entity.js
│ ├── events.js
│ ├── main.js
│ ├── player.js
│ ├── tilemap.js
│ ├── triggers.js
│ ├── utilities.js
│ │
│ └── data.js
├── assets/
│ ├── .../
│ └── └── ...
├── build.py
├── index.html
├── index.php
├── pixi.min.js
├── SAT.min.js
└── style.css
In case you don't plan to edit any of the catbulb source files, catbulb provides a build.py Python script to bundle all of these JS files. Run the following command to combine and minify catbulb and its dependencies into one catbulb.min.js file. Note that the script uses the JavaScript Minifier Web API to minify JavaScript, and thus requires an internet connection to work.
python ./build.py -- includeDependencies catbulb.min.jsOr, alternatively,
chmod +x build.py
./build.py --includeDependencies catbulb.min.jsThen, you can just include the file like this, preferably at the end of <body>:
<!-- You still need the data file, obviously. -->
<script src="data.js"></script>
<script src="catbulb.min.js"></script>If you are looking to edit the catbulb source files, make sure to include all the JS files under source/ as well as the SAT.min.js and pixi.min.js like so, preferably at the end of <body> (order matters!):
<!-- Dependencies -->
<script src="pixi.min.js"></script>
<script src="SAT.min.js"></script>
<!-- catbulb Source Files -->
<script src="sources/data.js"></script>
<script src="sources/utilities.js"></script>
<script src="sources/entity.js"></script>
<script src="sources/events.js"></script>
<script src="sources/triggers.js"></script>
<script src="sources/player.js"></script>
<script src="sources/tilemap.js"></script>
<script src="sources/main.js"></script>- If you want to (for some reason or the other) bundle only catbulb source files without dependencies (PixiJS, SAT.js), you can do so by running
build.pywithout the--includeDependenciesflag.
- Player
- Walking
- Running
- Tilemap
- Tile Rendering
- Tile Animation
- Events & Triggers
-
EventPlayer&Trigger - Message Event
- MapChange Event
-
- Loader
- data.js
- List of Assets
- Maps
- Tilesets
- Events & Triggers
- Bitmap Fonts
- Player Party
- SE & BGM
- ...
- Tiled JSON Loader
- data.js
-
BitmapText- Glyphs
- ASCII
- Hangul Johab
- Hangul Wansung
- Hiragana & Katakana
- Japanese Kanji
- Latin Extended
- Chinese Hanzi (Traditional)
- Chinese Hanzi (Simplified)
- ...
- Formatting
- Shake
- Tint
- Size
- Line Wrapping
- Glyphs
- Inventory System
- ...
- Battle System
- ...
[1] data.js is really just JSON, so not counting that as code.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent