{"id":15097010,"url":"https://github.com/joazco/cordova-reactjs-unity","last_synced_at":"2026-01-07T06:06:49.526Z","repository":{"id":150951660,"uuid":"544810411","full_name":"joazco/cordova-reactjs-unity","owner":"joazco","description":"Repository for your application mobile, web and software Unity webGL","archived":false,"fork":false,"pushed_at":"2023-03-27T08:45:12.000Z","size":7348,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-02-01T17:44:21.027Z","etag":null,"topics":["cordova","reactjs","typescript","unity","webgl"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/joazco.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-10-03T09:10:37.000Z","updated_at":"2022-10-03T09:15:23.000Z","dependencies_parsed_at":null,"dependency_job_id":"71c666cf-9d7b-42ec-aef9-8c09ce3e0270","html_url":"https://github.com/joazco/cordova-reactjs-unity","commit_stats":{"total_commits":17,"total_committers":3,"mean_commits":5.666666666666667,"dds":0.2941176470588235,"last_synced_commit":"f6ed91487d3db28633eeb5bd0d5960f6c129ea23"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joazco%2Fcordova-reactjs-unity","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joazco%2Fcordova-reactjs-unity/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joazco%2Fcordova-reactjs-unity/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joazco%2Fcordova-reactjs-unity/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/joazco","download_url":"https://codeload.github.com/joazco/cordova-reactjs-unity/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245853035,"owners_count":20683134,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cordova","reactjs","typescript","unity","webgl"],"created_at":"2024-09-25T16:03:37.892Z","updated_at":"2026-01-07T06:06:49.515Z","avatar_url":"https://github.com/joazco.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Cordova ReactJS Unity WEBGL\n\nRepository for your application mobile, web and software Unity webGL.\n\n## Installation\n\n```bash\nnpm install -g cordova\ngit clone git@github.com:poohia/react-cordova.git\ncd react-cordova\nnpm install\nnpm start\n```\n\n## Configuration\n\nEdit `config.ts`\n\n| Parameter                               | Type                                                                                                           | Description                                                                                                                                                                                                                                                                                                                                |\n| :-------------------------------------- | :------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| `name`                                  | `string`                                                                                                       | **Required**. Your application name                                                                                                                                                                                                                                                                                                        |\n| `build.version`                         | `string`                                                                                                       | **Required**. Your application name                                                                                                                                                                                                                                                                                                        |\n| `build.id`                              | `string`                                                                                                       | **Required**. Full version number expressed in major/minor/patch notation.                                                                                                                                                                                                                                                                 |\n| `build.version`                         | `string`                                                                                                       | **Required**. Specifies the app's identifier. The id should be in a reverse-DNS format however, only alphanumeric and dot characters are allowed. e.g: com.example.myapp                                                                                                                                                                   |\n| `build.android.versionCode`             | `string`                                                                                                       | **Required**. Alternative version for Android. Sets the [version code](https://developer.android.com/studio/publish/versioning) for the application. See the [Android guide](https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html#setting-the-version-code) for information on how this attribute may be modified. |\n| `build.ios.CFBundleVersion`             | `string`                                                                                                       | **Required**. Alternative version for iOS. For further details, see [iOS versioning](https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html#//apple_ref/doc/uid/20001431-102364).                                                                              |\n| `author.email`                          | `string`                                                                                                       | Author email                                                                                                                                                                                                                                                                                                                               |\n| `author.link`                           | `string`                                                                                                       | Author link                                                                                                                                                                                                                                                                                                                                |\n| `author.name`                           | `string`                                                                                                       | Author name                                                                                                                                                                                                                                                                                                                                |\n| `fullscreen`                            | `boolean`                                                                                                      | **Default: false**. Set application fullscreen                                                                                                                                                                                                                                                                                             |\n| `statusbar.show`                        | `boolean`                                                                                                      | **Default: true**. Shows the statusbar.                                                                                                                                                                                                                                                                                                    |\n| `statusbar.backgroundColor`             | `string`                                                                                                       | **Default: #ffffff**. Set the background color of the statusbar by a hex string (#RRGGBB) at startup                                                                                                                                                                                                                                       |\n| `statusbar.overlaysWebView`             | `boolean`                                                                                                      | **Default: true**. Make the statusbar overlay or not overlay the WebView at startup                                                                                                                                                                                                                                                        |\n| `statusbar.contentStyle`                | `default` `lightContent`                                                                                       | **Default: default**. Set the status bar style (e.g. text color)                                                                                                                                                                                                                                                                           |\n| `screenOrientation`                     | `any` `landscape` `landscape-primary` `landscape-secondary` `portrait` `portrait-primary` `portrait-secondary` | **Default: any**. Set screen orientation                                                                                                                                                                                                                                                                                                   |\n| `splashscreen.splashscreenDelay`        | `number`                                                                                                       | **Default: 3000**. Amount of time in milliseconds to wait before automatically hide splash screen.                                                                                                                                                                                                                                         |\n| `splashscreen.fadeSplashscreen`         | `boolean`                                                                                                      | **Default: true**. Set to false to prevent the splash screen from fading in and out when its display state changes.                                                                                                                                                                                                                        |\n| `splashscreen.fadeSplashscreenDuration` | `number`                                                                                                       | **Default: 500**. Specifies the number of milliseconds for the splash screen fade effect to execute.                                                                                                                                                                                                                                       |\n\n## Unity\n\n### Export Unity Project\n\n1. File -\u003e Build Settings... -\u003e WebGL\n2. File -\u003e Build Settings... -\u003e Player Settings -\u003e Player -\u003e Publishing Settings -\u003e Check Decompression Fallback\n3. File -\u003e Build Settings... -\u003e WebGL -\u003e Build\n4. Select folder `cordova-reactjs-unity/public/unity` and replace existant\n\n### Communication Unity webGL - ReactJS\n\n#### Unity - ReactJS\n\nOn Unity copy file `cordova-reactjs-unity/resources/SendEvents.jslib` to your project Unity `Assets/Plugins/SendEvents.jslib`\n\nThen you can send message to ReactJS:\n\n1. Without Data\n\n```cs\nusing System.Runtime.InteropServices;\n\npublic class MyScript{\n    .....\n\n    Start(){\n        sendDocumentEvent(\"My Event\");\n    }\n\n    #if UNITY_WEBGL \u0026\u0026 !UNITY_EDITOR\n       [DllImport(\"__Internal\")] private static extern void sendDocumentEvent(string str);\n    #else\n        private static void sendDocumentEvent(string str)\n        {\n        }\n    #endif\n}\n```\n\n2. With Data\n\n```cs\nusing System.Runtime.InteropServices;\n\npublic class MyScript{\n    .....\n\n    Start(){\n        sendDocumentEventWithData(\"My Event\", data);\n    }\n\n    #if UNITY_WEBGL \u0026\u0026 !UNITY_EDITOR\n       [DllImport(\"__Internal\")] private static extern void sendDocumentEventWithData(string eventName, string eventData);\n    #else\n        private static void sendDocumentEventWithData(string eventName, string eventData)\n        {\n        }\n    #endif\n    }\n}\n```\n\n3. On ReactJS you just need to listen event or use useUnity hook on `src/hooks`\n\n```typescript\nimport { useUnity } from \"src/hooks\";\n\ndocument.addEventListener(\"event from Unity\", (event) =\u003e {\n  const data = event.detail;\n});\n// OR\nconst { listenEvent } = useUnity();\nlistenEvent(\"event from Unity\", (data) =\u003e {\n  console.log(data);\n});\n```\n\n#### ReactJS - Unity\n\nUse custom hook useUnity to execute Function from Game Object.\n\n```typescript\nimport { useUnity } from \"src/hooks\";\n\nconst { sendMessage } = useUnity();\nsendMessage(\"Game Object Name\", \"Function Name\", ...data);\n```\n\n## Ios\n\n### Installation\n\n```bash\ncordova platform add ios\ncordova platform prepare ios\n```\n\nOpen file `platform/ios/*.xcworkspace` with XCode\n\n### Icon and Splashscreen\n\nIcon and splashscreen will be generated at prepare command. Based on files `resources/icon.png` and `resources/splash.png`.\nIcon image needs to be 1024x1024 pixel and Splashscreen image needs to be 2732x2732 pixel.\n\n## Android\n\n### Installation\n\n```bash\ncordova platform add android@11 # Version 11 is minimal version to push store\ncordova prepare android\n```\n\nOpen folder `platform/android` with Android Studio\n\n### Icon\n\nIcon will be generated at prepare command. Based on files `resources/android/icon-background.png` `resources/android/icon-foreground.png`.\nThey needs to be 432x432 pixels.\n\n### Splashscreen\n\nAndroid need an xml at resources/splash.xml [see more](https://developer.android.com/develop/ui/views/launch/splash-screen).\nYou can change background color at resources/colors.xml.\n\n## Browser\n\n```bash\ncordova platform add browser\ncordova build browser\n```\n\nUpload `platform/browser/www` on your server.\n\n## Electron\n\nIf you can build a website, you can build a desktop app. Electron is a framework for creating native applications [see documentation](https://cordova.apache.org/docs/en/11.x/guide/platforms/electron/index.html)\n\n```\ncordova platform add electron\ncordova run electron --nobuild\ncordova build electron --release\n```\n\n## Other documentations\n\n- Cordova [https://cordova.apache.org/docs/en/latest/](https://cordova.apache.org/docs/en/latest/)\n- ReactJS [https://reactjs.org/docs/getting-started.html](https://reactjs.org/docs/getting-started.html)\n- Generation Icon/Splashscreen with **cordova-res** [https://github.com/ionic-team/capacitor-assets](https://github.com/ionic-team/capacitor-assets)\n- Android Splashscreen [https://developer.android.com/develop/ui/views/launch/splash-screen](https://developer.android.com/develop/ui/views/launch/splash-screen)\n- awesome-cordova-library [https://github.com/joazco/awesome-cordova-library](https://github.com/joazco/awesome-cordova-library)\n- Unity Interaction with browser scripting: [https://docs.unity3d.com/Manual/webgl-interactingwithbrowserscripting.html](https://docs.unity3d.com/Manual/webgl-interactingwithbrowserscripting.html)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoazco%2Fcordova-reactjs-unity","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjoazco%2Fcordova-reactjs-unity","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoazco%2Fcordova-reactjs-unity/lists"}