diff --git a/blocks/three-object-block/Edit.js b/blocks/three-object-block/Edit.js
index 9127305..004aa28 100644
--- a/blocks/three-object-block/Edit.js
+++ b/blocks/three-object-block/Edit.js
@@ -68,6 +68,7 @@ export default function Edit( { attributes, setAttributes, isSelected } ) {
const ALLOWED_MEDIA_TYPES = [
'model/gltf-binary',
'application/octet-stream',
+ 'model/vnd.usdz+zip'
];
const MyDropZone = () => {
diff --git a/blocks/three-object-block/components/ThreeObjectEdit.js b/blocks/three-object-block/components/ThreeObjectEdit.js
index e21206c..5e1b2ce 100644
--- a/blocks/three-object-block/components/ThreeObjectEdit.js
+++ b/blocks/three-object-block/components/ThreeObjectEdit.js
@@ -1,4 +1,5 @@
import * as THREE from 'three';
+import { USDZLoader } from 'three/examples/jsm/loaders/USDZLoader';
import React, { Suspense, useRef, useState, useEffect } from 'react';
import { Canvas, useLoader, useFrame, useThree } from '@react-three/fiber';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
@@ -14,6 +15,7 @@ import { GLTFAudioEmitterExtension } from 'three-omi';
function ThreeObject( props ) {
const [ url, set ] = useState( props.url );
+ const {scene} = useThree();
useEffect( () => {
setTimeout( () => set( props.url ), 2000 );
}, [] );
@@ -23,6 +25,14 @@ function ThreeObject( props ) {
camera.add( listener );
} );
+ // USDZ loader.
+ if(props.url.split(/[#?]/)[0].split('.').pop().trim() === "usdz") {
+
+ const usdz = useLoader( USDZLoader, url);
+
+ return ;
+ }
+
const gltf = useLoader( GLTFLoader, url, ( loader ) => {
loader.register(
( parser ) => new GLTFAudioEmitterExtension( parser, listener )
@@ -31,10 +41,8 @@ function ThreeObject( props ) {
return new VRMLoaderPlugin( parser );
- } );
-
+ } );
} );
-
const { actions } = useAnimations( gltf.animations, gltf.scene );
const animationList = props.animations ? props.animations.split( ',' ) : '';
@@ -58,6 +66,7 @@ function ThreeObject( props ) {
vrm.scene.scale.set( props.scale, props.scale, props.scale );
return ;
}
+
gltf.scene.position.set( 0, props.positionY, 0 );
gltf.scene.rotation.set( 0, props.rotationY, 0 );
gltf.scene.scale.set( props.scale, props.scale, props.scale );
diff --git a/blocks/three-object-block/components/ThreeObjectFront.js b/blocks/three-object-block/components/ThreeObjectFront.js
index 6911287..95f6b5a 100644
--- a/blocks/three-object-block/components/ThreeObjectFront.js
+++ b/blocks/three-object-block/components/ThreeObjectFront.js
@@ -3,6 +3,7 @@ import React, { Suspense, useRef, useState, useEffect } from 'react';
import { Canvas, useLoader, useFrame, useThree } from '@react-three/fiber';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
import { Physics, RigidBody } from "@react-three/rapier";
+import { USDZLoader } from 'three/examples/jsm/loaders/USDZLoader';
import {
OrthographicCamera,
@@ -30,6 +31,14 @@ function SavedObject( props ) {
camera.add( listener );
} );
+ // USDZ loader.
+ if(props.url.split(/[#?]/)[0].split('.').pop().trim() === "usdz") {
+
+ const usdz = useLoader( USDZLoader, url);
+
+ return ;
+ }
+
const gltf = useLoader( GLTFLoader, url, ( loader ) => {
loader.register(
( parser ) => new GLTFAudioEmitterExtension( parser, listener )
diff --git a/inc/functions.php b/inc/functions.php
index 8e5926f..e9291ef 100644
--- a/inc/functions.php
+++ b/inc/functions.php
@@ -37,9 +37,9 @@ function threeobjectviewer_enqueue_threeobjectloaderinit() {
);
}
-add_filter('upload_mimes', 'threeobjectviewer_add_file_types_to_uploads', 1, 1);
+add_filter('upload_mimes', __NAMESPACE__ . '\threeobjectviewer_add_file_types_to_uploads', 10, 4);
/**
-* Adds glb and vrm types to allowed uploads.
+* Adds glb vrm and usdz types to allowed uploads.
*/
function threeobjectviewer_add_file_types_to_uploads($file_types){
$new_filetypes = array();
@@ -47,31 +47,25 @@ function threeobjectviewer_add_file_types_to_uploads($file_types){
// $new_filetypes['glb'] = 'model/gltf-binary';
$new_filetypes['glb'] = 'application/octet-stream';
$new_filetypes['vrm'] = 'application/octet-stream';
- $file_types = array_merge($file_types, $new_filetypes );
- return $file_types;
+ $new_filetypes['usdz'] = 'model/vnd.usdz+zip';
+ return $new_filetypes;
}
-add_filter('wp_check_filetype_and_ext', __NAMESPACE__ . '\threeobjectviewer_checkfiletypes', 10, 4);
-/**
- * Check the filetypes
- */
-function threeobjectviewer_checkfiletypes($data, $file, $filename, $mimes) {
- if (!$data['type']) {
- $wp_filetype = wp_check_filetype($filename, $mimes);
- $ext = $wp_filetype['ext'];
- $type = $wp_filetype['type'];
- $proper_filename = $filename;
- if ($type && 0 === strpos($type, 'model/') && $ext !== 'glb') {
- $ext = $type = false;
- }
- if ($type && 0 === strpos($type, 'model/') && $ext !== 'vrm') {
- $ext = $type = false;
- }
- $data['ext'] = $ext;
- $data['type'] = $type;
- $data['proper_filename'] = $proper_filename;
+add_filter( 'wp_check_filetype_and_ext', __NAMESPACE__ . '\three_object_viewer_check_for_usdz', 10, 4 );
+function three_object_viewer_check_for_usdz( $types, $file, $filename, $mimes ) {
+ if ( false !== strpos( $filename, '.usdz' ) ) {
+ $types['ext'] = 'usdz';
+ $types['type'] = 'model/vnd.usdz+zip';
+ }
+ if ( false !== strpos( $filename, '.glb' ) ) {
+ $types['ext'] = 'glb';
+ $types['type'] = 'application/octet-stream';
+ }
+ if ( false !== strpos( $filename, '.vrm' ) ) {
+ $types['ext'] = 'vrm';
+ $types['type'] = 'application/octet-stream';
}
- return $data;
+ return $types;
}
add_action('wp_enqueue_scripts', __NAMESPACE__ . '\threeobjectviewer_frontend_assets');
diff --git a/package.json b/package.json
index 0cc79ba..b7eb1f5 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "@antpb/three-object-viewer",
"private": true,
- "version": "0.6.0",
+ "version": "0.6.2",
"license": "GPL-2.0-or-later",
"main": "build/index.js",
"scripts": {
@@ -30,7 +30,7 @@
"@wordpress/components": "^14",
"@wordpress/element": "^3",
"@wordpress/i18n": "^4",
- "three": "^0.137.2",
+ "three": "0.144.0",
"three-omi": "^0.1.5"
}
}
diff --git a/readme.txt b/readme.txt
index 233f18d..d01fbdd 100644
--- a/readme.txt
+++ b/readme.txt
@@ -2,7 +2,7 @@
Requires at least: 5.7
Tested up to: 6.0
Requires PHP: 7.2
-Stable tag: 0.6.1
+Stable tag: 0.6.2
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Author: antpb
@@ -44,6 +44,12 @@ It can also be installed manually using a zip file.
== Changelog ==
+= 0.6.2 =
+
+* Adds USDZ support to block (note, usdz files must not contain usdc files)
+* Updates Three.js to 144
+* Allows uploads of usdz files
+
= 0.6.1 =
* Update rigibody types for vr objects. Sorry for the bouncy files! :)
diff --git a/three-object-viewer.php b/three-object-viewer.php
index e9f7d4e..b8c5a81 100644
--- a/three-object-viewer.php
+++ b/three-object-viewer.php
@@ -3,7 +3,7 @@
* Plugin Name: Three Object Viewer
* Plugin URI: https://3ov.xyz/
* Description: A plugin for viewing 3D files with support for WebXR and Open Metaverse Interoperability GLTF Extensions.
-* Version: 0.6.1
+* Version: 0.6.2
* Requires at least: 5.7
* Requires PHP: 7.1.0
* Author: antpb
diff --git a/yarn.lock b/yarn.lock
index 8bba3f3..3644942 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11220,10 +11220,10 @@ three-stdlib@^2.8.6, three-stdlib@^2.8.9:
potpack "^1.0.1"
zstddec "^0.0.2"
-three@^0.137.2:
- version "0.137.5"
- resolved "https://registry.yarnpkg.com/three/-/three-0.137.5.tgz#a1e34bedd0412f2d8797112973dfadac78022ce6"
- integrity sha512-rTyr+HDFxjnN8+N/guZjDgfVxgHptZQpf6xfL/Mo7a5JYIFwK6tAq3bzxYYB4Ae0RosDZlDuP+X5aXDXz+XnHQ==
+three@0.144.0:
+ version "0.144.0"
+ resolved "https://registry.yarnpkg.com/three/-/three-0.144.0.tgz#2818517169f8ff94eea5f664f6ff1fcdcd436cc8"
+ integrity sha512-R8AXPuqfjfRJKkYoTQcTK7A6i3AdO9++2n8ubya/GTU+fEHhYKu1ZooRSCPkx69jbnzT7dD/xEo6eROQTt2lJw==
throat@^5.0.0:
version "5.0.0"