Udonarium v1.14.1 および Udonarium Lily v1.08.0 対応 平面化パッチ

udonarium-2d.patch

diff --git a/src/app/component/dice-symbol/dice-symbol.component.css b/src/app/component/dice-symbol/dice-symbol.component.css
index aca62fd..b46d4af 100644
--- a/src/app/component/dice-symbol/dice-symbol.component.css
+++ b/src/app/component/dice-symbol/dice-symbol.component.css
@@ -98,7 +98,7 @@
   bottom: 0;
   left: 0;
   right: 0;
-  transform: rotateX(-90deg) translateY(-50%);
+  /* transform: rotateX(-90deg) translateY(-50%); */
 }
 
 .is-fit-width {
diff --git a/src/app/component/game-character-sheet/game-character-sheet.component.html b/src/app/component/game-character-sheet/game-character-sheet.component.html
index adeee31..045c4b3 100644
--- a/src/app/component/game-character-sheet/game-character-sheet.component.html
+++ b/src/app/component/game-character-sheet/game-character-sheet.component.html
@@ -10,7 +10,7 @@
   </ng-container>
   <ng-container *ngSwitchCase="'terrain'">
     <button (click)="openModal('floor')">床の画像を変更</button>
-    <button (click)="openModal('wall')">壁の画像を変更</button>
+    <!-- <button (click)="openModal('wall')">壁の画像を変更</button> -->
   </ng-container>
   <ng-container *ngSwitchCase="'dice-symbol'">
     <button (click)="openModal(tabletopObject['face'])" [disabled]="!tabletopObject['isVisible']">ダイス目の画像を変更</button>
@@ -60,4 +60,4 @@
       <button style="width:100%; color: #555;" (click)="addDataElement()">新しい項目を追加</button>
     </div>
   </ng-container>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/component/game-character/game-character.component.css b/src/app/component/game-character/game-character.component.css
index 4daebb8..bb3dc6e 100644
--- a/src/app/component/game-character/game-character.component.css
+++ b/src/app/component/game-character/game-character.component.css
@@ -76,7 +76,7 @@
   width: 100%;
   box-sizing: border-box;
   border: solid 6px #FFCC80;
-  border-radius: 25px;
+  border-radius: 10px;
 }
 
 .pedestal-outer {
@@ -86,7 +86,7 @@
   width: 100%;
   box-sizing: border-box;
   border: solid 2px #212121;
-  border-radius: 25px;
+  border-radius: 10px;
 }
 
 .upright-transform {
@@ -94,7 +94,7 @@
   bottom: 0;
   left: 0;
   right: 0;
-  transform: rotateX(-90deg) translateY(-50%);
+  /* transform: rotateX(-90deg) translateY(-50%); */
 }
 
 .is-fit-width {
diff --git a/src/app/component/game-character/game-character.component.html b/src/app/component/game-character/game-character.component.html
index 3af4ae2..1addb81 100644
--- a/src/app/component/game-character/game-character.component.html
+++ b/src/app/component/game-character/game-character.component.html
@@ -22,6 +22,7 @@
               <div class="back-tag has-length-limit is-3d">{{name}}</div>
             </div>
             <img class="image" *ngIf="0 < imageFile.url.length" [src]="imageFile.url | safe: 'resourceUrl'">
+            <!--
             <div class="rotate-grab rotate-grab-icon of-top"
               [ngStyle]="{'transform': 'translateX(-50%) translateX(' + size * gridSize / 2 +'px)'}">
               <i class="material-icons">autorenew</i>
@@ -30,9 +31,10 @@
               [ngStyle]="{'transform': 'translateX(-50%) translateX(' + size * gridSize / 2 +'px'}">
               <i class="material-icons">autorenew</i>
             </div>
+            -->
           </div>
         </div>
       </div>
     </div>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/component/game-table/game-table.component.ts b/src/app/component/game-table/game-table.component.ts
index eaa0f24..b840747 100644
--- a/src/app/component/game-table/game-table.component.ts
+++ b/src/app/component/game-table/game-table.component.ts
@@ -61,9 +61,9 @@ export class GameTableComponent implements OnInit, OnDestroy, AfterViewInit {
   private viewPotisonY: number = 0;
   private viewPotisonZ: number = 0;
 
-  private viewRotateX: number = 50;
+  private viewRotateX: number = 0;
   private viewRotateY: number = 0;
-  private viewRotateZ: number = 10;
+  private viewRotateZ: number = 0;
 
   private mouseGesture: TableMouseGesture = null;
   private touchGesture: TableTouchGesture = null;
@@ -245,7 +245,7 @@ export class GameTableComponent implements OnInit, OnDestroy, AfterViewInit {
     this.viewPotisonY += transformY;
     this.viewPotisonZ += transformZ;
 
-    this.gameTable.nativeElement.style.transform = 'translateZ(' + this.viewPotisonZ + 'px) translateY(' + this.viewPotisonY + 'px) translateX(' + this.viewPotisonX + 'px) rotateY(' + this.viewRotateY + 'deg) rotateX(' + this.viewRotateX + 'deg) rotateZ(' + this.viewRotateZ + 'deg) ';
+    this.gameTable.nativeElement.style.transform = 'translateZ(' + this.viewPotisonZ + 'px) translateY(' + this.viewPotisonY + 'px) translateX(' + this.viewPotisonX + 'px) ';
   }
 
   private setGameTableGrid(width: number, height: number, gridSize: number = 50, gridType: GridType = GridType.SQUARE, gridColor: string = '#000000e6') {
diff --git a/src/app/component/peer-cursor/peer-cursor.component.css b/src/app/component/peer-cursor/peer-cursor.component.css
index b03a7d0..fc2ab15 100644
--- a/src/app/component/peer-cursor/peer-cursor.component.css
+++ b/src/app/component/peer-cursor/peer-cursor.component.css
@@ -23,7 +23,7 @@
   border-radius: 50% 50% 5% 50%;
   background-color: rgba(240, 218, 189, 0.9);
   transform-origin: 100% 100%;
-  transform: translateX(-100%) translateY(-100%)  rotateX(-90deg) rotateZ(45deg);
+  transform: translateX(-100%) translateY(-100%) rotate(45deg);
 }
 
 .icon {
diff --git a/src/app/component/terrain/terrain.component.css b/src/app/component/terrain/terrain.component.css
index de9c7c6..0e3a5bd 100644
--- a/src/app/component/terrain/terrain.component.css
+++ b/src/app/component/terrain/terrain.component.css
@@ -56,6 +56,7 @@
 }
 
 .of-wall-top {
+  display: none;
   top: 0px;
   left: 0px;
 
@@ -65,6 +66,7 @@
 }
 
 .of-wall-bottom {
+  display: none;
   bottom: 0px;
   left: 0px;
 
@@ -74,6 +76,7 @@
 }
 
 .of-wall-left {
+  display: none;
   top: 0px;
   left: 0px;
 
@@ -83,6 +86,7 @@
 }
 
 .of-wall-right {
+  display: none;
   top: 0px;
   right: 0px;
 
diff --git a/src/app/component/terrain/terrain.component.html b/src/app/component/terrain/terrain.component.html
index caa02d8..9555df7 100644
--- a/src/app/component/terrain/terrain.component.html
+++ b/src/app/component/terrain/terrain.component.html
@@ -4,7 +4,7 @@
   <div class="component-content is-3d is-pointer-events-auto" [ngClass]="{'is-grab': !isLocked}"
     appRotable [rotable.option]="rotableOption" (rotable.ondragstart)="onMove()" (rotable.ondragend)="onMoved()" [rotable.disable]="isLocked">
     <ng-container *ngIf="hasFloor && isVisibleFloor && 0 < floorImage?.url.length">
-      <div class="texture" [ngClass]="{'blinking-animation': !isLocked}" [ngStyle]="{'transform': 'translateZ(' + height * gridSize +'px)'}"
+      <div class="texture" [ngClass]="{'blinking-animation': !isLocked}"
         [style.background-image]="'url(' + floorImage.url + ')' | safe: 'style'"></div>
     </ng-container>
     <ng-container *ngIf="hasWall && 0 < wallImage?.url.length">
@@ -37,4 +37,4 @@
       </div>
     </ng-container>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/component/terrain/terrain.component.ts b/src/app/component/terrain/terrain.component.ts
index 5caaa57..df3f583 100644
--- a/src/app/component/terrain/terrain.component.ts
+++ b/src/app/component/terrain/terrain.component.ts
@@ -149,21 +149,21 @@ export class TerrainComponent implements OnInit, OnDestroy, AfterViewInit {
             SoundEffect.play(PresetSound.lock);
           }
         }),
-      ContextMenuSeparator,
-      (this.hasWall
-        ? {
-          name: '壁を非表示', action: () => {
-            this.mode = TerrainViewState.FLOOR;
-            if (this.depth * this.width === 0) {
-              this.terrain.width = this.width <= 0 ? 1 : this.width;
-              this.terrain.depth = this.depth <= 0 ? 1 : this.depth;
-            }
-          }
-        } : {
-          name: '壁を表示', action: () => {
-            this.mode = TerrainViewState.ALL;
-          }
-        }),
+      // ContextMenuSeparator,
+      // (this.hasWall
+      //   ? {
+      //     name: '壁を非表示', action: () => {
+      //       this.mode = TerrainViewState.FLOOR;
+      //       if (this.depth * this.width === 0) {
+      //         this.terrain.width = this.width <= 0 ? 1 : this.width;
+      //         this.terrain.depth = this.depth <= 0 ? 1 : this.depth;
+      //       }
+      //     }
+      //   } : {
+      //     name: '壁を表示', action: () => {
+      //       this.mode = TerrainViewState.ALL;
+      //     }
+      //   }),
       ContextMenuSeparator,
       { name: '地形設定を編集', action: () => { this.showDetail(this.terrain); } },
       {
diff --git a/src/app/component/text-note/text-note.component.css b/src/app/component/text-note/text-note.component.css
index 78caff3..2dd14db 100644
--- a/src/app/component/text-note/text-note.component.css
+++ b/src/app/component/text-note/text-note.component.css
@@ -54,7 +54,7 @@
   left: 0;
   right: 0;
   transform-origin: 50% 100%;
-  transform: rotateX(-90deg);
+  /* transform: rotateX(-90deg); */
 }
 
 .is-bg-texture {
diff --git a/src/app/service/tabletop-action.service.ts b/src/app/service/tabletop-action.service.ts
index 2a80d5b..0828dc5 100644
--- a/src/app/service/tabletop-action.service.ts
+++ b/src/app/service/tabletop-action.service.ts
@@ -52,7 +52,7 @@ export class TabletopActionService {
     let viewTable = this.getViewTable();
     if (!viewTable) return;
 
-    let terrain = Terrain.create('地形', 2, 2, 2, image.identifier, image.identifier);
+    let terrain = Terrain.create('地形', 2, 2, 0, image.identifier, image.identifier);
     terrain.location.x = position.x - 50;
     terrain.location.y = position.y - 50;
     terrain.posZ = position.z;

udonarium-lily-2d.patch

diff --git a/src/app/component/dice-symbol/dice-symbol.component.css b/src/app/component/dice-symbol/dice-symbol.component.css
index 1f0c4565..68afffd8 100644
--- a/src/app/component/dice-symbol/dice-symbol.component.css
+++ b/src/app/component/dice-symbol/dice-symbol.component.css
@@ -109,7 +109,7 @@
   bottom: 0;
   left: 0;
   right: 0;
-  transform: rotateX(-90deg) translateY(-50%);
+  /* transform: rotateX(-90deg) translateY(-50%); */
 }
 
 .is-fit-width {
diff --git a/src/app/component/game-character-sheet/game-character-sheet.component.html b/src/app/component/game-character-sheet/game-character-sheet.component.html
index cef483d2..5dbaf9b1 100644
--- a/src/app/component/game-character-sheet/game-character-sheet.component.html
+++ b/src/app/component/game-character-sheet/game-character-sheet.component.html
@@ -11,7 +11,7 @@
     </ng-container>
     <ng-container *ngSwitchCase="'terrain'">
       <button (click)="openModal('floor')">床の画像を変更</button>
-      <button (click)="openModal('wall')">壁の画像を変更</button>
+      <!-- <button (click)="openModal('wall')">壁の画像を変更</button> -->
     </ng-container>
     <ng-container *ngSwitchCase="'dice-symbol'">
       <button (click)="openModal(tabletopObject['face'])" [disabled]="!tabletopObject['isVisible']">ダイス目の画像を変更</button>
@@ -278,4 +278,4 @@
         <button style="width:100%; color: #555;" (click)="addDataElement()">新しい項目を追加</button>
       </div>
     </ng-container>
-  </div>
\ No newline at end of file
+  </div>
diff --git a/src/app/component/game-character/game-character.component.css b/src/app/component/game-character/game-character.component.css
index c9b02690..50531f00 100644
--- a/src/app/component/game-character/game-character.component.css
+++ b/src/app/component/game-character/game-character.component.css
@@ -91,7 +91,7 @@
   width: 100%;
   box-sizing: border-box;
   border: solid 6px #FFCC80;
-  border-radius: 25px;
+  border-radius: 10px;
 }
 
 .pedestal-outer {
@@ -101,7 +101,7 @@
   width: 100%;
   box-sizing: border-box;
   border: solid 2px #212121;
-  border-radius: 25px;
+  border-radius: 10px;
 }
 
 .upright-transform {
@@ -109,7 +109,7 @@
   bottom: 0;
   left: 0;
   right: 0;
-  transform: rotateX(-90deg) translateY(-50%);
+  /* transform: rotateX(-90deg) translateY(-50%); */
 }
 
 .is-fit-width {
diff --git a/src/app/component/game-character/game-character.component.html b/src/app/component/game-character/game-character.component.html
index 4a94d2e2..17a97a8c 100644
--- a/src/app/component/game-character/game-character.component.html
+++ b/src/app/component/game-character/game-character.component.html
@@ -88,16 +88,19 @@
               </div>
             </ng-container>
 <!--回転部キャラ上-->
+            <!--
             <div *ngIf="!isLock" class="grab-group is-3d">
               <div class="rotate-grab rotate-grab-icon of-top is-3d will-change"
                 [ngStyle]="{'transform': 'translateX(-50%) translateX(' + size * gridSize / 2 +'px) translateY( -0px)'}">
                 <i class="material-icons will-change">autorenew</i>
               </div>
             </div>
+            -->
 <!--画像-->
             <img class="image is-3d" [ngStyle]="{'height':+ this.gameCharacter.komaImageHeignt + 'px','transform': 'translateX(-50%) translateX(' + size * gridSize / 2 +'px)'}" *ngIf="(0 < imageFile.url.length) && this.gameCharacter.specifyKomaImageFlag" [src]="imageFile.url | safe: 'resourceUrl'">
             <img class="image is-3d" [ngStyle]="{'width':'100%'}" *ngIf="(0 < imageFile.url.length) && !this.gameCharacter.specifyKomaImageFlag" [src]="imageFile.url | safe: 'resourceUrl'">
 <!--回転部キャラ下-->
+            <!--
             <div *ngIf="!isLock" class="grab-group is-3d">
               <div *ngIf="!isLock" class="rotate-grab rotate-grab-icon of-bottom is-3d will-change"
                 [ngStyle]="{'transform': 'translateX(-50%) translateX(' + size * gridSize / 2 +'px'}">
@@ -106,7 +109,7 @@
                 </ng-container>
               </div>
             </div>
-
+            -->
           </div>
         </div>
       </div>
diff --git a/src/app/component/game-table/game-table.component.ts b/src/app/component/game-table/game-table.component.ts
index 4b0c27a8..64f5afba 100644
--- a/src/app/component/game-table/game-table.component.ts
+++ b/src/app/component/game-table/game-table.component.ts
@@ -75,9 +75,9 @@ export class GameTableComponent implements OnInit, OnDestroy, AfterViewInit {
   private viewPotisonY: number = 0;
   private viewPotisonZ: number = 0;
 
-  private viewRotateX: number = 50;
+  private viewRotateX: number = 0;
   private viewRotateY: number = 0;
-  private viewRotateZ: number = 10;
+  private viewRotateZ: number = 0;
 
   private mouseGesture: TableMouseGesture = null;
   private touchGesture: TableTouchGesture = null;
@@ -131,17 +131,9 @@ export class GameTableComponent implements OnInit, OnDestroy, AfterViewInit {
           let centerY = this.gridCanvas.nativeElement.clientHeight / 2;
           let movedX = event.data.x - centerX;
           let movedY = event.data.y - centerY;
-          // z軸回転
-          let rotateZRad = this.viewRotateZ / 180 * Math.PI;
-          let rotatedMovedX = movedX * Math.cos(rotateZRad) - movedY * Math.sin(rotateZRad);
-          let zRotatedMovedY = movedX * Math.sin(rotateZRad) + movedY * Math.cos(rotateZRad);
-          // x軸回転
-          let rotateXRad = this.viewRotateX / 180 * Math.PI;
-          let rotatedMovedY = zRotatedMovedY * Math.cos(rotateXRad);
-          let rotatedMovedZ = zRotatedMovedY * Math.sin(rotateXRad);
           // 移動
           this.setTransform(
-            100 - rotatedMovedX - this.viewPotisonX, -rotatedMovedY - this.viewPotisonY, -rotatedMovedZ - this.viewPotisonZ, 0, 0, 0
+            100 - movedX - this.viewPotisonX, -movedY - this.viewPotisonY, -this.viewPotisonZ, 0, 0, 0
           );
         }, 50);
       });
@@ -293,7 +285,7 @@ export class GameTableComponent implements OnInit, OnDestroy, AfterViewInit {
     this.viewPotisonY += transformY;
     this.viewPotisonZ += transformZ;
 
-    this.gameTable.nativeElement.style.transform = 'translateZ(' + this.viewPotisonZ + 'px) translateY(' + this.viewPotisonY + 'px) translateX(' + this.viewPotisonX + 'px) rotateY(' + this.viewRotateY + 'deg) rotateX(' + this.viewRotateX + 'deg) rotateZ(' + this.viewRotateZ + 'deg) ';
+    this.gameTable.nativeElement.style.transform = 'translateZ(' + this.viewPotisonZ + 'px) translateY(' + this.viewPotisonY + 'px) translateX(' + this.viewPotisonX + 'px) ';
   }
 
   private setGameTableGrid(width: number, height: number, gridSize: number = 50, gridType: GridType = GridType.SQUARE, gridColor: string = '#000000e6') {
diff --git a/src/app/component/peer-cursor/peer-cursor.component.css b/src/app/component/peer-cursor/peer-cursor.component.css
index b870ae9a..c15bbd1e 100644
--- a/src/app/component/peer-cursor/peer-cursor.component.css
+++ b/src/app/component/peer-cursor/peer-cursor.component.css
@@ -25,7 +25,7 @@
   border-radius: 50% 50% 5% 50%;
   background-color: rgba(240, 218, 189, 0.9);
   transform-origin: 100% 100%;
-  transform: translateX(-100%) translateY(-100%)  rotateX(-90deg) rotateZ(45deg);
+  transform: translateX(-100%) translateY(-100%) rotate(45deg);
 }
 
 .icon {
diff --git a/src/app/component/terrain/terrain.component.css b/src/app/component/terrain/terrain.component.css
index 8d72c696..433409a0 100644
--- a/src/app/component/terrain/terrain.component.css
+++ b/src/app/component/terrain/terrain.component.css
@@ -67,6 +67,7 @@
 }
 
 .of-wall-top {
+  display: none;
   top: 0px;
   left: 0px;
 
@@ -76,6 +77,7 @@
 }
 
 .of-wall-bottom {
+  display: none;
   bottom: 0px;
   left: 0px;
 
@@ -85,6 +87,7 @@
 }
 
 .of-wall-left {
+  display: none;
   top: 0px;
   left: 0px;
 
@@ -94,6 +97,7 @@
 }
 
 .of-wall-right {
+  display: none;
   top: 0px;
   right: 0px;
 
diff --git a/src/app/component/terrain/terrain.component.html b/src/app/component/terrain/terrain.component.html
index 0bc861d0..202f5698 100644
--- a/src/app/component/terrain/terrain.component.html
+++ b/src/app/component/terrain/terrain.component.html
@@ -7,10 +7,10 @@
   <div class="component-content is-3d is-pointer-events-auto" [ngClass]="{'is-grab': !isLocked}"
     appRotable [rotable.option]="rotableOption" (rotable.ondragstart)="onMove()" (rotable.ondragend)="onMoved()" [rotable.disable]="isLocked">
     <ng-container *ngIf="hasFloor && isVisibleFloor && 0 < floorImage?.url.length">
-      <div class="texture will-change" [ngClass]="{'blinking-animation': !isLocked}" [ngStyle]="{'transform': 'translateZ(' + height * gridSize +'px)'}"
+      <div class="texture will-change" [ngClass]="{'blinking-animation': !isLocked}"
       [style.background-image]="'url(' + floorImage.url + ')' | safe: 'style'"></div>
     </ng-container>
-    <canvas class="grid-canvas is-fill is-pointer-events-none" [ngStyle]="{'transform': 'translateZ(' + height * gridSize +'px)'}" #gridCanvas></canvas>
+    <canvas class="grid-canvas is-fill is-pointer-events-none" #gridCanvas></canvas>
     <ng-container *ngIf="hasWall && 0 < wallImage?.url.length">
       <div *ngIf="isVisibleWallTopBottom will-change" [ngClass]="{'blinking-animation': !isLocked}"
         class="texture of-wall-top" [style.background-image]="'url(' + wallImage.url + ')' | safe: 'style'"
@@ -41,4 +41,4 @@
       </div>
     </ng-container>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/component/terrain/terrain.component.ts b/src/app/component/terrain/terrain.component.ts
index 7d686c0c..e9b228ee 100644
--- a/src/app/component/terrain/terrain.component.ts
+++ b/src/app/component/terrain/terrain.component.ts
@@ -200,21 +200,21 @@ export class TerrainComponent implements OnInit, OnDestroy, AfterViewInit{
             SoundEffect.play(PresetSound.lock);
           }
         }),
-      ContextMenuSeparator,
-      (this.hasWall
-        ? {
-          name: '壁を非表示', action: () => {
-            this.mode = TerrainViewState.FLOOR;
-            if (this.depth * this.width === 0) {
-              this.terrain.width = this.width <= 0 ? 1 : this.width;
-              this.terrain.depth = this.depth <= 0 ? 1 : this.depth;
-            }
-          }
-        } : {
-          name: '壁を表示', action: () => {
-            this.mode = TerrainViewState.ALL;
-          }
-        }),
+      // ContextMenuSeparator,
+      // (this.hasWall
+      //   ? {
+      //     name: '壁を非表示', action: () => {
+      //       this.mode = TerrainViewState.FLOOR;
+      //       if (this.depth * this.width === 0) {
+      //         this.terrain.width = this.width <= 0 ? 1 : this.width;
+      //         this.terrain.depth = this.depth <= 0 ? 1 : this.depth;
+      //       }
+      //     }
+      //   } : {
+      //     name: '壁を表示', action: () => {
+      //       this.mode = TerrainViewState.ALL;
+      //     }
+      //   }),
       ContextMenuSeparator,
       { name: '地形設定を編集', action: () => { this.showDetail(this.terrain); } },
       {
diff --git a/src/app/component/text-note/text-note.component.css b/src/app/component/text-note/text-note.component.css
index 90d653e1..6cb87dd5 100644
--- a/src/app/component/text-note/text-note.component.css
+++ b/src/app/component/text-note/text-note.component.css
@@ -61,7 +61,7 @@
   left: 0;
   right: 0;
   transform-origin: 50% 100%;
-  transform: rotateX(-90deg);
+  /* transform: rotateX(-90deg); */
 }
 
 .is-bg-texture {
diff --git a/src/app/service/tabletop-action.service.ts b/src/app/service/tabletop-action.service.ts
index 32c9a1cb..3fce2448 100644
--- a/src/app/service/tabletop-action.service.ts
+++ b/src/app/service/tabletop-action.service.ts
@@ -64,7 +64,7 @@ export class TabletopActionService {
     let viewTable = this.getViewTable();
     if (!viewTable) return;
 
-    let terrain = Terrain.create('地形', 2, 2, 2, image.identifier, image.identifier);
+    let terrain = Terrain.create('地形', 2, 2, 0, image.identifier, image.identifier);
     terrain.location.x = position.x - 50;
     terrain.location.y = position.y - 50;
     terrain.posZ = position.z;

ライセンスは元プロダクトに基づきMIT Licenseとします。