• There is NO official Otland's Discord server and NO official Otland's server list. The Otland's Staff does not manage any Discord server or server list. Moderators or administrator of any Discord server or server lists have NO connection to the Otland's Staff. Do not get scammed!

[Znote AAC] Show outfits on top 5

Responsive + VIP Animation + Animation Player

[pt-br] Game: CVOT - BR


PHP:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        .sidebar-container {
            display: flex;
            justify-content: center;
            margin: 20px;
        }

        .sidebar {
            max-width: 100%;
            padding: 30px;
            background: transparent;
            border-radius: 5px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
        }

        .sidebar h3 {
            text-align: center;
            font-size: 24px;
            color: #d1a233;
            margin-bottom: 20px;
        }

        .player-list {
            list-style: none;
            padding: 0;
        }

        .player-item {
            display: flex;
            align-items: center;
            margin-bottom: 10px;
        }

        .player-avatar {
            width: 80px;
            height: 80px;
            margin-right: 10px;
            border: 2px solid transparent;
            border-radius: 5px;
            transition: transform 0.5s, border-color 0.5s;
            background-size: cover;
            background-repeat: no-repeat;
        }

        .player-item:hover .player-avatar {
            border-color: #d1a233;
            cursor: pointer;
            transform: scale(1.1);
        }

        .player-info {
            flex-grow: 1;
            display: flex;
            flex-direction: column;
        }

        .player-info a {
            text-decoration: none;
            color: rgb(155,162,177);
            font-weight: bold;
        }

        .player-level {
            color: rgb(195,180,177);
        }

        .icons-container {
            display: flex;
            align-items: center;
        }

        .premdays-icon {
            position: relative;
            margin-right: 10px;
        }

        .premdays-icon img {
            width: 25px;
            height: 25px;
            transition: transform 0.5s;
        }

        .premdays-tooltip {
            position: absolute;
            top: -30px;
            left: 0;
            background-color: #d1a233;
            color: #fff;
            padding: 5px;
            border-radius: 5px;
            opacity: 0;
            transition: opacity 0.5s;
            pointer-events: none;
            white-space: nowrap; /* Evita quebra de linha */
        }

        .premdays-icon:hover .premdays-tooltip {
            opacity: 1;
        }

        .premdays-player {
            animation: pulse 1s infinite; /* Animação de pulsação */
        }

        @keyframes pulse {
            0% {
                transform: scale(1);
            }
            50% {
                transform: scale(1.1);
            }
            100% {
                transform: scale(1);
            }
        }
    </style>
</head>
<body>
<div class="sidebar-container">
    <div class="sidebar">
        <h3>Top 10 Players</h3>
        <ul class="player-list">
            <?php
            // Certifique-se de que você está conectado ao banco de dados aqui

            $cache = new Cache('engine/cache/topPlayer');
            if ($cache->hasExpired()) {
                // Consulta SQL para buscar os jogadores e seus premdays
                $players = mysql_select_multi('SELECT p.`name`, p.`level`, p.`experience`, p.`looktype`, p.`lookaddons`, p.`lookhead`, p.`lookbody`, p.`looklegs`, p.`lookfeet`, a.`premdays` FROM `players` p LEFT JOIN `accounts` a ON p.`account_id` = a.`id` WHERE p.`group_id` < ' . $config['highscore']['ignoreGroupId'] . ' ORDER BY p.`experience` DESC LIMIT 10;');
                $cache->setContent($players);
                $cache->save();
            } else {
                $players = $cache->load();
            }

            if ($players) {
                foreach ($players as $player) {
                    // Verifique se o jogador tem 1 ou mais premdays e adicione a classe apropriada
                    $premdays = $player['premdays'];
                    $playerClass = $premdays >= 1 ? 'premdays-player' : '';

                    echo '<li class="player-item">';
                    
                    // Adicione um link âncora em torno da imagem do avatar
                    echo '<a href="characterprofile.php?name=' . $player['name'] . '">';
                    echo '<div class="player-avatar" style="background-image: url(\'https://outfit-images.ots.me/animatedOutfits1090/animoutfit.php?id=' . $player['looktype'] . '&addons=' . $player['lookaddons'] . '&head=' . $player['lookhead'] . '&body=' . $player['lookbody'] . '&legs=' . $player['looklegs'] . '&feet=' . $player['lookfeet'] . '&g=0&h=3&i=1\');"></div>';
                    echo '</a>'; // Feche o link âncora

                    echo '<div class="player-info">';
                    echo '<a href="characterprofile.php?name=' . $player['name'] . '">' . $player['name'] . '</a>';
                    echo '<div class="player-level">Level ' . $player['level'] . '</div>';
                    
                    // Verifique se o jogador tem 1 ou mais premdays e exiba o ícone de Premdays
                    if ($premdays >= 1) {
                        echo '<div class="icons-container">';
                        echo '<div class="premdays-icon">';
                        echo '<img src="https://i.imgur.com/ZgSVc0X.png" alt="Premdays Icon" class="premdays-player">'; // Adicione a classe 'premdays-player' para manter a animação
                        echo '<div class="premdays-tooltip">' . $premdays . ' VIP DAYS</div>';
                        echo '</div>';
                    }
                    
                    echo '</div>';
                    echo '</li>';
                }
            }
            ?>
        </ul>
    </div>
</div>
</body>
</html>

Sem título.png
 
any can help me, after create character.

(query - SQL error)
Type: voidQuery (voidQuery is used for update, insert or delete from database)

Duplicate entry '0' for key 'players.PRIMARY'
 
I'm doing this. so it uses config.php instead of being changing the code in the file itself. i use znoteacc
Lua:
                                 echo '
                <div class="outfit">

                   <li style="margin: 8px 5px;"> <div style="position:relative; left:-28px; top:-28px;"><img src="' . $config['show_outfits']['imageServer'] . '?id=' . $player['looktype'] .
(isset($player['lookaddons']) ? '&addons=' . $player['lookaddons'] : '') .
'&head=' . (isset($player['lookhead']) ? $player['lookhead'] : '') .
'&body=' . (isset($player['lookbody']) ? $player['lookbody'] : '') .
'&legs=' . (isset($player['looklegs']) ? $player['looklegs'] : '') .
'&feet=' . (isset($player['lookfeet']) ? $player['lookfeet'] : '') . '" alt="img">
<div style="position:relative; left:31px; top:2px;"><a style="margin-right: 13px;" href="characterprofile.php?name=' . $player['name'] . '">' . $nam . '</a>
<span style="float: center;">'.coloured_value($player['experience']-$player['exphist_lastexp']).'</span></li>



                </div>
            ';
                        //echo '<span style="float: right;">' . coloured_value($player['experience'] - $player['exphist_lastexp']) . ' - Level ' . $player['level'] . '</span></li>';
                    }
                }
}
the only problem is the distance among players. can somebody lent me a hand this this?
Untitled.png
 
Back
Top