diff --git a/README.md b/README.md
index a1a4a14a..f81aefa8 100644
--- a/README.md
+++ b/README.md
@@ -35,11 +35,22 @@ export class App extends React.Component {
```
## Optional attributes
+### Overruling the module
```js
-// Overruling the module
+this.myCustomModule = { ... }
```
+### Tracking progression
+```js
+
+onProgress (progression) {
+ console.log (`Loading ${(progression * 100)} % ...`)
+ if (progression === 1)
+ console.log (`Loading done!`)
+}
+```
+
@@ -120,25 +131,10 @@ Legacy ways of calling JavaScript code from Unity. You can use the Application.E
-# Styling
-The following hierarchy will be applied to the React Unity WebGL component. Feel free to apply any styles to the component.
-
-```scss
-.unity {
- .unity-container {
- canvas {
- /* don't forget to set my width and height! */
- }
- }
- .unity-loader {
- .loading-bar {
- .loading-fill {
- /* the width will be set by the component */
- }
- }
- }
-}
-```
+# Notes
+Make sure your Unity build is in your public folder, this is due to the component **and** Unity itself will load files in Runtime and not Compile time.
+## 5.x to 6.x Upgrade note
+When upgrading from 5.x to 6.x, make sure you add the `loader` prop to the Unity component and remove the script tag from your HTML page refering to the UnityLoader.js file. See [Usage](#usage) for further details.
diff --git a/package.json b/package.json
index 3497f8ec..e52f484d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "react-unity-webgl",
- "version": "6.0.0",
+ "version": "6.1.0",
"description": "A Unity WebGL component for your React application",
"main": "lib/index.js",
"scripts": {
diff --git a/source/Unity.js b/source/Unity.js
index 6e708393..4a4aea0b 100644
--- a/source/Unity.js
+++ b/source/Unity.js
@@ -5,8 +5,6 @@ export default class Unity extends Component {
constructor (props) {
super (props)
this.state = {
- progress: 0,
- loaded: false,
error: null
}
this.unityLoaderService = new UnityLoaderService ()
@@ -14,6 +12,9 @@ export default class Unity extends Component {
componentDidMount () {
this.instantiate ()
}
+ componentWillUnmount () {
+ this.unityLoaderService.unmount ()
+ }
instantiate () {
let error = null
@@ -28,36 +29,27 @@ export default class Unity extends Component {
}
else {
this.unityLoaderService.append (this.props.loader).then (() => {
- module.exports.UnityInstance = UnityLoader.instantiate ('unity-container', this.props.src, {
- onProgress: ((gameInstance, progress) => {
- this.setState({
- loaded: progress === 1,
- progress: progress
- })
- }),
+ let unityInstance = UnityLoader.instantiate ('unity', this.props.src, {
+ onProgress: this.onProgress.bind (this),
Module : this.props.module
})
+ module.exports.UnityInstance = unityInstance
})
}
}
+ onProgress (unityInstance, progression) {
+ if (typeof this.props.onProgress !== 'undefined') {
+ this.props.onProgress (progression)
+ }
+ }
render () {
- if (this.state.error !== null) { return (
-
- React-Unity-Webgl error {this.state.error}
-
- )}
return (
-
- {this.state.loaded === false &&
-
- }
+ {this.state.error !== null ? (
+
React-Unity-Webgl error {this.state.error}
+ ):(
+
+ )}
)
}
diff --git a/source/UnityLoaderService.js b/source/UnityLoaderService.js
index 1d8f7829..022ca8cc 100644
--- a/source/UnityLoaderService.js
+++ b/source/UnityLoaderService.js
@@ -1,17 +1,23 @@
export default class UnityLoaderServer {
constructor () {
-
+ this.documentHead = document.getElementsByTagName ('head')[0]
+ this.unityLoaderScript = null
}
append (src) {
return new Promise ((resolve, reject) => {
- let unityLoaderScript = document.createElement ('script')
- unityLoaderScript.type = 'text/javascript'
- unityLoaderScript.async = true
- unityLoaderScript.src = src
- unityLoaderScript.onload = () => {
+ this.unityLoaderScript = document.createElement ('script')
+ this.unityLoaderScript.type = 'text/javascript'
+ this.unityLoaderScript.async = true
+ this.unityLoaderScript.src = src
+ this.unityLoaderScript.onload = () => {
resolve ()
}
- document.getElementsByTagName ('head')[0].appendChild (unityLoaderScript)
+ this.documentHead.appendChild (this.unityLoaderScript)
})
}
+ unmount () {
+ if (this.unityLoaderScript !== null) {
+ this.documentHead.removeChild (this.unityLoaderScript)
+ }
+ }
}
\ No newline at end of file