self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2024-11-24 08:12:24 +02:00
Code Issues Releases Activity

Mobile: Fixes #1045: Display notebooks as a tree in notebook dropdown

Browse Source
This commit is contained in:
Laurent Cozic 2018-12-16 17:18:24 +01:00
parent 6bb09c9c30
commit 3231bfaff0
3 changed files with 42 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
ReactNativeClient/lib/components/Dropdown.js
View File

@ -34,7 +34,7 @@ class Dropdown extends React.Component {
// Dimensions doesn't return quite the right dimensions so leave an extra gap to make
// sure nothing is off screen.
const listMaxHeight = windowHeight;
const listHeight = Math.min(items.length * itemHeight, listMaxHeight); //Dimensions.get('window').height - this.state.headerSize.y - this.state.headerSize.height - 50;
const listHeight = Math.min(items.length * itemHeight, listMaxHeight);
const maxListTop = windowHeight - listHeight;
const listTop = Math.min(maxListTop, this.state.headerSize.y + this.state.headerSize.height);
@ -60,10 +60,6 @@ class Dropdown extends React.Component {
const headerWrapperStyle = Object.assign({}, this.props.headerWrapperStyle ? this.props.headerWrapperStyle : {}, {
height: 35,
// borderWidth: 1,
// borderColor: '#ccc',
//paddingLeft: 20,
//paddingRight: 20,
flex: 1,
flexDirection: 'row',
alignItems: 'center',
@ -91,6 +87,8 @@ class Dropdown extends React.Component {
}
}
if (this.props.labelTransform && this.props.labelTransform === 'trim') headerLabel = headerLabel.trim();
const closeList = () => {
this.setState({ listVisible: false });
}

26
ReactNativeClient/lib/components/screen-header.js
View File

@ -362,18 +362,25 @@ class ScreenHeaderComponent extends Component {
if (folderPickerOptions && folderPickerOptions.enabled) {
const addFolderChildren = (folders, pickerItems, indent) => {
folders.sort((a, b) => {
return a.title.toLowerCase() < b.title.toLowerCase() ? -1 : +1;
});
for (let i = 0; i < folders.length; i++) {
const f = folders[i];
pickerItems.push({ label: ' '.repeat(indent) + ' ' + Folder.displayTitle(f), value: f.id });
pickerItems = addFolderChildren(f.children, pickerItems, indent + 1);
}
return pickerItems;
}
const titlePickerItems = (mustSelect) => {
let output = [];
if (mustSelect) output.push({ label: _('Move to notebook...'), value: null });
for (let i = 0; i < this.props.folders.length; i++) {
let f = this.props.folders[i];
output.push({ label: Folder.displayTitle(f), value: f.id });
}
output.sort((a, b) => {
if (a.value === null) return -1;
if (b.value === null) return +1;
return a.label.toLowerCase() < b.label.toLowerCase() ? -1 : +1;
});
const folderTree = Folder.buildTree(this.props.folders);
output = addFolderChildren(folderTree, output, 0);
return output;
}
@ -381,6 +388,7 @@ class ScreenHeaderComponent extends Component {
<Dropdown
items={titlePickerItems(!!folderPickerOptions.mustSelect)}
itemHeight={35}
labelTransform="trim"
selectedValue={('selectedFolderId' in folderPickerOptions) ? folderPickerOptions.selectedFolderId : null}
itemListStyle={{
backgroundColor: theme.backgroundColor,

22
ReactNativeClient/lib/models/Folder.js
View File

@ -152,6 +152,28 @@ class Folder extends BaseItem {
return getNestedChildren(all, '');
}
static buildTree(folders) {
const idToFolders = {};
for (let i = 0; i < folders.length; i++) {
idToFolders[folders[i].id] = folders[i];
idToFolders[folders[i].id].children = [];
}
const rootFolders = [];
for (let folderId in idToFolders) {
if (!idToFolders.hasOwnProperty(folderId)) continue;
const folder = idToFolders[folderId];
if (!folder.parent_id) {
rootFolders.push(folder);
} else {
idToFolders[folder.parent_id].children.push(folder);
}
}
return rootFolders;
}
static load(id) {
if (id == this.conflictFolderId()) return this.conflictFolder();
return super.load(id);