<?php
session_start();
function connect()
{
    $dbhost = "localhost";
    $dbuser = "nggappsx_fanime";
    $dbpass = "Tq.@7a{MCvWn";
    $dbname = "nggappsx_fanime";
    $conn = new mysqli($dbhost, $dbuser, $dbpass, $dbname) or die($conn->connect_error);
    return $conn;
}
function getAnime()
{
    $conn = connect();
    $sql = "SELECT * FROM watchlist WHERE email = '" . $_SESSION['email'] . "'";
    $result = $conn->query($sql);
    $conn->close();
    return $result;
}
?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Stream</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="stream.css">
    <link href="https://fonts.googleapis.com/css?family=Archivo+Black" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Prompt:wght@500;700" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10.10.1/dist/sweetalert2.all.min.js"></script>
    <link rel="shortcut icon" type="image/png" href="favicon.ico" />
    <style>
        .error {
            text-align: center;
            font: bold 1.5em sans-serif;
        }

        .thumbnail:hover {
            transform: scale(1.);
            /*smooth transition*/
            transition: all .2s ease-in-out;
        }

        .thumbnail:hover img {
            transform: scale(1.1);
            /*smooth transition*/
            transition: all .2s ease-in-out;
        }

        .ligma {
            background-color: #6f42c1;
             !important;
            border: none;
            height: 50px;
        }
    </style>
    <script type="text/javascript">
        (function(c, l, a, r, i, t, y) {
            c[a] = c[a] || function() {
                (c[a].q = c[a].q || []).push(arguments)
            };
            t = l.createElement(r);
            t.async = 1;
            t.src = "https://www.clarity.ms/tag/" + i;
            y = l.getElementsByTagName(r)[0];
            y.parentNode.insertBefore(t, y);
        })(window, document, "clarity", "script", "bd5f1lvj3b");
    </script>
</head>

<body>
    <!--create a search input to search anime's-->
    <nav class="menu-container">
        <!-- burger menu -->
        <input type="checkbox" aria-label="Toggle menu" />
        <span></span>
        <span></span>
        <span></span>

        <!-- logo -->
        <a href="#" class="menu-logo">
            <img src="favicon.ico" alt="Fanime" />
        </a>

        <!-- menu items -->
        <div class="menu">
            <ul>
                <li>
                    <a href="index.php">
                        Home
                    </a>
                </li>
                <li>
                    <a href="https://yttg.nggapps.xyz/RevampedFanime/api/" target="_blank" rel="noopener noreferrer">
                        Docs
                    </a>
                </li>
                <li>
                    <a href="donate.html">
                        Donate
                    </a>
                </li>
                <li>
                    <a href="signup.php">
                        Sign Up
                    </a>
                </li>
                <li>
                    <a href="login.php">
                        Login
                    </a>
                </li>
                <li>
                    <a href="profile.php">
                        <?php
                        if (isset($_SESSION['email'])) {
                            echo 'Profile';
                        } else {
                            echo "";
                        }
                        ?>
                    </a>
                <li>
                <li>
                    <!--php code to check if email is logged in-->
                    <?php
                    if (isset($_SESSION['email'])) {
                        echo '<a href="logout.php">Logout</a>';
                    } else {
                        echo '';
                    }
                    ?>
                </li>
                <!--email's email if not logged in display nothing-->
                <li>
                    <?php
                    if (isset($_SESSION['email'])) {
                        echo '<a id="user">Click me to see your email</a>';
                        echo '<script>
                            document.getElementById("user").onclick = function() {
                                alert("' . $_SESSION['email'] . '");
                            }
                        </script>';
                    } else {
                        echo '';
                    }
                    ?>
                </li>
                <button class="btn btn-primary" id="premium" onclick="window.location = 'premium.php'">Upgrade to premium</button>
            </ul>
        </div>
    </nav>
    <div class="container">
        <div class="row">
            <h1 class="text-center">Fanime an anime streaming site</h1>
            <div class="col-md-12">
                <div class="error text-danger" style="display:none;">
                    <h1>:(</h1>
                    <p>Couldn't find the anime your looking for.</p>
                    <p>Try typing your anime title in japanese.</p>
                    <button class="btn btn-primary" onclick="window.location.reload()">Try Again</button>
                </div>
                <div class="text-center">
                    <h1>Search for an Anime</h1>
                    <!--premium-->
                    <br>
                    <input type="text" id="search" class="form-control" placeholder="Search for an Anime">
                    <button id="searchbtn" onclick="find()" class="btn btn-primary">Search</button>
                    <!--create a loading-->
                    <div id="loading" class="text-center" style="display: none;">
                        <img src="loading.gif" alt="loading">
                    </div>
                    <div id="continue-anime" class="text-center" style="display:none">
                        <h1>Watch List:</h1>
                        <?php
                        if (isset($_SESSION['email'])) {
                            $result = getAnime();
                            //here we store the data in arrays
                            while ($row = $result->fetch_assoc()) {
                                $name = $row['name'];
                                $episode = $row['episode'];
                                $type = $row['type'];
                                $string = "stream.php?name=" . $name . "&episode=" . $episode . "&type=" . $type;
                                echo '<h1>' . $name . '</h1>';
                                echo '<h1>Current Episode: ' . $episode . '</h1>';
                                echo '<button class= "btn btn-primary text-center ligma" onclick="window.location.href=\'' . $string . '\'">Continue Watching</button>';
                                echo '<br>';
                                echo '<br>';
                                //button for next episode
                                echo '<button class= "btn btn-primary text-center ligma" onclick="window.location.href=\'stream.php?name=' . $name . '&episode=' . ($episode + 1) . '&type=' . $type . '\'">Next Episode</button>';
                                echo '<br>';
                                echo '<br>';
                                echo '<button class= "btn btn-primary text-center ligma" onclick="remove2()">Remove From Watch List</button>';
                            }
                        } else {
                            return;
                        }
                        ?>
                    </div>
                    <button id="ci" onclick="ci()" class="btn btn-primary">Show Watch List</button>
                </div>
                <!--thumbnailular anime-->
                <div class="pop-anime text-center">
                    <h1>Popular Anime</h1>
                </div>
            </div>
            <!--donate button-->
            <div class="col-md-12 text-center">
                <button class="btn btn-primary btn-lg" onclick="window.location = 'donate.html'">Donate</button>
            </div>
        </div>
    </div>
    <script src="script.min.js"></script>
    <script>
        function remove2() {
            var name = "<?php echo $name; ?>";
            remove(name);
        }
    </script>
</body>

</html>