<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>IW4MAdmin by RaidMax</title>
    <meta name="description" content="Administration tool for IW4M servers. IW4MAdmin Created by RaidMax">

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <script src="http://code.jquery.com/jquery-3.3.1.min.js"
            integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
            crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
    <style>
        #profile_avatar {
            height: 200px;
            width: 200px;
        }

        .profile-shortcode {
            font-size: 150pt;
            line-height: 175px;
            color: white;
        }

        .text-highlight {
            color: rgb(0, 122, 204) !important;
        }

        #profile_info {
            color: white;
        }

        #profile_name {
            font-size: 4em;
            line-height: 1em;
        }

        #profile_info > .text-muted {
            font-size: 1.5em;
            line-height: 1.25em;
        }

        #content,
        .container-fluid, #profile_aliases, body {
            background-color: rgb(34, 34, 34);
        }

        #profile_level > span.level {
            color: rgba(236, 130, 222, 0.69);
            font-weight: bold;
            font-size: 1.5em;
            line-height: 1.4em;
        }

        #profile_wrapper {
            border-bottom: 2px rgb(0, 122, 204) solid;
        }

        .level-color-user, .level-color-guest {
            color: rgba(255, 255, 255, 0.85);
        }

        .level-bgcolor-user, .level-bgcolor-guest {
            background-color: rgba(255, 255, 255, 0.85);
        }

        .level-color-trusted, .level-color-user {
            color: rgba(116,147,99,1);
        }

        .level-bgcolor-trusted, .level-bgcolor-user {
            background-color: rgba(116,147,99,1);
        }

        .level-color-flagged {
            color: rgba(253, 139, 22, 0.85);
        }

        .level-bgcolor-flagged {
            background-color: rgba(253, 139, 22, 0.85);
        }

        .level-color-banned {
            color: rgba(255, 69, 69, 0.85);
        }

        .level-bgcolor-banned {
            background-color: rgba(255, 69, 69, 0.85);
        }

        .level-color-moderator {
            color: rgba(235, 211, 101, 0.75);
        }

        .level-bgcolor-moderator {
            background-color: rgba(235, 211, 101, 0.75);
        }

        .level-color-administrator {
            color: rgba(236, 130, 222, 0.69);
        }

        .level-bgcolor-administrator {
            background-color: rgba(236, 130, 222, 0.69);
        }

        .level-color-senioradmin {
            color: rgba(50, 177, 185, 0.85);
        }

        .level-bgcolor-senioradmin {
            background-color: rgba(50, 177, 185, 0.85);
        }

        .level-color-owner {
            color: rgb(0, 122, 204);
        }

        .level-bgcolor-owner {
            background-color: rgb(0, 122, 204);
        }

        .profile-meta-title {
            color: white;
        }

        .profile-meta-entry {
            font-size: 1.5em;
        }

        .penalties-color-kick {
            color: rgba(116, 147, 99, 1);
        }

        .penalties-color-report {
            color: rgba(116, 147, 99, 1);
        }

        .penalties-color-warning {
            color: rgba(235, 211, 101, 0.75);
        }

        .penalties-color-tempban {
            color: rgba(253, 139, 22, 0.85);
        }

        .penalties-color-flag {
            color: rgba(253, 139, 22, 0.85);
        }

        .penalties-color-ban {
            color: rgba(255, 69, 69, 0.85);
        }

        #profile_aliases_btn {
            font-size: 0.5em;
            color: rgb(0, 122, 204);
            cursor: pointer;
        }

            #profile_aliases_btn:hover {
                color: white;
                cursor: pointer;
            }

        #profile_aliases {
            position: relative;
            display: none;
            top: 0.2em;
        }
    </style>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script>
        function parseGet(val) {
            var result = "undefined",
                tmp = [];
            location.search
                .substr(1)
                .split("&")
                .forEach(function (item) {
                    tmp = item.split("=");
                    if (tmp[0] === val) result = decodeURIComponent(tmp[1]);
                });
            return result;
        }

        function penaltyToName(penaltyName) {
            switch (penaltyName) {
                case "Flag":
                    return "Flagged"
                case "Warning":
                    return "Warned";
                case "Report":
                    return "Reported";
                case "Ban":
                    return "Banned";
                case "Kick":
                    return "Kicked";
                case "TempBan":
                    return "Temp Banned";
            }
        }

        let playerInfo = undefined;

        function loadMeta(meta) {
            let eventString = '';
            // it's a penalty
            if (meta.Class.includes("Penalty")) {
                if (meta.Value.PunisherId != playerInfo.playerID) {
                    eventString = `<div><span class="penalties-color-${meta.Value.Type.toLowerCase()}">${penaltyToName(meta.Value.Type)}</span> by <span class="text-highlight"> <a href="/profile?id=${meta.Value.PunisherId}">${meta.Value.PunisherName}</a></span > for <span style="color: white; ">${meta.Value.Offense}</span> ${meta.WhenString} ago </div>`;
                }
                else {
                    eventString = `<div><span class="penalties-color-${meta.Value.Type.toLowerCase()}">${penaltyToName(meta.Value.Type)} </span> <span class="text-highlight"><a href="/profile?id=${meta.Value.OffenderId}"> ${meta.Value.OffenderName}</a></span > for <span style="color: white; ">${meta.Value.Offense}</span> ${meta.WhenString} ago </div>`;
                }
            }
            // it's a message
            else if (meta.Key.includes("Event")) {
                eventString = `<div><span style="color:white;">></span><span class="text-muted"> ${meta.Value}</span></div>`;
            }
            $('#profile_events').append(eventString);
        }

        let count = 1;
        $(window).scroll(function () {
            if ($(window).scrollTop() == $(document).height() - $(window).height() || $(document).height() == $(window).height()) {
                while (count % 40 != 0 && count < playerInfo.Meta.length) {
                    loadMeta(playerInfo.Meta[count - 1]);
                    count++;
                }
                count++;
            }
        });

        $(document).ready(function () {
            $("#profile_aliases_btn").click(function (e) {
                if ($("#profile_aliases").text() != '') {
                    $("#profile_aliases").slideToggle(150);
                }
            });

            jQuery.getJSON("/getplayer?profile=1&id=" + parseGet("id"), function (result) {
                playerInfo = result[0];

                let firstLetter = playerInfo.playerName.match(/[a-zA-Z]/);
                if (firstLetter == undefined)
                    firstLetter = '?';
                else
                    firstLetter = firstLetter.pop().toUpperCase();

                $('#profile_avatar').addClass('level-bgcolor-' + playerInfo.playerLevel.toLowerCase());
                $('#profile_avatar > .profile-shortcode').text(firstLetter);
                $('#profile_name > .client-name').prepend(playerInfo.playerName);
                $.each(playerInfo.playerAliases, function (index, alias) {
                    $("#profile_aliases").append(alias + "<br/>");
                });
                $('#profile_time_played > .text-highlight').text(playerInfo.TimePlayed);
                $('#profile_level > span').text(playerInfo.playerLevel).addClass('level-color-' + playerInfo.playerLevel.toLowerCase());
                $('#profile_first_seen > .text-highlight').text(playerInfo.FirstSeen);
                $('#profile_last_seen > .text-highlight').text(playerInfo.LastSeen);

                $("#profile_events").text("");
                $.each(playerInfo.Meta, function (index, meta) {
                    if (!meta.Key.includes("Event")) {
                        let metaString = `<div class="profile-meta-entry"><span class="profile-meta-value text-highlight">${meta.Value}</span><span class="profile-meta-title"> ${meta.Key}</span></div>`;
                        $("#profile_meta").append(metaString);
                    }
                });

                $.each(playerInfo.Meta, function (index, meta) {
                    loadMeta(meta);

                    if (count % 40 == 0) {
                        count++;
                        return false;
                    }
                    count++
                });
            });
        });
    </script>
</head>
<body>
    <div class="container-fluid">
        <div id="content" class="p-4">
            <div id="profile_wrapper" class="row d-flex d-sm-inline-flex justify-content-center justify-content-left pb-4">
                <div class="mr-auto ml-auto ml-sm-0 mr-sm-0">
                    <div id="profile_avatar" class="text-center">
                        <span class="profile-shortcode">_</span>
                    </div>
                </div>
                <div id="profile_info" class="text-center text-sm-left pr-4 pl-4">
                    <div id="profile_name">
                        <span class="client-name"><span id="profile_aliases_btn" class="oi oi-caret-bottom pl-2"></span></span>
                        <div id="profile_aliases" class="pr-4 pb-2 mb-2 text-muted"></div>
                    </div>
                    <div id="profile_level" class="text-muted">
                        <span>_</span>
                    </div>
                    <div id="profile_time_played" class="text-muted">
                        Played <span class="text-highlight">_</span> hours
                    </div>
                    <div id="profile_first_seen" class="text-muted">
                        First seen <span class="text-highlight">_</span> ago
                    </div>
                    <div id="profile_last_seen" class="text-muted">
                        Last seen <span class="text-highlight">_</span> ago
                    </div>
                </div>
                <div id="profile_meta" class="text-center text-sm-right pt-2">
                </div>
            </div>
            <div class="row d-md-flex pt-4">
                <div id="profile_events" class="text-muted text-left ml-sm-0">
                    No recent events
                </div>
            </div>
        </div>
    </div>
</body>
</html>