Skip to content

M
Moecube Store
Commit 7e0d4368 authored by 神楽坂玲奈's avatar 神楽坂玲奈
Browse files
Options

rooms join

parent c72b0a8a
Show whitespace changes
Inline Side-by-side
Showing with 193 additions and 139 deletions
assets/javascripts/rooms.coffee
View file @ 7e0d4368
...@@ -4,11 +4,12 @@ class Server extends Spine.Model ...@@ -4,11 +4,12 @@ class Server extends Spine.Model
@url: "/servers.json" @url: "/servers.json"
class Room extends Spine.Model class Room extends Spine.Model
@configure "Room", @configure "Room", "name", "status"
"name", @belongsTo 'server', Server
"status"
class Rooms extends Spine.Controller class Rooms extends Spine.Controller
events:
'click .room': 'clicked'
constructor: -> constructor: ->
super super
Room.bind "refresh", @render Room.bind "refresh", @render
...@@ -16,7 +17,9 @@ class Rooms extends Spine.Controller ...@@ -16,7 +17,9 @@ class Rooms extends Spine.Controller
@html $('#room_template').tmpl _.sortBy Room.all(), @sort @html $('#room_template').tmpl _.sortBy Room.all(), @sort
sort: (room)-> sort: (room)->
[if room.status == "wait" then 0 else 1] [if room.status == "wait" then 0 else 1]
clicked: (e)->
room = $(e.target).tmplItem().data
mycard.join(room.server().ip, room.server().port, room.name)
$(document).ready -> $(document).ready ->
......
assets/javascripts/rooms.js
View file @ 7e0d4368
...@@ -33,6 +33,8 @@ ...@@ -33,6 +33,8 @@
Room.configure("Room", "name", "status"); Room.configure("Room", "name", "status");
Room.belongsTo('server', Server);
return Room; return Room;
})(Spine.Model); })(Spine.Model);
...@@ -41,6 +43,10 @@ ...@@ -41,6 +43,10 @@
__extends(Rooms, _super); __extends(Rooms, _super);
Rooms.prototype.events = {
'click .room': 'clicked'
};
function Rooms() { function Rooms() {
this.render = __bind(this.render, this); this.render = __bind(this.render, this);
Rooms.__super__.constructor.apply(this, arguments); Rooms.__super__.constructor.apply(this, arguments);
...@@ -55,6 +61,12 @@ ...@@ -55,6 +61,12 @@
return [room.status === "wait" ? 0 : 1]; return [room.status === "wait" ? 0 : 1];
}; };
Rooms.prototype.clicked = function(e) {
var room;
room = $(e.target).tmplItem().data;
return mycard.join(room.server().ip, room.server().port, room.name);
};
return Rooms; return Rooms;
})(Spine.Controller); })(Spine.Controller);
......
rooms/index.html
View file @ 7e0d4368
<!DOCTYPE html> <!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if lt IE 7]>
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> <!--[if IE 7]>
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<head> <!--[if IE 8]>
<html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>mycard rooms</title> <title>mycard rooms</title>
...@@ -13,7 +17,7 @@ ...@@ -13,7 +17,7 @@
<!-- Place favicon.ico and apple-touch-icon.png in the root directory --> <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<link rel="stylesheet" href="/vendor/stylesheets/normalize.css"> <link rel="stylesheet" href="/vendor/stylesheets/normalize.css">
<link rel="stylesheet/less" type="text/css" href="/assets/stylesheets/rooms.less" media="all" /> <link rel="stylesheet/less" type="text/css" href="/assets/stylesheets/rooms.less" media="all"/>
<script type="text/javascript" src="/vendor/javascripts/less-1.3.1.min.js"></script> <script type="text/javascript" src="/vendor/javascripts/less-1.3.1.min.js"></script>
<script src="/vendor/javascripts/modernizr-2.6.2.min.js"></script> <script src="/vendor/javascripts/modernizr-2.6.2.min.js"></script>
...@@ -21,7 +25,8 @@ ...@@ -21,7 +25,8 @@
<div class="room" id="room_${id}"> <div class="room" id="room_${id}">
<span class="room_name">${name}</span> <span class="room_name">${name}</span>
<span class="room_id">${id}</span> <span class="room_id">${id}</span>
<div class="room_users" />
<div class="room_users">
{{each users}} {{each users}}
<div class="user"> <div class="user">
<span class="user_name">${name}</span> <span class="user_name">${name}</span>
...@@ -31,16 +36,18 @@ ...@@ -31,16 +36,18 @@
</div> </div>
</script> </script>
</head> </head>
<body> <body>
<!--[if lt IE 7]> <!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p> <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade
<![endif]--> your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to
improve your experience.</p>
<![endif]-->
<!-- Add your site or application content here --> <!-- Add your site or application content here -->
<div class="card_top"> <div class="card_top">
<div class="card_logo"> <div class="card_logo">
<img src="/assets/images/logo.png" alt="" /> <img src="/assets/images/logo.png" alt=""/>
</div> </div>
<div class="card_form"> <div class="card_form">
<select name="" id=""> <select name="" id="">
...@@ -48,103 +55,105 @@ ...@@ -48,103 +55,105 @@
<option value=""></option> <option value=""></option>
<option value=""></option> <option value=""></option>
</select> </select>
<input type="button" value="建立房间" /> <input type="button" value="建立房间"/>
</div> </div>
<div class="log_reg"> <div class="log_reg">
<a href="">注册</a> <a href="">注册</a>
<span>&nbsp;&nbsp;|&nbsp;&nbsp;</span> <span>&nbsp;&nbsp;|&nbsp;&nbsp;</span>
<a class="login" href="">登录</a> <a class="login" href="">登录</a>
</div> </div>
</div> </div>
<div class="card_center"> <div class="card_center">
<div id="rooms"></div> <div id="rooms"></div>
<div class="online_list"> <div class="online_list">
<div class="online_title">在线用户</div> <div class="online_title">在线用户</div>
<ul> <ul>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<li> <li>
<img src="/assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span> <img src="/assets/images/hs1.jpg" alt=""/><span>Yolua Mesiade</span>
</li> </li>
<!-- <li class="online_botttom"></li> --> <!-- <li class="online_botttom"></li> -->
</ul> </ul>
</div> </div>
<div style="clear:left;"></div> <div style="clear:left;"></div>
</div> </div>
<div id="candy" style="top:auto;height:260px;"></div> <div id="candy" style="top:auto;height:260px;"></div>
<script src="/vendor/javascripts/jquery-1.8.2.min.js"></script>
<script src="/vendor/javascripts/jquery.tmpl.min.js"></script>
<!--<script src="/vendor/javascripts/plugins.js"></script>-->
<script src="/vendor/javascripts/spine/spine.js"></script>
<script src="/vendor/javascripts/spine/ajax.js"></script>
<script src="/vendor/javascripts/spine/relation.js"></script>
<script src="/vendor/javascripts/underscore-min.js"></script>
<script src="/vendor/javascripts/jquery-1.8.2.min.js"></script> <script src="/vendor/javascripts/mycard.js"></script>
<script src="/vendor/javascripts/jquery.tmpl.min.js"></script>
<!--<script src="/vendor/javascripts/plugins.js"></script>-->
<script src="/vendor/javascripts/spine/spine.js"></script>
<script src="/vendor/javascripts/spine/ajax.js"></script>
<script src="/vendor/javascripts/spine/relation.js"></script>
<script src="/vendor/javascripts/underscore-min.js"></script>
<link rel="stylesheet" type="text/css" href="/vendor/stylesheets/candy/default.css" /> <link rel="stylesheet" type="text/css" href="/vendor/stylesheets/candy/default.css"/>
<script type="text/javascript" src="/vendor/javascripts/candy.libs.min.js"></script> <script type="text/javascript" src="/vendor/javascripts/candy.libs.min.js"></script>
<script type="text/javascript" src="/vendor/javascripts/candy.min.js"></script> <script type="text/javascript" src="/vendor/javascripts/candy.min.js"></script>
<script src="/assets/javascripts/rooms.js"></script> <script src="/assets/javascripts/rooms.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. --> <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<!--<script> <!--<script>
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]; var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0]; (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js'; g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script')); s.parentNode.insertBefore(g,s)}(document,'script'));
</script>--> </script>-->
</body> </body>
</html> </html>
servers.json
View file @ 7e0d4368
[ [
{"auth":true,"created_at":"2012-08-04T18:12:07+08:00","id":2,"index":"http://ygopro-server.my-card.in:7922/","ip":"122.0.65.70","login":"http://master.smdcn.net:7922/?operation=passcheck&username={name}&pass={password}","max_rooms":100,"name":"mycard","port":7911,"pvp":true,"register":"http://master.smdcn.net:7922/?pass={key}&operation=forceuserpass&username={name}&password={password}","server_type":"ygopro","updated_at":"2012-09-05T07:12:08+08:00"}, {"auth":true,"created_at":"2012-08-04T18:12:07+08:00","id":2,"index":"http://ygopro-server.my-card.in:7922/","ip":"122.0.65.70","login":"http://master.smdcn.net:7922/?operation=passcheck&username={name}&pass={password}","max_rooms":100,"name":"mycard","port":7911,"pvp":true,"register":"http://master.smdcn.net:7922/?pass={key}&operation=forceuserpass&username={name}&password={password}","server_type":"ygopro","updated_at":"2012-09-05T07:12:08+08:00"},
{"auth":false,"created_at":"2012-08-04T18:12:07+08:00","id":3,"index":"http://ygopro-server.my-card.in:7966/","ip":"122.0.65.70","login":"http://master.smdcn.net:7966/?operation=passcheck&username={name}&pass={password}","max_rooms":100,"name":"mycard-free","port":7955,"pvp":false,"register":"http://master.smdcn.net:7966/?pass={key}&operation=forceuserpass&username={name}&password={password}","server_type":"ygopro","updated_at":"2012-09-05T07:12:08+08:00"}, {"auth":false,"created_at":"2012-08-04T18:12:07+08:00","id":3,"index":"http://ygopro-server.my-card.in:7966/","ip":"122.0.65.70","login":"http://master.smdcn.net:7966/?operation=passcheck&username={name}&pass={password}","max_rooms":100,"name":"mycard-free","port":7955,"pvp":false,"register":"http://master.smdcn.net:7966/?pass={key}&operation=forceuserpass&username={name}&password={password}","server_type":"ygopro","updated_at":"2012-09-05T07:12:08+08:00"},
{"auth":false,"created_at":"2012-08-04T18:12:07+08:00","id":4,"index":"http://touhou.my-card.in:7988/","ip":"140.113.246.2","login":"http://master.smdcn.net:7966/?operation=passcheck&username={name}&pass={password}","max_rooms":100,"name":"mycard-touhou","port":7977,"pvp":false,"register":"http://master.smdcn.net:7966/?pass={key}&operation=forceuserpass&username={name}&password={password}","server_type":"ygopro","updated_at":"2012-09-05T07:12:08+08:00"} {"auth":false,"created_at":"2012-08-04T18:12:07+08:00","id":4,"index":"http://zh99998.66rpg.com:7988/","ip":"116.255.201.171","login":"http://zh99998.66rpg.com:7988/?operation=passcheck&username={name}&pass={password}","max_rooms":100,"name":"mycard-66rpg","port":7977,"pvp":false,"register":"http://zh99998.66rpg.com:7988/?pass={key}&operation=forceuserpass&username={name}&password={password}","server_type":"ygopro","updated_at":"2012-09-05T07:12:08+08:00"}
] ]
\ No newline at end of file
vendor/javascripts/mycard.coffee 0 → 100644
View file @ 7e0d4368
@mycard = {}
@mycard.join = (ip,port,room,username,password)->
result = 'mycard://'
if username
result += encodeURIComponent(username)
if password
result += ':' + encodeURIComponent(password)
result += '@'
result += ip + ':' + port + '/' + encodeURIComponent(room)
window.location.href = result
\ No newline at end of file
vendor/javascripts/mycard.js 0 → 100644
View file @ 7e0d4368
// Generated by CoffeeScript 1.4.0
(function() {
this.mycard = {};
this.mycard.join = function(ip, port, room, username, password) {
var result;
result = 'mycard://';
if (username) {
result += encodeURIComponent(username);
if (password) {
result += ':' + encodeURIComponent(password);
}
result += '@';
}
result += ip + ':' + port + '/' + encodeURIComponent(room);
return window.location.href = result;
};
}).call(this);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment