File uploads

Presentation

Management of the file uploads.
Source code of demo functions (myFuncX) is available in demo.js file.

Even if the file extension and size are checked before the form upload, it is important that the receiving script check again the data.

01) Upload dialog with one file (test 1) (test 2) (test 404) (test console)
apijs.upload.sendFile(string title, string action, string input, number onemax, string exts, function callback, mixed args, string icon) : boolean

02) Upload dialog with multiple files (test 1) (test 2) (test 404) (test console)
apijs.upload.sendFiles(string title, string action, string input, number onemax, number allmax, string exts, function callback, mixed args, string icon) : boolean

File processing

Here is a minimal implementation of the file which processes the file before recording it on the server.

autumn
borland
bw
colorful
default
emacs
friendly
fruity
github
manni
monokai
murphy
native
pastie
perldoc
tango
trac
vim
vs
zenburn
php// stop output buffering with apache
// <Location ~ "this_file">
//     php_flag zlib.output_compression off
// </Location>
// stop output buffering with lighttpd
// $HTTP["url"] =~ "this_file" {
//     server.stream-response-body = 2
// }
// stop output buffering in the script (https://stackoverflow.com/a/25835968)
// the echo move the progress bar to 100%
header('Content-Encoding: chunked');
header('Content-Type: text/plain; charset=utf-8');
header('Cache-Control: no-cache, must-revalidate');
ini_set('output_buffering', (PHP_VERSION_ID < 80100) ? '0' : 0);
ini_set('implicit_flush', (PHP_VERSION_ID < 80100) ? '1' : 1);
ob_implicit_flush(true);
for ($i = 0; $i < ob_get_level(); $i++)
	ob_end_clean();
echo ' ';

// action
try {
	$tmpFile = tempnam(sys_get_temp_dir(), ''); // /tmp/anDY8jnU
	// $_FILES['myInputImage']['tmp_name'] if one file sent, else $_FILES['myInputImage']['tmp_name'][0]...
	move_uploaded_file($_FILES['myInputImage']['tmp_name'], $tmpFile);
	echo 'success-'.basename($tmpFile);	 // success-anDY8jnU
}
catch (Throwable $t) {
	echo $t->getMessage();
}

When the processing works well, the file which processes the file returns success-fileid.
The fileid is transmitted to the callback function as follow: callback(fileid, args).

Additional information

For the icon parameter the following CSS classes:
- can be used: notransition lock
- can not be used: information confirmation options upload progress waiting photo video iframe ajax start ready end reduce mobile tiny fullscreen slideshow loading download print error warning

API

autumn
borland
bw
colorful
default
emacs
friendly
fruity
github
manni
monokai
murphy
native
pastie
perldoc
tango
trac
vim
vs
zenburn
jsapijs.i18n.translate("word");              // return string
apijs.i18n.translateNode("word");          // return domelement
apijs.i18n.changeLang("fr");               // return boolean

apijs.dialog.dialogInformation(...);       // return boolean
apijs.dialog.dialogConfirmation(...);      // return boolean
apijs.dialog.dialogFormOptions(...);       // return boolean
apijs.dialog.dialogFormUpload(...);        // return boolean
apijs.dialog.dialogProgress(...);          // return boolean
apijs.dialog.dialogWaiting(...);           // return boolean
apijs.dialog.dialogPhoto(...);             // return boolean
apijs.dialog.dialogVideo(...);             // return boolean
apijs.dialog.dialogIframe(...);            // return boolean
apijs.dialog.dialogAjax(...);              // return boolean
apijs.dialog.actionClose();                // return void
apijs.dialog.add("string1", "string2");    // return dialog object
apijs.dialog.remove("string1", "string2"); // return dialog object
apijs.dialog.toggle("string1", "string2"); // return dialog object
apijs.dialog.has("string1", "string2");    // return boolean (true if one found)

apijs.upload.sendFile(...);                // return boolean
apijs.upload.sendFiles(...);               // return boolean

apijs.slideshow.show("slideshow.2.1");     // return boolean
apijs.slideshow.actionFirst();             // return boolean
apijs.slideshow.actionPrev();              // return boolean
apijs.slideshow.actionNext();              // return boolean
apijs.slideshow.actionLast();              // return boolean

// default config //////////////////////////////////////////
apijs.config.lang = "auto";
apijs.config.debug = false;

apijs.config.dialog.closeOnClick = false;
apijs.config.dialog.restrictNavigation = true;
apijs.config.dialog.player = true; // true|false|userFunction(videoTag, url)

apijs.config.slideshow.ids = "slideshow";
apijs.config.slideshow.anchor = true;

apijs.config.upload.tokenName = "X-CSRF-Token";
apijs.config.upload.tokenValue = null;

// events //////////////////////////////////////////////////
self.addEventListener("apijsbeforeload", function () {

	apijs.dialog.htmlContentOrig = apijs.dialog.htmlContent;
	apijs.dialog.htmlContent = function (title, text) {
		alert(title);
		this.htmlContentOrig(title, text);
	};

	if (!apijs.i18n.data.hasOwnProperty("xy")) apijs.i18n.data.xy = {};
	apijs.i18n.data.xy["xyz"] = "Test";

	apijs.config.debug = true;
});

self.addEventListener("apijsload", function () {
	console.log("ready");
});

self.addEventListener("apijsajaxresponse", function (ev) {
	console.log(ev.detail);
});