diff --git a/Gemfile.lock b/Gemfile.lock index 2052fe4..ae1d7ee 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -12,9 +12,12 @@ GEM eventmachine (>= 0.12.9) http_parser.rb (~> 0) eventmachine (1.2.7) + ffi (1.17.1) ffi (1.17.1-arm64-darwin) - ffi (1.17.1-x86_64-linux-gnu) forwardable-extended (2.6.0) + google-protobuf (4.29.3-aarch64-linux) + bigdecimal + rake (>= 13) google-protobuf (4.29.3-arm64-darwin) bigdecimal rake (>= 13) @@ -76,9 +79,10 @@ GEM rexml (3.4.0) rouge (4.5.1) safe_yaml (1.0.5) - sass-embedded (1.83.4-arm64-darwin) + sass-embedded (1.83.4) google-protobuf (~> 4.29) - sass-embedded (1.83.4-x86_64-linux-gnu) + rake (>= 13) + sass-embedded (1.83.4-arm64-darwin) google-protobuf (~> 4.29) terminal-table (3.0.2) unicode-display_width (>= 1.1.1, < 3) @@ -86,8 +90,9 @@ GEM webrick (1.9.1) PLATFORMS + aarch64-linux arm64-darwin - x86_64-linux-gnu + x86_64-linux DEPENDENCIES jekyll (~> 4.4.1) diff --git a/_config.yml b/_config.yml index faa6eaa..2e566e5 100644 --- a/_config.yml +++ b/_config.yml @@ -1,8 +1,8 @@ -title: Just the Docs Template -description: A starter template for a Jeykll site using the Just the Docs theme! +title: RGBoard Docs +description: A guide on how to create RGBoards and use the provided software. theme: just-the-docs -url: https://just-the-docs.github.io +favicon: "/assets/images/rgb-paw.png" +logo: "/assets/images/RGB-Icon.png" -aux_links: - Template Repository: https://github.com/just-the-docs/just-the-docs-template +url: https://https://rgboard.github.io/docs diff --git a/assets/images/20250503_010118.jpg b/assets/images/20250503_010118.jpg new file mode 100644 index 0000000..1a3c20a Binary files /dev/null and b/assets/images/20250503_010118.jpg differ diff --git a/assets/images/RGB-Icon.png b/assets/images/RGB-Icon.png new file mode 100644 index 0000000..f3b1ed5 Binary files /dev/null and b/assets/images/RGB-Icon.png differ diff --git a/assets/images/rgb-paw.png b/assets/images/rgb-paw.png new file mode 100644 index 0000000..360ed90 Binary files /dev/null and b/assets/images/rgb-paw.png differ diff --git a/assets/images/spinny.gif b/assets/images/spinny.gif new file mode 100644 index 0000000..ae28cf9 Binary files /dev/null and b/assets/images/spinny.gif differ diff --git a/design.md b/design.md new file mode 100644 index 0000000..7508ae6 --- /dev/null +++ b/design.md @@ -0,0 +1,67 @@ +--- +title: Design +layout: home +nav_order: 2 +--- +gif img of RGBoard +# Designing an RGBoard +You can build this system however you want — and sometimes that freedom can feel like chaos. +The version we’re showing here uses just two panels. Why? Because that was enough for our capstone project. +We actually considered going with a 2×2 layout, but in the end we saved money, time, and our sanity by sticking +with a simpler 2×1 setup. + +## Things to do prior to choosing parts and quantity +- Read the READMEs in the [rpi-rgb-led-matrix](https://github.com/hzeller/rpi-rgb-led-matrix). +If you're about to make a mistake, is likely they did first and wrote about it. For example, +don't get a Raspberry Pi 5 when the library states that is only supported up to the Raspberry Pi 4. +- We got our panels from [Adafruit](https://www.adafruit.com/). Check their inventory for panels and +see which ones you like best for your RGBoard. Make sure is the ones with two IDC connectors in the back. +- The 64 x 32 panels can draw up to 4 amps each! When you add them up, your power supply system has to grow in +size and cost. + +## 1. Get a Raspberry Pi compatible with rpi-rgb-led-matrix +This computer is the central part of your computer. Get yourself a good amount of RAM +to have enough room for your programs that make up the whole system. It also makes remote development easier when +you do remote development with modern day tools. We recommend getting the +Raspberry Pi 4 Model B with a generous 8GB RAM. + +## 2. Determine the size of your board +The size of your board plays a huge part in cost, power and computation. +### Daisy Chaining +You'll notice these boards have arrows drawn on the back to indicate +how your connections should flow. The output of one panel is the input to the next +following this direction. This allows you have a row of n panels. +Depending on the HAT, the adapting board that goes on the Raspberry and allows GPIO connections +to the input boards, you can set up rows on top of each other to make your canvas bigger. You can also +make a canvas with just series connection but will to transform your image on the software side. +### Power +Each panel, assuming they're 64 x 32, needs around 3.8 Amps when they're fully lit up, meaning all LED's set to white. +You can get a 5V 10A power supply for not much and that'll give you enough power for two panels and your Raspberry Pi. However, as +you need more, you might want to consider more serious power supplies to power your system. This is where you need to apply a little +electrical expertise. +### Is there a limit to how many I can chain? +The [rpi-rgb-led-matrix](https://github.com/hzeller/rpi-rgb-led-matrix) library supports up to 3 chains +with a theoretical number of 32 panels on each. That should be enough for most projects using a Raspberry Pi on +their design. If you are making something that requires much more than 3 x 32 panels, which would cost you thousands on the panels alone, +and multiple power supplies... why are you trying to run that off an $80 computer? + +## 3. Get LED matrix panel(s) +It can be one. It can be many. We recommend getting the panels from [Adafruit](https://www.adafruit.com/) but +you can also get them from other providers as long as they come with the HUB75 connector. Please see [Panels supported](https://github.com/hzeller/rpi-rgb-led-matrix?tab=readme-ov-file#panels-supported) and +[Types of Displays](https://github.com/hzeller/rpi-rgb-led-matrix?tab=readme-ov-file#types-of-displays) +for more info. + +## 4. Get a HAT connector +You may be thinking: "Haha, is a HAT because it goes on top of the Raspberry like a hat". WRONG!! It stands for "Hardware Attached on Top" and is about +time you get professional. To make these work, you'll need 2x8 IDC ribbon cables. Your HUB75 connectors work with these but your Raspberry Pi doesn't +have such terminal to physically connect these to. That's why you need a HAT that lets you do this. See [Adapters](https://github.com/hzeller/rpi-rgb-led-matrix/tree/master/adapter) for a selection of library +recommendations. + + +Once you get the general idea of how to put the hardware components together in a way that is thought out. Ask yourself these questions before checking out: +- Do I have compatible panels? +- Do I have enough power for the whole system (Panels + Raspberry Pi)? +- Do I have a [rpi-rgb-led-matrix](https://github.com/hzeller/rpi-rgb-led-matrix) compatible Raspberry Pi? +- Do I have the right amount of 8 x 2 IDC Ribbon cables and are they right length? + +Once you got all these components hooked up. We can move on to the next section which would be initial setup. \ No newline at end of file diff --git a/index.md b/index.md index ca0c545..b5015b9 100644 --- a/index.md +++ b/index.md @@ -1,35 +1,52 @@ --- title: Home layout: home +nav_order: 1 --- - -This is a *bare-minimum* template to create a Jekyll site that uses the [Just the Docs] theme. You can easily set the created site to be published on [GitHub Pages] – the [README] file explains how to do that, along with other details. - -If [Jekyll] is installed on your computer, you can also build and preview the created site *locally*. This lets you test changes before committing them, and avoids waiting for GitHub Pages.[^1] And you will be able to deploy your local build to a different platform than GitHub Pages. - -More specifically, the created site: - -- uses a gem-based approach, i.e. uses a `Gemfile` and loads the `just-the-docs` gem -- uses the [GitHub Pages / Actions workflow] to build and publish the site on GitHub Pages - -Other than that, you're free to customize sites that you create with this template, however you like. You can easily change the versions of `just-the-docs` and Jekyll it uses, as well as adding further plugins. - -[Browse our documentation][Just the Docs] to learn more about how to use this theme. - -To get started with creating a site, simply: - -1. click "[use this template]" to create a GitHub repository -2. go to Settings > Pages > Build and deployment > Source, and select GitHub Actions - -If you want to maintain your docs in the `docs` directory of an existing project repo, see [Hosting your docs from an existing project repo](https://github.com/just-the-docs/just-the-docs-template/blob/main/README.md#hosting-your-docs-from-an-existing-project-repo) in the template README. - ----- - -[^1]: [It can take up to 10 minutes for changes to your site to publish after you push the changes to GitHub](https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll#creating-your-site). - -[Just the Docs]: https://just-the-docs.github.io/just-the-docs/ -[GitHub Pages]: https://docs.github.com/en/pages -[README]: https://github.com/just-the-docs/just-the-docs-template/blob/main/README.md -[Jekyll]: https://jekyllrb.com -[GitHub Pages / Actions workflow]: https://github.blog/changelog/2022-07-27-github-pages-custom-github-actions-workflows-beta/ -[use this template]: https://github.com/just-the-docs/just-the-docs-template/generate +img of RGBoard +# RGBoard Docs 🔴🟢🔵 +RGBoard is a system comprised of parts in different disciplines. +To replicate this project, some fundamentals in different areas must be +understood to create derivations out of the provided instructions. The +documentation provided serves as a guide to help create RGBoards from scratch. +## Fundamentals Prerequisites +This is a great project for those that love tinkering and are not afraid of doing +a little bit of everything. Let's start with the fundamentals to get started +in building RGBoards. +### Engineering graphics 📐✏️ +A lot of people outside of mechanical engineering think this class is a waste of +time, but is one of the most important engineering classes and one +of the most classical forms of engineering. Truth is, to build something, you're going to have to +measure and sketch various iterations til you get your desired end result. Don't panic, +you don't need to know how to create complex objects, it all depends on what kind of board +you want to assemble, but in most cases, you will be building a frame. All you need to know is how +to draw measured lines, do your corners and measure where to put your holes so you can bolt your frame +to the panels. +### Electrical engineering ⚡ +RGBoard needs power relative to its size and the correct GPIO wiring. You don't need to be an electrical engineer, +but you need to understand that if each of your panel draws 3.8A, and you have 2 panels, then you need at minimum, a +10A power supply. +### Raspberry Pi 4 Model B and Unix/Linux Operating Systems 💻 +RGBoard is basically a Raspberry Pi project and this is where you will +be spending most of your time. Raspberry Pi's will usually run on an Operating System built on Debian +running on top of the very much popular Linux kernel. You need to understand how to use this type of +Operating System. If all you have ever used is Windows, you have quite a journey. If you have a Mac, +you're halfway there. +### C++ 🐀 +What makes the lights go in RGBoard is a [library](https://github.com/hzeller/rpi-rgb-led-matrix), mostly written in C++. You need +to know how to compile such libraries and bind them to your own project. You can wrap these executables with Python or another +language. Did you know the unofficial mascot of C++ is a diseased rat? +### Python and Flask 🐍 +The back-end of RGBoard is built with Flask, a web server interface for handling client requests, +and written in Python. Python is a relatively easy language to code in thanks to how much is able to +abstract with its very popular and well documented libraries. You will be handling user request, authenticating +them cryptographically with JSON Web Tokens, and making sure they have their respective CRUD permissions. +### Web frameworks 🌐 +RGBoards front-end is built using a selected set of tools out of the rabbit hole that is web development. We use the React with JavaScript, +Tailwind CSS to have quick styling options, and Vite to build the whole thing in a bundle that can be served with NGINX. You can make your +own front-end if you desire or even turn RGBoard into a mobile app. In the front-end is where most people can apply their flavor. +### Relational databases 🗃️ +In RGBoard, we use SQLite to store data due to it being so easy to interface with Python. You need to know concepts of +Relational Databases like set theory, tables, and SQL queries and transactions. +## Lets get started +The first step would be to choose your sizing and power. Click [here](/design.html) to go to the design step. \ No newline at end of file diff --git a/initial-setup.md b/initial-setup.md new file mode 100644 index 0000000..6233276 --- /dev/null +++ b/initial-setup.md @@ -0,0 +1,5 @@ +--- +title: Initial Setup +layout: home +nav_order: 3 +--- \ No newline at end of file