Components.TreeView.Model

[chesdenis]

Target: Get a feature that can manipulate elements in tree structure. Images: Components.TreeView The feature must have these sub-features:

• [ ] add elements to the root of tree structure;
• [ ] add elements to the any element of tree structure;
• [ ] clear children elements in the any element of tree structure;
• [ ] replace elements in the any element of tree structure;
• [ ] expand and collapse elements

For completing this issue you must develop a simple ts class that have collection of entities. Each entity must be implement an interface that have these properties:

• Id
• Title
• Level
• Url
• IsExpanded
• IsHidden
• IsShowLoading
• Children
• [ ] The ts class must have public properties|methods and private internal methods. For example when i call method like 'expand', - internal methods must update IsHidden and IsExpanded properties to appropriate values.
• [ ] I think that ITreeEntity can be like this:

interface ITreeEntity{
    Id:number;
    Title:string;
    Level:number;
    Url:string;
    IsExpanded:boolean;
    IsHidden:boolean;
    IsShowLoading:boolean;
    Children:ITreeEntity[];
}

• [ ] I think that TreeModel class can be like this:

class TreeModel {
    addToRoot(treeEntity: ITreeEntity): void {
        console.log("adding " + treeEntity.Title + " to root...")
    }

    addAsChild(treeEntity: ITreeEntity, parentTreeEntity: ITreeEntity): void {
        console.log(`adding ${treeEntity.Title} to ${parentTreeEntity.Title}`);
    }

    expand(treeEntity: ITreeEntity): void {
        console.log(`expand ${treeEntity.Title}  `);
    }
    collapse(treeEntity: ITreeEntity): void {
        console.log(`collapse ${treeEntity.Title}  `);
    }
}

• [ ] As the developer I want to use this class like below:

class FsFolder implements  ITreeEntity {
    Id:number;
    Title:string;
    Level:number;
    Url:string;
    IsExpanded:boolean;
    IsHidden:boolean;
    IsShowLoading:boolean;
    Children:ITreeEntity[];
}

let testTreeEntity1:ITreeEntity = new FsFolder();
testTreeEntity1.Title = "testTreeEntity1";

let testTreeEntity2:ITreeEntity = new FsFolder();
testTreeEntity2.Title = "testTreeEntity2";

let treeModel:TreeModel = new TreeModel();

treeModel.addToRoot(testTreeEntity2);
treeModel.addAsChild(testTreeEntity1, testTreeEntity2);

treeModel.expand(testTreeEntity2);
treeModel.collapse(testTreeEntity2);

P.S. Please if you start developing this issue, create a separate branch from branch 'development' and after complete development create the merge request to 'development' branch

[ivanblindyuk]

What about TreeEntity class? Should it be a separate class or an internal class of TreeModel?

[chesdenis]

I think we need a separate interface ITreeEntity and this interface must be in a separate file.

[ivanblindyuk]

Its all clear with interface. But as I understand TreeModel should be a class that contains array Entities of type, which implemets ITreeEntity (for example TreeEntity class). And when client wants to display folders info, we load our tree structure into TreeModel instance, but all real operations do with Entities property. Am I right?

[chesdenis]

Its all clear with interface. But as I understand TreeModel should be a class that contains array Entities of type, which implemets ITreeEntity (for example TreeEntity class). And when client wants to display folders info, we load our tree structure into TreeModel instance, but all real operations do with Entities property. Am I right?

Yes, You are right:) I have updated the description, so now I think it's more clear.

[ivanblindyuk]

Yes, now its clear. One more question about id: how do you think it should calculate - relative to the whole tree (each id would be unique) or relative to the level in which it is situated?

[chesdenis]

I think it should be unique. This feature give us ability to create an internal dictionary in TreeModel and use it to search any node very fast through all hierarchical data.