Calling a Unity WebGl Function from JavaScript (Vue) - unity3d

I have a VueJs Project right now, where I'm building a web page. In order to show 3D Content and let the User work with it, I wanted to embed a Unity Project as WebGL. I´m not a professional programmer, my knowledge is more selfe-taught from what I can find at the Internet.
First of all I created a plugin, as it is explained here. My .jslib file looks like that:
var UnityJavascipt = {
$JustAWebGLObject:
{
},
SendToJavscript: function ()
{
console.log("worked!")
}
}; autoAddDeps(UnityJavascipt , '$JustAWebGLObject'); mergeInto(LibraryManager.library, UnityJavascipt );
I embed my Unity WebGl like that in Vue:
<template>
<unity src="static/Build/game.json" width="1000" height="600" unityLoader="static/Build/UnityLoader.js" ref="myInstance"></unity>
</template>
I can also call "SendToJavaScript" from my C# Script. But now it starts to get unclear for me, since I want to be able to call my "SendToJavaScript" Function (or any other one that will be added later) from a outside JavaScript. In the manual they refer to the emscripten pagefor more detailed information. But for me that all is just very confusing. I already tried to call my function like that in VueJs:
_SendToJavaScript()
But I always get a ReferenceError: _SendToJavaScript is not defined I also read in the forum here, that it would be possible to call the function like that:
UnityInstance.Module.asmLibraryArg._SendToJavaScript()
UnityInstance is the Variable from my index.html file, where UnityLoader get's instantiated. But again I'm getting a Reference Error.
It would be very helpful if someone could explain what I'm doing wrong... Communication between WebGL and Vue are essential for my project but I´m stuck here for days. So thanks in advance!!

Use unityInstance.SendMessage() documented here.
You can pass a callback or call a .jslib defined function at the end of your C# method.

Related

Can't get the DOM in a react app using testcafe

I'm new into testcafe. I have a react app which was made by create-react-app, and I'm trying to do very simple function:
await t.expect(ReactSelector('ReactHighcharts').exists.ok()
I figured out that no matter what component I put inside the selector I get flase.
When I explored more, I saw that react-scripts probably minifies/uglifies by his webpack, my code, and that's
why I can't get the DOM.
Am I right? if yes - how can I disable it? if not, I'd like to understand why the DOM is unreachable.
You can explicitly set the displayName property for a component or consider testing the dev build.
https://reactjs.org/docs/react-component.html#displayname

Branch.io Ionic integration / Global Function definition needed

I am trying to integrate Branch.io to my app and I get this error message:
"Uncaught ReferenceError: DeepLinkHandler is not defined"
I followed their instructions here and added their SDK:
https://dev.branch.io/getting-started/sdk-integration-guide/guide/cordova/#start-a-branch-session
In specific I'm supposed to do this:
"Then add the method DeepLinkHandler which will act as our callback when the session beings. The deep link data will be included here:"
function DeepLinkHandler(data) {
alert('Data from initSession: ' + data.data);
}
Which is EXACTLY what I did.
I talked with their support, and got to the conclusion that we need to define that function as global, so it will be possible to call it from everywhere.
Did anyone that is using Ionic with Branch.io plugin can help me fix it?
How can I define a global function in Ionic?
Thanks!
It is easy to define a global method:
in your app.js at the top of the page, simply add the method:
function DeepLinkHandler(data) {
console.log("inside DeepLinkHandler");
if (data) {
alert('Data from deep link: ' + JSON.stringify(data));
} else {
alert('No data found');
}
}
Thanks for your help, it actually solved my problem and i got the console.log :)
Edit: It indeed calls it, but now i need to figure out a different problem - how do i call my Services from the global function. Im not sure what the answer is yet.
Edit2:
The idea of solving this is firing an event. Here is the inspiration, a bit of changes and it worked.
https://github.com/BranchMetrics/Cordova-Ionic-PhoneGap-Deferred-Deep-Linking-SDK/issues/128

Reference Error: Can't find variable: ChildBrowser, Cordova 1.7.0, jQueryMobile 1.0.1, iOS 5.1

I'm working on my first PhoneGap/Cordova app and using jQueryMobile as well. I'm trying to get the ChildBrowser plugin working but getting the error in the title when trying to call
ChildBrowser.install()
Its in my onDeviceReady function which is being called correctly and I've even verified that the ChildBrowser.js file is being called by adding an alert and wrapping the anonymous function that file in a try/catch and it does not seem to be throwing any errors during its execution. However the var does not seem to be valid within my index.html file.
Presumably there is some 'gotcha' here I am not aware of. Any thoughts?
Thanks in advance.
Combining info from http://blog.digitalbackcountry.com/2012/03/installing-the-childbrowser-plugin-for-ios-with-phonegapcordova-1-5/ and his linked post https://github.com/phonegap-starter/ChildBrowserPlugin it appears that the
ChildBrowswer.install();
step is no longer necessary. I am now using jQueryMobile 1.1 as well. Example function used to launch google in the ChildBrowser included below. I followed the .plist setup from the first link.
function onLinkClick() {
window.plugins.childBrowser.onLocationChange = function(loc){ alert("In index.html new loc = " + loc); };
window.plugins.childBrowser.onClose = function(){alert("In index.html child browser closed");};
window.plugins.childBrowser.onOpenExternal = function(){alert("In index.html onOpenExternal");};
window.plugins.childBrowser.showWebPage('http://www.google.com',
{ showLocationBar: true });
console.log(window.plugins.childBrowser);
}
and the link itself for completeness
<p>Click here to open a child browser window to Google</p>
Hopes this helps someone else as this question went unanswered for a couple of days.

Nancy.SassAndCoffee: Trouble Getting Started

I am brand new to NancyFX and currently enthralled by its low-ceremony approach to web application development. Throwing myself in at the deep-end, I also want to use CoffeeScript and investigate the benefits of Sass.
The Set-Up
To enable this combination I have created a new Empty Web Application using the VS2010 template (found in the Nancy Accessories project). I have then used the VS PackageManager to Nancify my application and add the SassAndCoffee support:
PM> Install-Package Nancy
PM> Install-Package Nancy.SassAndCoffee
So far so good. I then created an ~/Content/scripts folder and in there I have placed a file called home.coffee containing the following line of CoffeeScript.
alert "Hello Nancy!"
Now things start to get a bit fuzzy. I want to run this script on the client so I create an view called ~/Views/home.sshtml (and associated NancyModule with Get["/"] route - not shown). The view's html looks like this:
<head>
<title>Hello Nancy</title>
<script type="text/javascript" src="/content/scripts/home.js"></script>
</head>
<body>
<p>Hello #Model.User</p>
</body>
</html>
The view works just fine but the link to the home.js file just returns a 404: Not Found.
I am hoping that somehow Nancy will magically work out that I need my CoffeeScript compiled to JavaScript when it looks for the referenced home.js file and finds the home.coffee instead. This didn't work - so much for inspired guesswork.
If I change the script tag above to point to the existing home.coffee instead then the file is found but processed as a normal JavaScript file giving errors concerning the lack of tiresome ceremony namely: "unexpected string"
The Question
Now you know my set-up and simple requirements, here then is my question:
How do I get CoffeeScript to 'just work' using the NancyFX framework?
Thank you
Update
Steven Robbins (below) has answered this question by pointing to the demo code. But just in case you don't want to pull MBs of source from GitHub, here are the lines required to get things going. First add a class called Bootstrapper.cs to your project. Now add the following code (it worked like a charm for me):
public class Bootstrapper : DefaultNancyBootstrapper
{
protected override void ApplicationStartup(TinyIoCContainer container, IPipelines pipelines)
{
base.ApplicationStartup(container, pipelines);
StaticConfiguration.DisableErrorTraces = false;
Hooks.Enable(pipelines, new InMemoryCache(), container.Resolve<IRootPathProvider>());
}
}
The SassAndCoffee project doesn't hook into the static content bit in Nancy, it (or something similar) may in the future, but at the moment it's just a separate pipeline hook.
If you take a look at the sample project on github:
https://github.com/NancyFx/Nancy.SassAndCoffee/tree/master/src/Nancy.SassAndCoffee.Demo
That should show you how to get it going.

Event from JAva Script to objective c

I am developing a map application for iPhone.I am using google maps API to develop this,by adding the java script file to the resource.My problem is that I need to catch an event defined in the java script. for eg: I need to cath the following event in java script
"GEvent.addListener(poly, "click", function(latlng, index)" .
Please anyone help me.
Thanks in advance
Why are you not using MapKit? Is this a web app only?
You can call javascript to probe if something has happened, but you cannot have javascript call back to your code... at least not directly. You can override the URL handling and have javascript included that tries to make an external call that your code recognizes and acts on.