<?php
    defined('BASEPATH') OR exit('No direct script access allowed');
?>
<!DOCTYPE html>
<html lang="<?= $_SESSION['site_lang'] ?>">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="subject" content="KingOfDog">
    <meta name="description" content="">
    <meta name="author" content="KingOfDog">
    <meta name="robots" content="index,follow,noodp">
    <meta name="googlebot" content="index,follow">
    <meta name="google" content="notranslate">
    <meta name="google" content="nositelinkssearchbox">
    <meta name="theme-color" content="#2272ff">
    <title><?= $title; ?> | KingOfDog</title>
    <link rel="stylesheet" href="<?= base_url('/assets/css/lib/bootstrap.min.css') ?>">
    <?php
        $styles = [
            'fonts.css',
            'fix-bootstrap-4.css',
            'custom-buttons.css',
            'custom-alerts.css',
            'header.css',
            'lib/animate.min.css',
            'lib/prism.min.css',
            'lib/flag-icon.min.css'
        ];
        if (isset($additionalStyles)) {
            $styles = array_merge($styles, $additionalStyles);
        }
        $styles[] = 'main.css';
        $styleName = base_url("combine.php?type=css&files=" . join(',', $styles));
    ?>
    <link rel="stylesheet" href="<?= $styleName ?>">

    <link rel="stylesheet" href="<?= base_url('assets/css/lib/fontawesome-all-5.2.0.min.css') ?>">

    <link rel="icon" href="<?= base_url('assets/images/ico/favicon.ico'); ?>">
    <link rel="alternate"
          href="<?= base_url('lang/change/de?r=' . urlencode(base64_encode(base_url(uri_string())))); ?>"
          hreflang="de">
    <link rel="alternate"
          href="<?= base_url('lang/change/en?r=' . urlencode(base64_encode(base_url(uri_string())))); ?>"
          hreflang="en">
    <link rel="alternate"
          href="<?= base_url('lang/change/fr?r=' . urlencode(base64_encode(base_url(uri_string())))); ?>"
          hreflang="fr">
</head>
<!--/head-->
<body>
<header class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top <?= isset($active) && $active == 'profile' ? 'bg-custom' : '' ?>" role="banner">
    <a data-track-content data-content-name="Header Logo Link" class="navbar-brand"
       href="<?= base_url(); ?>">
        <div class="logo-container">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 386.48" id="logo-container">
                <defs>
                    <style>.a {
                            fill: #fff;
                        }
                    </style>
                </defs>
                <path class="a b"
                      d="M186,222.6V373.74A12.26,12.26,0,0,0,198.22,386H349.36A12.26,12.26,0,0,0,358,365.07L206.89,213.93A12.26,12.26,0,0,0,186,222.6Z" />
                <path class="a b"
                      d="M349.36,0H198.22A12.26,12.26,0,0,0,186,12.26V163.4a12.26,12.26,0,0,0,20.93,8.67L358,20.93A12.26,12.26,0,0,0,349.36,0Z" />
                <path class="a c"
                      d="M398.68,364.32,561,202a12.7,12.7,0,0,0,0-18L398.68,21.68a12.7,12.7,0,0,0-21.68,9V355.34A12.7,12.7,0,0,0,398.68,364.32Z" />
                <circle class="a d" cx="296.65" cy="193.11" r="65.52" />
            </svg>
            <h1 id="logo-text">KingOfDog</h1>
        </div>
    </a>
    <div class="navbar-content float-right">
        <ul>
            <?php if (isset($_SESSION['user'])): ?>
                <li>
                    <div class="dropdown">
                        <a href="#" role="button" data-toggle="dropdown" data-offset="0,20" id="notificationMenuButton" aria-haspopup="true" aria-expanded="false" class="navbar-link">
                            <i class="fa fa-bell d-inline"></i>
                            <div class="badge badge-pill badge-success" id="notificationCount"></div>
                        </a>

                        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="notificationMenuButton" id="notificationMenu">
                            <div class="list-group list-group-flush">
                                <div class="text-center">
                                    <i class="fa fa-cog fa-spin fa-4x my-4"></i>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
            <?php endif; ?>

            <?php if (!isset($_SESSION['user'])): ?>
                <li>
                    <a href="<?= base_url('login') ?>" data-toggle="tooltip" data-placement="bottom"
                       data-placement="bottom" title="<?= lang('header_login') ?>"
                       class="navbar-link">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 926 534" id="login-icon">
                            <defs>
                                <style>.z {
                                        fill: #fff;
                                    }</style>
                            </defs>
                            <path class="z"
                                  d="M522,52H649.16c4.09,0,8.18.07,12.26.41,1.36.11,3.53.76,4.85.51l-3.43-.44q1.6.25,3.2.54,4,.73,7.9,1.75t7.74,2.3c1.53.51,3,1.11,4.55,1.64q3.76,1.5-1.5-.69,1.48.64,2.94,1.33a110.44,110.44,0,0,1,14.06,7.91c1.35.9,2.65,1.86,4,2.78,4.67,3.24-4.19-3.7.07.08,2.33,2.07,4.71,4.07,6.93,6.27q2.53,2.5,4.88,5.17a30.9,30.9,0,0,0,2.77,3.31c-4.5-3.78-1.92-2.53-.44-.41s2.7,4.08,3.9,6.21q1.09,1.94,2.07,3.94l.64,1.35q1.62,3.64-.76-1.82c-.14.91,1.22,3.4,1.51,4.32q.69,2.22,1.24,4.49c.24,1,.44,2.06.66,3.08,1.22,5.53-.31-6,0-.25.2,3.63.31,7.23.31,10.87q0,7.64,0,15.29-.07,20.14-.19,40.29-.56,99.11-1.39,198.23c-.14,17.88.83,36.23-.57,54.06-.18,2.26-1.34,4.9.51-3.52-.19.87-.28,1.78-.44,2.65q-.47,2.5-1.1,5-.72,2.81-1.65,5.55c-.41,1.21-.87,2.39-1.3,3.58-1.41,3.91,2.76-5.85-.23.36A96.41,96.41,0,0,1,715,451.8l-1,1.42q-2.42,3.24.58-.75c-.69,1.5-2.63,3.13-3.73,4.35q-3.17,3.51-6.61,6.77c-1.87,1.77-3.82,3.43-5.79,5.09-4.18,3.52,4.74-3.25.24-.21-1.25.84-2.46,1.73-3.72,2.55q-3.12,2-6.4,3.82-2,1.06-4,2l-1.34.63q-3.64,1.62,1.89-.77c-2.67.27-5.8,2.12-8.43,2.86q-3.6,1-7.29,1.72l-1.49.27q-4.05.64,2.13-.24a18,18,0,0,0-3.06.31c-3.14.27-6.27.31-9.42.3q-64.57-.18-129.14-.44l-4.45,0c-13.08,0-25.6,11.53-25,25s11,25,25,25l130.89.45c18.9.06,36.4-3.38,53.59-11.28,24.3-11.17,46.2-33.31,57.78-57.32,7.8-16.18,11.16-32.14,11.27-50,0-7.92.13-15.84.19-23.76q.78-98.3,1.42-196.6c.16-26.49.43-53,.36-79.46C779.35,56.38,728.57,12.07,674.53,4,651,.54,626.78,2,603.11,2H522c-13.08,0-25.6,11.5-25,25s11,25,25,25Z" />
                            <path class="z y"
                                  d="M171,162H357V41s4-24,25-24c0,0,8-1,17,5L628,251s7,5,7,17c0,0-1,13-8,18L400,513s-10,11-28,4c0,0-15-9-15-23V374H171a27.74,27.74,0,0,1-18-8c-8-8-8-19-8-19V185s2-12,10-17S169,162,171,162Z" />
                        </svg>
                        <span><?= lang('header_login') ?></span>
                    </a>
                </li>
            <?php endif; ?>

            <?php if (isset($_SESSION['user'])): ?>
                <li>
                    <div class="dropdown">
                        <a href="" class="navbar-link dropdown-toggle" data-toggle="dropdown" id="userMenuButton" aria-haspopup="true" aria-expanded="false" role="button">
                            <img src="<?= $_SESSION['user']['profilePic'] ?>?w=100" alt="" class="img-fluid rounded-circle">
                            <?= $_SESSION['user']['displayname'] ?>
                        </a>

                        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="userMenuButton" id="userMenu">
                            <a href="<?= base_url('user/' . $_SESSION['user']['username']) ?>" class="dropdown-item">
                                <i class="fa fa-user"></i>
                                <?= lang('header_profile') ?>
                            </a>
                            <a href="<?= base_url('user/' . $_SESSION['user']['username'] . '/edit') ?>" class="dropdown-item">
                                <i class="fa fa-user-edit"></i>
                                <?= lang('header_edit_profile') ?>
                            </a>
                            <?php if (get_instance()->hasPermission('dashboard.view')): ?>
                                <a href="<?= base_url('admin') ?>" class="dropdown-item">
                                    <i class="fa fa-tachometer-alt"></i>
                                    <?= lang('header_admin_panel') ?>
                                </a>
                            <?php endif; ?>
                            <a href="<?= base_url('login/logout') ?>" class="dropdown-item">
                                <i class="fa fa-sign-out-alt"></i>
                                <?= lang('header_logout') ?>
                            </a>
                        </div>
                    </div>
                </li>
            <?php endif; ?>
        </ul>
    </div>
</header>
<div id="navbar-swipe-open d-block d-md-none"></div>
<button class="menu-icon">
    <span></span>
</button>
<div class="side-navigation">
    <span class="side-title">
        <img src="<?= base_url('assets/images/logo.png'); ?>" id="headerLogo" alt="logo">
    </span>
    <nav class="side-navigation-content">
        <ul>
            <li>
                <a href="<?= base_url() ?>"
                   class="<?= $active === 'home' ? 'active' : '' ?>"><?= lang("header_home") ?></a>
            </li>
            <li>
                <a href="<?= base_url("projects") ?>"
                   class="<?= $active === 'projects' ? 'active' : '' ?>"><?= lang('header_projects') ?></a>
            </li>
            <li>
                <a href="<?= base_url("blog") ?>"
                   class="<?= $active === 'blog' ? 'active' : '' ?>"><?= lang('header_blog') ?></a>
            </li>
            <?php $toolsActive = in_array($active, ['tools', 'encrypter', 'password-generator', 'nickname-generator', 'csgo', 'minecraft-players', 'minecraft-servers', 'youtube-downloader', 'twitch-tools', 'url-encoder', 'base64-encoder']) ? 'active' : ''; ?>
            <li class="dropdown <?= $toolsActive ?>">
                <a href="<?= base_url("tools") ?>"><?= lang('header_tools') ?>
                    <i
                            class="fa fa-angle-down <?= $toolsActive ? 'opened' : '' ?>"></i>
                </a>
                <ul class="sub-menu">
                    <li>
                        <a href="<?= base_url("tools") ?>" class="<?= $active === 'tools' ? 'active' : '' ?>">
                            <?= lang('header_tools_overview') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/encrypter") ?>" class="<?= $active === 'encrypter' ? 'active' : '' ?>">
                            <?= lang('header_tools_encrypter') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/encoder/url") ?>" class="<?= $active === 'url-encoder' ? 'active' : '' ?>">
                            <?= lang('header_tools_url_encoder') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/encoder/base64") ?>" class="<?= $active === 'base64-encoder' ? 'active' : '' ?>">
                            <?= lang('header_tools_base64') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/generator/password") ?>" class="<?= $active === 'password-generator' ? 'active' : '' ?>">
                            <?= lang('header_tools_password') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/generator/nickname") ?>" class="<?= $active === 'nickname-generator' ? 'active' : '' ?>">
                            <?= lang('header_tools_nickname') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/csgo") ?>" class="<?= $active === 'csgo' ? 'active' : '' ?>">
                            <?= lang('header_tools_csgo') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/minecraft/players") ?>" class="<?= $active === 'minecraft-players' ? 'active' : '' ?>">
                            <?= lang('header_tools_minecraft_player') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/minecraft/servers") ?>" class="<?= $active === 'minecraft-servers' ? 'active' : '' ?>">
                            <?= lang('header_tools_minecraft_server') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url("tools/youtube") ?>" class="<?= $active === 'youtube-downloader' ? 'active' : '' ?>">
                            <?= lang('header_tools_youtube') ?>
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="<?= base_url("about") ?>" class="<?= $active === 'about' ? 'active' : '' ?>">
                    <?= lang('header_about') ?>
                </a>
            </li>
            <li>
                <a href="<?= base_url("faq") ?>" class="<?= $active === 'faq' ? 'active' : '' ?>">
                    <?= lang('header_faq') ?>
                </a>
            </li>
            <li>
                <a href="<?= base_url("donate") ?>" class="<?= $active === 'donate' ? 'active' : '' ?>">
                    <?= lang('header_donate') ?>
                </a>
            </li>
            <li class="dropdown <?= in_array($active, ['feed', 'popular', 'top-users', 'trending-users', 'profile']) ? 'active' : '' ?>">
                <a href="<?= base_url('posts') ?>">
                    <?= lang('header_network') ?>
                    <i class="fa fa-angle-down <?= in_array($active, ['feed', 'popular', 'top-users', 'trending-users', 'profile']) ? 'opened' : '' ?>"></i>
                </a>
                <ul class="sub-menu">
                    <?php if (isset($_SESSION['user'])): ?>
                        <li>
                            <a href="<?= base_url('posts/feed') ?>" class="<?= $active === 'feed' ? 'active' : '' ?>">
                                <?= lang('header_network_feed') ?>
                            </a>
                        </li>
                    <?php endif; ?>
                    <li>
                        <a href="<?= base_url('posts/popular') ?>" class="<?= $active === 'popular' ? 'active' : '' ?>">
                            <?= lang('header_network_popular') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url('users/top') ?>" class="<?= $active === 'top-users' ? 'active' : '' ?>">
                            <?= lang('header_network_top_users') ?>
                        </a>
                    </li>
                    <li>
                        <a href="<?= base_url('users/trending') ?>" class="<?= $active === 'trending-users' ? 'active' : '' ?>">
                            <?= lang('header_network_trending_users') ?>
                        </a>
                    </li>
                    <?php if (isset($_SESSION['user'])): ?>
                        <li>
                            <a href="<?= base_url('user/' . $_SESSION['user']['username']) ?>"
                               class="<?= $active === 'profile' ? 'active' : '' ?>">
                                <?= lang('header_your_profile') ?>
                            </a>
                        </li>
                    <?php endif; ?>
                </ul>
            </li>
            <li>
                <?php if (isset($_SESSION['user'])): ?>
                    <a href="<?= base_url("logout") ?>"><?= lang('header_logout') ?></a>
                <?php else: ?>
                    <a href="<?= base_url("login") ?>"
                       class="<?= $active === 'login' ? 'active' : '' ?>"><?= lang('header_login') ?></a>
                <?php endif; ?>
            </li>
        </ul>
    </nav>
</div>
<div class="side-navigation-background"></div>
<div class="btn-floating">
    <ul class="btn-floating-list">
        <li>
            <a href="#" data-title="Dark Theme" id="switchDarkmode">
                <i class="fa fa-moon"></i>
            </a>
        </li>
        <li>
            <a data-title="<?= lang('header_contact') ?>" href="#" data-toggle="modal" data-target="#contactModal">
                <i class="fa fa-envelope"></i>
            </a>
        </li>
        <li>
            <a data-title="<?= lang('header_feedback') ?>" href="#" data-toggle="modal" data-target="#feedbackModal">
                <i class="fa fa-comment-dots"></i>
            </a>
        </li>
        <li>
            <a data-title="<?= lang('header_share') ?>" href="#" data-toggle="modal" data-target="#shareModal">
                <i class="fa fa-share-alt"></i>
            </a>
        </li>
        <?php if (isset($_SESSION['user']) && !empty($_SESSION['user'])): ?>
            <li>
                <a data-title="<?= lang('header_post') ?>" href="#" data-toggle="modal" data-target="#postModal">
                    <i class="fa fa-edit"></i>
                </a>
            </li>
        <?php endif; ?>
    </ul>
    <button type="button" class="btn btn-primary">
        <i class="fa fa-plus"></i>
    </button>

    <div class="btn-floating-shadow"></div>
</div>
<?php if (isset($_SESSION['user']) && !empty($_SESSION['user'])): ?>
    <div class="modal fade" id="postModal" tabindex="-1" role="dialog" aria-labelledby="postLabel">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="postLabel"><?= lang('header_post_title') ?></h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="<?= lang('close') ?>">
                        <span>&times;</span>
                    </button>
                </div>
                <div class="modal-body" id="postModalBody">
                    <form id="postForm">
                        <input type="hidden" value="-1" id="replyTo">
                        <div class="form-group has-feedback-right" id="content">
                            <div class="form-control" id="contentField" contenteditable style="min-height:100px"
                                 required></div>
                        </div>
                        <div class="form-group">
                            <div class="post-images">
                            </div>

                            <label class="postImageUpload">
                                <input type="file"
                                       accept="image/gif,image/jpeg,image/jpg,image/png,video/mp4,video/quicktime,video/x-m4v"
                                       name="postFiles[]" data-url="" id="postFiles"
                                       multiple>
                                <i class="fa fa-upload"></i>
                            </label>
                        </div>
                    </form>
                    <small><?= lang('header_post_notice') ?></small>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal"><?= lang('close') ?></button>
                    <button type="button" class="btn btn-primary" id="postModalPublish" onclick="publishPost()">
                        <?= lang('header_post_publish') ?>
                    </button>
                </div>
            </div>
        </div>
    </div>
<?php endif; ?>
<div class="modal fade" id="feedbackModal" tabindex="-1" role="dialog" aria-labelledby="feedbackLabel">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="feedbackLabel"><?= lang('header_feedback_title') ?></h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="<?= lang('close') ?>">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body" id="feedbackModalBody">
                <p><?= lang('header_feedback_info') ?></p>
                <form>
                    <div class="form-group has-feedback-right" id="message">
                        <label for="message"><?= lang('header_feedback_msg') ?></label>
                        <textarea rows="3" class="form-control" name="message"
                                  placeholder="<?= lang('header_feedback_msg_placeholder') ?>"></textarea>
                    </div>
                    <div class="checkbox">
                        <label for="anonymous">
                            <input type="checkbox" name="anonymous" checked aria-describedby="anonymousHelp">
                            <?= lang('header_feedback_anonymous') ?>
                        </label>
                    </div>
                    <span class="help-block" id="anonymousHelp">
                        <small><?= lang('header_feedback_anonymous_info') ?></small>
                    </span>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><?= lang('close') ?></button>
                <button type="button" class="btn btn-primary" id="feedbackModalSend"
                        onclick="sendFeedback()"><?= lang('send') ?></button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="contactModal" tabindex="-1" role="dialog" aria-labelledby="contactLabel">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="contactLabel"><?= lang('header_contact_title') ?></h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="<?= lang('close') ?>">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body" id="contactModalBody">
                <form>
                    <?php if (!isset($_SESSION['user'])): ?>
                        <div class="form-group has-feedback-right" id="email-address">
                            <label for="contact-email"><?= lang('header_contact_mail') ?></label>
                            <input type="email" class="form-control" name="contact-email"
                                   placeholder="<?= lang('header_contact_mail_placeholder') ?>">
                        </div>
                    <?php endif; ?>
                    <div class="form-group has-feedback-right" id="contact-message">
                        <label for="message"><?= lang('header_contact_msg') ?></label>
                        <textarea rows="3" class="form-control" name="message"
                                  placeholder="<?= lang('header_contact_msg_placeholder') ?>"></textarea>
                    </div>

                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><?= lang('close') ?></button>
                <button type="button" class="btn btn-primary" id="contactModalSend"
                        onclick="sendContactMessage()"><?= lang('send') ?></button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="shareModal" tabindex="-1" role="dialog" aria-labelledby="shareLabel">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="shareLabel"><?= lang('header_share_title') ?></h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="<?= lang('close') ?>">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body" id="shareModalBody">
                <a class="btn btn-large share-btn share-btn-twitter"
                   href="https://twitter.com/intent/tweet?text=<?= $title ?>&url=<?= urlencode(base_url(uri_string())) ?>&via=kingofdogtv&related=kingofdogtv%3AEntwickler%20von%20KingOfDog.de">
                    <i class="fab fa-twitter"></i>
                    Twitter
                </a>
                <a class="btn btn-large share-btn share-btn-facebook"
                   href="https://www.facebook.com/sharer/sharer.php?u=<?= urlencode(base_url(uri_string())) ?>">
                    <i class="fa fa-facebook"></i>
                    Facebook
                </a>
                <a class="btn btn-large share-btn share-btn-google-plus"
                   href=https://plus.google.com/share?url=<?= urlencode(base_url(uri_string())) ?>">
                    <i class="fab fa-google-plus-g"></i>
                    Google+
                </a>
            </div>
        </div>
    </div>
</div>

<div class="snackbar-container">
</div>