dragend
Replaced a placeholder console.log with a concrete implementation of the
`updateElementLocation` function in the `startModifyElement` event
listener. This function calculates a new angular position (`theta`)
based on the element's offset after dragging it in the editor and
updates the element's `theta-start` attribute accordingly. This change
leads to a more dynamic and interactive user experience in the editor by
allowing users to reposition elements visually and have those changes
reflected immediately.
Correctly set the value for the Teleport option in the element creation
form, ensuring that elements are correctly classified. Enhanced dynamic
data fetching for scenes and categories to populate the destination
dropdown based on the scene's category, improving user experience in
specifying teleport destinations. Resolved an issue with event
propagation by explicitly setting the button type for dropdown items,
preventing form submission on selection. This change streamlines the
process of creating teleport elements and selecting destinations within
the editor, making it more intuitive and error-free.
- Removed outdated TODO comment related to element drags handling.
- Removed unused rotation input fields for a cleaner UI.
- Added conversion function `thetaToCartesian` for future
functionalities.
Wrapped element creation and modification properties sections in a div
with a `hide` class, which can now be toggled via a keyboard shortcut
(Ctrl+Shift+Q). This debug mode allows developers to easily view and
hide debugging information about elements being created or modified in
the editor. This enhancement is aimed at improving the development and
troubleshooting process by providing quick access to relevant debug
information without cluttering the UI for users.
Additionally, a new function `toggleDebugVisibility` was added to manage
the visibility of debug information, and a keyboard event listener was
implemented to handle the specified keyboard shortcut.
This update aims to balance the need for detailed debugging information
during development with a clean, user-friendly interface during regular
use.
Refined the `createElementPropertiesForm` in the editor to include
position and rotation inputs, improving user interaction for specifying
these attributes. Simplified the function's parameters by removing
unnecessary event and thetaStart arguments, streamlining the codebase.
Also corrected the naming of `destination_x`, `destination_y`, and
`destination_z` input names for consistency. Marked handling of unknown
element types with a TODO to prompt future development. This enhancement
allows for more precise control over element positioning and
orientation, directly impacting user experience positively.
Enhanced UI element visibility and interaction across the editor and
scene components. By switching to classList manipulation for showing and
hiding UI elements, the approach aligns better with modern best
practices, ensuring smooth transitions and consistency in user
experience. The addition of `!important` in the CSS for the `.hide`
class guarantees the override of conflicting styles, addressing
potential visibility issues. Adjustments in HTML formatting enhance
readability and maintainability without altering functionality. This
change, while seemingly minor, significantly improves the user's ability
to intuitively navigate and interact with the UI, potentially reducing
frustration and increasing overall user satisfaction.
Replaced multiple specific functions for creating MarkerElement,
ImageElement, and TeleportElement forms in the editor with a single,
switch-based function titled createElementPropertiesForm. This
enhancement consolidates form generation logic, reducing redundancy and
improving maintainability. It dynamically generates input fields based
on the element type selected, simplifying future extensions or
modifications to element properties. Additionally, this refactoring
ensures a more consistent user experience by uniform handling of
different element types during creation and modification.
The new approach allows for easier addition of new element types and
their corresponding inputs, adhering to the DRY principle and promoting
code readability.
drag
Introduce enhanced drag-and-drop capabilities for elements within the
editor. This enhancement includes setting elements to be draggable upon
interaction and capturing their final position post-drag. This change
aims to improve the user experience by providing a more intuitive and
direct way to position elements within the editor environment.
Additionally, the removal of the universal "click-drag" attribute
assignment from all entities (except "A-SKY") during the loading phase
streamlines the initial setup by applying the attribute selectively,
based on user interaction, which may improve performance and reduce
unnecessary processing.
The package.json file has been updated to reflect the "Private.coffee
Team" as the project's author, signaling a formal acknowledgment of the
development team's contribution and ownership.
skybox handling
Introduced the @kumitterer/aframe-click-drag-component for enhanced
interaction within the VR editor, enabling objects to be click-draggable
except for the skybox element. This selective application of click-drag
functionality enriches user experience by preserving the intended static
background. Additionally, refactored the A-Frame dependency management,
ensuring a coherent and up-to-date project structure.
- Upgraded and consolidated A-Frame imports across JavaScript files for
consistency.
- Excluded the "A-SKY" element from click-drag attributes to avoid
unintended interactions with the scene background.
- Added deep-equal package for enhanced object comparison
functionalities.
This update aims to streamline user interactions within 3D scenes,
offering more intuitive and immersive navigation capabilities.
Adding dynamic form rendering in the editor for marker, image, and
teleport elements. Now, when creating a new element, a form is
dynamically generated based on the element type selected. This
enhancement improves the user experience by providing a tailored
interface for inputting properties specific to each type of element,
such as title, text for markers, and file upload for images. This update
streamlines the creation process and ensures users have a clear,
context-specific set of fields when adding new elements to their
projects.
Adjusted the modal content in the editor's JavaScript to dynamically
update based on the type of element being created, improving user
interaction and feedback during the element creation process. The change
includes fixing incorrect references to modal labels and contents,
adding CSRF token support for form submissions, and dynamically
showing/hiding buttons based on the context of the element creation.
Additionally, event listeners are set up to handle different element
types (Marker, Image, Teleport), further enhancing the user experience
by tailoring the UI to the selected element type. This update aims to
make the editor more intuitive and responsive to user actions, reducing
potential confusion and improving the flow of creating various types of
elements within the application.
This commit overhauls the user area with the addition of comprehensive
file upload capabilities for images and videos. Notably, it integrates
front-end enhancements for drag-and-drop uploads in the user area and
introduces a secure back-end handling process. The back-end adjustments
include a new media upload view and adjustments to image and video
models to support large file handling through settings for maximum image
pixel limits. Additionally, the refactor standardizes CSRF token
retrieval across JavaScript modules, improving security and code
maintainability.
- Front-end additions include detailed user feedback during the file
upload process, such as progress bars and success/error indicators.
- Back-end improvements ensure large image files are processed
efficiently, mitigating potential memory issues by configuring a maximum
image pixel threshold.
- Consolidating the CSRF token retrieval into the `api.js` module
centralizes security mechanisms, reducing redundancy and enhancing the
codebase's clarity.
Overall, these changes enrich the platform's media management
capabilities, bolster security practices, and improve user experience
through intuitive interface updates and robust back-end processing.
Introduced a new CSS file for styling a fixed navbar in scenes,
enhancing user navigation within the virtual environment. Modified
scene.js to include fetching categories and generating a navbar with
scene options dynamically based on the category of the current scene.
This allows users to switch scenes more intuitively. The `nonavbar`
attribute was added for scenes where the navbar should be omitted,
providing flexibility in scene presentation. Additionally, streamlined
CSS and SCSS imports across JS files for consistency and removed an
unnecessary SCSS import from editor.js, optimizing load times and
project structure.
This update significantly improves user experience by facilitating
easier navigation and scene exploration within the application.
Implemented a new function to fetch the CSRF token from cookies in the
editor's JavaScript. This ensures secure AJAX requests by validating the
client's sessions, enhancing the application's security against
cross-site request forgery attacks. The addition is a crucial step
towards securing forms and API calls within the editor environment.
Migrated the SCSS import for the frontend directly into editor.js and
userarea.js from frontend.js, removing redundancy by consolidating style
imports. This adjustment enables more coherent management of SCSS files
and removes the need for a separate frontend bundle. Consequently,
frontend.js and its references in HTML templates were removed to clean
up the codebase and simplify the asset pipeline. These changes should
make future maintenance of CSS easier and improve load times by reducing
unnecessary scripting and network requests.
Introduced significant updates to the user interface for editing VR
scenes, adding new CSS styles for a coherent and modern look.
Implemented data tables for robust content management in the user area,
now users can easily navigate through scenes and media with DataTables
integration. Expanded the API with category retrieval capabilities,
enabling dynamic content categorization.
The editor now seamlessly integrates into the UI with a sidebar for
properties editing, improving usability. The teleportation element
creation and modification logic has been significantly refined,
including a search-enabled dropdown for destination selection, making it
more user-friendly. Added thumbnail display for scenes and media in the
user area, enhancing content overview.
This update also introduced user area templates and routes, providing a
foundational structure for user content management functionality,
including categories and individual category views.
Refactored JavaScript imports to align with the new editor CSS and
adjusted scene loading to support embedded scenes, improving the
flexibility and usability of scene components.
