@tomorrowevening/hermes 0.0.37 → 0.0.39

package/src/editor/sidePanel/inspector/inspector.scss

@@ -1,161 +0,0 @@
-$icon_folder: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAAB1CAYAAADN5fjJAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAzklEQVR4nO3bwQqCUBBA0Yz+/5dt1eYRkVfKWZyzUgi5zEJSxm3f99tU96sDPhFXiavEVeIqcZW4anTcYzmf8P9pex2Mnpy4Slwlrhodt96Et7e/usjoyYmrxFXiKnGVuEpcJa4SV4mrxFXiKnGVuEpcJa4SV4mrxFXiKnGVuEpcJa4SV4mrxFXiqtFx69LLUd9sKuZFmtGTE1eJq8RV4ipx1T+2+o9e01b/aeIqcZW46uxWvweckcRV4ipxlbhqdNzZl4c//cJu9ORGxz0BUl8I9T4qXncAAAAASUVORK5CYII=');
-
-#Inspector {
-  .field {
-    align-items: center;
-    background-color: #222;
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    min-height: 21px;
-    overflow: hidden;
-    padding: 1px;
-    position: relative;
-    
-    label {
-      line-height: normal;
-      margin: 0 10px;
-      max-width: 180px;
-      user-select: none;
-      width: fit-content;
-      min-width: 20px;
-      text-align: center;
-    }
-
-    input {
-      block-size: 11px;
-      flex: 1%;
-      margin: 0;
-      padding: 4px;
-      outline: none;
-      &.min {
-        height: 11px;
-        flex: none;
-        width: 30px;
-        margin-right: 1px;
-      }
-      &.color {
-        flex: none;
-        width: 60px;
-      }
-    }
-
-    input[type='checkbox'] {
-      flex: none;
-    }
-
-    input[type='color'] {
-      block-size: revert;
-      height: 21px;
-      padding-block: revert;
-      padding: 0;
-      margin: 0;
-    }
-
-    input[type='number'], input[type='range'] {
-      appearance: none;
-      height: 11px;
-    }
-
-    input[type='range']::-webkit-slider-runnable-track {
-      border: none;
-    }
-
-    input[type='range']::-webkit-slider-thumb {
-      appearance: none;
-      background-color: #666;
-      height: 17px;
-      width: 17px;
-      transition: 0.2s linear background-color;
-      &:hover {
-        background-color: #999;
-      }
-    }
-
-    textarea {
-      background-color: #191919;
-      font-size: 10px;
-    }
-
-    img {
-      border: 1px dotted #333;
-      cursor: pointer;
-      object-fit: cover;
-      max-width: 100%;
-      min-width: 50px;
-      min-height: 50px;
-      max-height: 100px;
-      width: 100%;
-      position: relative;
-      left: 50%;
-      transform: translateX(-50%);
-    }
-
-    button {
-      background-color: #333;
-      border-top: 1px dotted #444;
-      height: 100%;
-      margin: 0;
-      padding: 0;
-      text-align: center;
-      transition: 0.2s background-color linear;
-      width: 100%;
-      &:hover {
-        background-color: #444;
-      }
-    }
-
-    &.block {
-      label {
-        display: block;
-        line-height: 21px;
-        max-width: 100%;
-        width: 100%;
-      }
-    }
-
-    select {
-      background-color: #222;
-      border: 1px solid #333;
-      font-size: 12px;
-      padding: 1px 5px;
-      position: absolute;
-      right: 4px;
-    }
-  }
-
-  .group {
-    background-color: #191919;
-    margin: 2px 0;
-    h4 {
-      display: inline;
-      font-weight: bold;
-      pointer-events: none;
-      width: fit-content;
-    }
-    .toggleBtn {
-      background-color: #191919;
-      background-image: $icon_folder;
-      background-position: 1px 1px;
-      background-repeat: no-repeat;
-      background-size: 15px 45px;
-      display: inline-block;
-      height: 15px;
-      opacity: 0.8;
-      overflow: hidden;
-      margin: 0 0 0 5px;
-      padding-left: 20px;
-      width: calc(100% - 7px);
-      transition: all 0.15s linear;
-      &:hover {
-        background-color: #222;
-        opacity: 1;
-      }
-    }
-    .fieldItems {
-      border-top: 1px dotted #333;
-      overflow-y: auto;
-      user-select: none;
-    }
-  }
-}

package/src/editor/sidePanel/inspector/utils/InspectAnimation.tsx

@@ -1,102 +0,0 @@
-import { AnimationMixer } from 'three';
-import RemoteThree from '@/core/remote/RemoteThree';
-import InspectorGroup from '../InspectorGroup';
-import { AnimationClipInfo, RemoteObject } from '../../types';
-
-export default function InspectAnimation(obj: RemoteObject, three: RemoteThree) {
-  const items: any[] = [];
-  const animations: any[] = [];
-  let maxDuration = 0;
-  obj.animations.forEach((clipInfo: AnimationClipInfo) => {
-    // Add animation
-    maxDuration = Math.max(maxDuration, clipInfo.duration);
-    if (clipInfo.duration > 0) {
-      animations.push({
-        title: clipInfo.name,
-        items: [
-          {
-            title: 'Duration',
-            type: 'number',
-            value: clipInfo.duration,
-            disabled: true,
-          },
-          {
-            title: 'Blend Mode',
-            type: 'option',
-            disabled: true,
-            options: [
-              {
-                title: 'Normal',
-                value: 2500,
-              },
-              {
-                title: 'Additive',
-                value: 2501,
-              },
-            ],
-          }
-        ]
-      });
-    }
-  });
-  items.push({
-    title: 'Animations',
-    items: animations
-  });
-
-  const child = three.scene?.getObjectByProperty('uuid', obj.uuid);
-  let hasMixer = false;
-  if (child !== undefined) {
-    const mixer = child['mixer'] as AnimationMixer;
-    hasMixer = mixer !== undefined;
-    if (hasMixer) {
-      const mixerItems: any[] = [
-        {
-          title: 'Time Scale',
-          type: 'range',
-          value: mixer.timeScale,
-          step: 0.01,
-          min: -1,
-          max: 2,
-          onChange: (_: string, value: any) => {
-            mixer.timeScale = value;
-            three.updateObject(obj.uuid, 'mixer.timeScale', value);
-          },
-        },
-      ];
-      // animations.forEach((animation: any, index: number) => {
-      //   if (obj.animations[index].duration > 0) {
-      //     mixerItems.push({
-      //       title: `Play: ${animation.title}`,
-      //       type: 'button',
-      //       onChange: () => {
-      //         // Stop Previous
-      //         mixer.stopAllAction();
-      //         three.requestMethod(obj.uuid, 'stopAllAction', undefined, 'mixer');
-
-      //         //
-      //         const clip = child.animations[index] as AnimationClip;
-      //         const action = mixer.clipAction(clip);
-      //         action.play();
-      //       }
-      //     });
-      //   }
-      // });
-      mixerItems.push({
-        title: 'Stop All',
-        type: 'button',
-        onChange: () => {
-          mixer.stopAllAction();
-          three.requestMethod(obj.uuid, 'stopAllAction', undefined, 'mixer');
-        }
-      });
-      items.push({
-        title: 'Mixer',
-        items: mixerItems
-      });
-    }
-  }
-  return (
-    <InspectorGroup title='Animation' items={items} />
-  );
-}

package/src/editor/sidePanel/inspector/utils/InspectCamera.tsx

@@ -1,75 +0,0 @@
-import RemoteThree from '@/core/remote/RemoteThree';
-import InspectorGroup from '../InspectorGroup';
-import { RemoteObject } from '../../types';
-import { setItemProps } from '../../utils';
-
-function prettyName(name: string): string {
-  switch (name) {
-    case 'fov': return 'FOV';
-    case 'zoom': return 'Zoom';
-    case 'near': return 'Near';
-    case 'far': return 'Far';
-    case 'focus': return 'Focus';
-    case 'aspect': return 'Aspect';
-    case 'filmGauge': return 'Film Gauge';
-    case 'filmOffset': return 'Film Offset';
-    case 'left': return 'Left';
-    case 'right': return 'Right';
-    case 'top': return 'Top';
-    case 'bottom': return 'Bottom';
-  }
-  return name;
-}
-
-export function InspectCamera(object: RemoteObject, three: RemoteThree): any {
-  const items: any[] = [];
-
-  if (object.perspectiveCameraInfo !== undefined) {
-    for (const i in object.perspectiveCameraInfo) {
-      items.push({
-        title: prettyName(i),
-        prop: i,
-        type: 'number',
-        step: 0.01,
-        value: object.perspectiveCameraInfo[i],
-        onChange: (prop: string, value: any) => {
-          three.updateObject(object.uuid, prop, value);
-          three.requestMethod(object.uuid, 'updateProjectionMatrix');
-
-          const child = three.scene?.getObjectByProperty('uuid', object.uuid);
-          if (child !== undefined) {
-            setItemProps(child, prop, value);
-            child['updateProjectionMatrix']();
-          }
-        }
-      });
-    }
-  } else if (object.orthographicCameraInfo !== undefined) {
-    for (const i in object.orthographicCameraInfo) {
-      items.push({
-        title: prettyName(i),
-        prop: i,
-        type: 'number',
-        step: 0.01,
-        value: object.perspectiveCameraInfo![i],
-        onChange: (prop: string, value: any) => {
-          three.updateObject(object.uuid, prop, value);
-          three.requestMethod(object.uuid, 'updateProjectionMatrix');
-
-          const child = three.scene?.getObjectByProperty('uuid', object.uuid);
-          if (child !== undefined) {
-            setItemProps(child, prop, value);
-            child['updateProjectionMatrix']();
-          }
-        }
-      });
-    }
-  }
-
-  return (
-    <InspectorGroup
-      title='Camera'
-      items={items}
-    />
-  );
-}

package/src/editor/sidePanel/inspector/utils/InspectLight.tsx

@@ -1,62 +0,0 @@
-import { Color } from 'three';
-import RemoteThree from '@/core/remote/RemoteThree';
-import InspectorGroup from '../InspectorGroup';
-import { RemoteObject } from '../../types';
-import { setItemProps } from '../../utils';
-
-function prettyName(value: string): string {
-  switch (value) {
-    case 'color': return 'Color';
-    case 'intensity': return 'Intensity';
-    case 'decay': return 'Decay';
-    case 'distance': return 'Distance';
-    case 'angle': return 'Angle';
-    case 'penumbra': return 'Penumbra';
-    case 'groundColor': return 'Ground Color';
-  }
-  return value;
-}
-
-export function InspectLight(obj: RemoteObject, three: RemoteThree) {
-  const items: any[] = [];
-  if (obj.lightInfo !== undefined) {
-    for (const i in obj.lightInfo) {
-      const value = obj.lightInfo[i];
-      if (value === undefined) continue;
-
-      if (value.isColor !== undefined) {
-        items.push({
-          title: prettyName(i),
-          prop: i,
-          type: 'color',
-          value: value,
-          onChange: (prop: string, value: any) => {
-            const color = new Color(value);
-            three.updateObject(obj.uuid, prop, color);
-            const child = three.scene?.getObjectByProperty('uuid', obj.uuid);
-            if (child !== undefined) setItemProps(child, prop, color);
-          }
-        });
-      } else {
-        items.push({
-          title: prettyName(i),
-          prop: i,
-          type: typeof value,
-          value: value,
-					step: typeof value === 'number' ? 0.01 : undefined,
-          onChange: (prop: string, value: any) => {
-						three.updateObject(obj.uuid, prop, value);
-            const child = three.scene?.getObjectByProperty('uuid', obj.uuid);
-            if (child !== undefined) setItemProps(child, prop, value);
-          }
-        });
-      }
-    }
-  }
-  return (
-    <InspectorGroup
-      title='Light'
-      items={items}
-    />
-  );
-}