Magic Leap MagicScript Landscape Application. XMLHttpRequest

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**

```sh
magic-script init my-xhr org.magicscript.xhr "XMLHttpRequest"
cd my-xhr
```

**Code**

Change app.js

```jsx
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

```jsx
// 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

```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**

```sh
magic-script build -i
```

**Run**

```sh
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!