Does electron enable drag-and-drop uploads

[wenbingzhang]

Does electron enable drag-and-drop uploads

[lonnywong]

Not yet. trzsz.js will support the feature.

It should be an api of TrzszFilter and TrzszAddon. I may name it uploadFiles.

The client of trzsz.js can listen on the drag event, and call trzsz.js api to upload the dragging files.

See also:
https://www.geeksforgeeks.org/drag-and-drop-files-in-electronjs/

https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/File_drag_and_drop

[wenbingzhang]

I'm looking forward to this feature being developed

[lonnywong]

v0.4.0 supports dragging files and directories to upload.

[wenbingzhang]

Drag and drop uploads work fine, the display is just a little unfriendly.

[lonnywong]

I've try to hide the trz. Sounds like it's not working.

trzsz.js/src/filter.ts

Lines 130 to 139 in 7f43fe4

	if (this.uploadFilesList) {
	const out = stripServerOutput(output);
	if (out === "trz" || out === "trz -d") {
	this.writeToTerminal("\r\n");
	return;
	}
	if (out === "" || out === '"') {
	return;
	}
	}

Could you try to figure out why?

[lonnywong]

What's the type of the server output? Blob, or Uint8Array, or ArrayBuffer?

[wenbingzhang]

trzsz.js/src/filter.ts

Line 233 in 7f43fe4

this.sendToServer(hasDir ? "trz -d\r" : "trz\r");

Although the complete command is sent here, "processServerOutput" may receive split characters.

[lonnywong]

Maybe. Could you print some log in here?

trzsz.js/src/filter.ts

Lines 130 to 139 in 7f43fe4

	if (this.uploadFilesList) {
	const out = stripServerOutput(output);
	if (out === "trz" || out === "trz -d") {
	this.writeToTerminal("\r\n");
	return;
	}
	if (out === "" || out === '"') {
	return;
	}
	}

Figure out the server output, then we can skip it.

[wenbingzhang]

[wenbingzhang]

I've tested it many times. Sometimes it's a different result.

[lonnywong]

Is it Uint8Array? It may has some characters unprintable. Could you print the char codes too?

[lonnywong]

I've tested it many times. Sometimes it's a different result.

Collect all the cases, we can do it. We need to print each ascii code.

[wenbingzhang]

[wenbingzhang]

trzsz.js/src/filter.ts

Lines 130 to 139 in 7f43fe4

	if (this.uploadFilesList) {
	const out = stripServerOutput(output);
	if (out === "trz" || out === "trz -d") {
	this.writeToTerminal("\r\n");
	return;
	}
	if (out === "" || out === '"') {
	return;
	}
	}

If no breakpoint is set, the returned data is the same, but after setting a breakpoint, the automatic upload will be disabled and a file selection dialog will be prompted.

[lonnywong]

Could you print the printable log and char codes together? It would be easy to analyze. Thanks very much.

[lonnywong]

trzsz.js/src/filter.ts

Lines 130 to 139 in 7f43fe4

	if (this.uploadFilesList) {
	const out = stripServerOutput(output);
	if (out === "trz" || out === "trz -d") {
	this.writeToTerminal("\r\n");
	return;
	}
	if (out === "" || out === '"') {
	return;
	}
	}

If no breakpoint is set, the returned data is the same, but after setting a breakpoint, the automatic upload will be disabled and a file selection dialog will be prompted.

The reason is:

trzsz.js/src/filter.ts

Lines 235 to 245 in 7f43fe4

	// cleanup if it's not uploading
	setTimeout(() => {
	if (this.uploadFilesList) {
	this.uploadFilesList = null;
	this.uploadFilesResolve = null;
	if (this.uploadFilesReject) {
	this.uploadFilesReject("Upload does not start");
	this.uploadFilesReject = null;
	}
	}
	}, 1000);

[wenbingzhang]

I think "trz" can be displayed in "xterm", but it needs the correct line break.

[lonnywong]

I think "trz" can be displayed in "xterm", but it needs the correct line break.

But we need to figure out the server output first. Could you print the printable log and ascii codes together?

[wenbingzhang]

Is that right?

[lonnywong]

That's it. Thanks.
Looks like I have to learn more about vt100.

[lonnywong]

@wenbingzhang If just remove these code, What will it show?

trzsz.js/src/filter.ts

Lines 130 to 139 in 7f43fe4

	if (this.uploadFilesList) {
	const out = stripServerOutput(output);
	if (out === "trz" || out === "trz -d") {
	this.writeToTerminal("\r\n");
	return;
	}
	if (out === "" || out === '"') {
	return;
	}
	}

[wenbingzhang]

[lonnywong]

It looks not bad.

Type some garbage into the command line without a carriage return, what will it show after dragging files to upload?

And If move the cursor to the middle of the garbage, what will it show after dragging files to upload?

[wenbingzhang]

[lonnywong]

All right. I want to keep the garbage unchanged.

Since it doesn't work in some environments ( e.g., yours ), I'm going to remove it.

[lonnywong]

Should be solved with v0.4.1.

[wenbingzhang]

It has been updated and tested, and it works fine.

[lonnywong]

@wenbingzhang

Thanks for your feedback.