Using this plugin is very easy, in the PHP index page where you will place the uploder, add the below:
<?php
// Initiating the session
session_start();
?>
// Here, we add the HTML container for the uploader
<div id="muwakaba_uploader" class="muwakaba_uploader"></div>
In the JavaScript side, you can load the uploader with full customized preferences as you see here:
muwakaba_uploader
.init
({ uploadArea: document.getElementById("muwakaba_uploader"),
numOfUploads: 15,
live_url_to_images_folder: "www.example.com/my_uploader",
language: "en",
cropped_thumbnail_width: 300,
cropped_thumbnail_height: 300,
compression_rate: 70,
text_on_image: "www.muwakaba.com",
keep_original: 1,
.
.
.
& more
}); To get the uploaded photos names
// They will be saved in the JSON object: muwakaba_uploader.uploadedNames which looks like below // {"1":"1456446242.jpeg", "2":"1456446244.jpeg", "3":"1456446249.jpeg",...} // To extract the names and append them to an array var array_names
= []; for (var o
in muwakaba_uploader.uploadedNames
){ array_names.push(muwakaba_uploader.uploadedNames[o]);
} To check if the upload has completed
//
Use the property muwakaba_uploader.readyToPost as below: if(muwakaba_uploader
.readyToPost
== true){ // Proceed with submitting the form with the extractted photo names to be saved in the database.
}