-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
149 lines (119 loc) · 4.86 KB
/
index.html
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
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<!DOCTYPE HTML>
<html>
<head>
<title> League of Lobbies </title>
<link rel="stylesheet" href="css/animate.css"/>
<link rel="stylesheet" href="css/bootstrap.css"/>
<link rel="stylesheet" href="css/styles.css"/>
<script src="/socket.io/socket.io.js"></script>
<script type="text/javascript" src="JS/jquery.js"></script>
<script type="text/javascript" src="JS/underscore.js"></script>
<script type="text/javascript" src="JS/bootstrap.min.js"></script>
<script type="text/javascript" src="JS/backbone.js"></script>
<script type="text/javascript" src="JS/appView.js"></script>
<script type="text/javascript" src="JS/roomListView.js"></script>
<script type="text/javascript" src="JS/roomListCollection.js"></script>
<script type="text/javascript" src="JS/RoomPlayerView.js"></script>
<script type="text/javascript" src="JS/chooserView.js"></script>
<script type="text/javascript" src="JS/counterView.js"></script>
<script type="text/javascript" src="JS/counterModel.js"></script>
<script type="text/javascript" src="JS/animate.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<div class="row topbar">
<div class="span12">
<a href="about" id="about">About</a>
Mark Chatkhan © 2013
<div class="alert hide info">
<a class="closealert" style="float:right" href="#">×</a>
I made this matchmaking site for those who don't feel like arguing about lanes. And those looking to find some quick partners for ARAM or 2-man ranked. This is an open-source project. No one will be making any money from this. The background image is an asset belonging to Riot Games Inc. Website Copyright 2013 Mark Chatkhan
</div>
</div>
</div>
<div class="container main">
<div class="row">
<div class="span12">
<h1>Welcome to the league of lobbies!</h1>
</div>
</div>
<div class="row" id="chatRoomArea">
<div class="span6">
<div id="chatbox" class="hide">
<div class=" brush chatText">
</div>
<div class="inputContainer">
<input class=" brush chatinput" placeholder="type here to chat"/>
</div>
</div>
</div>
<div class="span3">
<div id="userslist" class="hide">
<div id="roomInfo"></div>
<div id="usersInner"></div>
<div id="controlButtons"><a id="fontToggle"class="btn btn-primary">Toggle Font</a><a id="requeue"class="btn btn-danger">Re-Queue</a>
</div>
</div>
</div>
<div class="span3">
<div id="globalChat" class="hide">
<div >Global Chat</div>
<div id="gChatArea"></div>
<input class="chatinput global" placeholder="Chat to everyone!" />
</div>
</div>
</div>
</div>
</div> <!-- container main -->
<div data-keyboard="false" data-backdrop="static" id="modal1" class='modal hide fade'>
<div class="modal-header">
</div>
<div class="modal-body">
<a id="about" href="about">About</a>
<div class="lanechooser"><div id="error" class="hide"></div>
<div>
<h2>Type your username and choose your gametype:</h2>
<p>1. You'll be matched with people playing other lanes and put into a chatroom with them.</p>
<p>2. When your team is ready to go, queue as a team in game and play.</p>
<input id="username" focus placeholder="Username" />
<br/><br/></div>
<div class="gameModes row">
<button rel="tooltip" title="coming soon" class="btn btn-inverse btn-large" data-mode="aram">10s ARAM</button>
<a class="btn btn-large btn-primary" data-mode="norm">5s Normal</a>
<button rel="tooltip" title="coming soon" class="btn btn-inverse btn-large" data-mode="rank">2s Ranked</button>
</div>
<div class="lanes hide row">
<br/>
<a class="btn btn-warning" data-lane="top">Solo Top</a><a class="btn btn-primary" data-lane="mid">Solo Mid</a><a class="btn btn-success" data-lane="jun">Jungle</a><a class="btn btn-danger" data-lane="adc">ADC Bot</a><a class="btn btn-info" data-lane="sup">Support Bot</a>
</div>
</div>
</div>
</div><!-- chooser modal div -->
<script>
var socketBindings = function(){
socket.on('userinfoValid', function(data){
chooser.infoValidated(data);
appView.showGlobalChat();
});
socket.on('messageServed', function(data){
console.log('hi');
appView.handleMessage(data);
});
socket.on('updateUserList', function(data){
roomList.resetRoom(data.users);
});
socket.on('updateStatus', function(data){
roomList.updateStatus(data);
console.log(data);
});
socket.on('newRoom', function(data){
chooser.model.set('myRoom', data);
appView.showChat();
});
};
(function($){
var chooser, counterV, roomList;
var socket = null;
appView = new AppView();
})(jQuery);
</script>