Skip to content

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

rooms

parent a0f90a43
Hide whitespace changes
Inline Side-by-side
Showing with 1 addition and 264 deletions
assets/stylesheets/mycard.css
View file @ 42fd24c0
/*
*/
/* line 14, ../../app/assets/stylesheets/mycard.css.scss */
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
......
index.html
View file @ 42fd24c0
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
<a class="nav_logo">MyCard</a> <a class="nav_logo">MyCard</a>
<ul class="menu" id="menu"> <ul class="menu" id="menu">
<li><a href="#" class="nav_link" style="color:silver">在线大厅</a></li> <li><a href="/rooms" class="nav_link">在线大厅</a></li>
<li><a href="#" class="nav_link" style="color:silver">竞技场</a> <li><a href="#" class="nav_link" style="color:silver">竞技场</a>
<ul> <ul>
<li><a href="#" class="nav_sub" style="color:silver">排行榜</a></li> <li><a href="#" class="nav_sub" style="color:silver">排行榜</a></li>
......
rooms/index_.html deleted 100644 → 0
View file @ a0f90a43
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>Candy - Chats are not dead yet</title>
<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/jquery-1.8.2.min.js"></script>
<!--<link rel="stylesheet" type="text/css" href="assets/stylesheets/css_clear.css" />-->
<link rel="stylesheet" type="text/css" href="/vendor/stylesheets/candy/default.css" />
<script type="text/javascript" src="http://benpickles.github.com/js-model/dist/js-model-0.11.0.min.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.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="dump.js"></script>-->
<script type="text/javascript">
$(document).ready(function(){
var pageHight = (document.documentElement.clientHeight)-450;
// alert(pageHight);
$(".online_list ul").height(pageHight);
});
</script>
<script type="text/javascript">
var Room = Model("room", function(){
this.include({
users: function(){
var id = this.id()
return User.select(function(){
return this.attr("room_id") == id
})
}
})
})
var User = Model("user", function(){
this.include({
room: function(){
var room_id = this.attr("room_id")
return Room.detect(function(){
return this.id() == room_id
})
}
})
})
$(document).ready(function(){
var room_template = Handlebars.compile($("#room-template").html())
var render = function(room){
var r = room.attributes
r["users"] = room.users().map(function(){
return this.attributes
})
return room_template(r)
}
Room.bind('add', function(room){
$('#rooms').append(render(room))
})
Room.bind('remove', function(room){
$("#room_" + room.id()).remove()
})
var update = function(servers){
servers.find('server').each(function(){
$(this).children('room').each(function(){
var id = $(this).attr('id')
if($(this).attr('_deleted')){
var room = Room.detect(function(){return id == this.id()})
if(room){
room.destroy()
}
}else{
var room = new Room(get_attributes(this))
var users = room.users().all()
for(var i in users){
users[i].destroy()
}
$(this).children('user').each(function(){
user = new User(get_attributes(this))
user.attr('room_id', room.id())
user.save()
})
room.save()
room.bind('update', function(){
$('#room_' + this.id()).html(render(this))
})
}
})
})
}
Candy.init('/http-bind/', {
core: { debug: false, autojoin: ['mycard@conference.my-card.in'] },
view: { resources: '/vendor/stylesheets/candy/', language: 'cn' }
});
Candy.Core.connect('zh99998@my-card.in', 'zh112998');
var old_presence = Candy.Core.Event.Jabber.Room.Presence
var old_message = Candy.Core.Event.Jabber.Room.Message
Candy.Core.Event.Jabber.Room.Presence = function(msg){old_presence(msg); update(msg)}
Candy.Core.Event.Jabber.Room.Message = function(msg){old_message(msg); update(msg)}
});
function get_attributes(element){
var result = {}
for(var i in element.attributes) {
result[element.attributes[i].nodeName] = element.attributes[i].nodeValue
}
return result
}
</script>
<script id="room-template" type="text/x-handlebars-template">
<div class="room" id="room_{{id}}">
<span class="room[name]">{{name}}</span>
<span class="room[id]">{{id}}</span>
<div class="room[users]" />
{{#each users}}
<div class="user">
<span class="user[name]">{{name}}</span>
</div>
{{/each}}
</div>
</div>
</script>
</head>
<body>
<div class="card_top">
<div class="card_logo">
<img src="assets/images/logo.png" alt="" />
</div>
<div class="card_form">
<select name="" id="">
<option value="">选择分区</option>
<option value=""></option>
<option value=""></option>
</select>
<input type="button" value="建立房间" />
</div>
<div class="log_reg">
<a href="">注册</a>
<span>&nbsp;&nbsp;|&nbsp;&nbsp;</span>
<a class="login" href="">登录</a>
</div>
</div>
<div class="card_center">
<div id="rooms"></div>
<div class="online_list">
<div class="online_title">在线用户</div>
<ul>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<li>
<img src="assets/images/hs1.jpg" alt="" /><span>Yolua Mesiade</span>
</li>
<!-- <li class="online_botttom"></li> -->
</ul>
</div>
<div style="clear:left;"></div>
</div>
<div id="candy" style="top:auto;height:260px;"></div>
</body>
</html>
test.html deleted 100644 → 0
View file @ a0f90a43
<div class="wrapper">
<header>Header</header>
<article>
<div class="main">Main</div>
<aside class="aside">Aside</aside>
<aside class="sub">Sub</aside>
</article>
<footer>Footer</footer>
</div>
<style>header{ height:100px; margin-top: 10px; border: 1px solid #000;}
article{ height:100%; margin-top: 10px;}
footer{ height:50px; margin-top: 10px; border: 1px solid #000;}
article{ display:-webkit-box; display:-moz-box; display:box; width: 100%;}
.aside{ width: 150px; border: 1px solid #f00; -webkit-box-ordinal-group:0; -moz-box-ordinal-group:0; box-ordinal-group:0;}
.main{ -webkit-box-flex:1; -moz-box-flex:1; box-flex:1; -webkit-box-ordinal-group:1; -moz-box-ordinal-group:1; box-ordinal-group:1; margin: 0px 10px; border: 1px solid #f00;}
.sub{ width: 200px; border: 1px solid #f00; -webkit-box-ordinal-group:2; -moz-box-ordinal-group:2; box-ordinal-group:2;}
.wrapper{height:500px}
</style>
\ No newline at end of file
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