[localhost] File Picker

Test version of Kloudless File Picker. Pulls from staging.

by Chih-Hung Chen

HTML

<script src="https://s3-us-west-2.amazonaws.com/kloudless-static-assets/localhost-dev/platform/sdk/kloudless.picker.js"></script>
<h1>Welcome to the Kloudless JS File Picker (localhost)</h1>

<hr />

<h2>Documentation</h2>

<p>Documentation can be found <a href="https://developers.kloudless.com/docs#ui-tools" target="_blank">here</a>

</p>

<h2>Example</h2>

<button id="chooser-test">Choose a file</button>

<button id="saver-test">Save a file</button>

<h3>File information</h3>

<div id="file-info"></div>

JavaScript

var picker = window.Kloudless.filePicker.picker({
  app_id: 'Dp_SSKa1_rOxNkeURncgEwk2Mf8Q4ivkesGAQ2X21Q6BL_EA',
  multiselect: true,
  computer: true,
  link: true,
  services: ['all'],
  types: ['all'],
  oauth: (service) => {
    const authOptions = {};

    switch (service) {
      case 'gdrive':
        // Ask for read-only access to Google Drive data instead.
        authOptions.scope = 'gdrive.storage."https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/drive.readonly":raw';
        break;
      case 'ftp':
        // Set a default domain when connecting an FTP account.
        authOptions.extra_data = {
          domain: 'ftps://ftp.example.com:21',
        };
        break;
    }

    return authOptions;
  },
});

picker.on('success', function(files) {
  console.log('Successfully selected files: ', files);
  var fileContainer = document.getElementById('file-info');

  // remove all elements
  while (fileContainer.lastChild) {
    fileContainer.removeChild(fileContainer.lastChild);
  }

  var fileJSON = document.createElement('pre');
  fileJSON.appendChild(document.createTextNode(
    JSON.stringify(files, null, 2)));

  fileContainer.appendChild(fileJSON);
});
picker.on('cancel', function() {
  console.log('File selection cancelled.');

  var fileContainer = document.getElementById('file-info');

  // remove all elements
  while (fileContainer.lastChild) {
    fileContainer.removeChild(fileContainer.lastChild);
  }

  var result = document.createElement('p');
  result.appendChild(document.createTextNode('File selection cancelled!'));
  fileContainer.appendChild(result);
});
picker.on('error', function(error) {
  console.log('An error occurred: ', error);

  var fileContainer = document.getElementById('file-info');

  // remove all elements
  while (fileContainer.lastChild) {
    fileContainer.removeChild(fileContainer.lastChild);
  }

  var result = document.createElement('p');
  result.appendChild(document.createTextNode('An...