WordPress 3D Viewer Pro: OBJ & FBX

##Features
Supported Formats: View .obj and .fbx models, with optional .mtl material files for OBJ models.
Interactive Controls:
Upload Model: Allows users to upload .obj or .fbx files directly into the viewer.
Toggle Wireframe: Switch between normal and wireframe views for better visualization of model structure.
Camera Reset: Return the camera to the default viewing position.
Rotation and Zoom Controls: Rotate models on the X, Y, and Z axes and zoom in/out.
Background and Model Color Pickers: Change the background color of the viewer and apply colors to the model.
Height Adjustment: Dynamically adjust the viewer height for responsive design.
Lighting Controls: Adjust ambient and directional lights, including light color and intensity.
Rotation Display: Shows the model’s current rotation angles in real-time.
Screenshot Capture: Take a snapshot of the current view.
Fullscreen Mode: Switch to fullscreen for an immersive viewing experience.
Built with Three.js: Utilizes Three.js’s advanced rendering capabilities along with OrbitControls, OBJLoader, MTLLoader, and FBXLoader for high-quality 3D rendering and manipulation.
Installation
Download or clone this repository.
Upload the 3d-viewer-enhanced folder to your WordPress wp-content/plugins directory.
Activate the plugin from your WordPress Dashboard under Plugins.
Usage

##To display a 3D model, use the shortcode in your posts, pages, or widgets:

three_d_viewer_enhanced id=”viewer1″ model_url=”URL_TO_MODEL.obj” mtl_url=”URL_TO_MTL.mtl”
three_d_viewer_enhanced model_url=”URL_TO_MODEL.obj” mtl_url=”URL_TO_MTL.mtl”

Replace URL_TO_MODEL.obj with the direct URL to the OBJ or FBX file you want to display, and URL_TO_MTL.mtl with the MTL file if applicable.

Shortcode Parameters
model_url (required): URL to the 3D model file (either .obj or .fbx).
mtl_url (optional): URL to the .mtl material file (for OBJ models only).
Example Shortcode
three_d_viewer_enhanced model_url=”https://example.com/models/model.obj” mtl_url=”https://example.com/models/materials.mtl”

##Controls Overview

After embedding the shortcode, the following interactive controls will appear in the viewer:

Upload Model: Allows users to upload their own .obj or .fbx files.
Wireframe Toggle: Toggle between wireframe and solid modes.
Reset Camera: Resets the camera to the default position.
Zoom Slider: Allows zooming in and out.
Rotate X, Y, Z Buttons: Incrementally rotates the model along each axis.
Background Color Picker: Changes the viewer background color.
Model Color Picker: Changes the color of the model.
Height Slider: Adjusts the height of the viewer dynamically.
Light Intensity and Color Controls: Adjust light intensity and color for ambient and directional lights.
Reset Model: Resets model rotation and scale.
Toggle Ambient and Directional Light: Shows or hides different light sources.
Screenshot Button: Captures a screenshot of the viewer.
Fullscreen Button: Switches the viewer to fullscreen mode.

##Notes
The plugin relies on Three.js and several loaders (OBJLoader, MTLLoader, FBXLoader, and OrbitControls). Ensure all necessary scripts are included for the viewer to function.
If models are not loading, confirm that URLs are correct and accessible, and check the browser console for any error messages.
Changelog
v1.4
Added support for real-time rotation display.
Added height adjustment control.
Improved background and model color picker.
Added additional lighting control options (color and intensity).
Enhanced UI responsiveness for a more seamless user experience.

## File Structure

3d-viewer-enhanced/
├── css/
│ └── viewer.css # CSS file for styling the viewer and controls
├── js/
│ ├── viewer.js # Main JavaScript file for 3D model loading and controls
│ ├── loaders/
│ │ ├── OBJLoader.js # Three.js OBJ loader for loading .obj models
│ │ ├── MTLLoader.js # Three.js MTL loader for loading .mtl files (materials for OBJ models)
│ │ ├── FBXLoader.js # Three.js FBX loader for loading .fbx models
│ │ ├── DRACOLoader.js # Three.js Draco loader for loading compressed models
│ │ └── OrbitControls.js # Three.js OrbitControls for camera interaction
├── images/
│ └── icon.png # Icon for the plugin (optional, for WordPress dashboard)
├── 3d-viewer-enhanced.php # Main plugin file with WordPress hooks and shortcode definition
└── README.md # Readme file with details about the plugin, installation, and usage