Compare commits
No commits in common. "main" and "Mid-SimElectronBuild" have entirely different histories.
main
...
Mid-SimEle
4 changed files with 340 additions and 0 deletions
93
.github/workflows/main.yml
vendored
Normal file
93
.github/workflows/main.yml
vendored
Normal file
|
@ -0,0 +1,93 @@
|
||||||
|
# This is a basic workflow to help you get started with Actions
|
||||||
|
|
||||||
|
name: CI
|
||||||
|
|
||||||
|
# Controls when the workflow will run
|
||||||
|
on:
|
||||||
|
workflow_run:
|
||||||
|
workflows: [pages-build-deployment]
|
||||||
|
types:
|
||||||
|
- completed
|
||||||
|
|
||||||
|
# Allows you to run this workflow manually from the Actions tab
|
||||||
|
workflow_dispatch:
|
||||||
|
|
||||||
|
# A workflow run is made up of one or more jobs that can run sequentially or in parallel
|
||||||
|
jobs:
|
||||||
|
# This workflow contains a single job called "build"
|
||||||
|
build:
|
||||||
|
# The type of runner that the job will run on
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
permissions:
|
||||||
|
contents: write
|
||||||
|
# Steps represent a sequence of tasks that will be executed as part of the job
|
||||||
|
steps:
|
||||||
|
# Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
|
||||||
|
- uses: actions/checkout@v3
|
||||||
|
|
||||||
|
# Runs a set of commands using the runners shell
|
||||||
|
- name: Install Dependencies
|
||||||
|
run: sudo npm install -g nativefier
|
||||||
|
|
||||||
|
- name: Stage Overall
|
||||||
|
run: |
|
||||||
|
cd ${{ github.workspace }}
|
||||||
|
zip -r Mid_Simulator.Source.zip *
|
||||||
|
mkdir build
|
||||||
|
mv Mid_Simulator.Source.zip build/Mid_Simulator.Source.zip
|
||||||
|
|
||||||
|
- name: Stage For Linux
|
||||||
|
run: |
|
||||||
|
cd ${{ github.workspace }}
|
||||||
|
cd build
|
||||||
|
nativefier https://meowcatheorange.github.io/Mid-Simulator/ --icon "${{ github.workspace }}/sprites/jellybeanTitle.png" --name "Mid-Simulator" --platform linux --arch x64 --portable --disable-context-menu --height 400 --width 700 --single-instance --zoom 1.0 --lang "en-US" --min-width 700 --min-height 400 --max-width 1400 --max-height 800
|
||||||
|
cd Mid-Simulator-linux-x64
|
||||||
|
zip -r ../Mid_Simulator.Linux-amd64.zip *
|
||||||
|
|
||||||
|
# - name: Stage For Windows
|
||||||
|
# run: |
|
||||||
|
# cd ${{ github.workspace }}/build
|
||||||
|
# nativefier https://meowcatheorange.github.io/Mid-Simulator/ --icon "${{ github.workspace }}/sprites/jellybeanTitle.png" --name "Mid-Simulator" --platform windows --arch x64 --portable --disable-context-menu --height 400 --width 700 --single-instance --zoom 1.0 --lang "en-US" --min-width 700 --min-height 400 --max-width 1400 --max-height 800
|
||||||
|
# ls
|
||||||
|
# cd Mid-Simulator-win32-x64
|
||||||
|
# zip -r ../Mid_Simulator.Windows-x86_64.zip *
|
||||||
|
#
|
||||||
|
# - name: Stage For Mac
|
||||||
|
# run: |
|
||||||
|
# cd ${{ github.workspace }}/build
|
||||||
|
# nativefier https://meowcatheorange.github.io/Mid-Simulator/ --icon "${{ github.workspace }}/sprites/jellybeanTitle.png" --name "Mid-Simulator" --platform osx --arch x64 --portable --disable-context-menu --height 400 --width 700 --single-instance --zoom 1.0 --lang "en-US" --min-width 700 --min-height 400 --max-width 1400 --max-height 800
|
||||||
|
# ls
|
||||||
|
# cd Mid-Simulator-darwin-x64
|
||||||
|
# zip -r ../Mid_Simulator.MacOSX-x86_64.zip *
|
||||||
|
# cd ${{ github.workspace }}/build
|
||||||
|
# nativefier https://meowcatheorange.github.io/Mid-Simulator/ --icon "${{ github.workspace }}/sprites/jellybeanTitle.png" --name "Mid-Simulator" --platform osx --arch arm64 --portable --disable-context-menu --height 400 --width 700 --single-instance --zoom 1.0 --lang "en-US" --min-width 700 --min-height 400 --max-width 1400 --max-height 800
|
||||||
|
# ls
|
||||||
|
# cd Mid-Simulator-darwin-arm64
|
||||||
|
# zip -r ../Mid_Simulator.MacOSX-arm64.zip *
|
||||||
|
|
||||||
|
- name: "[Debug] Check Dirs"
|
||||||
|
run: |
|
||||||
|
cd ${{ github.workspace }}/build
|
||||||
|
echo "LS 1"
|
||||||
|
ls
|
||||||
|
cd ..
|
||||||
|
echo "LS 2"
|
||||||
|
ls
|
||||||
|
cd ..
|
||||||
|
echo "LS 3"
|
||||||
|
ls
|
||||||
|
|
||||||
|
- uses: ncipollo/release-action@v1
|
||||||
|
with:
|
||||||
|
artifacts: "${{ github.workspace }}/build/*.zip"
|
||||||
|
body: "Electron build of Mid-Sim, built automatically on ${{ runner.name }} (${{ runner.os }} ${{ runner.arch }})"
|
||||||
|
tag: "Mid-SimElectronBuild"
|
||||||
|
name: "Mid-Sim Electron Build"
|
||||||
|
allowUpdates: true
|
||||||
|
commit: "main"
|
||||||
|
token: ${{ secrets.GITHUB_TOKEN }}
|
||||||
|
|
||||||
|
- name: Cleanup
|
||||||
|
run: |
|
||||||
|
cd ${{ github.workspace }}
|
||||||
|
rm -rf build
|
2
.replit
Normal file
2
.replit
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
language = "kaboom"
|
||||||
|
entrypoint = "code/main.js"
|
220
CHARTS.md
Normal file
220
CHARTS.md
Normal file
|
@ -0,0 +1,220 @@
|
||||||
|
# Before You Start
|
||||||
|
|
||||||
|
You need:
|
||||||
|
|
||||||
|
- Some JS knowledge
|
||||||
|
- Some knowledge of the KaboomJS engine
|
||||||
|
- A static file server, for your images and music. That, or download the game locally and place the files into there.
|
||||||
|
- 2 700 x 400 (or similarly scaled) sprites for your background and foreground.
|
||||||
|
- 1.333x: 525 x 300
|
||||||
|
- 2x: 350 x 200
|
||||||
|
- 4x: 175 x 100
|
||||||
|
- 8x: 87 x 50
|
||||||
|
- The names of the files:
|
||||||
|
- Background: `"[Your Song ID]BG0"` (e.x. `"liveandlearnBG0"`)
|
||||||
|
- Foreground: `"[Your Song ID]FG0"` (e.x. `"liveandlearnFG0"`)
|
||||||
|
- Spritesheets that are any size, for your character
|
||||||
|
- Spritesheet animations:
|
||||||
|
- `idle: At least 4 images for the animation that will be played every beat`
|
||||||
|
- `talk: At least 1 image for the animation that will be played when a note is successfully hit`
|
||||||
|
- `miss: At least 3 images for the animation that will be played when your player misses`
|
||||||
|
- The names of the file:
|
||||||
|
- Character file: `"[Your Character ID][Your Song ID]"` (e.x. `"Shadowliveandlearn"`)
|
||||||
|
|
||||||
|
# How To Make A Chart File
|
||||||
|
|
||||||
|
Add this code before the last **square end bracket (`]`)** near the end of your `charts.js` file.
|
||||||
|
|
||||||
|
```js
|
||||||
|
{
|
||||||
|
id: "", // REQUIRED! This ID will also be used to access your song name.
|
||||||
|
name: "", // Required
|
||||||
|
speed: 3, // Required
|
||||||
|
bpm: 120, // Required
|
||||||
|
events: {
|
||||||
|
preload: function() { // Required, but you can simply just not modify it if your chart requires no extra assets.
|
||||||
|
},
|
||||||
|
onBeat: function(beat) { // Optional
|
||||||
|
},
|
||||||
|
},
|
||||||
|
characters: [
|
||||||
|
["id", "name"] // Required, other characters are optional
|
||||||
|
],
|
||||||
|
noteTypes: {
|
||||||
|
"J": noteDefault, // Required, other note types are optional
|
||||||
|
},
|
||||||
|
makeScript: {
|
||||||
|
customChar: false,
|
||||||
|
customBG: false,
|
||||||
|
script: function() { // Required, but if customChar and customBG are false, this doesn't require modification
|
||||||
|
}
|
||||||
|
},
|
||||||
|
chart: "...", // Required, duh
|
||||||
|
scale: 1 // Required
|
||||||
|
},
|
||||||
|
```
|
||||||
|
|
||||||
|
## File basics:
|
||||||
|
|
||||||
|
```js
|
||||||
|
{
|
||||||
|
id: "",
|
||||||
|
name: "",
|
||||||
|
speed: 3,
|
||||||
|
bpm: 120,
|
||||||
|
...
|
||||||
|
|
||||||
|
...
|
||||||
|
chart: "...",
|
||||||
|
scale: 1
|
||||||
|
},
|
||||||
|
```
|
||||||
|
|
||||||
|
The `id` field should contain the simple name of your song.
|
||||||
|
|
||||||
|
For example, a song name of `"Live And Learn"` can be `"liveandlearn"`, `"lal"`, or `"learn"`.
|
||||||
|
|
||||||
|
```js
|
||||||
|
id: "liveandlearn"
|
||||||
|
```
|
||||||
|
|
||||||
|
Next, the `name` field should be the main, detailed name of your song. This field is not case-sensitive, technically, as the font the text is displayed in uses ALL CAPS.
|
||||||
|
However, you should still be wary about your grammar.
|
||||||
|
|
||||||
|
For example, `name` can be `"Live And Learn"`. Please exclude the artist of the song in the title unless you *need* it for recognition or credit.
|
||||||
|
|
||||||
|
```js
|
||||||
|
name: "Live And Learn"
|
||||||
|
```
|
||||||
|
|
||||||
|
Now, let's move on to the `speed` field, which is basically the time that notes go from Right Stage to your hitmarker.
|
||||||
|
|
||||||
|
For example, `5` means it will take 5 seconds for notes to go from right to left. `1` means it will take 1 second for notes to go.
|
||||||
|
|
||||||
|
```js
|
||||||
|
speed: 5
|
||||||
|
```
|
||||||
|
|
||||||
|
Let's do this quickly, the `bpm` field will be the song tempo in beats per minute.
|
||||||
|
|
||||||
|
For example, `172` is the BPM of `Live And Learn`.
|
||||||
|
|
||||||
|
```js
|
||||||
|
bpm: 172
|
||||||
|
```
|
||||||
|
|
||||||
|
The `chart` field is important, and this would be relatively easy to make in a normal text editor. Each individual character in this string is a step (1/4 of a beat).
|
||||||
|
However, it's better to use the built-in Chart Editor, which can be accessed by pressing `~` while the song you want to chart is selected in the song picker menu.
|
||||||
|
|
||||||
|
After you do so, press the EXPORT button on the chart editor, and then go to your browser's inspector by pressing eiher `F12` or `CTRL-SHIFT-I`.
|
||||||
|
|
||||||
|
Copy the newly-created string into the `chart` field, and you're finished with that.
|
||||||
|
|
||||||
|
```js
|
||||||
|
chart: "..."
|
||||||
|
```
|
||||||
|
|
||||||
|
Alright, the `scale` field is just the scale of your sprites. If you have failed to properly re-scale your sprites (while also using the default settings for characters and backgrounds.), then you can change this field.
|
||||||
|
|
||||||
|
## Complicated stuff that requires code
|
||||||
|
|
||||||
|
```js
|
||||||
|
events: {
|
||||||
|
preload: function() {
|
||||||
|
},
|
||||||
|
onBeat: function(beat) {
|
||||||
|
},
|
||||||
|
},
|
||||||
|
characters: [
|
||||||
|
["id", "name"]
|
||||||
|
],
|
||||||
|
noteTypes: {
|
||||||
|
"J": noteDefault,
|
||||||
|
},
|
||||||
|
makeScript: {
|
||||||
|
customChar: false,
|
||||||
|
customBG: false,
|
||||||
|
script: function() {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
```
|
||||||
|
|
||||||
|
`events.preload()` will be ran before the game starts. This function can be used to load all of your current chart's required assets.
|
||||||
|
|
||||||
|
`events.onBeat(beat)` will be ran every beat of your song. The provided variable `beat` will tell you the current beat of the song.
|
||||||
|
|
||||||
|
`characters` is a list of all of the playable characters your player will be able to use. Nore really coding-related, but you will need this if you want to give your player some character variety.
|
||||||
|
|
||||||
|
The array goes like this: `[ "ID Of Character", "Name Of Character" ]`
|
||||||
|
If you're not using custom character definitions (see below), you also have 2 more values to play with:
|
||||||
|
`[ "ID", "Name", X Pos, Y Pos ]`. These define the X and Y position the character will be placed at.
|
||||||
|
|
||||||
|
```js
|
||||||
|
[ "sonic", "Sonic", 20, 108 ]
|
||||||
|
```
|
||||||
|
|
||||||
|
`noteTypes` is a list of strings that will define different letters of the chart as notes.
|
||||||
|
|
||||||
|
`noteTypes.[anonymous](time, letter, prevStep)` is a function that's good for defining custom notes.
|
||||||
|
The default note is labelled as `noteDefault`, and can be used if you want a specific character to make a default note.
|
||||||
|
Here's a good use, to define a note that will be empty and full, for making something of a duet:
|
||||||
|
```js
|
||||||
|
function(time, prevStep) {
|
||||||
|
noteDefault(time, "PUT YOUR CORRESPONDING LETTER HERE", prevStep); //The aformentioned default note value, with all of the variables being passed into it.
|
||||||
|
customNote(time, "PUT YOUR CORRESPONDING LETTER HERE", prevStep, 0, [0, 0, 0], true);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
> `customNote` is also a really good helper function for easily defining... custom notes. The internal variables `time, letter, prevStep, w, colorArray, empty,` and `funclol` are used as so:
|
||||||
|
>
|
||||||
|
> `time` is where you pass in the variable with the same name, just like `noteDefault`. This is same with `prevStep`.
|
||||||
|
>
|
||||||
|
> `letter` is where you put the letter that spawns the note, as a way of identification by other modules.
|
||||||
|
>
|
||||||
|
> `w` is the width of your note. You can't change the height, because... why would you need to. Default width is usually 10.
|
||||||
|
>
|
||||||
|
> `colorArray` is the color of your note. If you want to make a sprite note instead, you'll have to use Kaboom's `add()` function instead.
|
||||||
|
>
|
||||||
|
> `empty` determines if this note is empty, which means the player cannot hit this note. Instead, this note will be handled by a seperate "player", designated for only hitting these notes. Animations and actions will also be passed into another player, labelled `players.empty`.
|
||||||
|
>
|
||||||
|
> Finally, `funclol` is where you put the function that runs when you hit this note. Including this automatically makes your note "[not normal.](https://i.kym-cdn.com/entries/icons/original/000/037/442/you_are_not_normal.jpg)" Passing parameters are `empty`, `curBeat`, and `letter`.
|
||||||
|
|
||||||
|
`time` will return the current time of the song in milliseconds.
|
||||||
|
|
||||||
|
`prevStep` will return the step that this note was made on.
|
||||||
|
|
||||||
|
`makeScript.script(players, char, bgEl)` will be ran when your chart is loaded. It can be used to load a custom layout by setting `makeScript.customChar` and/or `makeScript.customBG` to true.
|
||||||
|
Here's a good use, to load a custom character layout:
|
||||||
|
```js
|
||||||
|
script: function(players, char, bgEl) {
|
||||||
|
var player, player2;
|
||||||
|
player = add([
|
||||||
|
sprite("shadow"),
|
||||||
|
"dances", //required for all player characters
|
||||||
|
pos(224, 108),
|
||||||
|
scale(1) // if using a custom layout, use this instead of the chart's provided scale variable
|
||||||
|
])
|
||||||
|
player2 = add([
|
||||||
|
sprite("sonic"),
|
||||||
|
"dances",
|
||||||
|
pos(20, 108),
|
||||||
|
scale(1)
|
||||||
|
])
|
||||||
|
return {returnType: "character", main: player, empty: player2};
|
||||||
|
/*
|
||||||
|
You'll need to return your code after making some character changes, so make sure you use this.
|
||||||
|
returnType only has the value "character", which allows the use of these two variables:
|
||||||
|
- main, a variable for defining the character the player will use (GameObj)
|
||||||
|
- empty, a variable for defining the character the empty note bot will use to display opposing animation (GameObj)
|
||||||
|
*/
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
The included variables can be used as such:
|
||||||
|
|
||||||
|
`players`: Will only really mean anything if `makeScript.customChar` is false. It is an object array of the player positions.
|
||||||
|
e.x. `{ main: bean<GameObj>, empty: shadowthehedge<GameObj> }`
|
||||||
|
|
||||||
|
`char`: The ID of the currently selected character. Good for making differing stages for different characters.
|
||||||
|
|
||||||
|
`bgEl`: Will only really mean anything if `makeScript.customBG` is false. It is simply the current background GameObj.
|
25
README.md
Normal file
25
README.md
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
# Mid-Simulator
|
||||||
|
The main GitHub repository for JellyBean's Mid-Sim.
|
||||||
|
|
||||||
|
## How to Build:
|
||||||
|
Game's built already. Just download the files, put it in a folder, open VS Code and start a Live Server.
|
||||||
|
|
||||||
|
## Documentation For Chartmaking
|
||||||
|
[CHARTS.md](./CHARTS.md)
|
||||||
|
|
||||||
|
## Warnings
|
||||||
|
When downloading/playing an unofficially distributed mod of this game, be careful and look at [code/charts.js](./code/charts.js) for any bad code before you continue! Any `eval()`, popup, or other malicious code references should be a huge red flag!
|
||||||
|
|
||||||
|
Some things to look for:
|
||||||
|
|
||||||
|
`eval()`
|
||||||
|
|
||||||
|
`window.close()`
|
||||||
|
|
||||||
|
`fetch()`
|
||||||
|
|
||||||
|
`alert()`
|
||||||
|
|
||||||
|
`document.body.style.backgroundColor` (could cause a seizure for those who are photosensitive)
|
||||||
|
|
||||||
|
`window.open()`
|
Loading…
Reference in a new issue