retro portable new pics and vids
This commit is contained in:
211
retro-portable/index.html
Normal file
211
retro-portable/index.html
Normal file
@ -0,0 +1,211 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Creative Crafter: Retro Portable Manual</title>
|
||||
<script type="module" src="https://cdn.jsdelivr.net/npm/ldrs/dist/auto/quantum.js"></script>
|
||||
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: "Lato";
|
||||
src: url("/Lato-Black.ttf");
|
||||
}
|
||||
|
||||
body, html {
|
||||
font-family: 'Lato', sans-serif;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.loader-container {
|
||||
display: none;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(173, 216, 230, 0.8);
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.loading .loader-container {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Titillium Web', sans-serif;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Honk', system-ui;
|
||||
text-align: center;
|
||||
}
|
||||
footer {
|
||||
text-align: center;
|
||||
}
|
||||
a {
|
||||
color: rgb(0, 41, 175)
|
||||
}
|
||||
|
||||
.center-img {
|
||||
display: block; /* Bild zu Blockelement machen */
|
||||
margin-left: auto; /* Linken Rand automatisch setzen */
|
||||
margin-right: auto; /* Rechten Rand automatisch setzen */
|
||||
/* Kurzform: margin: 0 auto; */
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color:rgb(0, 0, 0);
|
||||
width: 225px
|
||||
}
|
||||
.pre-text {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
border-top: 2px solid #000; /* Eine 1px dicke, durchgezogene schwarze Linie */
|
||||
padding-top: 20px; /* Optional: Abstand zwischen Linie und Inhalt */
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<br>
|
||||
<img class="center-img" src="logo.png" alt="Logo" width="15%">
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<video controls width="25%" class="center-img" poster="videopic.jpg">
|
||||
<source src="video.mp4" type="video/mp4">
|
||||
</video>
|
||||
|
||||
<br>
|
||||
|
||||
<img src="pic1.jpg" alt="pic of the console" width="25%" class="center-img">
|
||||
|
||||
|
||||
|
||||
|
||||
<h2>
|
||||
Material:
|
||||
</h2>
|
||||
|
||||
<div style="padding-left: 30%">
|
||||
|
||||
<h3>
|
||||
- Micro SD card (rec. min. 32GB)
|
||||
<br>
|
||||
- <a href="https://www.raspberrypi.com/products/raspberry-pi-3-model-b-plus/" >Raspberry Pi 3 Model B+</a>
|
||||
<br>
|
||||
- <a href="https://www.amazon.de/-/en/gp/product/B093K2HDZF" >5 inch TFT LCD 800×480, DSI interface</a>
|
||||
<br>
|
||||
- <a href="https://www.amazon.de/dp/B09JK728MB?th=1" >I2S Soundcard (GPIO)</a>
|
||||
<br>
|
||||
- <a href="https://www.amazon.de/dp/B0DK37CSHP" >XBox-styled Bluetooth Gamepad</a>
|
||||
<br>
|
||||
- <a href="https://retropie.org.uk/download/" >RetroPie for Raspberry Pi 3B+</a>
|
||||
<br>
|
||||
- <a href="viewer.html" >3D printed Case</a>
|
||||
<br>
|
||||
- Keyboard for the Alsa Setup
|
||||
<pre class="pre-text" >
|
||||
pcm.!default {
|
||||
type plug
|
||||
slave.pcm "softvol"
|
||||
}
|
||||
|
||||
pcm.softvol {
|
||||
type softvol
|
||||
slave {
|
||||
pcm "dmix"
|
||||
}
|
||||
control {
|
||||
name "Master"
|
||||
card 0
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
<br>
|
||||
- <a href="https://www.amazon.de/dp/B0F5BQWHK3?th=1" >USB C Female charging module</a>
|
||||
<br>
|
||||
- <a href="https://www.amazon.de/dp/B086QGZRKG" >sliding switch</a>
|
||||
<br>
|
||||
- lipo battery with the capacity of 3.7V / 3800 mAh (measure.: 684mm x 81.3mm x 3.4mm)</a>
|
||||
<br>
|
||||
- <a href="https://www.amazon.de/dp/B0D2CSHWC4" >DC DC step Up Module 3.7V to 5V</a>
|
||||
<br>
|
||||
|
||||
</h3>
|
||||
|
||||
</div>
|
||||
|
||||
<h2>
|
||||
Instructions:
|
||||
</h2>
|
||||
|
||||
<div style="padding-left: 30%">
|
||||
|
||||
<h3>
|
||||
1. Flash RetroPie to the SD card using Raspberry Pi Imager and insert it into the Raspberry Pi.
|
||||
<img src="raspimager.png" alt="pic of the raspi imager" width="60%">
|
||||
<br><br>
|
||||
2. Attach the Raspberry Pi to the display and connect the soundcard.
|
||||
<br>
|
||||
2.1. Align the Pi’s screw holes with the display.
|
||||
<br>
|
||||
2.2. Secure with mounting screws.
|
||||
<br>
|
||||
2.3. Insert the FPC cable into the DSI interface.
|
||||
<br>
|
||||
2.4. Connect the soundcard to the GPIO pins.
|
||||
<br><br>
|
||||
3. Plug in your keyboard, shut down EmulationStation, and configure the ALSA softvol.
|
||||
<br><br>
|
||||
4. Reboot the Raspberry Pi.
|
||||
<br><br>
|
||||
5. Solder the USB-C female charging module, sliding switch, LiPo battery, and the 3.7V-to-5V DC-DC step-up module together as shown.
|
||||
<img src="schematic.png" alt="schematic.png" width="60%">
|
||||
<br>
|
||||
(5.1. In our module, the output voltage had to be set using two solder bridges. Both bridges must be open.)
|
||||
<br><br>
|
||||
6. Place the assembled components into the case and glue the USB-C module and sliding switch in their respective openings.
|
||||
<br>
|
||||
(6.1. Insert foam into the cavity.)
|
||||
<br><br>
|
||||
7. Attach the lid.
|
||||
<br><br>
|
||||
8. Mount the case onto the Xbox-style gamepad.
|
||||
<br><br>
|
||||
9. Start gaming!
|
||||
</h3>
|
||||
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<footer class="footer-container">
|
||||
Game played in the video: <a href="https://technik-freak.itch.io/minecraft-game-boy-technik-freak" >Minecraft Fan-Project by Technik Freak</a>
|
||||
|
||||
<br>
|
||||
|
||||
Music used in the video: Music by <a href="https://pixabay.com/de/users/hitslab-47305729/?utm_source=link-attribution&utm_medium=referral&utm_campaign=music&utm_content=270173">HitsLab</a> from <a href="https://pixabay.com/music//?utm_source=link-attribution&utm_medium=referral&utm_campaign=music&utm_content=270173">Pixabay</a>
|
||||
|
||||
|
||||
|
||||
</footer>
|
||||
|
||||
<br>
|
||||
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user