Added icon_links.py to customize where the icons for discord/telegram/gitea take you #7

Merged
tpd94 merged 1 commits from main into github 2025-04-28 22:07:39 +00:00
6 changed files with 85 additions and 258 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,5 @@
<<<<<<< Updated upstream
<!doctype html>
<html lang="en">
<html lang="en" class="w-full h-full">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favico.png" />
@ -13,32 +12,10 @@
<meta property='og:url' content="{{ data.opengraph_url }}" />
<meta property='og:locale' content='en_US' />
<title>{{ data.tab_title }}</title>
<script type="module" crossorigin src="/assets/index-D2On2KQO.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-0Rv9u7Qs.css">
<script type="module" crossorigin src="/assets/index-DN7XJ__W.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-COb8XlA9.css">
</head>
<body>
<div id="root"></div>
<body class="w-full h-full">
<div id="root" class="w-full h-full"></div>
</body>
=======
<!doctype html>
<html lang="en" class="w-full h-full">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favico.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="{{ data.description }}"/>
<meta name="keywords" content="{{ data.keywords }}"/>
<meta property='og:title' content="{{ data.opengraph_title }}" />
<meta property='og:description' content="{{ data.opengraph_description }}" />
<meta property='og:image' content="{{ data.opengraph_image }}" />
<meta property='og:url' content="{{ data.opengraph_url }}" />
<meta property='og:locale' content='en_US' />
<title>{{ data.tab_title }}</title>
<script type="module" crossorigin src="/assets/index-Hj0TonAS.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-DhrTUBtZ.css">
</head>
<body class="w-full h-full">
<div id="root" class="w-full h-full"></div>
</body>
>>>>>>> Stashed changes
</html>

View File

@ -1,3 +1,4 @@
import { useEffect, useState } from 'react';
import { NavLink } from 'react-router-dom';
import homeIcon from '../assets/icons/home.svg';
import cacheIcon from '../assets/icons/cache.svg';
@ -8,105 +9,96 @@ import telegramIcon from '../assets/icons/telegram.svg';
import giteaIcon from '../assets/icons/gitea.svg';
function NavBar() {
const [externalLinks, setExternalLinks] = useState({
discord: '#',
telegram: '#',
gitea: '#',
});
useEffect(() => {
fetch('/api/links')
.then(response => response.json())
.then(data => setExternalLinks(data))
.catch(error => console.error('Error fetching links:', error));
}, []);
return (
<div className="flex flex-col w-full h-full bg-white/1">
<div>
<p className='text-white text-2xl font-bold p-3 text-center mb-5'>
<a href='/'>
CDRM-Project
</a>
<a href='/'>CDRM-Project</a>
</p>
</div>
<div className='overflow-y-auto grow'>
<NavLink
to='/'
className={({ isActive }) =>
`flex flex-row p-3 border-l-3 ${isActive ? 'border-l-sky-500/50 bg-black/50' : 'hover:border-l-sky-500/50 hover:bg-white/5'}`
}
>
<button className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer'>
<img src={homeIcon} alt="Home" className='w-1/2 cursor-pointer' />
</button>
<p className='grow text-white md:text-2xl font-bold flex items-center justify-start'>
Home
</p>
</NavLink>
<NavLink
to='/cache'
className={({ isActive }) =>
`flex flex-row p-3 border-l-3 ${isActive ? 'border-l-emerald-500/50 bg-black/50' : 'hover:border-l-emerald-500/50 hover:bg-white/5'}`
}
>
<button className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer'>
<img src={cacheIcon} alt="Cache" className='w-1/2 cursor-pointer' />
</button>
<p className='grow text-white md:text-2xl font-bold flex items-center justify-start'>
Cache
</p>
</NavLink>
<NavLink
to='/api'
className={({ isActive }) =>
`flex flex-row p-3 border-l-3 ${isActive ? 'border-l-indigo-500/50 bg-black/50' : 'hover:border-l-indigo-500/50 hover:bg-white/5'}`
}
>
<button className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer'>
<img src={apiIcon} alt="API" className='w-1/2 cursor-pointer' />
</button>
<p className='grow text-white md:text-2xl font-bold flex items-center justify-start'>
API
</p>
</NavLink>
<NavLink
to='/testplayer'
className={({ isActive }) =>
`flex flex-row p-3 border-l-3 ${isActive ? 'border-l-rose-700/50 bg-black/50' : 'hover:border-l-rose-700/50 hover:bg-white/5'}`
}
>
<button className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer'>
<img src={testPlayerIcon} alt="Test Player" className='w-1/2 cursor-pointer' />
</button>
<p className='grow text-white md:text-2xl font-bold flex items-center justify-start'>
Test Player
</p>
</NavLink>
{/* Static routes */}
{[{
to: '/',
label: 'Home',
icon: homeIcon,
color: 'sky'
}, {
to: '/cache',
label: 'Cache',
icon: cacheIcon,
color: 'emerald'
}, {
to: '/api',
label: 'API',
icon: apiIcon,
color: 'indigo'
}, {
to: '/testplayer',
label: 'Test Player',
icon: testPlayerIcon,
color: 'rose-700'
}].map(({ to, label, icon, color }) => (
<NavLink
key={label}
to={to}
className={({ isActive }) =>
`flex flex-row p-3 border-l-3 ${
isActive
? `border-l-${color}-500/50 bg-black/50`
: `hover:border-l-${color}-500/50 hover:bg-white/5`
}`
}
>
<button className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer'>
<img src={icon} alt={label} className='w-1/2 cursor-pointer' />
</button>
<p className='grow text-white md:text-2xl font-bold flex items-center justify-start'>
{label}
</p>
</NavLink>
))}
</div>
{/* External links */}
<div className='flex flex-row w-full h-16 self-end bg-black/25'>
<a
href='https://discord.cdrm-project.com'
href={externalLinks.discord}
target='_blank'
rel='noopener noreferrer'
className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer hover:bg-blue-950 group'
>
<img
src={discordIcon}
alt="Discord"
className='w-1/2 cursor-pointer group-hover:animate-bounce'
/>
<img src={discordIcon} alt="Discord" className='w-1/2 group-hover:animate-bounce' />
</a>
<a
href='https://telegram.cdrm-project.com'
href={externalLinks.telegram}
target='_blank'
rel='noopener noreferrer'
className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer hover:bg-blue-400 group'
>
<img
src={telegramIcon}
alt="Telegram"
className='w-1/2 cursor-pointer group-hover:animate-bounce'
/>
<img src={telegramIcon} alt="Telegram" className='w-1/2 group-hover:animate-bounce' />
</a>
<a
href='https://cdm-project.com/tpd94/cdrm-project'
href={externalLinks.gitea}
target='_blank'
rel='noopener noreferrer'
className='w-1/3 p-3 flex flex-col items-center justify-center cursor-pointer hover:bg-green-700 group'
>
<img
src={giteaIcon}
alt="Gitea"
className='w-1/2 cursor-pointer group-hover:animate-bounce'
/>
<img src={giteaIcon} alt="Gitea" className='w-1/2 group-hover:animate-bounce' />
</a>
</div>
</div>

5
configs/icon_links.py Normal file
View File

@ -0,0 +1,5 @@
data = {
'discord': 'https://discord.cdrm-project.com/',
'telegram': 'https://telegram.cdrm-project.com/',
'gitea': 'https://cdm-project.com/tpd94/cdm-project'
}

View File

@ -10,6 +10,7 @@ import mysql.connector
from io import StringIO
import tempfile
import time
from configs.icon_links import data as icon_data
api_bp = Blueprint('api', __name__)
with open(f'{os.getcwd()}/configs/config.yaml', 'r') as file:
@ -233,4 +234,12 @@ def decrypt_data():
return jsonify({
'status': 'fail',
'message': result['message']
})
})
@api_bp.route('/api/links', methods=['GET'])
def get_links():
return jsonify({
'discord': icon_data['discord'],
'telegram': icon_data['telegram'],
'gitea': icon_data['gitea'],
})