Skip to content

Enhance InspectPane #23

New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Open
wants to merge 2 commits into
base: dev
Choose a base branch
from
Open

Enhance InspectPane #23

wants to merge 2 commits into from

Conversation

jb0gie
Copy link

@jb0gie jb0gie commented Jan 31, 2025

Description

Enhanced the InspectPane component with several improvements to tooltips and transform controls:

  1. Added tooltips (hypertips) for Lock and Preload buttons:

    • Lock tooltip explains "Lock position, rotation and scale. Prevents accidental changes."
    • Preload tooltip explains "Load this object before the world loads. Useful for frequently used objects."
    • Preload tooltip appears on the right side for better visibility
    • Tooltips use consistent gradient styling with the existing Transform tooltip
  2. Fixed transform controls behavior when app is frozen:

    • Made transform behavior consistent by blocking all transform changes (position, rotation, scale) when app is locked
    • Properly handling the frozen state through network updates
    • Fixed the frozen key handling in the modify function
  3. Enhanced DraggableNumberInput component:

    • Added support for mathematical expressions
    • Improved keyboard controls with arrow key support
    • Added Shift key modifier for fine control
    • Added proper cursor feedback for drag operations

Fixes issues with inconsistent locking behavior and improves overall UX with better tooltips and transform controls.

Type of change

  • Bug fix (non-breaking change which fixes a component issue)
  • Component enhancement

How Has This Been Tested?

  • Component functionality tests

    • Verified tooltip appearance and positioning
    • Tested transform controls in both locked and unlocked states
    • Tested mathematical expression input in transform fields
    • Verified keyboard controls and modifier keys
    • Tested network synchronization of frozen state
  • Integration tests with other Hyperfy components

    • Verified interaction between InspectPane and world state
    • Tested network synchronization between clients

Test Configuration:

  • Hyperfy Version: Current
  • Test world setup: Standard development environment
  • Browser(s): Chrome, Firefox
  • Node.js version: Current

Checklist:

  • My code follows Hyperfy's component architecture
  • I have performed a self-review
  • I have documented the component's usage
  • I have tested the component in multiple scenarios
  • My changes maintain compatibility with existing worlds
  • I have updated the component documentation if needed
brave_88fjh7XMZZ.mp4

- Implemented app freezing functionality to prevent movement, rotation, and scaling
- Added copy/paste controls for transform fields (position, rotation, scale)
- Introduced draggable number inputs with Ctrl+drag and Shift fine control
- Enhanced Fields component to support Vector3 and Euler transform types
- Added reset transform button and tooltip for transform controls
- Added support for pasting and dropping URLs and files (GLB, VRM, JS, HYPE, JSON)
- Implemented context menu actions for copying GLB URL and downloading object JSON
- Added new methods to handle various file types and create objects dynamically
- Enhanced ClientEditor with improved file processing and error handling
- Added paste event listener for seamless object creation
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant