From caee550f74e1a3a85f7aa55fd5632101bc56445b Mon Sep 17 00:00:00 2001
From: keiya sasaki <keiya.s.0210@gmail.com>
Date: Wed, 6 Sep 2023 18:14:50 +0900
Subject: [PATCH] chore(web): add some atmosphere properties (#663)

---
 web/src/beta/lib/core/Map/types/index.ts            | 7 ++++++-
 web/src/beta/lib/core/engines/Cesium/core/Globe.tsx | 7 +++++++
 web/src/beta/lib/core/engines/Cesium/hooks.ts       | 3 ++-
 web/src/beta/lib/core/engines/Cesium/index.tsx      | 8 +++++++-
 4 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/web/src/beta/lib/core/Map/types/index.ts b/web/src/beta/lib/core/Map/types/index.ts
index a38cf090c0..fcac52b9f4 100644
--- a/web/src/beta/lib/core/Map/types/index.ts
+++ b/web/src/beta/lib/core/Map/types/index.ts
@@ -288,6 +288,7 @@ export type SceneProperty = {
   terrain?: TerrainProperty;
   atmosphere?: {
     enable_sun?: boolean;
+    enableMoon?: boolean;
     enable_lighting?: boolean;
     ground_atmosphere?: boolean;
     sky_atmosphere?: boolean;
@@ -295,13 +296,17 @@ export type SceneProperty = {
     shadowResolution?: 1024 | 2048 | 4096;
     softShadow?: boolean;
     shadowDarkness?: number;
+    shadowMaximumDistance?: number;
     fog?: boolean;
     fog_density?: number;
-    brightness_shift?: number;
     hue_shift?: number;
+    brightness_shift?: number;
     surturation_shift?: number;
+    skyboxBrightnessShift?: number;
+    skyboxSurturationShift?: number;
     globeShadowDarkness?: number;
     globeImageBasedLighting?: boolean;
+    globeBaseColor?: string;
   };
   timeline?: {
     animation?: boolean;
diff --git a/web/src/beta/lib/core/engines/Cesium/core/Globe.tsx b/web/src/beta/lib/core/engines/Cesium/core/Globe.tsx
index bf9d841176..686e35aeb1 100644
--- a/web/src/beta/lib/core/engines/Cesium/core/Globe.tsx
+++ b/web/src/beta/lib/core/engines/Cesium/core/Globe.tsx
@@ -12,6 +12,7 @@ import { Globe as CesiumGlobe } from "resium";
 import { objKeys } from "@reearth/beta/utils/util";
 
 import type { SceneProperty, TerrainProperty } from "../..";
+import { toColor } from "../common";
 
 export type Props = {
   property?: SceneProperty;
@@ -49,8 +50,14 @@ export default function Globe({ property, cesiumIonAccessToken }: Props): JSX.El
     cesiumIonAccessToken,
   ]);
 
+  const baseColor = useMemo(
+    () => toColor(property?.atmosphere?.globeBaseColor),
+    [property?.atmosphere?.globeBaseColor],
+  );
+
   return (
     <CesiumGlobe
+      baseColor={baseColor}
       enableLighting={!!property?.atmosphere?.enable_lighting}
       showGroundAtmosphere={property?.atmosphere?.ground_atmosphere ?? true}
       atmosphereSaturationShift={property?.atmosphere?.surturation_shift}
diff --git a/web/src/beta/lib/core/engines/Cesium/hooks.ts b/web/src/beta/lib/core/engines/Cesium/hooks.ts
index 33ade9cf47..42e515cbda 100644
--- a/web/src/beta/lib/core/engines/Cesium/hooks.ts
+++ b/web/src/beta/lib/core/engines/Cesium/hooks.ts
@@ -166,7 +166,7 @@ export default ({
     shadowMap.darkness = property?.atmosphere?.shadowDarkness ?? 0.3;
     shadowMap.size = property?.atmosphere?.shadowResolution ?? 2048;
     shadowMap.fadingEnabled = true;
-    shadowMap.maximumDistance = 5000;
+    shadowMap.maximumDistance = property?.atmosphere?.shadowMaximumDistance ?? 5000;
     shadowMap.normalOffset = true;
 
     // bias
@@ -222,6 +222,7 @@ export default ({
     property?.atmosphere?.softShadow,
     property?.atmosphere?.shadowDarkness,
     property?.atmosphere?.shadowResolution,
+    property?.atmosphere?.shadowMaximumDistance,
   ]);
 
   useEffect(() => {
diff --git a/web/src/beta/lib/core/engines/Cesium/index.tsx b/web/src/beta/lib/core/engines/Cesium/index.tsx
index fab4fbe028..879bcff2c2 100644
--- a/web/src/beta/lib/core/engines/Cesium/index.tsx
+++ b/web/src/beta/lib/core/engines/Cesium/index.tsx
@@ -13,6 +13,7 @@ import {
   ScreenSpaceCameraController,
   Entity,
   PolylineGraphics,
+  Moon,
 } from "resium";
 
 import type { Engine, EngineProps, EngineRef } from "..";
@@ -193,7 +194,12 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
         density={property?.atmosphere?.fog_density}
       />
       <Sun show={property?.atmosphere?.enable_sun ?? true} />
-      <SkyAtmosphere show={property?.atmosphere?.sky_atmosphere ?? true} />
+      <Moon show={property?.atmosphere?.enableMoon} />
+      <SkyAtmosphere
+        show={property?.atmosphere?.sky_atmosphere ?? true}
+        saturationShift={property?.atmosphere?.skyboxSurturationShift}
+        brightnessShift={property?.atmosphere?.skyboxBrightnessShift}
+      />
       <Globe property={property} cesiumIonAccessToken={cesiumIonAccessToken} />
       <featureContext.Provider value={context}>{ready ? children : null}</featureContext.Provider>
       <AmbientOcclusion