I am currently exploring the use of Three.js to develop a versatile 3D renderer that can run seamlessly on various platforms through integration with a "WebView" or "WebBrowser" component within native applications. I have successfully implemented this solution on Windows 8.1 (Store) and Windows Phone 8.1 apps, as well as in the Internet Explorer 11 desktop browser. However, I encountered an issue when attempting to integrate the renderer into a WPF application on the same desktop.
My current code snippet for loading the page is as follows:
private const string MainUri = "file:///{0}/Html/stlviewer.html";
string curDir = Directory.GetCurrentDirectory();
webView.Navigate(new Uri(String.Format(MainUri, curDir)));
Upon launching the application, I am prompted with a dialog requesting permission to run ActiveX, which is not acceptable. If I proceed, I encounter an error in three.min.js at line 22 character 190 stating "Expected ':' and code 0". This issue leads to undefined references to THREE in other JavaScript files, including my main script in the html file.
In an attempt to address the problem, I included the MARK OF THE WEB tag:
<!-- saved from url=(0016)http://localhost -->
While this eliminated the ActiveX dialog, it exacerbated the JavaScript errors across multiple files, displaying 'script error' without detailed information except for the error code which remains as 0. The three.min.js file used is the standard r66 version, as r67 is incompatible with WP 8.1.
EDIT: I also tried using the following tag without success:
<!-- saved from url=(0014)about:internet -->
Further investigation revealed that the WebBrowser component in WPF may be utilizing IE7 mode (or similar behavior), rather than IE11, potentially causing compatibility issues.
Subsequently, I managed to enable WebGL functionality by configuring the WebBrowser to emulate IE11 mode based on guidance from this resource. However, implementing the mark of the web tag to disable ActiveX dialogs resulted in the inability to load JavaScript files. Although touch interactions function properly in Desktop IE using Hammer.js, multitouch gestures are not received by Hammer when integrated into the WebBrowser. Any insights on resolving this issue?