ルーム情報コピーボタン。

NanasuNANA · Dec 11, 2023 · a60010d · a60010d
1 parent 8fea99b
commit a60010d
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 7 deletions.
diff --git a/src/app/component/peer-menu/peer-menu.component.html b/src/app/component/peer-menu/peer-menu.component.html
@@ -22,11 +22,11 @@
           <span class="id-spacer">{{ networkService.peer.userId }}</span>
           <input class="id-input" type="text" value="{{ networkService.peer.userId }}" readonly>
         </span>
-        <button *ngIf="isAbleClipboardCopy" (click)="copyPeerId()" [disabled]="isCopied"><b class="material-icons" style="font-size: 1em; vertical-align: bottom">content_copy</b></button>
+        <button *ngIf="isAbleClipboardCopy" (click)="copyPeerId()" [disabled]="isCopied" title="クリップボードにコピー"><b class="material-icons" style="font-size: 1em; vertical-align: bottom">content_copy</b></button>
         <span [@fadeInOut]="isCopied" class="copied" [style.color]="myPeerColor"> {{ isCopied ? 'クリップボードにコピーしました。' : '' }}</span>
       </ng-container>
     </span>
-    <span *ngIf="!networkService.isOpen" style="font-weight: bold;">???</span>
+    <span *ngIf="!networkService.isOpen" style="font-weight: bold">???</span>
   </div>
 </div>
 <ng-container *ngIf="networkService.peer.isRoom">
@@ -38,7 +38,7 @@
           <span class="id-spacer room-data">{{ networkService.peer.roomName }}/{{ networkService.peer.roomId }}</span>
           <input class="id-input room-data" type="text" value="{{ networkService.peer.roomName + '/' + networkService.peer.roomId }}" readonly>
         </span>
-        <button *ngIf="isAbleClipboardCopy" (click)="copyRoomName()" [disabled]="isRoomNameCopied"><b class="material-icons" style="font-size: 1em; vertical-align: bottom">content_copy</b></button>
+        <button *ngIf="isAbleClipboardCopy" (click)="copyRoomName()" [disabled]="isRoomNameCopied" title="クリップボードにコピー"><b class="material-icons" style="font-size: 1em; vertical-align: bottom">content_copy</b></button>
         <span [@fadeInOut]="isRoomNameCopied" class="copied" [style.color]="myPeerColor"> {{ isRoomNameCopied ? 'クリップボードにコピーしました。' : '' }}</span>
       </ng-container>
     </span>
@@ -56,8 +56,9 @@
           <input class="id-input room-data" type="text" value="{{ networkService.peer.password }}" readonly>
         </span>
         <div style="display: inline" *ngIf="!isPasswordOpen" class="masked-password" draggable="false">{{ maskedPassword }}</div>
-        <button *ngIf="isAbleClipboardCopy && isPasswordOpen" (click)="copyPassword()" [disabled]="isPasswordCopied"><b class="material-icons" style="font-size: 1em; vertical-align: bottom">content_copy</b></button>
+        <button *ngIf="isAbleClipboardCopy && isPasswordOpen" (click)="copyPassword()" [disabled]="isPasswordCopied" title="クリップボードにコピー"><b class="material-icons" style="font-size: 1em; vertical-align: bottom">content_copy</b></button>
         <span [@fadeInOut]="isPasswordCopied" class="copied" [style.color]="myPeerColor"> {{ isPasswordCopied ? 'クリップボードにコピーしました。' : '' }}</span>
+        <br /><button *ngIf="isAbleClipboardCopy && isPasswordOpen" style="margin-top: 2px; margin-left: 0px" (click)="copyRoomInfo()" [disabled]="isPasswordCopied"><b class="material-icons" style="font-size: 1em; vertical-align: middle">content_copy</b><b style="margin-left: 2px; display: inline-block; font-size: smaller">ルーム名、パスワードをクリップボードにコピー</b></button>
       </div>
     </div>
   </ng-container>
@@ -75,7 +76,7 @@
     <input [(ngModel)]="targetUserId" placeholder="接続したい相手のID" name="targetUserId" [disabled]="isDisableConnect" />
     <button (click)="connectPeer()" [disabled]="!networkService.isOpen || targetUserId == null || targetUserId == '' || isDisableConnect">プライベート接続</button><br>
   </ng-container>
-  <button *ngIf="networkService.peerIds.length <= 1" (click)="showLobby()" [disabled]="!networkService.isOpen || isDisableConnect">ロビー（ルーム一覧）を表示</button>
+  <button *ngIf="networkService.peerIds.length <= 1" style="margin-left: 0px" (click)="showLobby()" [disabled]="!networkService.isOpen || isDisableConnect">ロビー（ルーム一覧）を表示</button>
 </div>
 <ng-container *ngIf="!isGMMode && !isGMHold">
   <ng-container *ngIf="!networkService.peer.isRoom">

diff --git a/src/app/component/peer-menu/peer-menu.component.ts b/src/app/component/peer-menu/peer-menu.component.ts
@@ -215,7 +215,19 @@ export class PeerMenuComponent implements OnInit, OnDestroy {
       navigator.clipboard.writeText(this.networkService.peer.password);
       this.isPasswordCopied = true;
       clearTimeout(this._timeOutId3);
-      this._timeOutId2 = setTimeout(() => {
+      this._timeOutId3 = setTimeout(() => {
+        this.isPasswordCopied = false;
+      }, 1000);
+      this.isPasswordOpen = false;
+    }
+  }
+
+  copyRoomInfo() {
+    if (navigator.clipboard) {
+      navigator.clipboard.writeText('ルーム名：' + this.networkService.peer.roomName + '/' + this.networkService.peer.roomId + '　パスワード：' + this.networkService.peer.password);
+      this.isPasswordCopied = true;
+      clearTimeout(this._timeOutId3);
+      this._timeOutId3 = setTimeout(() => {
         this.isPasswordCopied = false;
       }, 1000);
       this.isPasswordOpen = false;

diff --git a/src/index.html b/src/index.html
@@ -2,7 +2,7 @@
 <html>
 <head>
   <meta charset="utf-8">
-  <title>Udonarium with Fly 1.8.10d (Powered by Udonarium 1.15.2)</title>
+  <title>Udonarium with Fly 1.8.10e (Powered by Udonarium 1.15.2)</title>
   <base href="./">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="mobile-web-app-capable" content="yes">