-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Joseph Suarez
committed
Dec 7, 2024
1 parent
ec01a0b
commit d266dca
Showing
8 changed files
with
12,210 additions
and
38 deletions.
There are no files selected for viewing
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,89 @@ | ||
<!doctype html> | ||
<html lang="EN-us"> | ||
<head> | ||
<meta charset="utf-8"> | ||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | ||
|
||
<title>raylib web game</title> | ||
|
||
<meta name="title" content="raylib web game"> | ||
<meta name="description" content="New raylib web videogame, developed using raylib videogames library"> | ||
<meta name="keywords" content="raylib, programming, examples, html5, C, C++, library, learn, games, videogames"> | ||
<meta name="viewport" content="width=device-width"> | ||
|
||
<!-- Open Graph metatags for sharing --> | ||
<meta property="og:type" content="website" /> | ||
<meta property="og:title" content="raylib web game"> | ||
<meta property="og:image:type" content="image/png"> | ||
<meta property="og:image" content="https://www.raylib.com/common/raylib_logo.png"> | ||
<meta property="og:image:alt" content="New raylib web videogame, developed using raylib videogames library" /> | ||
<meta property="og:site_name" content="raylib - example"> | ||
<meta property="og:url" content="https://www.raylib.com/games.html"> | ||
<meta property="og:description" content="New raylib web videogame, developed using raylib videogames library"> | ||
|
||
<!-- Twitter metatags for sharing --> | ||
<meta name="twitter:card" content="summary_large_image"> | ||
<meta name="twitter:site" content="@raysan5"> | ||
<meta name="twitter:title" content="raylib web game"> | ||
<meta name="twitter:image" content="https://www.raylib.com/common/raylib_logo.png"> | ||
<meta name="twitter:image:alt" content="New raylib web videogame, developed using raylib videogames library"> | ||
<meta name="twitter:url" content="https://www.raylib.com/games.html"> | ||
<meta name="twitter:description" content="New raylib web videogame, developed using raylib videogames library"> | ||
|
||
<!-- Favicon --> | ||
<link rel="shortcut icon" href="https://www.raylib.com/favicon.ico"> | ||
|
||
<style> | ||
body { | ||
margin: 0px; | ||
overflow: hidden; | ||
background-color: black; | ||
} | ||
canvas.emscripten { border: 0px none; background-color: black;} | ||
</style> | ||
<script type='text/javascript' src="https://cdn.jsdelivr.net/gh/eligrey/FileSaver.js/dist/FileSaver.min.js"> </script> | ||
<script type='text/javascript'> | ||
function saveFileFromMEMFSToDisk(memoryFSname, localFSname) // This can be called by C/C++ code | ||
{ | ||
var isSafari = false; // Not supported, navigator.userAgent access is being restricted | ||
//var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent); | ||
var data = FS.readFile(memoryFSname); | ||
var blob; | ||
|
||
if (isSafari) blob = new Blob([data.buffer], { type: "application/octet-stream" }); | ||
else blob = new Blob([data.buffer], { type: "application/octet-binary" }); | ||
|
||
// NOTE: SaveAsDialog is a browser setting. For example, in Google Chrome, | ||
// in Settings/Advanced/Downloads section you have a setting: | ||
// 'Ask where to save each file before downloading' - which you can set true/false. | ||
// If you enable this setting it would always ask you and bring the SaveAsDialog | ||
saveAs(blob, localFSname); | ||
} | ||
</script> | ||
</head> | ||
<body> | ||
<canvas class=emscripten id=canvas oncontextmenu=event.preventDefault() tabindex=-1></canvas> | ||
<p id="output" /> | ||
<script> | ||
var Module = { | ||
print: (function() { | ||
var element = document.getElementById('output'); | ||
if (element) element.value = ''; // clear browser cache | ||
return function(text) { | ||
if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' '); | ||
console.log(text); | ||
if (element) { | ||
element.value += text + "\n"; | ||
element.scrollTop = element.scrollHeight; // focus on bottom | ||
} | ||
}; | ||
})(), | ||
canvas: (function() { | ||
var canvas = document.getElementById('canvas'); | ||
return canvas; | ||
})() | ||
}; | ||
</script> | ||
<script async type="text/javascript" src="game.js"></script> | ||
</body> | ||
</html> |
Large diffs are not rendered by default.
Oops, something went wrong.
Binary file not shown.
Large diffs are not rendered by default.
Oops, something went wrong.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,103 +1,220 @@ | ||
const games = { | ||
/* | ||
nmmo3: { | ||
title: "Neural MMO 3", | ||
description: `A massively multiagent environment with progression and an agent-driven economy. By Joseph Suarez. | ||
A spiritual successor to Neural MMO 1-2. Explore, forage, fight, and trade in a massive procedurally generated open world. It's playable and quite fun, so I'm not going to tell you much. Your combat and profession levels are displayed overhead. The max in this demo is 40 for each. It starts off hard but you will discover some tricks... probably. Good luck! | ||
This environment supports configurable difficulty and scale. We are running a medium size map (512x512), but with only 8 agents for browser compatibility. The same map runs 1024 locally. | ||
Controls: | ||
Move (1st person) or pan (3rd person): W/A/S/D or Arrow keys Sprint (1st person) or increase pan/zoom speed (3rd person): Left shift Use item: Number keys | ||
Attack: Space | ||
Buy/sell: B/V | ||
Debug: H | ||
Switch view: Tab | ||
Zoom (3rd person): Q/E | ||
Observations: 2D crop of nearby tiles (discrete), 1D vector of self data (mixed discrete/continuous) | ||
Actions: Discrete. Move, sprint, attack, use item, buy, sell`, | ||
thumbnail: "assets/nmmo3_thumbnail.png", | ||
path: "assets/nmmo3/game.html", | ||
width: 960, | ||
height: 704, | ||
}, | ||
*/ | ||
moba: { | ||
title: "Puffer MOBA", | ||
description: "A Multiplayer Online Battle Arena (MOBA) inspired by games like DoTA and League of Legends. Click to move, Q/W/E for skills. Number keys to switch characters. By Joseph.", | ||
description: `A Multiplayer Online Battle Arena (MOBA) inspired by DoTA and OpenAI Five. By Joseph Suarez. | ||
This is a 5v5 mirror match with 5 unique characters, each with three unique skills. Your objective is to destroy the enemy base on the other side of the map. There game map has three lanes, each of which contains three towers that will automatically attach nearby enemies. Waves of minions will spawn from each team's base and travel down each lane, fighting each other and towers along the way. In the current version, enemy units are controlled by a simple scripted AI. This environment can also be trained with self-play. | ||
Controls: | ||
Move: Click or click and hold | ||
Attack: Automatic | ||
Use skill: Q/W/E | ||
Switch character: Number keys | ||
Observations: 2D crop of nearby tiles (mixed discrete/continuous), 1D vector of self data (mixed discrete/continuous) | ||
Actions: Multi-discrete. Move, use skills`, | ||
thumbnail: "assets/moba_thumbnail.png", | ||
path: "assets/moba/game.html", | ||
width: 1312, | ||
height: 736, | ||
}, | ||
tactics: { | ||
title: "Puffer Tactics", | ||
description: "A turn-based tactical combat game. Inspired by games like Fire Emblem and the popular MMO Dofus. By Nathan. Click to move, number keys to select skills.", | ||
description: `A turn-based tactical combat game inspired by the popular MMO Dofus. By Nathan Lichtlé. | ||
Combat is similar to CRPGs, D&D, and other tactical turn-based games played on a grid. This environment is missing scripted opponent AI and a trained policy. | ||
Controls: | ||
Move: Click | ||
Select skill: Number keys | ||
Use skill: Click`, | ||
thumbnail: "assets/tactical_thumbnail.png", | ||
path: "assets/tactical/game.html", | ||
width: 1200, | ||
height: 900, | ||
}, | ||
go: { | ||
title: "Go", | ||
description: "The ancient board game of territory control and strategic placement. By Spencer. Click to place a stone.", | ||
description: `The ancient board game of territory control. By Spencer Cheng. | ||
Controls: Click to place a stone or pass | ||
Observations: 2D tile grid (discrete) | ||
Actions: Discrete. Place a stone, pass`, | ||
thumbnail: "assets/go_thumbnail.png", | ||
path: "assets/go/game.html", | ||
width: 950, | ||
height: 512, | ||
}, | ||
snake: { | ||
title: "Multiagent Snake", | ||
description: "A multiplayer version of classic snake. By Joseph. W/A/S/D to move.", | ||
description: `Play with one snake or thousands. By Joseph Suarez. | ||
Controls: W/A/S/D or Arrow keys to move | ||
Observations: 2D crop of nearby tiles (discrete) | ||
Actions: Discrete. Move`, | ||
thumbnail: "assets/snake_thumbnail.png", | ||
path: "assets/snake/game.html", | ||
width: 1280, | ||
height: 720, | ||
}, | ||
tripletriad: { | ||
title: "Triple Triad", | ||
description: "A card game inspired by Final Fantasy. By Spencer. Num keys to select cards, click to place.", | ||
thumbnail: "assets/tripletriad_thumbnail.png", | ||
path: "assets/tripletriad/game.html", | ||
width: 990, | ||
height: 1000, | ||
}, | ||
pong: { | ||
title: "Pong", | ||
description: "A fast version of the classic Atari game. By Nathan. W/S to move.", | ||
thumbnail: "assets/pong_thumbnail.png", | ||
path: "assets/pong/game.html", | ||
width: 620, | ||
height: 640, | ||
enduro: { | ||
title: "Enduro", | ||
description: `A fast version of the classic Atari game. By Daniel Addis. | ||
Score points by passing cars. Pass enough cars before time runs out to move on to the next day. | ||
Controls: | ||
Move: A/D or Left/Right | ||
Accelerate: Space | ||
Brake: S or Down | ||
Observations: 1d vector (continuous) | ||
Actions: Discrete. Move, accelerate, brake`, | ||
thumbnail: "assets/enduro_thumbnail.png", | ||
path: "assets/enduro/game.html", | ||
width: 304, | ||
height: 420, | ||
}, | ||
breakout: { | ||
title: "Breakout", | ||
description: "A fast version of the classic Atari game. By Noah, physics enhanced by David. A/D to move, W to fire.", | ||
description: `A fast version of the classic Atari game. By Noah Farr with physics enhancements by David (dmoore101). | ||
Break two screens of bricks before losing all five lives to win. | ||
Controls: | ||
Move: A/D or Left/Right | ||
Fire: W or Up | ||
Observations: 1d vector (continuous) | ||
Actions: Discrete. Move, fire`, | ||
thumbnail: "assets/breakout_thumbnail.png", | ||
path: "assets/breakout/game.html", | ||
width: 576, | ||
height: 330, | ||
}, | ||
enduro: { | ||
title: "Enduro", | ||
description: "A fast version of the classic Atari game. By Bet. A/D to steer, space to accelerate.", | ||
thumbnail: "assets/enduro_thumbnail.png", | ||
path: "assets/enduro/game.html", | ||
width: 304, | ||
height: 420, | ||
pong: { | ||
title: "Pong", | ||
description: `A fast version of the classic Atari game. By Nathan Lichtlé. | ||
First player to score 21 goals wins. | ||
Controls: W/S or Up/Down to move | ||
Observations: 1d vector (continuous) | ||
Actions: Discrete. Move`, | ||
thumbnail: "assets/pong_thumbnail.png", | ||
path: "assets/pong/game.html", | ||
width: 620, | ||
height: 640, | ||
}, | ||
connect4: { | ||
title: "Connect4", | ||
description: "The classic two-player board game. By Spencer, AI enhanced by Jake. Num keys to play in col.", | ||
thumbnail: "assets/connect4_thumbnail.png", | ||
path: "assets/connect4/game.html", | ||
width: 672, | ||
height: 576, | ||
tripletriad: { | ||
title: "Triple Triad", | ||
description: `A card-based minigame from Final Fantasy. By Spencer Cheng. | ||
When a card is placed next to an opponent's card, the numbers of both cards on that edge will be compared. The higher number card captures the lower number card, converting its color. At the end of the game, the player with the most cards of their own color on the board wins. | ||
Controls: | ||
Select card: Number keys | ||
Place card: Click | ||
Observations: 1D vector (continuous) | ||
Actions: Discrete. Select card, place card`, | ||
thumbnail: "assets/tripletriad_thumbnail.png", | ||
path: "assets/tripletriad/game.html", | ||
width: 990, | ||
height: 690, | ||
}, | ||
rware: { | ||
title: "RWare", | ||
description: "Port of the robot warehouse environment RWare to C. By Spencer. W to move, A/D to turn, Enter to load a box.", | ||
description: `Port of the robot warehouse environment RWare to C. By Spencer Cheng. | ||
Controls: | ||
Move forward: W or Up | ||
Turn left: A or Left | ||
Turn right: D or Right | ||
Load/drop box: Space or Enter | ||
Observations: 1D flat crop of nearby tiles (continuous) | ||
Actions: Discrete. Move, turn, load/drop box`, | ||
thumbnail: "assets/rware_thumbnail.png", | ||
path: "assets/rware/game.html", | ||
width: 640, | ||
height: 704, | ||
}, | ||
connect4: { | ||
title: "Connect4", | ||
description: `The classic two-player board game. By Spencer, with opponent AI by Jake Forsey | ||
Be the first player to get four of your pieces in a row horizontally, vertically, or diagonally to win. | ||
Controls: Num keys 1-7 to drop a piece in that column | ||
Observations: 1D vector board state (continuous) | ||
Actions: Discrete. Play piece`, | ||
thumbnail: "assets/connect4_thumbnail.png", | ||
path: "assets/connect4/game.html", | ||
width: 672, | ||
height: 576, | ||
}, | ||
}; | ||
|
||
const wip = { | ||
tcg: { | ||
title: "TCG", | ||
description: "Prototype of a trading card game inspired by MTG. By Joseph. Num keys to select a card/target, Enter to confirm.", | ||
description: `Prototype of a trading card game inspired by MTG. By Joseph Suarez. | ||
Currently supports playing lands and minions with no abilities. Help us continue development! | ||
Controls: | ||
Select card: Num keys | ||
Confirm: Enter`, | ||
thumbnail: "assets/tcg_thumbnail.png", | ||
path: "assets/tcg/game.html", | ||
width: 1080, | ||
height: 720, | ||
}, | ||
robocode: { | ||
title: "Robocode", | ||
description: "A port of the Java programming challenge Robocode to C. By Joseph. W/S to move, A/D to turn, Space to fire.", | ||
description: `Port of the Java programming challenge Robocode to C. By Joseph Suarez. | ||
Really cool tank battle environment that wouldn't take much work to finish. Help us continue development! | ||
Controls: | ||
Move forward: W or Up | ||
Move backward: S or Down | ||
Turn left: A or Left | ||
Turn right: D or Right | ||
Fire: Space`, | ||
thumbnail: "assets/robocode_thumbnail.png", | ||
path: "assets/robocode/game.html", | ||
width: 768, | ||
height: 576, | ||
}, | ||
} | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters