Files
project_vollidioten_website/pages/SetupGuide.tsx
Lars Behrends d1b797a320 feat: Initialize project with Vite, React, and TypeScript
Sets up the foundational structure for the Obsidian | RP Plattform. This includes configuring Vite as the build tool, integrating React for the UI, and establishing TypeScript for type safety. Also includes initial styling and placeholder data to define the application's core interfaces.
2025-12-28 02:15:09 +01:00

128 lines
4.3 KiB
TypeScript

import React from 'react';
import { Icons } from '../components/IconSet';
const CodeBlock = ({ label, lang, code }: { label: string, lang: string, code: string }) => (
<div className="mb-8">
<div className="flex justify-between items-center mb-2">
<span className="text-sm font-medium text-textMain flex items-center gap-2">
<Icons.Terminal className="w-4 h-4 text-accentInfo" /> {label}
</span>
<span className="text-xs text-textMuted uppercase bg-surfaceHighlight px-2 py-1 rounded">{lang}</span>
</div>
<div className="bg-[#0b0b0d] border border-border rounded-lg p-4 overflow-x-auto shadow-inner group relative">
<pre className="text-xs font-mono text-gray-300 leading-relaxed">
<code>{code}</code>
</pre>
<button
onClick={() => navigator.clipboard.writeText(code)}
className="absolute top-2 right-2 opacity-0 group-hover:opacity-100 bg-surfaceHighlight border border-border text-xs px-2 py-1 rounded text-textMain hover:bg-white/10 transition-all"
>
Kopieren
</button>
</div>
</div>
);
const SetupGuide: React.FC = () => {
return (
<div className="max-w-3xl mx-auto space-y-8 pb-20">
<div>
<h1 className="text-3xl font-bold mb-4">Installationsanleitung</h1>
<p className="text-textMuted leading-relaxed">
Die Obsidian-Plattform nutzt einen leichtgewichtigen, serverunabhängigen Ansatz.
Der Minecraft-Server generiert Daten über Vanilla-Befehle, und ein einfaches Shell-Skript lädt diese auf den Webserver hoch.
</p>
</div>
<div className="p-4 bg-surfaceHighlight/20 border border-accentInfo/20 rounded-lg text-sm text-textMuted">
<strong className="text-accentInfo">Hinweis:</strong> Kein Python oder schweres Backend erforderlich. Funktioniert unter Windows (Batch) und Linux (Bash).
</div>
<CodeBlock
label="1. Datapack Funktion (export.mcfunction)"
lang="mcfunction"
code={`# File: data/obsidian/functions/export_player.mcfunction
# Triggered by: execute as @a run function obsidian:export_player
# 1. Store Inventory Data to Storage
data modify storage obsidian:temp Inventory set from entity @s Inventory
# 2. Log formatted JSON to server console
# We use tellraw/log tricks or simply "data get" to print to log, which the script scrapes.
# Ideally, use a macro to format this into a single line string.
# Simplified concept for log scraping:
tellraw @a[tag=admin] [{"text":"JSON_EXPORT_START|"},{"selector":"@s"},{"text":"|"},{"nbt":"Inventory","entity":"@s"}]
`}
/>
<CodeBlock
label="2. Upload Skript (Linux/Bash)"
lang="bash"
code={`#!/bin/bash
# obsidian_sync.sh
# Scrapes logs for JSON markers and uploads to Web Server
LOG_FILE="/path/to/minecraft/logs/latest.log"
WEB_DIR="./web_data"
FTP_HOST="ftp.yourserver.com"
FTP_USER="user"
FTP_PASS="pass"
mkdir -p $WEB_DIR
# 1. Parse Log (Simple Grep/Sed extraction)
# Look for lines starting with JSON_EXPORT_START
grep "JSON_EXPORT_START" $LOG_FILE | tail -n 10 > temp_extract.txt
while read p; do
# Extract Name and JSON data (simplified regex)
# In production, use 'jq' if available, otherwise pure bash string manipulation
PLAYER_NAME=$(echo $p | cut -d'|' -f2)
JSON_DATA=$(echo $p | cut -d'|' -f3)
echo "{ \"username\": \"$PLAYER_NAME\", \"inventory\": $JSON_DATA }" > "$WEB_DIR/$PLAYER_NAME.json"
done < temp_extract.txt
# 2. Upload via lftp (High performance, parallel)
lftp -u $FTP_USER,$FTP_PASS $FTP_HOST <<EOF
mirror -R -v $WEB_DIR /public_html/api/players
bye
EOF
echo "Sync Complete at $(date)"
`}
/>
<CodeBlock
label="3. Upload Skript (Windows Batch)"
lang="batch"
code={`@echo off
:: obsidian_sync.bat
:: Uses standard Windows FTP command
set LOCAL_DIR=C:\\Minecraft\\web_data
set FTP_SCRIPT=ftp_script.txt
:: Create FTP script dynamically
echo open ftp.yourserver.com > %FTP_SCRIPT%
echo myuser >> %FTP_SCRIPT%
echo mypassword >> %FTP_SCRIPT%
echo cd public_html/api/players >> %FTP_SCRIPT%
echo lcd %LOCAL_DIR% >> %FTP_SCRIPT%
echo mput *.json >> %FTP_SCRIPT%
echo disconnect >> %FTP_SCRIPT%
echo quit >> %FTP_SCRIPT%
:: Run FTP
ftp -i -s:%FTP_SCRIPT%
del %FTP_SCRIPT%
echo Sync Complete.
`}
/>
</div>
);
};
export default SetupGuide;