AirstoreJS - File Picker

Plugin to upload images.

Features#

  • Super easy to set up
  • No bloated dependencies
  • Images upload from user computer
  • Images upload from web
  • Use already uploaded images
  • Icons gallery with tons of icons grouped by categories and with color filter
  • Images gallery with tons of images grouped by categories and with color filter

Demo#

Try out the demo!

Install#

Use latest CDNized plugin version

<script src="https://js.filerobot.com/airstore-uploader.last.js"></script>

Add DOM element in body

<div id="airstore-uploader"></div>

Usage#

We provide easy way to integrate image uploader in your applications.

window.AirstoreUploader.init(options)

// Configuration 
let options = {
    MODULES: ['UPLOAD', 'UPLOADED_IMAGES', 'ICONS_GALLERY', 'IMAGES_GALLERY'], // optional default: 'UPLOAD', 'UPLOADED_IMAGES', 'ICONS_GALLERY', 'IMAGES_GALLERY'
    UPLOAD_PARAMS: {                 // optional default: {}
      dir: '/your/directory'
    },
    //ELEMENT_ID: 'airstore-uploader', // optional default : 'airstore-uploader'
    UPLOADED_FOLDERS: [                             // required if UPLOADED_IMAGES is set
      { dir: '/company_test', label: 'Company' },
      { dir: '/company_test/project_test', label: 'Project' }
    ],
    AIRSTORE_UPLOAD_KEY: '0cbe9ccc4f164bf8be26bd801d53b132', // required
    OPENPIX_KEY: 'xxxxxxxxxxxxxxx',                          // required if ICONS_GALLERY et IMAGES_GALLERY
    CONTAINER: 'example',                           // required
    INITIAL_TAB: 'UPLOAD',                          // optional   default first module
    onUpload: onUploadHandler,                      // required
  };

window.onload = function() {
    if (window.AirstoreUploader) {
      window.AirstoreUploader.init(options);
      const openBtn = document.querySelector('.open-modal-btn');
      if (openBtn) openBtn.onclick = () => window.AirstoreUploader.open();
    }
}

options.AIRSTORE_UPLOAD_KEY: string (required)

Unique upload key for Airstore.

options.CONTAINER: string (required)

Airstore Container name.

options.onUpload(files: file[]): function (required)

Function to handle uploaded files.

options.ELEMENT_ID: string

Id of element in DOM.

Default: airstore-uploader

options.INITIAL_TAB: string

Allow to choose the initial tab. Should be one of enable Module. By default the first module choosen is select.

options.MODULES: string[]

Modules (tabs) in file uploader modal.

Available modules: 'UPLOAD', 'UPLOADED_IMAGES', 'ICONS_GALLERY', 'IMAGES_GALLERY'.

options.UPLOAD_PARAMS: object

  • options.UPLOAD_PARAMS.dir: string - Directory of upload.

options.UPLOADED_FOLDERS: array

  • options.UPLOADED_FOLDERS[X].dir: text - Directory where to fetch the image
  • options.UPLOADED_FOLDERS[X].label: text - Label display for the folder

options.OPENPIX_KEY: text

Key for Openpix. Required if you are using 'ICONS_GALLERY', 'IMAGES_GALLERY'

Uploader plugin#

Version 2018-06

The last version of our file picker is here:

See: https://js.filerobot.com/airstore-uploader.demo.html

History

  • 2018-05 : We removed the old versions from the page
  • 2017-11 : We deprecated our old versions (2016 and 2017) which were using jQuery.