Skip to content

Commit

Permalink
feat: add page for developers
Browse files Browse the repository at this point in the history
  • Loading branch information
manankarnik committed Feb 18, 2024
1 parent bcd3296 commit bd0f083
Show file tree
Hide file tree
Showing 7 changed files with 187 additions and 6 deletions.
Binary file modified bun.lockb
Binary file not shown.
3 changes: 3 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
"@sveltejs/adapter-netlify": "^3.0.1",
"@sveltejs/kit": "^2.0.0",
"@sveltejs/vite-plugin-svelte": "^3.0.0",
"@tailwindcss/typography": "^0.5.10",
"@types/eslint": "8.56.0",
"@typescript-eslint/eslint-plugin": "^6.0.0",
"@typescript-eslint/parser": "^6.0.0",
Expand All @@ -31,6 +32,7 @@
"prisma": "^5.8.0",
"svelte": "^4.2.7",
"svelte-check": "^3.6.0",
"svelte-highlight": "^7.6.0",
"tailwind-scrollbar": "^3.0.5",
"tailwindcss": "^3.3.6",
"tslib": "^2.4.1",
Expand All @@ -45,6 +47,7 @@
"@prisma/client": "5.8.0",
"bits-ui": "^0.15.1",
"clsx": "^2.1.0",
"highlight.js": "^11.9.0",
"lucide-svelte": "^0.303.0",
"mode-watcher": "^0.1.2",
"tailwind-merge": "^2.2.0",
Expand Down
11 changes: 10 additions & 1 deletion src/app.pcss
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
--foreground: 240 10% 3.9%;
--card: 0 0% 100%;
--card-foreground: 240 10% 3.9%;
--popover: 0 0% 100%;;
--popover: 0 0% 100%;
--popover-foreground: 240 10% 3.9%;
--primary: 240 5.9% 10%;
--primary-foreground: 0 0% 98%;
Expand Down Expand Up @@ -46,6 +46,15 @@
--input: 240 3.7% 15.9%;
--ring: 240 4.9% 83.9%;
}
.prose pre {
@apply bg-transparent p-0;
code {
@apply !rounded-xl backdrop-blur;
}
}
.hljs {
@apply scrollbar-thin scrollbar-track-slate-100 scrollbar-thumb-slate-400 scrollbar-thumb-rounded dark:scrollbar-track-slate-700 dark:scrollbar-thumb-slate-900;
}
}

@layer base {
Expand Down
7 changes: 3 additions & 4 deletions src/lib/components/footer.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,15 @@
links.push({ href: "/manage", text: "Manage" });
}
links.push({ href: "/dev", text: "For Devs" });
links.push({ href: "https://github.com/manankarnik/procedra/releases", text: "Download" });
</script>

<footer class="bg-[hsl(var(--background))]/60 p-10 backdrop-blur">
<div
class="flex items-center justify-between gap-4"
>
<div class="flex items-center justify-between gap-4">
<div>
<h3 class="text-xl font-bold sm:text-2xl">Procedra</h3>
</div>
<div class="grid-col-1 hidden gap-4 md:grid md:grid-cols-2 lg:grid-cols-4">
<div class="hidden gap-4 md:grid md:grid-cols-3 lg:grid-cols-5">
{#each links as link}
<a
href={link.href}
Expand Down
9 changes: 9 additions & 0 deletions src/lib/highlight.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
// Using ES6 import syntax
import hljs from "highlight.js/lib/core";
import shell from "highlight.js/lib/languages/shell";
import rust from "highlight.js/lib/languages/rust";

hljs.registerLanguage("shell", shell);
hljs.registerLanguage("rust", rust);

export default hljs;
161 changes: 161 additions & 0 deletions src/routes/dev/+page.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,161 @@
<script>
import Footer from "$lib/components/footer.svelte";
import Highlight from "svelte-highlight";
import shell from "svelte-highlight/languages/shell";
import rust from "svelte-highlight/languages/rust";
import github from "svelte-highlight/styles/github";
import githubDark from "svelte-highlight/styles/github-dark";
import { mode } from "mode-watcher";
const mapCode = `use bevy::prelude::*;
use bevy_generative::map::{MapBundle, MapPlugin};
fn main() {
App::new()
.add_plugins(DefaultPlugins)
.add_plugins(MapPlugin)
.add_systems(Startup, setup)
.run();
}
fn setup(mut commands: Commands) {
commands.spawn(Camera2dBundle::default());
commands.spawn(MapBundle::default());
}
`;
const terrainCode = `use bevy::prelude::*;
use bevy_generative::terrain::{TerrainBundle, TerrainPlugin};
fn main() {
App::new()
.add_plugins(DefaultPlugins)
.add_plugins(TerrainPlugin)
.add_systems(Startup, setup)
.run();
}
fn setup(mut commands: Commands) {
commands.spawn(PointLightBundle {
transform: Transform::from_xyz(-2.0, 2.5, 5.0).looking_at(Vec3::ZERO, Vec3::Y),
..default()
});
commands.spawn(Camera3dBundle {
transform: Transform::from_xyz(-2.0, 2.5, 5.0).looking_at(Vec3::ZERO, Vec3::Y),
..default()
});
commands.spawn(TerrainBundle::default());
}
`;
const planetExample = `use bevy::prelude::*;
use bevy_generative::planet::{PlanetBundle, PlanetPlugin};
fn main() {
App::new()
.add_plugins(DefaultPlugins)
.add_plugins(PlanetPlugin)
.add_systems(Startup, setup)
.run();
}
fn setup(mut commands: Commands) {
commands.spawn(PointLightBundle {
transform: Transform::from_xyz(-2.0, 2.5, 5.0).looking_at(Vec3::ZERO, Vec3::Y),
..default()
});
commands.spawn(Camera3dBundle {
transform: Transform::from_xyz(-2.0, 2.5, 5.0).looking_at(Vec3::ZERO, Vec3::Y),
..default()
});
commands.spawn(PlanetBundle::default());
}
`;
</script>

<svelte:head>
<title>For Developers • Procedra</title>
{#if $mode == "dark"}
{@html githubDark}
{:else}
{@html github}
{/if}
</svelte:head>

<section>
<article class="prose mx-auto my-8 p-4 dark:prose-invert md:p-0">
<h1
class="animate-gradient bg-gradient-to-r bg-clip-text text-4xl font-extrabold text-transparent"
>
For Developers
</h1>
<p>
Hey developers, welcome to the world of procedural generation with bevy_generative! Are you
tired of being restricted by the limited customization options of our current web app? Or
perhaps you're eager to integrate procedural generation directly into your Bevy game? Well,
you're in luck because bevy_generative has got you covered! In this guide, we'll explore how
to get started with this powerful plugin for the Bevy game engine. But before we dive in, make
sure you have Rust and Cargo installed on your system.
</p>
<h2>What is bevy_generative?</h2>
<p>
bevy_generative is a plugin designed specifically for the Bevy engine, allowing you to perform
real-time procedural generation of maps, textures, terrain, planets, and more! Whether you're
creating dynamic landscapes, generating unique textures, or crafting immersive 3D
environments, bevy_generative has got you covered.
</p>
<h2>Installation</h2>
<p>
To get started, you'll need to add bevy_generative to your Rust project. You can do this by
running the following command in your terminal:
</p>
<Highlight language={shell} code="cargo add bevy_generative" />
<h2>Examples</h2>
<p>Let's dive into some examples to see bevy_generative in action!</p>
<h3>Maps and Textures</h3>
<p>
Maps and textures are essential elements of any game world. With bevy_generative, you can
dynamically generate maps and textures in real-time, allowing for endless variations and
customization. In this example, we'll show you how to spawn a basic 2D camera and generate a
map.
</p>
<Highlight language={rust} code={mapCode} />
<h3>Terrain</h3>
<p>
Creating realistic terrain can breathe life into your game world. With bevy_generative, you
can generate detailed terrain meshes with ease. In this example, we'll demonstrate how to
spawn a 3D camera and generate terrain.
</p>
<Highlight language={rust} code={terrainCode} />
<h3>Planets</h3>
<p>
Transport your players to distant worlds with procedurally generated planets. With
bevy_generative, you can create stunning planetary landscapes on the fly. In this example,
we'll illustrate how to spawn a 3D camera and generate a planet. Note that these are not
highly detailed and are recommended for backdrops.
</p>
<Highlight language={rust} code={planetExample} />
<h2>Source Code and API Documentation</h2>
<p>
The source code for bevy_generative can be found on <a
href="https://github.com/manankarnik/procedra">Github</a
>. The complete API documentation for bevy_generative, including all the customizable
parameters, can be found <a href="https://docs.rs/bevy_generative">here</a>. Be sure to check
it out for detailed information on how to fine-tune your procedural generation to suit your
needs.
</p>
<h2>Bevy Compatibility</h2>
<p>bevy_generative is compatible with Bevy 0.12.</p>
<h2>Contributing</h2>
<p>
We're not accepting pull requests at this time, but we welcome issues, feature requests, and
bug reports. Your feedback is valuable in improving bevy_generative for everyone!
</p>
<h2>License</h2>
<p>
bevy_generative is dual-licensed under the MIT License and Apache License, Version 2.0. You
can choose the license that suits your needs best.<br /> Happy coding! 🚀
</p>
<p>~ Manan Karnik</p>
</article>
</section>

<Footer />
2 changes: 1 addition & 1 deletion tailwind.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ const config = {
darkMode: ["class"],
content: ["./src/**/*.{html,js,svelte,ts}"],
safelist: ["dark", { pattern: /^bg-/ }],
plugins: [require("tailwind-scrollbar")({ nocompatible: true })],
plugins: [require("tailwind-scrollbar")({ nocompatible: true }), require('@tailwindcss/typography')],
theme: {
container: {
center: true,
Expand Down

0 comments on commit bd0f083

Please sign in to comment.