Skip to content
Snippets Groups Projects
Commit c975cc27 authored by Tögl, Christina's avatar Tögl, Christina
Browse files

Add cancel functionality, improve numbering

parent 7d99536c
No related branches found
No related tags found
1 merge request!1Filehandling overwrite dialog
Pipeline #12579 passed
Stage: test
Hide whitespace changes
Inline Side-by-side
packages/file-handling/src/dbp-nextcloud-file-picker.js
+ 76
− 50
View file @ c975cc27
...@@ -40,6 +40,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -40,6 +40,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
this.uploadFileObject = null; this.uploadFileObject = null;
this.uploadFileDirectory = null; this.uploadFileDirectory = null;
this.fileList = []; this.fileList = [];
this.fileNameCounter = 0;
} }
static get scopedElements() { static get scopedElements() {
...@@ -381,12 +382,15 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -381,12 +382,15 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
uploadFiles(files, directory) { uploadFiles(files, directory) {
this.fileList = files; this.fileList = files;
this.fileNameCounter = 1;
this.uploadFile(directory); this.uploadFile(directory);
} }
async uploadFile(directory) { async uploadFile(directory) {
if(this.fileList.length !== 0) { if(this.fileList.length !== 0) {
let file = this.fileList[0]; let file = this.fileList[0];
console.log("FileList length: ", this.fileList.length);
console.log("FileList: ", this.fileList);
this.replaceFilename = file.name; this.replaceFilename = file.name;
console.log("before one file finished"); console.log("before one file finished");
let path = directory + "/" + file.name; let path = directory + "/" + file.name;
...@@ -397,14 +401,10 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -397,14 +401,10 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
.putFileContents(path, file, { overwrite: false, onUploadProgress: progress => { .putFileContents(path, file, { overwrite: false, onUploadProgress: progress => {
console.log(`Uploaded ${progress.loaded} bytes of ${progress.total}`); console.log(`Uploaded ${progress.loaded} bytes of ${progress.total}`);
}}).then(function() { }}).then(function() {
that.loading = false; that.loading = false;
that.statusText = ""; that.statusText = "";
console.log("try finished"); console.log("try finished");
console.log("after one file finished");
that.fileList.shift(); that.fileList.shift();
console.log("FileList: ", that.fileList);
that.uploadFile(directory); that.uploadFile(directory);
}).catch(error => { }).catch(error => {
console.error(error.message); console.error(error.message);
...@@ -414,8 +414,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -414,8 +414,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
if(error.message.search("412") !== -1) { if(error.message.search("412") !== -1) {
this.replaceModalDialog(file, directory); this.replaceModalDialog(file, directory);
} }
} });
);
} }
else { else {
this.loading = false; this.loading = false;
...@@ -424,11 +423,10 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -424,11 +423,10 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
{ bubbles: true, composed: true }); { bubbles: true, composed: true });
this.dispatchEvent(event); this.dispatchEvent(event);
} }
} }
async uploadFileWithNewName() { async uploadFileAfterConflict() {
console.log("uploadFileAfterConflict")
let path = ""; let path = "";
let overwrite = false; let overwrite = false;
let file = this.uploadFileObject; let file = this.uploadFileObject;
...@@ -436,6 +434,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -436,6 +434,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
if(this._("input[name='replacement']:checked").value === "ignore") { if(this._("input[name='replacement']:checked").value === "ignore") {
MicroModal.close(this._("#replace-modal")); MicroModal.close(this._("#replace-modal"));
console.log("############ ignore");
this.fileList.shift(); this.fileList.shift();
this.uploadFile(directory); this.uploadFile(directory);
return true; return true;
...@@ -444,80 +443,109 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -444,80 +443,109 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
path = directory + "/" + this._("#replace-filename").value; path = directory + "/" + this._("#replace-filename").value;
console.log("############# new name checked"); console.log("############# new name checked");
this.replaceFilename = this._("#replace-filename").value; this.replaceFilename = this._("#replace-filename").value;
//this.fileNameCounter++; //TODO check
} }
else { else {
path = directory + "/" + this.uploadFileObject.name; path = directory + "/" + this.uploadFileObject.name;
overwrite = true; overwrite = true;
console.log("############### replace checked");
} }
let that = this;
// https://github.com/perry-mitchell/webdav-client#putfilecontents // https://github.com/perry-mitchell/webdav-client#putfilecontents
let contents = await this.webDavClient let contents = await this.webDavClient
.putFileContents(path, file, { overwrite: overwrite, onUploadProgress: progress => { .putFileContents(path, file, { overwrite: overwrite, onUploadProgress: progress => {
console.log(`Uploaded ${progress.loaded} bytes of ${progress.total}`); console.log(`Uploaded ${progress.loaded} bytes of ${progress.total}`);
}}).then(content => { }}).then(content => {
this.loading = false; that.loading = false;
this.statusText = ""; that.statusText = "";
console.log("try finished"); console.log("FileList length: ", this.fileList.length); //TODO
console.log("after one file finished");
this.fileList.shift();
console.log("FileList length: ", this.fileList.length);
console.log("########## after one file finished");
MicroModal.close(this._("#replace-modal")); MicroModal.close(this._("#replace-modal"));
this.uploadFile(directory); that.fileList.shift();
that.uploadFile(directory);
}).catch(error => { }).catch(error => {
console.error(error.message); console.error(error.message);
this.loading = false; that.loading = false;
this.statusText = error.message; that.statusText = error.message;
console.log("----", error.message);
if(error.message.search("412") !== -1) { if(error.message.search("412") !== -1) {
MicroModal.close(this._("#replace-modal")); MicroModal.close(that._("#replace-modal"));
this.replaceModalDialog(file, directory); that.replaceModalDialog(file, directory);
} }
}); });
this.fileNameCounter = 1;
} }
/** /**
*
*
* *
*/ */
replaceModalDialog(file, directory) { replaceModalDialog(file, directory) {
console.log("zeig uns an.");
this.uploadFileObject = file; this.uploadFileObject = file;
this.uploadFileDirectory = directory; this.uploadFileDirectory = directory;
MicroModal.show(this._('#replace-modal')); MicroModal.show(this._('#replace-modal'));
} }
/** /**
* Returns a filename with the next counter number.
* *
* * @returns {string} The next filename
*
*/ */
getNextFilename() { getNextFilename() { //TODO
let nextFilename = "";
let splitFilename = this.replaceFilename.split("."); let splitFilename = this.replaceFilename.split(".");
let nextFilename = splitFilename[0] + "(1)";
let splitBracket = splitFilename[0].split('(')
if(splitBracket.length > 1) {
let numberString = splitBracket[1].split(')');
if (numberString.length > 1 && !isNaN(parseInt(numberString[0]))) {
let number = parseInt(numberString[0]);
this.fileNameCounter = number + 1;
nextFilename = splitBracket[0] + "(" + this.fileNameCounter + ")";
}
else {
nextFilename = splitFilename[0] + "(" + this.fileNameCounter + ")";
}
}
else {
nextFilename = splitFilename[0] + "(" + this.fileNameCounter + ")";
}
if(splitFilename.length > 1) { if(splitFilename.length > 1) {
for(let i = 1; i < splitFilename.length; i++) { for(let i = 1; i < splitFilename.length; i++) {
nextFilename = nextFilename + "." + splitFilename[i]; nextFilename = nextFilename + "." + splitFilename[i];
} }
} }
this.fileNameCounter++;
return nextFilename; return nextFilename;
} }
/** /**
* Disables or enables the input field for the new file name
*/
disableInputField() {
this._("#replace-filename").disabled = !this._("#replace-new-name").checked;
}
/**
* Returns text for the cancel button depending on number of files
* *
* @returns {string} correct cancel text
*/
getCancelText() {
if(this.fileList.length > 1) {
return i18n.t('nextcloud-file-picker.replace-cancel-all');
}
return i18n.t('nextcloud-file-picker.replace-cancel');
}
/**
* *
*/
cancelEverything() {
this.fileList = [];
}
/**
* *
*/ */
disableInputField() { repeatForAllConflicts() {
if(!this._("#replace-new-name").checked) { //TODO
this._("#replace-filename").disabled = true;
}
else {
this._("#replace-filename").disabled = false;
}
} }
/** /**
...@@ -800,15 +828,15 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -800,15 +828,15 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
padding: 30px; padding: 30px;
max-height: 470px; max-height: 460px;
min-height: 470px; min-height: 460px;
min-width: 400px; min-width: 400px;
max-width: 190px; max-width: 190px;
} }
#replace-modal-box .modal-header { #replace-modal-box .modal-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-evenly;
align-items: baseline; align-items: baseline;
} }
...@@ -848,7 +876,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -848,7 +876,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
} }
#replace-modal-box .modal-footer { #replace-modal-box .modal-footer {
padding-top: 30px; padding-top: 15px;
} }
#replace-modal-box .modal-footer .modal-footer-btn { #replace-modal-box .modal-footer .modal-footer-btn {
...@@ -939,8 +967,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -939,8 +967,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
max-width: 100%; max-width: 100%;
} }
} }
`; `;
} }
...@@ -1016,7 +1043,6 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -1016,7 +1043,6 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
<span style="word-break: break-all;">${this.replaceFilename}</span> <span style="word-break: break-all;">${this.replaceFilename}</span>
${i18n.t('nextcloud-file-picker.replace-title-2')}. ${i18n.t('nextcloud-file-picker.replace-title-2')}.
</h2> </h2>
<button title="${i18n.t('file-sink.modal-close')}" class="modal-close" aria-label="Close modal" data-micromodal-close> <button title="${i18n.t('file-sink.modal-close')}" class="modal-close" aria-label="Close modal" data-micromodal-close>
<dbp-icon title="${i18n.t('file-sink.modal-close')}" name="close" class="close-icon"></dbp-icon> <dbp-icon title="${i18n.t('file-sink.modal-close')}" name="close" class="close-icon"></dbp-icon>
</button> </button>
...@@ -1042,12 +1068,12 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -1042,12 +1068,12 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
</main> </main>
<footer class="modal-footer"> <footer class="modal-footer">
<div class="modal-footer-btn"> <div class="modal-footer-btn">
<button class="button" data-micromodal-close aria-label="Close this dialog window">${i18n.t('nextcloud-file-picker.replace-cancel')}</button> <button class="button" data-micromodal-close aria-label="Close this dialog window" @click="${() => {this.cancelEverything();}}">${this.getCancelText()}</button>
<button class="button select-button is-primary" @click="${() => {this.uploadFileWithNewName();}}">OK</button> <button class="button select-button is-primary" @click="${() => {this.uploadFileAfterConflict();}}">OK</button>
</div> </div>
<div> <div>
<input type="checkbox" id="replace_mode_all" name="replace_mode_all" value="replace_mode_all"> <input type="checkbox" id="replace_mode_all" name="replace_mode_all" value="replace_mode_all" @click="${() => {this.repeatForAllConflicts();}}>
<label for="replace_mode_all">Für alle übernehmen</label> <label for="replace_mode_all">${i18n.t('nextcloud-file-picker.replace-mode-all')}</label>
</div> </div>
</footer> </footer>
</div> </div>
......
packages/file-handling/src/i18n/de/translation.json
+ 2
− 1
View file @ c975cc27
...@@ -56,7 +56,8 @@ ...@@ -56,7 +56,8 @@
"replace-new_name": "Neuer Name", "replace-new_name": "Neuer Name",
"replace-replace": "Ersetzen", "replace-replace": "Ersetzen",
"replace-skip": "Überspringen", "replace-skip": "Überspringen",
"replace-cancel": "Alle abbrechen", "replace-cancel": "Abbrechen",
"replace-cancel-all": "Alle abbrechen",
"replace-mode-all": "Für alle zukünftigen Konflikte übernehmen" "replace-mode-all": "Für alle zukünftigen Konflikte übernehmen"
} }
} }
packages/file-handling/src/i18n/en/translation.json
+ 2
− 1
View file @ c975cc27
...@@ -56,7 +56,8 @@ ...@@ -56,7 +56,8 @@
"replace-new_name": "New Name", "replace-new_name": "New Name",
"replace-replace": "Replace", "replace-replace": "Replace",
"replace-skip": "Ignore", "replace-skip": "Ignore",
"replace-cancel": "Cancel all", "replace-cancel": "Cancel",
"replace-cancel-all": "Cancel all",
"replace-mode-all": "Do this for the next conflicts" "replace-mode-all": "Do this for the next conflicts"
} }
} }
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment