@reactvision/react-viro 2.41.3 → 2.41.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +14 -6
- package/components/AR/ViroARPlaneSelector.tsx +19 -10
- package/components/Utilities/ViroVersion.ts +1 -1
- package/components/ViroText.tsx +1 -1
- package/dist/components/AR/ViroARPlaneSelector.d.ts +2 -2
- package/dist/components/AR/ViroARPlaneSelector.js +11 -8
- package/dist/components/Utilities/ViroVersion.d.ts +1 -1
- package/dist/components/Utilities/ViroVersion.js +1 -1
- package/dist/components/ViroText.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<p align="center" style="background-color: #CCCCCC;">
|
|
2
|
-
<a href="https://www.
|
|
2
|
+
<a href="https://www.reactvision.org/">
|
|
3
3
|
<img src="../viro/public/icons/NVLogo.png">
|
|
4
4
|
</a>
|
|
5
5
|
</p>
|
|
@@ -31,9 +31,9 @@ ViroReact is a library for developers to rapidly build augmented reality (AR) an
|
|
|
31
31
|
|
|
32
32
|
If you are starting a fresh project with ViroReact, consider cloning one of our starter kits:
|
|
33
33
|
|
|
34
|
-
- [Expo + TypeScript](https://github.com/
|
|
35
|
-
- [React Native](https://github.com/
|
|
36
|
-
- [Expo + JavaScript](https://github.com/
|
|
34
|
+
- [Expo + TypeScript](https://github.com/ReactVision/expo-starter-kit-typescript)
|
|
35
|
+
- [React Native](https://github.com/ReactVision/starter-kit)
|
|
36
|
+
- [Expo + JavaScript](https://github.com/ReactVision/expo-starter-kit)
|
|
37
37
|
|
|
38
38
|
# Examples
|
|
39
39
|
|
|
@@ -47,6 +47,14 @@ See our [Example projects](https://viro-community.readme.io/docs/examples) page.
|
|
|
47
47
|
|
|
48
48
|
# A little history...
|
|
49
49
|
|
|
50
|
-
ViroReact was originaly developed by the [Viro Media](http://www.viromedia.com/) company, but was open sourced in 2019. In late 2020 the Viro Community was formed to help maintain and move the project onwards, updating it so it could run with modern versions of react native, and start to add in new features.
|
|
50
|
+
ViroReact was originaly developed by the [Viro Media](http://www.viromedia.com/) company, but was open sourced in 2019. In late 2020 the Viro Community was formed to help maintain and move the project onwards, updating it so it could run with modern versions of react native, and start to add in new features. ReactVision now focuses on the project full time making sure the codebase is updated and ready for the future of XR / Spatial Computing.
|
|
51
51
|
|
|
52
|
-
We, as a community, owe a great debt to Viro Media and the people who developed this library originally. We hope to make them proud as it continues to develop and grow in the
|
|
52
|
+
We, as a community, owe a great debt to Viro Media and the people who developed this library originally. We hope to make them proud as it continues to develop and grow in the Viro Community.
|
|
53
|
+
|
|
54
|
+
# Supporters
|
|
55
|
+
|
|
56
|
+
<p align="center">
|
|
57
|
+
<a href="https://themorrow.digital/">
|
|
58
|
+
<img src="readmes/morrow-supporter.png" alt="Morrow">
|
|
59
|
+
</a>
|
|
60
|
+
</p>
|
|
@@ -11,7 +11,11 @@
|
|
|
11
11
|
|
|
12
12
|
"use strict";
|
|
13
13
|
|
|
14
|
-
import {
|
|
14
|
+
import {
|
|
15
|
+
ViroARPlaneSizes,
|
|
16
|
+
ViroClickStateEvent,
|
|
17
|
+
ViroPlaneUpdatedMap,
|
|
18
|
+
} from "../Types/ViroEvents";
|
|
15
19
|
import { ViroARPlaneType, ViroNativeRef } from "../Types/ViroUtils";
|
|
16
20
|
import * as React from "react";
|
|
17
21
|
import { ViroMaterials } from "../Material/ViroMaterials";
|
|
@@ -65,9 +69,9 @@ export class ViroARPlaneSelector extends React.Component<Props, State> {
|
|
|
65
69
|
|
|
66
70
|
_getARPlanes() {
|
|
67
71
|
if (this.state.selectedSurface == -1) {
|
|
68
|
-
let arPlanes = [];
|
|
72
|
+
let arPlanes: JSX.Element[] = [];
|
|
69
73
|
let numPlanes = this.props.maxPlanes || _maxPlanes;
|
|
70
|
-
for (
|
|
74
|
+
for (let i = 0; i < numPlanes; i++) {
|
|
71
75
|
let foundARPlane = this.state.foundARPlanes[i];
|
|
72
76
|
let surfaceWidth = foundARPlane ? foundARPlane.width : 0;
|
|
73
77
|
let surfaceHeight = foundARPlane ? foundARPlane.height : 0;
|
|
@@ -82,7 +86,9 @@ export class ViroARPlaneSelector extends React.Component<Props, State> {
|
|
|
82
86
|
>
|
|
83
87
|
<ViroQuad
|
|
84
88
|
materials={"ViroARPlaneSelector_Translucent"}
|
|
85
|
-
|
|
89
|
+
onClickState={(clickState, position, source) =>
|
|
90
|
+
this._getOnClickSurface(i, { clickState, position, source })
|
|
91
|
+
}
|
|
86
92
|
position={surfacePosition}
|
|
87
93
|
width={surfaceWidth}
|
|
88
94
|
height={surfaceHeight}
|
|
@@ -102,17 +108,20 @@ export class ViroARPlaneSelector extends React.Component<Props, State> {
|
|
|
102
108
|
}
|
|
103
109
|
}
|
|
104
110
|
|
|
105
|
-
_getOnClickSurface = (index: number) => {
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
};
|
|
111
|
+
_getOnClickSurface = (index: number, event: ViroClickStateEvent) => {
|
|
112
|
+
if (event.clickState < 3) {
|
|
113
|
+
return;
|
|
114
|
+
}
|
|
115
|
+
this.setState({ selectedSurface: index });
|
|
116
|
+
this._onPlaneSelected(this.state.foundARPlanes[index]);
|
|
110
117
|
};
|
|
111
118
|
|
|
112
119
|
_onARPlaneUpdated = (index: number) => {
|
|
113
120
|
return (updateMap: ViroPlaneUpdatedMap) => {
|
|
114
|
-
this.state.foundARPlanes
|
|
121
|
+
let newPlanes = [...this.state.foundARPlanes];
|
|
122
|
+
newPlanes[index] = updateMap;
|
|
115
123
|
this.setState({
|
|
124
|
+
foundARPlanes: newPlanes,
|
|
116
125
|
arPlaneSizes: this.state.arPlaneSizes,
|
|
117
126
|
});
|
|
118
127
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const VIRO_VERSION = "2.41.
|
|
1
|
+
export const VIRO_VERSION = "2.41.4";
|
package/components/ViroText.tsx
CHANGED
|
@@ -100,7 +100,7 @@ export class ViroText extends ViroBase<Props> {
|
|
|
100
100
|
// Fixes #272. for some reason, onClick was making it
|
|
101
101
|
// to the native code. Other incorrect props don't make it
|
|
102
102
|
// to the native code.
|
|
103
|
-
// https://github.com/
|
|
103
|
+
// https://github.com/ReactVision/viro/issues/272
|
|
104
104
|
onClick={undefined}
|
|
105
105
|
onTouchViro={this._onTouch}
|
|
106
106
|
onScrollViro={this._onScroll}
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
*
|
|
9
9
|
* @providesModule ViroARPlaneSelector
|
|
10
10
|
*/
|
|
11
|
-
import { ViroARPlaneSizes, ViroPlaneUpdatedMap } from "../Types/ViroEvents";
|
|
11
|
+
import { ViroARPlaneSizes, ViroClickStateEvent, ViroPlaneUpdatedMap } from "../Types/ViroEvents";
|
|
12
12
|
import { ViroARPlaneType, ViroNativeRef } from "../Types/ViroUtils";
|
|
13
13
|
import * as React from "react";
|
|
14
14
|
import { ViroCommonProps, ViroObjectProps } from "./ViroCommonProps";
|
|
@@ -38,7 +38,7 @@ export declare class ViroARPlaneSelector extends React.Component<Props, State> {
|
|
|
38
38
|
};
|
|
39
39
|
render(): JSX.Element;
|
|
40
40
|
_getARPlanes(): JSX.Element | JSX.Element[];
|
|
41
|
-
_getOnClickSurface: (index: number
|
|
41
|
+
_getOnClickSurface: (index: number, event: ViroClickStateEvent) => void;
|
|
42
42
|
_onARPlaneUpdated: (index: number) => (updateMap: ViroPlaneUpdatedMap) => void;
|
|
43
43
|
_onPlaneSelected: (updateMap: ViroPlaneUpdatedMap) => void;
|
|
44
44
|
reset: () => void;
|
|
@@ -62,13 +62,13 @@ class ViroARPlaneSelector extends React.Component {
|
|
|
62
62
|
if (this.state.selectedSurface == -1) {
|
|
63
63
|
let arPlanes = [];
|
|
64
64
|
let numPlanes = this.props.maxPlanes || _maxPlanes;
|
|
65
|
-
for (
|
|
65
|
+
for (let i = 0; i < numPlanes; i++) {
|
|
66
66
|
let foundARPlane = this.state.foundARPlanes[i];
|
|
67
67
|
let surfaceWidth = foundARPlane ? foundARPlane.width : 0;
|
|
68
68
|
let surfaceHeight = foundARPlane ? foundARPlane.height : 0;
|
|
69
69
|
let surfacePosition = foundARPlane ? foundARPlane.center : [0, 0, 0];
|
|
70
70
|
arPlanes.push(<ViroARPlane_1.ViroARPlane key={_planePrefix + i} minWidth={this.props.minWidth} minHeight={this.props.minHeight} alignment={this.props.alignment} onAnchorUpdated={this._onARPlaneUpdated(i)}>
|
|
71
|
-
<ViroQuad_1.ViroQuad materials={"ViroARPlaneSelector_Translucent"}
|
|
71
|
+
<ViroQuad_1.ViroQuad materials={"ViroARPlaneSelector_Translucent"} onClickState={(clickState, position, source) => this._getOnClickSurface(i, { clickState, position, source })} position={surfacePosition} width={surfaceWidth} height={surfaceHeight} rotation={[-90, 0, 0]}/>
|
|
72
72
|
</ViroARPlane_1.ViroARPlane>);
|
|
73
73
|
}
|
|
74
74
|
return arPlanes;
|
|
@@ -77,16 +77,19 @@ class ViroARPlaneSelector extends React.Component {
|
|
|
77
77
|
return (<ViroARPlane_1.ViroARPlane key={_planePrefix + this.state.selectedSurface} {...this.props}></ViroARPlane_1.ViroARPlane>);
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
|
-
_getOnClickSurface = (index) => {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
};
|
|
80
|
+
_getOnClickSurface = (index, event) => {
|
|
81
|
+
if (event.clickState < 3) {
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
84
|
+
this.setState({ selectedSurface: index });
|
|
85
|
+
this._onPlaneSelected(this.state.foundARPlanes[index]);
|
|
85
86
|
};
|
|
86
87
|
_onARPlaneUpdated = (index) => {
|
|
87
88
|
return (updateMap) => {
|
|
88
|
-
this.state.foundARPlanes
|
|
89
|
+
let newPlanes = [...this.state.foundARPlanes];
|
|
90
|
+
newPlanes[index] = updateMap;
|
|
89
91
|
this.setState({
|
|
92
|
+
foundARPlanes: newPlanes,
|
|
90
93
|
arPlaneSizes: this.state.arPlaneSizes,
|
|
91
94
|
});
|
|
92
95
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const VIRO_VERSION = "2.41.
|
|
1
|
+
export declare const VIRO_VERSION = "2.41.4";
|
|
@@ -77,7 +77,7 @@ class ViroText extends ViroBase_1.ViroBase {
|
|
|
77
77
|
// Fixes #272. for some reason, onClick was making it
|
|
78
78
|
// to the native code. Other incorrect props don't make it
|
|
79
79
|
// to the native code.
|
|
80
|
-
// https://github.com/
|
|
80
|
+
// https://github.com/ReactVision/viro/issues/272
|
|
81
81
|
onClick={undefined} onTouchViro={this._onTouch} onScrollViro={this._onScroll} onSwipeViro={this._onSwipe} onDragViro={this._onDrag} onPinchViro={this._onPinch} onRotateViro={this._onRotate} onFuseViro={this._onFuse} onAnimationStartViro={this._onAnimationStart} onAnimationFinishViro={this._onAnimationFinish} materials={materials} transformBehaviors={transformBehaviors} outerStroke={outerStroke} canCollide={this.props.onCollision != undefined} onCollisionViro={this._onCollision} timeToFuse={timeToFuse}/>);
|
|
82
82
|
}
|
|
83
83
|
}
|