.hide file feature to hide files and folders in project
Closed this issue · 1 comments
Hi! I have a Feature request:)
Whenever I am working with any project, there are almost always a number of files and folders which I seldom interact with. Being a neat freak, I think it would be really great if the tree view could hide certain files and folders for each individual project regardless of whether it is set up as a git project or not.
My suggestion is to create a package that reads certain files with name '.hide' within the project folder. These files can be located at the top of the project folder tree, or inside any other subfolder. Inside these '.hide' files, there are paths to files and folders that are meant to be hidden from the tree-view.
If a '.hide' file is located inside a subfolder, the path inside the '.hide' files should only be valid from within that folder and down.
I have hacked a bit with this, trying to create the package myself. And I have also found two already existing packages which almost do what I have in mind. One called dot-hide, and another called hide-files. The problem with the first is that is doesn't hide files for individual projects, but for the global list of ignored files, the main problem with the second is that it doesn't store wich files should be hidden whenever the project window is closed, and it also is quite cumbersome to select each file and set it to be hidden with a key shortcut/rightmouseclick.
You may think, why not just use VCS ignored names? Sometimes you don't want your project to be set up as a git project, and you also sometimes want to see some of the files that is ignored when commiting in git.
My first attempt to create this package was to manipulate the dom with js. But now after my second attempt I think it would be much better to simply use css. This is because it wouldn't be as necessary to listen tho changes to the DOM, when adding files/folders/opening folder etc...
My suggestion is that after the the package has read all the '.hide' files and found all the paths to each file and folder that is to be hidden, it should simply target each individual file and folder, using css selectors.
I have had success with selecting the files in DOM using only css; [data-path="/path/to/file"].icon-file-text { display:none }. This hides the file correctly.
But I can't seem to target the folders in the same way. The best solution would be to add a data attribute to each list item inside the tree-view. This is because it is impossible to select the parent of an element using only css selectors.
Inside the code for the tree-view package, simply add f. ex data-someNameOfDataAttr="/path/to/file" to the list item element. Then it would be possible to easily create the feature I am asking for.
I have never successfully created and shipped a package for atom mostly because I don't have enough skill yet. So any help here would be appreciated!
Thanks for reading!
I have found a solution to what i suggested.
In the file lib/directory-view.js, add the following at line 17 with a newline after:
this.element.dataset.locateEntry = this.directory.path
Also, in the file lib/file-view.js, add the following at line 15 with a newline after:
this.element.dataset.locateEntry = this.file.path
Regarding the name of the custom data attribute locateEntry: What this is named is really not important, I suggest 'locateEntry' because it describes the purpose of this feature request.
Any other custom data attribute name is welcomed to be discussed here.
What is the overall purpose of this?
This change will allow easy css selection of the elements in the tree view, which is currently not possible. Mainly because it is impossible to select a parent using css selectors. This change will make it easier to hack, or create packages for the tree view.