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

Change code and css for new folder creation

parent a0217b64
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
packages/file-handling/src/nextcloud-file-picker.js
+ 51
− 38
View file @ cde0ec50
...@@ -334,6 +334,9 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -334,6 +334,9 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
} else { } else {
// TODO // TODO
console.log('reached'); console.log('reached');
if (this._('#tf-new-folder')) {
this._('#tf-new-folder').focus();
}
} }
}, },
rowDblClick: (e, row) => { rowDblClick: (e, row) => {
...@@ -389,6 +392,8 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -389,6 +392,8 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
// that.addFolder(); // that.addFolder();
// } // }
// }); // });
}); });
} }
...@@ -1480,18 +1485,22 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -1480,18 +1485,22 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
if (this._('.addRowAnimation')) { if (this._('.addRowAnimation')) {
this._('.addRowAnimation').classList.remove('addRowAnimation'); this._('.addRowAnimation').classList.remove('addRowAnimation');
} }
// this._('#new-folder-wrapper').classList.toggle('hidden'); this._('#new-folder-wrapper').classList.toggle('hidden');
// if (this._('#new-folder-wrapper').classList.contains('hidden')) { if (this._('#new-folder-wrapper').classList.contains('hidden')) {
// this._('#add-folder-button').setAttribute("name", "plus"); this._('#add-folder-button').setAttribute("name", "plus");
// this._('#add-folder-button').setAttribute("title", i18n.t('nextcloud-file-picker.add-folder-open')); this._('#add-folder-button').setAttribute("title", i18n.t('nextcloud-file-picker.add-folder-open'));
// } else { } else {
// this._('#add-folder-button').setAttribute("name", "close"); this._('#add-folder-button').setAttribute("name", "close");
// this._('#add-folder-button').setAttribute("title", i18n.t('nextcloud-file-picker.add-folder-close')); this._('#add-folder-button').setAttribute("title", i18n.t('nextcloud-file-picker.add-folder-close'));
// this._('#new-folder').focus(); this._('#new-folder').focus();
// } }
}
// TODO move this to new function addOpenFolderTableEntry() {
const i18n = this._i18n;
if (this._('.addRowAnimation')) {
this._('.addRowAnimation').classList.remove('addRowAnimation');
}
let props = {permissions: 'RGDNVCK'}; let props = {permissions: 'RGDNVCK'};
var row = { var row = {
...@@ -1507,6 +1516,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -1507,6 +1516,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
this._('#new-folder-row').setAttribute('style', 'background: #259207; color: white'); this._('#new-folder-row').setAttribute('style', 'background: #259207; color: white');
this._('#new-folder-row').querySelector("div.tabulator-cell:nth-child(1) > div > span.tabulator-responsive-collapse-toggle-open").classList.add('new-folder-selected'); this._('#new-folder-row').querySelector("div.tabulator-cell:nth-child(1) > div > span.tabulator-responsive-collapse-toggle-open").classList.add('new-folder-selected');
this._('#new-folder-row').querySelector("div.tabulator-cell:nth-child(1) > div > span.tabulator-responsive-collapse-toggle-close").classList.add('new-folder-selected');
// this._('#directory-content-table').querySelector("div.tabulator-tableHolder > div.tabulator-table > div.tabulator-row:nth-child(1) > div.tabulator-cell:nth-child(3)") // this._('#directory-content-table').querySelector("div.tabulator-tableHolder > div.tabulator-table > div.tabulator-row:nth-child(1) > div.tabulator-cell:nth-child(3)")
// .classList.add('blinking'); // .classList.add('blinking');
...@@ -1538,7 +1548,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -1538,7 +1548,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
}) })
this._('#tf-new-folder').focus(); // this._('#tf-new-folder').focus();
} }
addNewFolder() { addNewFolder() {
...@@ -1787,6 +1797,11 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -1787,6 +1797,11 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
${commonStyles.getRadioAndCheckboxCss()} ${commonStyles.getRadioAndCheckboxCss()}
${fileHandlingStyles.getFileHandlingCss()} ${fileHandlingStyles.getFileHandlingCss()}
.tabulator-row.no-select.tabulator-selected {
background-color: white;
color: #333;
}
input[type=text]#tf-new-folder:focus { input[type=text]#tf-new-folder:focus {
border: none; border: none;
background: transparent; background: transparent;
...@@ -1799,42 +1814,40 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -1799,42 +1814,40 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
} }
input[type=text]#tf-new-folder::placeholder { input[type=text]#tf-new-folder::placeholder {
color: #000; color: #333;
font-weight: 200; font-weight: 300;
} }
input[type=text]#tf-new-folder { #tf-new-folder::-webkit-input-placeholder {
border: 0px; color: #333;
background: transparent; font-weight: 300;
width: 100%;
height: 100%;
} }
.new-folder-selected::after { #tf-new-folder:-moz-placeholder {
filter: invert(100%); color: #333;
font-weight: 300;
} }
.blinking::after { #tf-new-folder::-moz-placeholder {
// animation: blink 1s linear infinite alternate; color: #333;
content: ""; font-weight: 300;
margin-left: 2px;
width: 2px;
height: 1rem;
background: white;
display: inline-block;
animation: cursor-blink 1.5s steps(2) infinite;
} }
.blinking { #tf-new-folder::-ms-input-placeholder {
display: flex; color: #333;
align-items: center; font-weight: 300;
gap: 2px;
} }
@keyframes cursor-blink { input[type=text]#tf-new-folder {
0% { border: 0px;
opacity: 0; background: transparent;
width: 100%;
height: 100%;
margin-left: -8px;
} }
.new-folder-selected::after {
filter: invert(100%);
} }
.visible { .visible {
...@@ -2465,7 +2478,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) { ...@@ -2465,7 +2478,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
</a> </a>
</li> </li>
<li class="${classMap({hidden: !this.directoriesOnly})}"> <li class="${classMap({hidden: !this.directoriesOnly})}">
<a class="${classMap({inactive: this.isInRecent || this.isInFavorites || this.disableRowClick})}" @click="${() => { this.openAddFolderDialogue(); }}"> <a class="${classMap({inactive: this.isInRecent || this.isInFavorites || this.disableRowClick})}" @click="${() => { this.addOpenFolderTableEntry(); }}">
${i18n.t('nextcloud-file-picker.add-folder')} ${i18n.t('nextcloud-file-picker.add-folder')}
</a> </a>
</li> </li>
... ...
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment