Updated graph page to send people to error page when you can't connect to the web socket.

5 years ago · a912a7acd8
--- a/website/error.html
+++ b/website/error.html
@ -0,0 +1,143 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="utf-8">
    <title>Jrtechs Steam Friend Graph Project</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <link rel="stylesheet" href="css/bootstrap.css" media="screen">
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
 </head>
 <body>

 <div class="navbar navbar-expand-lg fixed-top navbar-dark bg-primary">
    <div class="container">
        <a class="navbar-brand" href="#">Steam Graph Project</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item">
                    <a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="graphs.html">Graphs</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="profile.html">Profile Look-Up</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="faq.html">FAQ</a>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li>
                    <a class="nav-link" href="https://jrtechs.net">Blog</a>
                </li>
                <li>
                    <a class="nav-link" href="https://jrtechs.me">Resume</a>
                </li>
                <li>
                    <a class="nav-link" href="https://github.com/jrtechs">Github</a>
                </li>
            </ul>
        </div>
    </div>
 </div>


 <div class="container">
    <br><br><br>

    <h2>My Steam websocket server down.</h2>
    <p>Sorry about that, you should try again some other day.</p>
    <img src="img/404.jpg">
    <br><br>
 </div>


 <!-
 ┈┈╱▔▔▔▔▔╲┈┈┈HM┈HM
 ┈╱┈┈╱▔╲╲╲▏┈┈┈HMMM
 ╱┈┈╱━╱▔▔▔▔▔╲━╮┈┈
 ▏┈▕┃▕╱▔╲╱▔╲▕╮┃┈┈
 ▏┈▕╰━▏▊▕▕▋▕▕━╯┈┈
 ╲┈┈╲╱▔╭╮▔▔┳╲╲┈┈┈
 ┈╲┈┈▏╭━━━━╯▕▕┈┈┈
 ┈┈╲┈╲▂▂▂▂▂▂╱╱┈┈┈
 ┈┈┈┈▏┊┈┈┈┈┊┈┈┈╲┈
 ┈┈┈┈▏┊┈┈┈┈┊▕╲┈┈╲
 ┈╱▔╲▏┊┈┈┈┈┊▕╱▔╲▕
 ┈▏ ┈┈┈╰┈┈┈┈╯┈┈┈▕▕
 ┈╲┈┈┈╲┈┈┈┈╱┈┈┈╱┈╲
 ┈┈╲┈┈▕▔▔▔▔▏┈┈╱╲╲╲▏
 ┈╱▔┈┈▕┈┈┈┈▏┈┈▔╲▔▔
 ┈╲▂▂▂╱┈┈┈┈╲▂▂▂╱┈

 If you are seeing this monkey that means that you are interested in my
 code. Yay!! If you are not here to hack me ... you should really consider
 contributing to some of my public projects on github.

 https://github.com/jrtechs

 -->

 <!-- Footer -->
 <footer class="text-center">
    <div class="footer-above">
        <div class="container">
            <div class="row">
                <div class="footer-col col-md-4">
                    <h3>Location</h3>
                    <p>Rochester Institute of Technology
                        <br>1 Lomb Memorial Dr, Rochester, NY 14623</p>
                </div>
                <div class="footer-col col-md-4">
                    <h3>Around the Web</h3>
                    <ul class="list-inline">
                        <li class="list-inline-item">
                            <a class="btn-social btn-outline" href="https://www.youtube.com/c/JrtechsNet">
                                <i class="fa fa-fw fa-youtube"></i>
                            </a>
                        </li>
                        <li class="list-inline-item">
                            <a class="btn-social btn-outline" href="https://github.com/jrtechs">
                                <i class="fa fa-fw fa-github"></i>
                            </a>
                        </li>
                        <li class="list-inline-item">
                            <a class="btn-social btn-outline" href="http://jrtechs.net">
                                <i class="fa fa-fw fa-wordpress"></i>
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="footer-col col-md-4">
                    <h3>About This Website</h3>
                    <p>Check out the source code for this website on my
                        <a href="https://github.com/jrtechs">github</a>.</p>
                </div>
            </div>
        </div>
    </div>
    <div class="footer-below">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <p class="m-0 text-center text-white"><a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank">CC-BY-SA 4.0</a> <script type="text/javascript">
                        document.write(new Date().getFullYear());
                    </script> Jrtechs</p>
                </div>
            </div>
        </div>
    </div>
 </footer>


 <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
 </body>
 </html>
--- a/website/graph.html
+++ b/website/graph.html
@ -187,6 +187,16 @@
    /** Web socket to communicate with the steam friend java server */
    connection = new WebSocket('ws://localhost:4444');


    setTimeout(function()
    {
        if (this.connection.readyState != 1) {
            console.log("fuck");
            document.location.href = "error.html";
        }
    }, 3000);


    /**
     * When the web socket is opened, this function
     * fetches the get data and requests the server
--- a/website/img/404.jpg
+++ b/website/img/404.jpg