# Core

Integrate your JavaScript code with the basic functions of your AppMachine app. This page discusses the available functions and possible errors that lie at the basis of each JavaScript block.

## Get Block Name[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#get-block-name) <a href="#get-block-name" id="get-block-name"></a>

Get the current name of the block.

```javascript
import { getBlockName } from '@myjsblock/sdk'

const myBlockName = await getBlockName();

// or

getBlockName().then(data => {  
    console.log(data);
});
```

#### Errors[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#errors) <a href="#errors" id="errors"></a>

Here is a list of errors that can be thrown when calling this function in addition to [generic errors](https://docs.appmachine.com/libraries/javascript/sdk/api/core#generic-errors):

| Error Code         | Description                                         |
| ------------------ | --------------------------------------------------- |
| `INVALID_ARGUMENT` | The 'caption' property is not defined on the block. |

## Get Property[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#get-property) <a href="#get-property" id="get-property"></a>

Get a property by name from the current block.

```javascript
import { getProperty } from '@myjsblock/sdk'

const myProperty = await getProperty('myProperty');

// or

getProperty('myProperty').then(data => {  
    console.log(data);
});
```

#### Arguments[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#arguments) <a href="#arguments" id="arguments"></a>

| Name           | Type     | Required | Default |
| -------------- | -------- | -------- | ------- |
| `propertyName` | *String* | ✅        | -       |

#### Errors[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#errors-1) <a href="#errors-1" id="errors-1"></a>

Here is a list of errors that can be thrown when calling this function in addition to [generic errors](https://docs.appmachine.com/libraries/javascript/sdk/api/core#generic-errors):

| Error Code         | Description                               |
| ------------------ | ----------------------------------------- |
| `INVALID_ARGUMENT` | The provided `propertyName` is not found. |

## Get Image Url[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#get-image-url) <a href="#get-image-url" id="get-image-url"></a>

Get a public URL of an image, based on the given `imageId`.

```javascript
import { getImageUrl } from '@myjsblock/sdk'

const myImage = await getImageUrl('myImageId');

const imageElement = document.createElement('img');
imageElement.src = myImage;

document.body.appendChild(imageElement);
```

#### Image Resizing[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#image-resizing) <a href="#image-resizing" id="image-resizing"></a>

By default the image URL that will be returned is the URL of the image in full resolution. We recommend using fixed dimensions for the `width` and `height` options when using high resolution images. This also improves performance and saves bandwidth.

#### **Basic Example**[**​**](https://docs.appmachine.com/libraries/javascript/sdk/api/core#basic-example)

```javascript
import { getImageUrl } from '@myjsblock/sdk'

const myImage = await getImageUrl('myImageId', {    
    width: 300,    
    height: 300
});

const imageElement = document.createElement('img');
imageElement.src = myImage;

document.body.appendChild(imageElement);
```

#### **Multiple Image sizes**[**​**](https://docs.appmachine.com/libraries/javascript/sdk/api/core#multiple-image-sizes)

It is also possible to use multiple image resolution depending on the device resolution or pixel density using image src sets. Read [MDN guide](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images) for more information.

```javascript
import { getImageUrl } from '@myjsblock/sdk'

const myImageId = 'a181f12c-3116-11e5-80d0-00155d130a43';

const imageSourceDimensions = {    
    '300w': [280, 210],    
    '768w': [748, 561],    
    '1280w': [1260, 945]
};

const imageSourcePromises = Object.values(imageSourceMap).map(([width, height]) => getImageUrl('myImageId', { width, height }));

const imageSourceUrls = await Promise.all(imageSourcePromises);

const imageSourceMap = Object.entries(imageSourceDimensions).map(([viewPortWidth], dimensionIndex) => [viewPortWidth, imageSourceUrls[dimensionIndex]]);
// Returns array of e.g. ['300w', 'https://myasseturl...']

const sourceSet = imageSourceMap.map(([viewPortWidth, imageUrl]) => `${imageUrl} ${viewPortWidth}`).join(', ');

const imageElement = document.createElement('img');

const defaultImage = imageSourceMap[0][1]; // Smallest image
imageElement.src = defaultImage;

imageElement.srcset = sourceSet;

document.body.appendChild(imageElement);
```

#### **Result**[**​**](https://docs.appmachine.com/libraries/javascript/sdk/api/core#result)

```html
<html>    
    <body>
        <img            
            src="https://static.accept.appmachine.com/api/image/x/a181f12c-3116-11e5-80d0-00155d130a43"            
            srcset="https://static.accept.appmachine.com/api/image/280x210/a181f12c-3116-11e5-80d0-00155d130a43 300w, https://static.accept.appmachine.com/api/image/748x561/a181f12c-3116-11e5-80d0-00155d130a43 768w, https://static.accept.appmachine.com/api/image/1260x945/a181f12c-3116-11e5-80d0-00155d130a43 1280w"        
        />    
    </body>
</html>
```

#### Arguments[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#arguments-1) <a href="#arguments-1" id="arguments-1"></a>

| Name         | Type                                | Required | Default |
| ------------ | ----------------------------------- | -------- | ------- |
| `imageId`    | *String*                            | ✅        | -       |
| `dimensions` | *{ width: Number, height: Number }* |          | -       |

#### Errors[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#errors-2) <a href="#errors-2" id="errors-2"></a>

Here is a list of errors that can be thrown when calling this function in addition to [generic errors](https://docs.appmachine.com/libraries/javascript/sdk/api/core#generic-errors):

| Error Code         | Description                                                     |
| ------------------ | --------------------------------------------------------------- |
| `INVALID_ARGUMENT` | `imageId` is missing or the `width` or `height` isn't a number. |

## Show Loader[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#show-loader) <a href="#show-loader" id="show-loader"></a>

Show an overlay with a spinner.

```
import { showLoader, hideLoader } from '@myjsblock/sdk'const loadData = async () => {  await showLoader()  try {    await fetchData()  } finally {    await hideLoader()  }}
```

## Hide Loader[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#hide-loader) <a href="#hide-loader" id="hide-loader"></a>

Hide the loader overlay that was shown by the `showLoader` function.

```
import { showLoader, hideLoader } from '@myjsblock/sdk'const loadData = async () => {  await showLoader()  try {    await fetchData()  } finally {    await hideLoader()  }}
```

#### Errors[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#errors-3) <a href="#errors-3" id="errors-3"></a>

Here is a list of errors that can be thrown when calling this function in addition to [generic errors](https://docs.appmachine.com/libraries/javascript/sdk/api/core#generic-errors):

| Error Code              | Description                |
| ----------------------- | -------------------------- |
| `OPERATION_NOT_ALLOWED` | There is no active loader. |

## Generic errors[​](https://docs.appmachine.com/libraries/javascript/sdk/api/core#generic-errors) <a href="#generic-errors" id="generic-errors"></a>

| Error Code              | Description                                                     |
| ----------------------- | --------------------------------------------------------------- |
| `UNKNOWN_ERROR`         | Unknown error occurred.                                         |
| `TIMEOUT_EXCEEDED`      | The app failed to respond within the set timeout.               |
| `UNKNOWN_FUNCTION`      | The function that was called doesn't exist.                     |
| `VERSION_NOT_SUPPORTED` | The function isn't supported in the current version of the app. |

<br>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.appmachine.com/developers/javascript/sdk/core.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.