update room list display

app/ygopro.component.html

@@ -70,7 +70,7 @@
                     <tr *ngFor="let room of rooms" class="room" (click)="join_room(room)">
                         <td class="title">{{room.title}}</td>
                         <td class="users">
-                            <img *ngFor="let user of room.users" class="avatar rounded" [src]="'https://ygobbs.com/user_avatar/ygobbs.com/' + user.username + '/25/1.png'" data-toggle="tooltip" data-placement="bottom" [title]="user.username">
+                            <img *ngFor="let user of room.users" class="avatar rounded" [src]="'https://ygobbs.com/user_avatar/ygobbs.com/' + user.username + '/25/1.png'" data-toggle="tooltip" data-placement="bottom" [title]="user.username" (error)="avatar_fallback($event)">
                         </td>
                         <td class="mode">
                             <span i18n *ngIf="room.options.mode === 0">单局模式</span>
@@ -79,12 +79,12 @@
                         </td>
                         <td class="extra">
                             <span *ngIf="room.options.rule != default_options.rule">{{{'0': 'OCG', '1': 'TCG', '2': 'O/T', '3': '专有卡禁止'}[room.options.rule]}}</span>
-                            <span i18n *ngIf="room.options.start_lp != default_options.start_lp">{{room.options.start_lp}} LP</span>
-                            <span i18n *ngIf="room.options.start_hand != default_options.start_hand">{{room.options.start_hand}} 初始</span>
-                            <span i18n *ngIf="room.options.draw_count != default_options.draw_count">{{room.options.draw_count}} 抽卡</span>
-                            <span i18n *ngIf="room.options.enable_priority != default_options.enable_priority">旧规则</span>
-                            <span i18n *ngIf="room.options.no_check_deck != default_options.no_check_deck">不检查</span>
-                            <span i18n *ngIf="room.options.no_shuffle_deck != default_options.no_shuffle_deck">不洗卡</span>
+                            <span i18n *ngIf="room.options.start_lp != default_options.start_lp">{{room.options.start_lp}}LP</span>
+                            <span i18n *ngIf="room.options.start_hand != default_options.start_hand" title="初始起手数量">{{room.options.start_hand}}初始</span>
+                            <span i18n *ngIf="room.options.draw_count != default_options.draw_count" title="每回合抽卡数量">{{room.options.draw_count}}抽卡</span>
+                            <span i18n *ngIf="room.options.enable_priority != default_options.enable_priority" title="上个版本的大师规则">旧规则</span>
+                            <span i18n *ngIf="room.options.no_check_deck != default_options.no_check_deck" title="不检查卡组是否合规">不检查</span>
+                            <span i18n *ngIf="room.options.no_shuffle_deck != default_options.no_shuffle_deck" title="任何时候都不洗切卡组">不洗卡</span>
                         </td>
                     </tr>
                     </tbody>
@@ -282,18 +282,18 @@
                                     <span *ngIf="!(room.arena || room.id.startsWith('AI#') || room.private)">{{room.title}}</span>
                                 </td>
                                 <td class="users">
-                                    <img *ngFor="let user of room.users" class="avatar rounded" [src]="'https://ygobbs.com/user_avatar/ygobbs.com/' + user.username + '/25/1.png'" data-toggle="tooltip" data-placement="bottom" [title]="user.username">
+                                    <img *ngFor="let user of room.users" class="avatar rounded" [src]="'https://ygobbs.com/user_avatar/ygobbs.com/' + user.username + '/25/1.png'" data-toggle="tooltip" data-placement="bottom" [title]="user.username" (error)="avatar_fallback($event)">
                                 </td>
                                 <td class="extra">
                                     <div *ngIf="!(room.arena || room.id.startsWith('AI#'))">
                                         <span *ngIf="room.options.rule != default_options.rule">{{{'0': 'OCG', '1': 'TCG', '2': 'O/T', '3': '专有卡禁止'}[room.options.rule]}}</span>
                                         <span i18n *ngIf="room.options.start_lp != default_options.start_lp && room.options.mode != 2">{{room.options.start_lp}}LP</span>
                                         <span i18n *ngIf="room.options.start_lp != default_options.start_lp_tag && room.options.mode == 2">{{room.options.start_lp}}LP</span>
-                                        <span i18n *ngIf="room.options.start_hand != default_options.start_hand">{{room.options.start_hand}}初始</span>
-                                        <span i18n *ngIf="room.options.draw_count != default_options.draw_count">{{room.options.draw_count}}抽卡</span>
-                                        <span i18n *ngIf="room.options.enable_priority != default_options.enable_priority">旧规则</span>
-                                        <span i18n *ngIf="room.options.no_check_deck != default_options.no_check_deck">不检查</span>
-                                        <span i18n *ngIf="room.options.no_shuffle_deck != default_options.no_shuffle_deck">不洗卡</span>
+                                        <span i18n *ngIf="room.options.start_hand != default_options.start_hand" title="初始起手数量">{{room.options.start_hand}}初始</span>
+                                        <span i18n *ngIf="room.options.draw_count != default_options.draw_count" title="每回合抽卡数量">{{room.options.draw_count}}抽卡</span>
+                                        <span i18n *ngIf="room.options.enable_priority != default_options.enable_priority" title="上个版本的大师规则">旧规则</span>
+                                        <span i18n *ngIf="room.options.no_check_deck != default_options.no_check_deck" title="不检查卡组是否合规">不检查</span>
+                                        <span i18n *ngIf="room.options.no_shuffle_deck != default_options.no_shuffle_deck" title="任何时候都不洗切卡组">不洗卡</span>
                                     </div>
                                 </td>
                             </tr>

app/ygopro.component.ts

@@ -816,4 +816,11 @@ export class YGOProComponent implements OnInit, OnDestroy {
     //     this.youtube.nativeElement.src = 'https://m.youtube.com/results?search_query=YGOPro';
     //     shell.openExternal(event.url);
     // }
+
+    avatar_fallback(event) {
+        if (!event.target.getAttribute('fallback')) {
+            event.target.src = "images/noavatar.png";
+            event.target.setAttribute('fallback', true);
+        }
+    }
 }