# UI Tools

Kloudless provides JS libraries to assist with common tasks, such as authenticating users, and prompting users to select files in cloud storage.

Since the Virtual Appliance is being used, your application should reference JS libraries hosted by your Virtual Appliance rather than Kloudless’s cloud version. This can be done by modifying the URL in the script tag to reference the file on the Virtual Appliance’s API server.

# Authenticator JS Library

The open-source Authenticator JS library provides a pop-up that prompts users to connect their cloud accounts to your application. You can find an example of it in action on the Interactive Docs, where it powers the ‘Add Account’ button. More information about the library can be found on its GitHub page.

To reference the file on the Virtual Appliance, change the tag below documented on GitHub:

<script type="text/javascript"
src="https://static-cdn.kloudless.com/p/platform/sdk/kloudless.authenticator.js"></script>

to this one:

<script type="text/javascript"
src="https://[appliance_hostname]/static/kloudless.authenticator.min.js"></script>

All other steps are as described on the GitHub page.

# File Picker

The open-source File Picker is a JavaScript library that allows your users to browse and select files and folders from their storage services. More information about the File Picker can be found on its GitHub page.

Similar to the Authenticator above, change the URL used by the script tag to reference the API server on the Virtual Appliance rather than Kloudless’s cloud script:

<script type="text/javascript"
src="https://[appliance_hostname]/static/picker/kloudless.picker.js"></script>