Prepare
Magic Leap One
https://www.magicleap.com/magic-leap-one
mlsdk v.0.20.0
https://creator.magicleap.com/downloads/lumin-sdk/overview
magic-script-cli v2.0.1
https://www.npmjs.com/package/magic-script-cli
magic-script-polyfills v2.2.0
https://www.npmjs.com/package/magic-script-polyfills
Create Project
magic-script init my-xhr org.magicscript.xhr "XMLHttpRequest"
cd my-xhr
Code
Change app.js
import { LandscapeApp, ui } from 'lumin';
const {
UiLinearLayout,
UiText,
UiButton,
EclipseLabelType,
Alignment,
HorizontalTextAlignment} = ui;
export class App extends LandscapeApp {
onAppStart () {
const prism = this.requestNewPrism([0.5, 0.5, 0.5]);
const layout = UiLinearLayout.Create(prism);
layout.setLocalPosition([-0.1, 0.1, 0]);
const text = UiText.CreateEclipseLabel(
prism,
'',
EclipseLabelType.kB2
);
text.setAlignment(Alignment.CENTER_CENTER);
text.setTextAlignment(HorizontalTextAlignment.kCenter);
const button = UiButton.Create(prism, 'REQUEST', 0, 0.1);
button.onActivateSub(function (uiEventData) {
const xhr = new XMLHttpRequest();
xhr.addEventListener("load", function(event)
{
text.setText(xhr.responseText);
});
xhr.open("GET", "https://magicmodelers.net/");
xhr.send();
});
layout.addItem(text, [0, 0, 0.03, 0]
, Alignment.BOTTOM_CENTER);
layout.addItem(button, [0, 0, 0.03, 0]
, Alignment.BOTTOM_CENTER);
prism.getRootNode().addChild(layout);
}
}
Change .eslintrc.js
// ESLint config for MagicScript Apps
module.exports = {
env: {
"es6": true
},
globals: {
// These globals are provided by the vm itself.
"print": true,
"globalThis": true,
// The following globals are provided by `magic-script-polyfills`
"setTimeout": true,
"clearTimeout": true,
"setInterval": true,
"clearInterval": true,
"setImmediate": true,
"clearImmediate": true,
"fetch": true,
"Headers": true,
"Request": true,
"Response": true,
"XMLHttpRequest":true ,
},
parserOptions: {
"ecmaVersion": 2018,
"sourceType": "module"
},
extends: "semistandard",
};
Change manifest.xml
<manifest xmlns:ml="magicleap"
ml:package="org.magicleap.xhr"
ml:version_name="0.0.1"
ml:version_code="1">
<application ml:visible_name="File System"
ml:application_type="untrusted"
ml:sdk_version="1.0">
<component ml:name=".universe"
ml:visible_name="File System"
ml:binary_name="bin/index.js"
ml:type="Universe">
<mode ml:shareable="true"/>
<icon ml:model_folder=""
ml:portal_folder=""/>
</component>
<uses-privilege ml:name="MagicScript"/>
<uses-privilege ml:name="Internet"/>
</application>
</manifest>
Build
magic-script build -i
Run
magic-script run --port=10000
Reference
xhr.js (magic-script-polyfills at Github)
https://github.com/magic-script/magic-script-polyfills/blob/master/src/xhr.js
magicscript
https://www.magicscript.org/
Thanks!