This demo shows how you can import and assign an image, or load a previously imported image.

var baseSceneId = '254d90dd-eb0c-4618-ba85-bf22668b1a5d';

var api = claraplayer('player');
api.sceneIO.fetchAndUse(baseSceneId).then(function() {
  document.getElementById('upload').onchange = onInputFileChanged;
  document.getElementById('previous').onclick = importPreviousImage;
  document.getElementById('import').onclick = importUrl;
  document.getElementById('baseScene').setAttribute('href','https://clara.io/view/'+baseSceneId);
});

function importUrl(url) {
  var url = document.getElementById('url').value;
  api.assets.importImage(url, { resizeTo: 1024, targetFormat: 'jpg', quality: 60 }).then(handleImport).catch(handleError);
}

function onInputFileChanged(ev) {
  var file = ev.target.files[0];
  api.assets.importImage(file, { resizeTo: 1024 }).then(handleImport).catch(handleError);
}

function handleImport(attrs) {
  api.scene.set({name: 'Physical', plug: 'Material', property: 'baseMap'}, attrs.imageNodeId);
};

function handleError(err) {
  console.log('Import image error: ', err);
}

function importPreviousImage(ev) {
  api.assets.importImage('b358f029-316a-4b95-8043-b3431f5ae3cd').then(handleImport).catch(handleError);
}