icon & announcement

assets/javascripts/rooms.coffee

-#window.oldSetInterval = window.setInterval;
-#window.setInterval = (func, interval)->
-#  interval = oldSetInterval(func, interval);
-#  console.log "setInteval called", func, interval
-
-#window.oldClearInterval = window.setInterval;
-#window.ClearInterval = (func, interval)->
-#  interval = oldClearInterval(func, interval);
-#  console.log "clearInteval called", func, interval
-
 class Server extends Spine.Model
   @configure "Server", "name", "ip", "port", "index"
   @extend Spine.Model.Ajax
@@ -165,18 +155,11 @@ logout = ->
   Candy.Util.deleteCookie('password')
   window.location.reload()
 
-announcement_scroll = (obj)->
-  $('#announcements_wrapper').find("ul:first").animate
-    marginTop:"-25px"
-  ,500,->
-    $(this).css({marginTop:"0px"}).find("li:first").appendTo(this)
-#console.log this
-@announcement_scrolling = null
 
 setRosterHeight = ->
   pageHight = (document.documentElement.clientHeight)-430
   $("#roster").height(pageHight)
-$(document).ready =>
+$(document).ready ->
   if Candy.Util.getCookie('jid')
     login()
     after_login()
@@ -266,25 +249,29 @@ $(document).ready =>
   $('#logout_button').click ->
     logout()
 
-  $('#announcements li').mouseover =>
-    console.log 'mouseover'
-    #clearInterval(@announcement_scrolling) if @announcement_scrolling
-    #@announcement_scrolling = null
-  $('#announcements li').mouseleave =>
-    #@announcement_scrolling = setInterval(announcement_scroll, 5000) if !@announcement_scrolling
-
-
   setRosterHeight();
   $(window).resize(setRosterHeight);
 
-  $.getJSON '/announcements.json', (data)=>
+  $.getJSON '/announcements.json', (data)->
+    if data.length
       for announcement in data
         $('<li />').append($('<a />',
           href: announcement.url
           target: '_blank'
           text: announcement.title
         )).appendTo $('#announcements')
-    @announcement_scrolling = setInterval(announcement_scroll, 5000) if !@announcement_scrolling and data.length
+
+      announcement_scroll = (obj)->
+        $('#announcements_wrapper').find("ul:first").animate
+          marginTop:"-25px"
+        ,500,->
+          $(this).css({marginTop:"0px"}).find("li:first").appendTo(this)
+      announcement_scrolling = setInterval(announcement_scroll, 5000)
+      $('#announcements li').mouseenter ->
+        clearInterval(announcement_scrolling)
+        announcement_scrolling = null
+      $('#announcements li').mouseleave ->
+        announcement_scrolling = setInterval(announcement_scroll, 5000) if !announcement_scrolling
 
   rooms = new Rooms(el: $('#rooms'))
   servers = new Servers(el: $('#servers'))

assets/javascripts/rooms.js

 // Generated by CoffeeScript 1.4.0
 (function() {
-  var Room, Rooms, Server, Servers, announcement_scroll, login, logout, setRosterHeight,
+  var Room, Rooms, Server, Servers, login, logout, setRosterHeight,
     __hasProp = {}.hasOwnProperty,
     __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
-    __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
-    _this = this;
+    __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };
 
   Server = (function(_super) {
 
@@ -259,18 +258,6 @@
     return window.location.reload();
   };
 
-  announcement_scroll = function(obj) {
-    return $('#announcements_wrapper').find("ul:first").animate({
-      marginTop: "-25px"
-    }, 500, function() {
-      return $(this).css({
-        marginTop: "0px"
-      }).find("li:first").appendTo(this);
-    });
-  };
-
-  this.announcement_scrolling = null;
-
   setRosterHeight = function() {
     var pageHight;
     pageHight = document.documentElement.clientHeight - 430;
@@ -375,14 +362,11 @@
     $('#logout_button').click(function() {
       return logout();
     });
-    $('#announcements li').mouseover(function() {
-      return console.log('mouseover');
-    });
-    $('#announcements li').mouseleave(function() {});
     setRosterHeight();
     $(window).resize(setRosterHeight);
     $.getJSON('/announcements.json', function(data) {
-      var announcement, _i, _len;
+      var announcement, announcement_scroll, announcement_scrolling, _i, _len;
+      if (data.length) {
         for (_i = 0, _len = data.length; _i < _len; _i++) {
           announcement = data[_i];
           $('<li />').append($('<a />', {
@@ -391,8 +375,25 @@
             text: announcement.title
           })).appendTo($('#announcements'));
         }
-      if (!_this.announcement_scrolling && data.length) {
-        return _this.announcement_scrolling = setInterval(announcement_scroll, 5000);
+        announcement_scroll = function(obj) {
+          return $('#announcements_wrapper').find("ul:first").animate({
+            marginTop: "-25px"
+          }, 500, function() {
+            return $(this).css({
+              marginTop: "0px"
+            }).find("li:first").appendTo(this);
+          });
+        };
+        announcement_scrolling = setInterval(announcement_scroll, 5000);
+        $('#announcements li').mouseenter(function() {
+          clearInterval(announcement_scrolling);
+          return announcement_scrolling = null;
+        });
+        return $('#announcements li').mouseleave(function() {
+          if (!announcement_scrolling) {
+            return announcement_scrolling = setInterval(announcement_scroll, 5000);
+          }
+        });
       }
     });
     rooms = new Rooms({

assets/stylesheets/rooms.less

@@ -43,7 +43,7 @@ body{background:#fbfbfb;}
         &:hover{overflow-y:scroll;}
         li{
           border-top:1px solid #dddddd;padding:8px 8px;height:32px;
-          &.online_botttom{background:url(../images/gradual_change.png) repeat-x;height:10px;bottom:0;position:fixed;width:160px;padding:0 8px;border:none;}
+          &.online_botttom{background:url(/assets/images/rooms/gradual_change.png) repeat-x;height:10px;bottom:0;position:fixed;width:160px;padding:0 8px;border:none;}
           img{height:32px;width:32px;float:left;}span{line-height:32px;font-size:12px;padding:0 0 0 10px;float:left;}
           &:hover{background:#eeeeee;color:#3366CC}
 
@@ -173,8 +173,8 @@ html #candy{position:fixed;bottom:0;background:#ffffff;font-size:12px;top:auto;h
                   margin:0;background:#ffffff;border-top:1px solid #dddddd;border-left:1px solid #dddddd;padding:7px 7px;
                   &:hover{background:#eeeeee;color:#3366CC;}
                   ul{
-                      .context{margin:0;float:left;margin:0 0 0 40px;border:none;background:url(../images/menu.png) no-repeat 0 6px;
-                          &:hover{background:url(../images/menu_hover.png) no-repeat 0 6px;}
+                      .context{margin:0;float:left;margin:0 0 0 40px;border:none;background:url(/assets/images/rooms/menu.png) no-repeat 0 6px;
+                          &:hover{background:url(/assets/images/rooms/menu_hover.png) no-repeat 0 6px;}
                       }
                   }
               }
@@ -187,7 +187,7 @@ html #candy{position:fixed;bottom:0;background:#ffffff;font-size:12px;top:auto;h
             li{margin:0 5px 5px 5px;}
         }
     }
-    #chat-modal-overlay{background:url(../images/overlay_logo.png) center center #E7EAE9 no-repeat;}
+    #chat-modal-overlay{background:url(/assets/images/rooms/overlay_logo.png) center center #E7EAE9 no-repeat;}
 }
 
 

rooms/index.html

@@ -66,7 +66,7 @@
     <script id="room_template" type="text/x-jquery-tmpl">
 		<section class="room ${status}">
             <header class="room_top">
-                <img src="/assets/images/home.png" alt="">
+                <img src="/assets/images/rooms/{{if private}}private{{else}}${status}{{/if}}.png" alt="room" title="">
                 <span>${name}</span>
             </header>
             <div class="room_body {{if mode == 2}}double{{else}}single{{/if}}">
@@ -88,7 +88,7 @@
             </div>
             <footer class="room_member">
                 <p class="mode">模式: <span>{{if mode == 0}}单局{{else}}{{if mode == 1}}比赛{{else}}TAG{{/if}}{{/if}}</span></p>
-                {{if private}}<img src="/assets/images/lock.png" alt="私密房" class="private">{{/if}}
+                <!--{{if private}}<img src="/assets/images/lock.png" alt="私密房" class="private">{{/if}}-->
                 <!--<img src="/assets/images/duel.png" alt="竞技场" class="arena">-->
             </footer>
         </section>
@@ -130,7 +130,7 @@
 <!-- Add your site or application content here -->
 <header class="card_top">
     <div class="card_logo">
-        <img src="/assets/images/logo.png" alt=""/>
+        <img src="/assets/images/rooms/logo.png" alt="mycard"/>
     </div>
     <div class="card_form">
         <select id="servers" multiple="multiple"></select>
@@ -180,16 +180,16 @@
             <span>下面留的是管理员</span>
         </li>
         <li class="xmpp" data-jid="悼亡圣约@my-card.in" data-nick="悼亡圣约">
-            <img src="https://lh3.googleusercontent.com/-deevaHxZKmU/AAAAAAAAAAI/AAAAAAAAAAA/1AA3-swJOGg/s32-c-k/photo.jpg" alt=""/><span>悼亡圣约</span>
+            <img src="https://lh3.googleusercontent.com/-deevaHxZKmU/AAAAAAAAAAI/AAAAAAAAAAA/1AA3-swJOGg/s32-c-k/photo.jpg" alt="悼亡圣约"/><span>悼亡圣约</span>
         </li>
         <li class="xmpp" data-jid="悠夏丶@my-card.in" data-nick="悠夏丶">
-            <img src="https://lh4.googleusercontent.com/-kIAfjf8dim8/AAAAAAAAAAI/AAAAAAAAAAA/BPCryxovCU8/s48-c-k/photo.jpg" alt=""/><span>悠夏丶</span>
+            <img src="https://lh4.googleusercontent.com/-kIAfjf8dim8/AAAAAAAAAAI/AAAAAAAAAAA/BPCryxovCU8/s48-c-k/photo.jpg" alt="悠夏丶"/><span>悠夏丶</span>
         </li>
         <li class="xmpp" data-jid="萌の狐@my-card.in" data-nick="萌の狐">
-            <img src="https://lh3.googleusercontent.com/-oyc22EZHGvo/AAAAAAAAAAI/AAAAAAAAAAA/mXrA7Vz0NJg/s32-c-k/photo.jpg" alt=""/><span>萌の狐</span>
+            <img src="https://lh3.googleusercontent.com/-oyc22EZHGvo/AAAAAAAAAAI/AAAAAAAAAAA/mXrA7Vz0NJg/s32-c-k/photo.jpg" alt="萌の狐"/><span>萌の狐</span>
         </li>
         <li class="xmpp" data-jid="神様と秀吉@my-card.in" data-nick="神様と秀吉">
-            <img src="https://lh6.googleusercontent.com/-zNVBxXLudFc/AAAAAAAAAAI/AAAAAAAAAAA/YH5q1jCmiDQ/s48-c-k/photo.jpg" alt=""/><span>神様と秀吉</span>
+            <img src="https://lh6.googleusercontent.com/-zNVBxXLudFc/AAAAAAAAAAI/AAAAAAAAAAA/YH5q1jCmiDQ/s48-c-k/photo.jpg" alt="神様と秀吉"/><span>神様と秀吉</span>
         </li>
     </ul>
 </aside>