
Octotree: the missing GitHub tree view (Chrome extension) - yblu
https://chrome.google.com/webstore/detail/octotree/bkhaagjahfmjljalopjnoealnfndnagc
======
yblu
I built this to scratch my own itch, as somebody who frequently reads GitHub
code and feels annoyed having to click countless of links to navigate through
a large project. Hope it is useful for other people too.

~~~
toyg
Mad props. Any chance of a Safari port? Its extension system is not very
different from Chrome's. EDIT: and you shouldn't be shy to plug your gittip
page: [https://www.gittip.com/buunguyen/](https://www.gittip.com/buunguyen/)

~~~
xdissent
Here's a Safari version:
[https://github.com/xdissent/octotree/releases/tag/v1.0.0-saf...](https://github.com/xdissent/octotree/releases/tag/v1.0.0-safari)

~~~
yblu
You can find both Firefox and Safari prebuilt packages here:
[https://github.com/buunguyen/octotree/tree/master/dist](https://github.com/buunguyen/octotree/tree/master/dist).

~~~
toyg
Lovely, it works great :)

------
jburwell
To me, the lack a fast tree browser has been one of the biggest weakness of
the Github interface. This plugin solves that problem exceeding well. Github
should hire the author, and officially fund his efforts to make it a first
class feature that does not require a plugin.

~~~
rplnt
Honest question: What is this good for? I guess I don't use github (or any
other visual vcs) enough.. but I really can't see any point in browsing file
structure of the repo in a web browser.

~~~
fishtoaster
I browse repos on github pretty frequently. Some use cases:

\- It's someone else's repo (eg, a gem I'm using), and I just want to see one
line real quick, rather than cloning the whole project locally and finding it
there.

\- It's my repo, but I my local working copy is on a different branch or has
uncommitted changes, so I don't want to bother stashing + changing branches
just to look up one line

\- I'm poking around several repos that I have no intention of using- eg,
looking at an interview candidate's public repos

~~~
staticshock
For the "my repo, wrong branch" use case, you have some options:

    
    
      git show other-branch:path/to/file
    

or:

    
    
      git grep -e pattern other-branch

~~~
skyebook
git-grep is indescribably awesome. To be fair though, I search github pretty
frequently because it means I can search issues also. If issues were git repos
themselves it would be a different ballgame.

------
bnj
Wow, giving it a quick try I can't believe how fast it is. This is one of
those things that I've always desperately needed, and I never knew until now.

Be sure to tweet it at some of the github engineers– Thy should bring this
into their core product.

------
ahmett
Here's an idea: Automatically expand all the tree until there are more than 1
items in the level

e.g. src->com->twitter->scalding->scala->test (in this example, these are all
folders in hierarchy and they are the only one until the 'test' so expanding
them automatically all the way through makes sense).

~~~
vdm
That's a good idea, those 'fake' Java directories can be displayed collapsed
inline as a single node of the hierarchy, thus saving all their indent space.

------
Jonovono
This is awesome. Much better than my similar project! :
[http://gitray.com](http://gitray.com).

------
whizzkid
Great work but i want to point out one small feature that Github has but not
known to everyone.

Press 't' when you go to a repository, it will activate the file finder. From
there you can just start typing for the file/folder name you want to see and
it will filter the repo instantly.

I wonder why this feature is not popular yet.

~~~
mateuszf
Because you have to know the name of the file you are looking for. It's good
if you are looking at your own code base, but not for exploratory work.

~~~
whizzkid
Reasonable point you got there. Since I am mostly working on the repos that i
am involved, it becomes very handy for me. I agree that it may not be so
useful for unknown repos to explore.

------
granttimmerman
You can also press `t` on any repo on github to find files/filetypes quickly.

~~~
aslakhellesoy
I use 't' all the time to look up files as well.

I guess this extension makes it easier to get an overview of the directory
structure, but that's something I rarely need.

I'm sceptical of browser plugins in general. There are so many browser plugins
that change under the hood and do malicious things. It would be easy for the
author of this plugin to scrape all your source code and phone it home.

~~~
yblu
I understand the concern. This extension is open-source/MIT [1], hope that
brings a little peace of mind. If not, you can just pack the extension from
its source instead of installing from Chrome Store.

[1]
[https://github.com/buunguyen/octotree](https://github.com/buunguyen/octotree)

------
manish_gill
Fantastic! You planning to add Bitbucket support? That would be really nice.
:)

~~~
chillericed
+1 I'd also use bitbucket supported version of this

~~~
peteretep
I would probably pay for one

------
ubercow
I'd love to see a setting that makes the tree view collapsed by default. If I
have some time later I might whip up a pull req.

~~~
yblu
The tree should already be collapsed by the default (or it's a bug). However,
the extension remembers the selection state, so if you expand some folders,
you will see them remained expanded the next time you visit the same
repository. Is there any chance you talked about this scenario?

~~~
ubercow
I meant the entire left pane collapsed by default. Right now on page load it
automatically pops out.

edit: looks like I'm insane. working as you described it. nice job!

~~~
yblu
If you toggle it off (by clicking the small hamburger icon at the bottom-left
corner), it should remained hidden even if you navigate to other repositories.
The only exception is when it needs to prompt for the personal access token
(to access private repositories or deal with GitHub API limit). Is it not the
behavior you're observing or expecting?

------
jxf
This is a fantastic extension! Browsing is fast and efficient, and creating
the token for my private repos was painless.

A "search for files/folders named ..." feature would be a nice bonus, too, so
that you can quickly get to the right spot in a big hierarchy.

To the author
([https://twitter.com/buunguyen](https://twitter.com/buunguyen)): please add a
donation link somewhere so I can send you a thank-you (or you can just e-mail
me with your PayPal/other address; my e-mail's in my profile).

~~~
tomblomfield
Adding a private token took a few seconds - just a little irritating. It links
to a Readme, which then links to the page to get your token

Instead, why doesn't the plugin just link directly to the page which generates
the token if it detects that the repo is private?

~~~
yblu
Actually there are 2 links, the one named "Create token" goes directly to the
token generation page. The "Help" link goes to Readme just in case people
wonder why they have to enter the token. I guess you clicked on the "Help"
link instead of "Create Token" link?

------
xwowsersx
This is great. It would be even better if you could resize the tree. Some
projects have really deep trees and at a certain point you can't seem the
names of the files.

~~~
mateuszf
I second that.

------
Chris911
Github repo:
[https://github.com/buunguyen/octotree/](https://github.com/buunguyen/octotree/)

------
gknoy
Is there an easy way to extend this so that it can also be used when accessing
Enterprise Github installations, e.g. `github.mycompany.com`?

~~~
yblu
A couple of people have asked for this in comments (and someone reported it on
GitHub as well). I don't have a deployment handy so it's hard to build out. I
hope someone can submit a PR. (Or wait until I can get a deployment to
build/test.)

~~~
gknoy
I've started poking around at it, in hopes of making a PR, but feel like I am
making poor progress. It was trivial to change some things (like linking to
/settings/tokens/new instead of including the hostname), but then my API key
won't work.

I suspect that our enterprise installation uses a different API version than
the live Github site, as I am having a hard time figuring out what an error
406 (vs the ones you catch) means. (And, the tree that I get is undefined.)

I'm surely doing something wrong. (I had hacked up the github.js library to
use `github.ourcompany.com` for its API domain, which is probably wrong.) I
will have to look for more info on API access to enterprise instances, because
this is a feature which would make reading our various codebases __much__ more
convenient.

Thank you for such an inspiring plugin!

~~~
YZF
should be something like: http(s)://github.ourcompany.com/api/v3

------
vdm
@creationix's Tedit mounts git repos directly; it will melt your brain.
[http://www.youtube.com/watch?v=U4eJTBXJ54I](http://www.youtube.com/watch?v=U4eJTBXJ54I)
[https://github.com/creationix/tedit-app](https://github.com/creationix/tedit-
app)

------
mzahir
Github also has a file finder similar to the Command-T plugin for vim -
[https://github.com/blog/793-introducing-the-file-
finder](https://github.com/blog/793-introducing-the-file-finder)

This extension is great for exploring but if you know what you're looking for,
cmd+t will save you more time.

------
mrdmnd
Did you get API rate limited, by any chance?

~~~
yblu
I did. But personal access token to rescue (GitHub API is great). See here:
[https://github.com/buunguyen/octotree#github-api-rate-
limit](https://github.com/buunguyen/octotree#github-api-rate-limit).

------
dewey
I'd love to see something like this being on the site by default. Maybe just a
button next to the repository title where you'd be able to toggle between the
current view and the tree view. Both of these options have their advantages
for different use cases.

In the meantime that's a great solution. Thanks!

------
GowGuy47
I had the same idea a couple weeks ago but never finished it:
[https://github.com/Gowiem/GitHubTree](https://github.com/Gowiem/GitHubTree).
Crazy to see this. Glad somebody got around to it. Thanks man!

------
spullara
Press 't' and search the filenames in repo instantly. Very useful.

~~~
mateuszf
Useful, but you have to know exactly what you are looking for. It's not always
the case.

------
ntoshev
I don't really find the tree view useful. But I wish there was a way to see
the code weight by individual files and whole repos: as KLOCS, size, anything.
Is there such an extension?

------
houshuang
Brilliant - it's often quite slow to change between directories in the web
view, this is blazingly fast. Especially useful for deeply nested (templated)
projects.

------
bshimmin
This is seriously excellent.

I bet Github have had this feature on their issue tracker for years - and I
suspect it probably just got bumped a good few places up the list.

------
nilkn
Is there a way to use this for Github Enterprise repos?

~~~
dkroy
You would just have to switch out
[https://api.github.com/](https://api.github.com/) with
[https://{Your](https://{Your) company's Github Enterprise location}/api/v3/

~~~
yblu
Do you know if GitHub Enterprise imposes an API limit for unauthenticated
requests? If it does, does it support personal access token? (See
[https://github.com/buunguyen/octotree#github-api-rate-
limit.](https://github.com/buunguyen/octotree#github-api-rate-limit.))

Depending on the answers, it could be very simple change, i.e. allow users to
configure API subdomain. Unfortunately, I don't have any GitHub Enterprise
deployment in handy at this moment to find out.

~~~
jansanchez
> If it does, does it support personal access token?

Yes, it does support tokens.

~~~
yblu
Thanks for confirming. Then it should be straightforward to support. I'll hope
to have access to a Enterprise deployment to test out.

~~~
Myrmornis
I believe the Github developer program [1] gives you access to a github
enterprise instance for exactly this purpose.

[1]
[https://developer.github.com/program/](https://developer.github.com/program/)

------
jhspaybar
I've been using Firefox almost exclusively for months. This may very well make
me go back to Chrome. Looks amazing!

~~~
walden42
Would love to see a Firefox port.

~~~
Spittie
It doesn't seems to be using any Chrome api, so porting it to the Firefox SDK
should be a trivial matter.

See
[https://gist.github.com/Spittie/93adf218040d470abd40](https://gist.github.com/Spittie/93adf218040d470abd40)
([http://81.4.126.121/i/1400019350.png](http://81.4.126.121/i/1400019350.png)),
probably the hardest part is "fixing" the css if it's using some only webkit-
feature. Also I'm not sure if it's possible to load local images withing the
page-mod api, but embedding them as base64 images is easy enough.

EDIT: oh well, Enjoy:
[https://github.com/Spittie/octotree](https://github.com/Spittie/octotree) No
pull-requests because I've moved pretty much everything to make it working.
The right way would probably be to use some build system, but who has time for
that? :)

~~~
yblu
Wow, that's fast, thanks a lot. Let me see if I can roll out a build script
and merge your code (as well as the Safari fork made by another person).

~~~
Spittie
If you do, that would be awesome, considering that I'm too lazy to maintain
the firefox version for a lot of time :)

Not that I did change a lot of stuff, but with everything in a different
folder I can't just git pull from your repository.

And thanks for the great extension!

~~~
yblu
Done. I've added a build script to generate structures for Chrome, Firefox and
Safari. The prebuilt packages for Firefox and Safari are here:
[https://github.com/buunguyen/octotree/tree/master/dist](https://github.com/buunguyen/octotree/tree/master/dist).
Thanks again for the direction.

~~~
Spittie
That was fast! I can't edit my old comment, but I've changed the readme to
point to your repository. When this thread die, I'll delete it.

------
StepR
Hacker News will never cease to amaze me everyday. You guys are the best. Is
this going to be open sourced?

~~~
owenversteeg
It is open source:
[https://github.com/buunguyen/octotree/](https://github.com/buunguyen/octotree/)

------
dustingetz
Great extension, except in private repos, every time I click on a file (from
github proper) the extension animates outward while telling me that it doesn't
work with private repos. Extremely annoying and resulted in uninstall :(

edit: i'm not willing to give extension access to private repos, that would
defeat the point of being private

~~~
yblu
Private repos require your authorization. I guess you'll be more frustrated if
I could code up something to access your private repos without your
authorization, won't you? The instructions to create and set the token is
here: [https://github.com/buunguyen/octotree#github-api-rate-
limit](https://github.com/buunguyen/octotree#github-api-rate-limit).

~~~
dustingetz
Hi there, a better idea is to not animate and to just show a link at the
bottom corner. So I get the goodies when everything works, and if it doesn't
work, it stays out of my way.

~~~
yblu
Thanks, that is a good idea. I'll think more about it. The UI certainly needs
work to address this annoying behavior.

------
Dorian-Marie
Good idea. Having nicer icons and align the icon with the text would even more
awesome.

------
cmancini
Brilliant work. This will be a huge timesaver for me. Thanks!

------
ika
that wasn't a lacking feature for me but still, good job! also would be nice
if author uses github like design instead of windows-ish one

------
mitul_45
What about enterprise GitHub support?

------
dorolow
This is incredible. Thank you.

------
piratebroadcast
Epic. So fucking cool.

------
chadhietala
Thank you for this!

------
dud3z
Wow, great work!

------
cdelsolar
Wow, you rock.

------
sideproject
soooooo good!! Thanks!

------
Demiurge
Niiice.

