//Elements: uploadButton, submit Button (disabled on load), gallery (collapsed on load), Loader (html component; optional; collapsed on load)

//CODE

import wixUsers from "wix-users";

import wixData from "wix-data";

let userId = wixUsers.currentUser.id;

let galleryItems = [];

let toSave = [];

$w.onReady(function () {

$w("#uploadButton1").fileType = "Image";

$w("#uploadButton1").onChange( () => {

if ($w("#uploadButton1").value.length > 0) {

   $w("#submit").disable();

   $w("#uploadButton1").buttonLabel = "Loading...";

    $w("#loader").expand();

$w("#uploadButton1").startUpload()

.then( (uploadedFile) => {

     galleryItems.push({type: "image", src: uploadedFile.url});

     $w("#gallery1").items = galleryItems;

      $w("#loader").collapse();

     $w("#gallery1").expand();

     toSave.push({image: uploadedFile.url, userId: userId});

     $w("#submit").enable();

     toSave.length > 1 ? $w("#submit").label = "Save Images" : $w("#submit").label = "Save Image";

$w("#uploadButton1").buttonLabel = "Add another image";

    $w("#uploadButton1").reset();

} )

.catch( (uploadError) => {

console.log(`File upload error: ${uploadError.errorCode}`);

console.log(uploadError.errorDescription);

} );

}

} );

$w("#submit").onClick((event) => {

  $w("#submit").label = "saving...";

  $w("#uploadButton1").disable();

  $w("#submit").disable();

  wixData.bulkInsert("Pictures", toSave)

  .then(() => {

    $w("#submit").label = "✓ Saved";

    $w("#submit").disable();

    $w("#gallery1").items = [];

    $w("#gallery1").collapse();

    galleryItems = [];

    toSave = [];

    $w("#uploadButton1").buttonLabel = "Add an Image";

    $w("#uploadButton1").enable();

  })

})

});

​

​

​