files: updated based on new design

rhodecode/apps/repository/views/repo_files.py

@@ -873,18 +873,17 b' class RepoFilesView(RepoAppView):'
             self.db_repo_name, self.db_repo.repo_id, commit.raw_id, f_path)
         return {'nodes': metadata}
 
-    def _create_references(
-            self, branches_or_tags, symbolic_reference, f_path):
+    def _create_references(self, branches_or_tags, symbolic_reference, f_path, ref_type):
         items = []
         for name, commit_id in branches_or_tags.items():
-            sym_ref = symbolic_reference(commit_id, name, f_path)
-            items.append((sym_ref, name))
+            sym_ref = symbolic_reference(commit_id, name, f_path, ref_type)
+            items.append((sym_ref, name, ref_type))
         return items
 
-    def _symbolic_reference(self, commit_id, name, f_path):
+    def _symbolic_reference(self, commit_id, name, f_path, ref_type):
         return commit_id
 
-    def _symbolic_reference_svn(self, commit_id, name, f_path):
+    def _symbolic_reference_svn(self, commit_id, name, f_path, ref_type):
         new_f_path = vcspath.join(name, f_path)
         return u'%s@%s' % (new_f_path, commit_id)
 
@@ -914,7 +913,7 b' class RepoFilesView(RepoAppView):'
         for commit in commits:
             branch = ' (%s)' % commit.branch if commit.branch else ''
             n_desc = 'r%s:%s%s' % (commit.idx, commit.short_id, branch)
-            commits_group[0].append((commit.raw_id, n_desc,))
+            commits_group[0].append((commit.raw_id, n_desc, 'sha'))
         history.append(commits_group)
 
         symbolic_reference = self._symbolic_reference
@@ -930,11 +929,11 b' class RepoFilesView(RepoAppView):'
                 symbolic_reference = self._symbolic_reference_svn
 
         branches = self._create_references(
-            self.rhodecode_vcs_repo.branches, symbolic_reference, f_path)
+            self.rhodecode_vcs_repo.branches, symbolic_reference, f_path, 'branch')
         branches_group = (branches, _("Branches"))
 
         tags = self._create_references(
-            self.rhodecode_vcs_repo.tags, symbolic_reference, f_path)
+            self.rhodecode_vcs_repo.tags, symbolic_reference, f_path, 'tag')
         tags_group = (tags, _("Tags"))
 
         history.append(branches_group)
@@ -962,7 +961,7 b' class RepoFilesView(RepoAppView):'
             for obj in file_history:
                 res.append({
                     'text': obj[1],
-                    'children': [{'id': o[0], 'text': o[1]} for o in obj[0]]
+                    'children': [{'id': o[0], 'text': o[1], 'type': o[2]} for o in obj[0]]
                 })
 
             data = {

rhodecode/lib/helpers.py

@@ -199,6 +199,7 b' class _GetError(object):'
         if form_errors and field_name in form_errors:
             return literal(tmpl % form_errors.get(field_name))
 
+
 get_error = _GetError()
 
 
@@ -215,33 +216,30 b' class _ToolTip(object):'
         tooltip_title = tooltip_title.replace('<', '&lt;').replace('>', '&gt;')
         return tooltip_title
 
+
 tooltip = _ToolTip()
 
 
-def files_breadcrumbs(repo_name, commit_id, file_path, at_ref=None):
+def files_breadcrumbs(repo_name, commit_id, file_path, at_ref=None, limit_items=False):
     if isinstance(file_path, str):
         file_path = safe_unicode(file_path)
+
     route_qry = {'at': at_ref} if at_ref else None
 
-    # TODO: johbo: Is this always a url like path, or is this operating
-    # system dependent?
-    path_segments = file_path.split('/')
+    # first segment is a `..` link to repo files
+    root_name = literal(u'<i class="icon-home"></i>')
+    url_segments = [
+        link_to(
+            root_name,
+            route_path(
+                'repo_files',
+                repo_name=repo_name,
+                commit_id=commit_id,
+                f_path='',
+                _query=route_qry),
+        )]
 
-    repo_name_html = escape(repo_name)
-    if len(path_segments) == 1 and path_segments[0] == '':
-        url_segments = [repo_name_html]
-    else:
-        url_segments = [
-            link_to(
-                repo_name_html,
-                route_path(
-                    'repo_files',
-                    repo_name=repo_name,
-                    commit_id=commit_id,
-                    f_path='',
-                    _query=route_qry),
-                )]
-
+    path_segments = file_path.split('/')
     last_cnt = len(path_segments) - 1
     for cnt, segment in enumerate(path_segments):
         if not segment:
@@ -262,7 +260,16 b' def files_breadcrumbs(repo_name, commit_'
         else:
             url_segments.append(segment_html)
 
-    return literal('/'.join(url_segments))
+    limited_url_segments = url_segments[:1] + ['...'] + url_segments[-5:]
+    if limit_items and len(limited_url_segments) < len(url_segments):
+        url_segments = limited_url_segments
+
+    full_path = file_path
+    icon = '<i class="file-breadcrumb-copy tooltip icon-clipboard clipboard-action" data-clipboard-text="{}" title="Copy the full path"></i>'.format(full_path)
+    if file_path == '':
+        return root_name
+    else:
+        return literal(' / '.join(url_segments) + icon)
 
 
 def code_highlight(code, lexer, formatter, use_hl_filter=False):

rhodecode/public/css/main.less

@@ -2192,12 +2192,13 b' h3.files_location{'
 			}
 		}
 
-        .select-index-number {
-            margin: 0 0 0 20px;
-            color: @grey3;
-        }
 	}
 
+    .select-index-number {
+        margin: 0 0 0 20px;
+        color: @grey3;
+    }
+
 	.search_activate {
 		display: table-cell;
 		vertical-align: middle;

rhodecode/public/css/rcicons.less

@@ -1,12 +1,12 b''
 @font-face {
   font-family: 'rcicons';
 
-  src: url('../fonts/RCIcons/rcicons.eot?73199028');
-  src: url('../fonts/RCIcons/rcicons.eot?73199028#iefix') format('embedded-opentype'),
-       url('../fonts/RCIcons/rcicons.woff2?73199028') format('woff2'),
-       url('../fonts/RCIcons/rcicons.woff?73199028') format('woff'),
-       url('../fonts/RCIconst/rcicons.ttf?73199028') format('truetype'),
-       url('../fonts/RCIcons/rcicons.svg?73199028#rcicons') format('svg');
+  src: url('../fonts/RCIcons/rcicons.eot?9641970');
+  src: url('../fonts/RCIcons/rcicons.eot?9641970#iefix') format('embedded-opentype'),
+       url('../fonts/RCIcons/rcicons.woff2?9641970') format('woff2'),
+       url('../fonts/RCIcons/rcicons.woff?9641970') format('woff'),
+       url('../fonts/RCIcons/rcicons.ttf?9641970') format('truetype'),
+       url('../fonts/RCIcons/rcicons.svg?9641970#rcicons') format('svg');
 
   font-weight: normal;
   font-style: normal;
@@ -186,6 +186,7 b''
 .icon-minus:before { content: '\e820'; } /* '' */
 .icon-info-circled:before { content: '\e821'; } /* '' */
 .icon-upload:before { content: '\e822'; } /* '' */
+.icon-home:before { content: '\e823'; } /* '' */
 .icon-git:before { content: '\e82a'; } /* '' */
 .icon-hg:before { content: '\e82d'; } /* '' */
 .icon-svn:before { content: '\e82e'; } /* '' */

rhodecode/public/css/summary.less

@@ -425,7 +425,6 b''
     }
 
     .stats-info {
-        margin-top: 5px;
         color: @grey4;
     }
 
@@ -434,7 +433,6 b''
         text-align: right;
         color: @grey4;
         padding: 10px;
-        margin-top: 15px;
     }
 
     .file-container {

rhodecode/public/fonts/RCIcons/config.json

@@ -552,6 +552,12 b''
       "src": "fontelico"
     },
     {
+      "uid": "513ac180ff85bd275f2b736720cbbf5e",
+      "css": "home",
+      "code": 59427,
+      "src": "entypo"
+    },
+    {
       "uid": "c43db6645e7515889fc2193294f50767",
       "css": "plus",
       "code": 59411,

rhodecode/public/fonts/RCIcons/rcicons.svg

@@ -76,6 +76,8 b''
 
 <glyph glyph-name="upload" unicode="&#xe822;" d="M714 29q0 14-10 25t-25 10-25-10-11-25 11-25 25-11 25 11 10 25z m143 0q0 14-10 25t-26 10-25-10-10-25 10-25 25-11 26 11 10 25z m72 125v-179q0-22-16-38t-38-16h-821q-23 0-38 16t-16 38v179q0 22 16 38t38 15h238q12-31 39-51t62-20h143q34 0 61 20t40 51h238q22 0 38-15t16-38z m-182 361q-9-22-33-22h-143v-250q0-15-10-25t-25-11h-143q-15 0-25 11t-11 25v250h-143q-23 0-33 22-9 22 8 39l250 250q10 10 25 10t25-10l250-250q18-17 8-39z" horiz-adv-x="928.6" />
 
+<glyph glyph-name="home" unicode="&#xe823;" d="M888 336q16-16 11-27t-27-11l-84 0 0-310q0-14-1-21t-8-13-23-6l-204 0 0 310-204 0 0-310-194 0q-28 0-35 10t-7 30l0 310-84 0q-22 0-27 11t11 27l400 402q16 16 38 16t38-16z" horiz-adv-x="900" />
+
 <glyph glyph-name="git" unicode="&#xe82a;" d="M929 844h-858c-36 0-65-30-65-65v-857c0-36 30-65 65-65h857c36 0 65 30 65 65v857c1 35-29 65-64 65z m-729-549c4-11 9-20 14-27 6-8 14-14 22-18 9-4 19-6 29-6 9 0 16 1 24 2 7 2 14 4 20 7l6 51h-27c-4 0-8 1-10 4-2 1-3 5-3 7l5 39h105l-16-131c-8-7-16-12-25-15-9-4-18-8-28-10-10-3-18-5-30-7-10-1-21-2-33-2-20 0-38 4-54 11-16 8-30 18-41 30-12 13-20 28-27 45-6 18-10 36-10 56 0 18 3 34 7 50 3 17 10 30 17 44 8 14 16 25 26 36 10 12 22 20 34 28 13 7 26 14 41 17 15 4 30 7 47 7 13 0 25-2 36-4 11-3 21-6 29-10 8-4 16-9 22-14 6-5 13-11 18-16l-20-31c-4-5-9-8-14-9-5-1-10 0-16 4-5 3-10 6-14 8-5 3-9 5-14 7-5 1-10 2-15 3-5 2-11 2-17 2-14 0-27-3-38-9-11-6-21-14-29-25-8-10-15-24-18-38-5-15-7-31-7-48-1-14 2-27 4-38z m336-102h-71l39 315h71l-39-315z m343 258h-80l-33-258h-70l32 258h-80l7 57h231l-7-57z" horiz-adv-x="1000" />
 
 <glyph glyph-name="hg" unicode="&#xe82d;" d="M927 841h-853c-36 0-65-29-65-65v-853c0-36 29-65 65-65h853c36 0 65 29 65 65v853c0 36-29 65-65 65z m-483-648h-70l16 133h-113l-17-133h-70l39 313h70l-16-132h113l16 132h71l-39-313z m177 101c3-11 8-20 14-27 7-8 14-14 23-18 8-4 18-6 28-6 9 0 16 1 23 3 7 1 14 3 20 6l6 51h-27c-4 0-7 1-9 3-3 3-3 6-3 9l5 39h104l-16-131c-8-6-16-11-25-15-9-5-18-8-27-11-9-2-19-4-30-6-10-1-21-2-33-2-19 0-37 4-53 11-16 7-30 17-41 29-11 13-20 28-26 45-7 17-10 35-10 55 0 17 2 34 6 50 4 15 10 30 17 43 7 14 16 26 26 36 10 11 22 20 34 28 13 7 27 13 41 17 14 4 30 7 46 7 13 0 25-2 36-4 11-3 20-6 29-10 8-4 16-9 23-14 7-5 13-11 18-17l-23-28c-4-5-8-8-13-9-5-1-11 0-16 3-5 4-10 7-14 9-5 3-9 5-14 6-4 2-9 3-14 4-5 1-11 1-17 1-14 0-27-3-38-8-11-6-21-14-29-25-8-10-15-23-19-38-5-15-7-31-7-49 0-13 2-26 5-37z" horiz-adv-x="1000" />

rhodecode/public/js/src/rhodecode/select2_widgets.js

@@ -73,10 +73,3 b' var select2RefSwitcher = function(target'
     {'repo_name': templateContext.repo_name});
   select2RefBaseSwitcher(targetElement, loadUrl, initialData);
 };
-
-var select2FileHistorySwitcher = function(targetElement, initialData, state) {
-  var loadUrl = pyroutes.url('repo_file_history',
-    {'repo_name': templateContext.repo_name, 'commit_id': state.rev,
-     'f_path': state.f_path});
-  select2RefBaseSwitcher(targetElement, loadUrl, initialData);
-};

rhodecode/templates/changelog/changelog_file_history.mako

@@ -3,7 +3,7 b''
 
     <table class="table rctable file_history">
     %for cnt,cs in enumerate(c.pagination):
-        <tr id="chg_${cnt+1}" class="${'tablerow%s' % (cnt%2)}">
+        <tr id="chg_${cnt+1}" class="${('tablerow%s' % (cnt%2))}">
             <td class="td-user">
                 ${base.gravatar_with_user(cs.author, 16)}
             </td>
@@ -33,7 +33,19 b''
                     ${_('Show File')}
                 </a>
             </td>
+            <td class="td-actions">
+                <a href="${h.route_path('repo_compare',repo_name=c.repo_name, source_ref_type="rev", source_ref=cs.raw_id,target_ref_type="rev", target_ref=c.commit_id,_query=dict(merge='1',f_path=c.changelog_for_path))}">
+                    ${_('Diff File')}
+                </a>
+            </td>
         </tr>
     %endfor
+        <tr>
+            <td colspan="6">
+                <a id="file_history_overview_full" href="${h.route_path('repo_changelog_file',repo_name=c.repo_name, commit_id=c.commit_id, f_path=c.f_path)}">
+               ${_('Show Full History')}
+                </a>
+            </td>
+        </tr>
     </table>
 </div>

rhodecode/templates/files/file_authors_box.mako

@@ -10,6 +10,7 b''
             <span class="user commit-author">${h.link_to_user(user)}</span>
             % if c.file_author:
                 <span class="commit-date">- ${h.age_component(c.file_last_commit.date)}</span>
+                <a href="#ShowAuthors" id="show_authors" class="action_link"> - ${_('Load All Authors')}</a>
             % elif c.file_last_commit.author_email==email:
                 <span> (${_('last author')})</span>
             % endif
@@ -27,13 +28,7 b''
             % endif
         </td>
     </tr>
-    <tr>
-        <td colspan="2">
-            % if c.file_author:
-            <a href="#ShowAuthors" id="show_authors" class="action_link">${_('Show Authors')}</a>
-            % endif
-        </td>
-    </tr>
+
     % endfor
 </table>
 % endif

rhodecode/templates/files/files.mako

@@ -118,14 +118,322 b''
                 timeagoActivate();
             });
             metadataRequest.fail(function (data, textStatus, errorThrown) {
-                console.log(data);
                 if (data.status != 0) {
                     alert("Error while fetching metadata.\nError code {0} ({1}).Please consider reloading the page".format(data.status,data.statusText));
                 }
             });
         };
 
-        var callbacks = function() {
+        var initFileJS = function () {
+            var state = getState('callbacks');
+
+            // select code link event
+            $("#hlcode").mouseup(getSelectionLink);
+
+            // file history select2 used for history of file, and switch to
+            var initialCommitData = {
+                at_ref: atRef,
+                id: null,
+                text: '${c.commit.raw_id}',
+                type: 'sha',
+                raw_id: '${c.commit.raw_id}',
+                idx: ${c.commit.idx},
+                files_url: null,
+            };
+
+            // check if we have ref info.
+            var selectedRef =  fileTreeRefs[atRef];
+            if (selectedRef !== undefined) {
+                $.extend(initialCommitData, selectedRef)
+            }
+
+            var loadUrl = pyroutes.url('repo_file_history', {'repo_name': templateContext.repo_name, 'commit_id': state.rev,'f_path': state.f_path});
+            var cacheKey = '__SINGLE_FILE_REFS__';
+            var cachedDataSource = {};
+
+            var loadRefsData = function (query) {
+                $.ajax({
+                    url: loadUrl,
+                    data: {},
+                    dataType: 'json',
+                    type: 'GET',
+                    success: function (data) {
+                        cachedDataSource[cacheKey] = data;
+                        query.callback({results: data.results});
+                    }
+                });
+            };
+
+            var feedRefsData = function (query, cachedData) {
+                var data = {results: []};
+                //filter results
+                $.each(cachedData.results, function () {
+                    var section = this.text;
+                    var children = [];
+                    $.each(this.children, function () {
+                        if (query.term.length === 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
+                            children.push(this)
+                        }
+                    });
+                    data.results.push({
+                        'text': section,
+                        'children': children
+                    })
+                });
+
+                query.callback(data);
+            };
+
+            var select2FileHistorySwitcher = function (targetElement, loadUrl, initialData) {
+                var formatResult = function (result, container, query) {
+                    return formatSelect2SelectionRefs(result);
+                };
+
+                var formatSelection = function (data, container) {
+                    var commit_ref = data;
+
+                    var tmpl = '';
+                    if (commit_ref.type === 'sha') {
+                        tmpl = (commit_ref.raw_id || "").substr(0,8);
+                    } else if (commit_ref.type === 'branch') {
+                        tmpl = tmpl.concat('<i class="icon-branch"></i> ');
+                        tmpl = tmpl.concat(escapeHtml(commit_ref.text));
+                    } else if (commit_ref.type === 'tag') {
+                        tmpl = tmpl.concat('<i class="icon-tag"></i> ');
+                        tmpl = tmpl.concat(escapeHtml(commit_ref.text));
+                    } else if (commit_ref.type === 'book') {
+                        tmpl = tmpl.concat('<i class="icon-bookmark"></i> ');
+                        tmpl = tmpl.concat(escapeHtml(commit_ref.text));
+                    }
+                    var idx = commit_ref.idx || 0;
+                    tmpl = tmpl.concat('<span class="select-index-number">r{0}</span>'.format(idx));
+                    return tmpl
+                };
+
+              $(targetElement).select2({
+                dropdownAutoWidth: true,
+                width: "resolve",
+                containerCssClass: "drop-menu",
+                dropdownCssClass: "drop-menu-dropdown",
+                query: function(query) {
+                  var cachedData = cachedDataSource[cacheKey];
+                  if (cachedData) {
+                    feedRefsData(query, cachedData)
+                  } else {
+                    loadRefsData(query)
+                  }
+                },
+                initSelection: function(element, callback) {
+                  callback(initialData);
+                },
+                formatResult: formatResult,
+                formatSelection: formatSelection
+              });
+
+            };
+
+            select2FileHistorySwitcher('#file_refs_filter', loadUrl, initialCommitData);
+
+            $('#file_refs_filter').on('change', function(e) {
+                var data = $('#file_refs_filter').select2('data');
+                var commit_id = data.id;
+
+                if ("${c.annotate}" === "True") {
+                    var url = pyroutes.url('repo_files:annotated',
+                            {'repo_name': templateContext.repo_name,
+                             'commit_id': commit_id, 'f_path': state.f_path});
+                } else {
+                    var url = pyroutes.url('repo_files',
+                            {'repo_name': templateContext.repo_name,
+                             'commit_id': commit_id, 'f_path': state.f_path});
+                }
+                window.location = url;
+
+            });
+
+            // show more authors
+            $('#show_authors').on('click', function(e) {
+                e.preventDefault();
+                var url = pyroutes.url('repo_file_authors',
+                            {'repo_name': templateContext.repo_name,
+                             'commit_id': state.rev, 'f_path': state.f_path});
+
+                $.pjax({
+                    url: url,
+                    data: 'annotate=${("1" if c.annotate else "0")}',
+                    container: '#file_authors',
+                    push: false,
+                    timeout: 5000
+                }).complete(function(){
+                    $('#show_authors').hide();
+                    $('#file_authors_title').html(_gettext('All Authors'))
+                })
+            });
+
+            // load file short history
+            $('#file_history_overview').on('click', function(e) {
+                e.preventDefault();
+                path = state.f_path;
+                if (path.indexOf("#") >= 0) {
+                    path = path.slice(0, path.indexOf("#"));
+                }
+                var url = pyroutes.url('repo_changelog_file',
+                        {'repo_name': templateContext.repo_name,
+                         'commit_id': state.rev, 'f_path': path, 'limit': 6});
+                $('#file_history_container').show();
+                $('#file_history_container').html('<div class="file-history-inner">{0}</div>'.format(_gettext('Loading ...')));
+
+                $.pjax({
+                    url: url,
+                    container: '#file_history_container',
+                    push: false,
+                    timeout: 5000
+                });
+            });
+
+
+        };
+
+        var initTreeJS = function () {
+            var state = getState('callbacks');
+            getFilesMetadata();
+
+            // fuzzy file filter
+            fileBrowserListeners(state.node_list_url, state.url_base);
+
+            // switch to widget
+            var initialCommitData = {
+                at_ref: atRef,
+                id: null,
+                text: '${c.commit.raw_id}',
+                type: 'sha',
+                raw_id: '${c.commit.raw_id}',
+                idx: ${c.commit.idx},
+                files_url: null,
+            };
+
+            // check if we have ref info.
+            var selectedRef =  fileTreeRefs[atRef];
+            if (selectedRef !== undefined) {
+                $.extend(initialCommitData, selectedRef)
+            }
+
+            var loadUrl = pyroutes.url('repo_refs_data', {'repo_name': templateContext.repo_name});
+            var cacheKey = '__ALL_FILE_REFS__';
+            var cachedDataSource = {};
+
+            var loadRefsData = function (query) {
+                $.ajax({
+                    url: loadUrl,
+                    data: {},
+                    dataType: 'json',
+                    type: 'GET',
+                    success: function (data) {
+                        cachedDataSource[cacheKey] = data;
+                        query.callback({results: data.results});
+                    }
+                });
+            };
+
+            var feedRefsData = function (query, cachedData) {
+                var data = {results: []};
+                //filter results
+                $.each(cachedData.results, function () {
+                    var section = this.text;
+                    var children = [];
+                    $.each(this.children, function () {
+                        if (query.term.length === 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
+                            children.push(this)
+                        }
+                    });
+                    data.results.push({
+                        'text': section,
+                        'children': children
+                    })
+                });
+
+                //push the typed in commit idx
+                if (!isNaN(query.term)) {
+                    var files_url = pyroutes.url('repo_files',
+                                {'repo_name': templateContext.repo_name,
+                                 'commit_id': query.term, 'f_path': state.f_path});
+
+                    data.results.push({
+                        'text': _gettext('go to numeric commit'),
+                        'children': [{
+                            at_ref: null,
+                            id: null,
+                            text: 'r{0}'.format(query.term),
+                            type: 'sha',
+                            raw_id: query.term,
+                            idx: query.term,
+                            files_url: files_url,
+                        }]
+                    });
+                }
+                query.callback(data);
+            };
+
+            var select2RefFileSwitcher = function (targetElement, loadUrl, initialData) {
+                var formatResult = function (result, container, query) {
+                    return formatSelect2SelectionRefs(result);
+                };
+
+                var formatSelection = function (data, container) {
+                    var commit_ref = data;
+
+                    var tmpl = '';
+                    if (commit_ref.type === 'sha') {
+                        tmpl = (commit_ref.raw_id || "").substr(0,8);
+                    } else if (commit_ref.type === 'branch') {
+                        tmpl = tmpl.concat('<i class="icon-branch"></i> ');
+                        tmpl = tmpl.concat(escapeHtml(commit_ref.text));
+                    } else if (commit_ref.type === 'tag') {
+                        tmpl = tmpl.concat('<i class="icon-tag"></i> ');
+                        tmpl = tmpl.concat(escapeHtml(commit_ref.text));
+                    } else if (commit_ref.type === 'book') {
+                        tmpl = tmpl.concat('<i class="icon-bookmark"></i> ');
+                        tmpl = tmpl.concat(escapeHtml(commit_ref.text));
+                    }
+
+                    var idx = commit_ref.idx || 0;
+                    tmpl = tmpl.concat('<span class="select-index-number">r{0}</span>'.format(idx));
+                    return tmpl
+                };
+
+              $(targetElement).select2({
+                dropdownAutoWidth: true,
+                width: "resolve",
+                containerCssClass: "drop-menu",
+                dropdownCssClass: "drop-menu-dropdown",
+                query: function(query) {
+
+                  var cachedData = cachedDataSource[cacheKey];
+                  if (cachedData) {
+                    feedRefsData(query, cachedData)
+                  } else {
+                    loadRefsData(query)
+                  }
+                },
+                initSelection: function(element, callback) {
+                  callback(initialData);
+                },
+                formatResult: formatResult,
+                formatSelection: formatSelection
+              });
+
+            };
+
+            select2RefFileSwitcher('#refs_filter', loadUrl, initialCommitData);
+
+            $('#refs_filter').on('change', function(e) {
+                var data = $('#refs_filter').select2('data');
+                window.location = data.files_url
+            });
+
+        };
+
+        $(document).ready(function() {
             timeagoActivate();
 
             if ($('#trimmed_message_box').height() < 50) {
@@ -137,250 +445,12 b''
                 $(this).hide();
             });
 
-            var state = getState('callbacks');
-
-            // VIEW FOR FILE SOURCE
             if (fileSourcePage) {
-                // variants for with source code, not tree view
-
-                // select code link event
-                $("#hlcode").mouseup(getSelectionLink);
-
-                // file history select2 used for history, and switch to
-                var initialCommitData = {
-                    id: null,
-                    text: '${_("Pick Commit")}',
-                    type: 'sha',
-                    raw_id: null,
-                    files_url: null
-                };
-
-                select2FileHistorySwitcher('#diff1', initialCommitData, state);
-
-                // show at, diff to actions handlers
-                $('#diff1').on('change', function(e) {
-                    $('#diff_to_commit').removeClass('disabled').removeAttr("disabled");
-                    $('#diff_to_commit').val(_gettext('Diff to Commit ') + e.val.truncateAfter(8, '...'));
-
-                    $('#show_at_commit').removeClass('disabled').removeAttr("disabled");
-                    $('#show_at_commit').val(_gettext('Show at Commit ') + e.val.truncateAfter(8, '...'));
-                });
-
-                $('#diff_to_commit').on('click', function(e) {
-                    var diff1 = $('#diff1').val();
-                    var diff2 = $('#diff2').val();
-
-                    var url_data = {
-                        repo_name: templateContext.repo_name,
-                        source_ref: diff1,
-                        source_ref_type: 'rev',
-                        target_ref: diff2,
-                        target_ref_type: 'rev',
-                        merge: 1,
-                        f_path: state.f_path
-                    };
-                    window.location = pyroutes.url('repo_compare', url_data);
-                });
-
-                $('#show_at_commit').on('click', function(e) {
-                    var diff1 = $('#diff1').val();
-
-                    var annotate = $('#annotate').val();
-                    if (annotate === "True") {
-                        var url = pyroutes.url('repo_files:annotated',
-                                {'repo_name': templateContext.repo_name,
-                                 'commit_id': diff1, 'f_path': state.f_path});
-                    } else {
-                        var url = pyroutes.url('repo_files',
-                                {'repo_name': templateContext.repo_name,
-                                 'commit_id': diff1, 'f_path': state.f_path});
-                    }
-                    window.location = url;
-
-                });
-
-                // show more authors
-                $('#show_authors').on('click', function(e) {
-                    e.preventDefault();
-                    var url = pyroutes.url('repo_file_authors',
-                                {'repo_name': templateContext.repo_name,
-                                 'commit_id': state.rev, 'f_path': state.f_path});
-
-                    $.pjax({
-                        url: url,
-                        data: 'annotate=${("1" if c.annotate else "0")}',
-                        container: '#file_authors',
-                        push: false,
-                        timeout: 5000
-                    }).complete(function(){
-                        $('#show_authors').hide();
-                        $('#file_authors_title').html(_gettext('All Authors'))
-                    })
-                });
-
-                // load file short history
-                $('#file_history_overview').on('click', function(e) {
-                    e.preventDefault();
-                    path = state.f_path;
-                    if (path.indexOf("#") >= 0) {
-                        path = path.slice(0, path.indexOf("#"));
-                    }
-                    var url = pyroutes.url('repo_changelog_file',
-                            {'repo_name': templateContext.repo_name,
-                             'commit_id': state.rev, 'f_path': path, 'limit': 6});
-                    $('#file_history_container').show();
-                    $('#file_history_container').html('<div class="file-history-inner">{0}</div>'.format(_gettext('Loading ...')));
-
-                    $.pjax({
-                        url: url,
-                        container: '#file_history_container',
-                        push: false,
-                        timeout: 5000
-                    })
-                });
-
+                initFileJS()
+            } else {
+                initTreeJS()
             }
-            // VIEW FOR FILE TREE BROWSER
-            else {
-                getFilesMetadata();
-
-                // fuzzy file filter
-                fileBrowserListeners(state.node_list_url, state.url_base);
-
-                // switch to widget
-                var initialCommitData = {
-                    at_ref: atRef,
-                    id: null,
-                    text: '${c.commit.raw_id}',
-                    type: 'sha',
-                    raw_id: '${c.commit.raw_id}',
-                    idx: ${c.commit.idx},
-                    files_url: null,
-                };
 
-                // check if we have ref info.
-                var selectedRef =  fileTreeRefs[atRef];
-                if (selectedRef !== undefined) {
-                    $.extend(initialCommitData, selectedRef)
-                }
-
-                var loadUrl = pyroutes.url('repo_refs_data', {'repo_name': templateContext.repo_name});
-                var cacheKey = '__ALL_FILE_REFS__';
-                var cachedDataSource = {};
-
-                var loadRefsData = function (query) {
-                    $.ajax({
-                        url: loadUrl,
-                        data: {},
-                        dataType: 'json',
-                        type: 'GET',
-                        success: function (data) {
-                            cachedDataSource[cacheKey] = data;
-                            query.callback({results: data.results});
-                        }
-                    });
-                };
-
-                var feedRefsData = function (query, cachedData) {
-                    var data = {results: []};
-                    //filter results
-                    $.each(cachedData.results, function () {
-                        var section = this.text;
-                        var children = [];
-                        $.each(this.children, function () {
-                            if (query.term.length === 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
-                                children.push(this)
-                            }
-                        });
-                        data.results.push({
-                            'text': section,
-                            'children': children
-                        })
-                    });
-
-                    //push the typed in commit idx
-                    if (!isNaN(query.term)) {
-                        var files_url = pyroutes.url('repo_files',
-                                    {'repo_name': templateContext.repo_name,
-                                     'commit_id': query.term, 'f_path': state.f_path});
-
-                        data.results.push({
-                            'text': _gettext('go to numeric commit'),
-                            'children': [{
-                                at_ref: null,
-                                id: null,
-                                text: 'r{0}'.format(query.term),
-                                type: 'sha',
-                                raw_id: query.term,
-                                idx: query.term,
-                                files_url: files_url,
-                            }]
-                        });
-                    }
-                    query.callback(data);
-                };
-
-                var select2RefFileSwitcher = function (targetElement, loadUrl, initialData) {
-                    var formatResult = function (result, container, query) {
-                        return formatSelect2SelectionRefs(result);
-                    };
-
-                    var formatSelection = function (data, container) {
-                        var commit_ref = data;
-
-                        var tmpl = '';
-                        if (commit_ref.type === 'sha') {
-                            tmpl = commit_ref.raw_id.substr(0,8);
-                        } else if (commit_ref.type === 'branch') {
-                            tmpl = tmpl.concat('<i class="icon-branch"></i> ');
-                            tmpl = tmpl.concat(escapeHtml(commit_ref.text));
-                        } else if (commit_ref.type === 'tag') {
-                            tmpl = tmpl.concat('<i class="icon-tag"></i> ');
-                            tmpl = tmpl.concat(escapeHtml(commit_ref.text));
-                        } else if (commit_ref.type === 'book') {
-                            tmpl = tmpl.concat('<i class="icon-bookmark"></i> ');
-                            tmpl = tmpl.concat(escapeHtml(commit_ref.text));
-                        }
-
-                        tmpl = tmpl.concat('<span class="select-index-number">r{0}</span>'.format(commit_ref.idx));
-                        return tmpl
-                    };
-
-                  $(targetElement).select2({
-                    dropdownAutoWidth: true,
-                    width: "resolve",
-                    containerCssClass: "drop-menu",
-                    dropdownCssClass: "drop-menu-dropdown",
-                    query: function(query) {
-
-                      var cachedData = cachedDataSource[cacheKey];
-                      if (cachedData) {
-                        feedRefsData(query, cachedData)
-                      } else {
-                        loadRefsData(query)
-                      }
-                    },
-                    initSelection: function(element, callback) {
-                      callback(initialData);
-                    },
-                    formatResult: formatResult,
-                    formatSelection: formatSelection
-                  });
-
-                };
-
-                select2RefFileSwitcher('#refs_filter', loadUrl, initialCommitData);
-
-                $('#refs_filter').on('change', function(e) {
-                    var data = $('#refs_filter').select2('data');
-                    window.location = data.files_url
-                });
-
-            }
-        };
-
-        $(document).ready(function() {
-            callbacks();
             var search_GET = "${request.GET.get('search','')}";
             if (search_GET === "1") {
                 NodeFilter.initFilter();

rhodecode/templates/files/files_browser.mako

@@ -17,18 +17,28 b''
             </div>
 
             % if h.HasRepoPermissionAny('repository.write','repository.admin')(c.repo_name):
-              <div title="${_('Add New File')}" class="btn btn-primary new-file">
-                <a href="${h.route_path('repo_files_add_file',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path, _anchor='edit')}">
-                    ${_('Add File')}</a>
+              <div>
+                <a class="btn btn-primary new-file" href="${h.route_path('repo_files_add_file',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path, _anchor='edit')}">
+                    ${_('Upload File')}
+                </a>
+                <a class="btn btn-primary new-file" href="${h.route_path('repo_files_add_file',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path, _anchor='edit')}">
+                    ${_('Add File')}
+                </a>
               </div>
             % endif
 
             % if c.enable_downloads:
               <% at_path = '{}'.format(request.GET.get('at') or c.commit.raw_id[:6]) %>
               <div class="btn btn-default new-file">
-                <a href="${h.route_path('repo_archivefile',repo_name=c.repo_name, fname='{}.zip'.format(c.commit.raw_id))}">
-                    ${_('Download ZIP @ ')} <code>${at_path}</code>
-                </a>
+                  % if c.f_path == '/':
+                    <a href="${h.route_path('repo_archivefile',repo_name=c.repo_name, fname='{}.zip'.format(c.commit.raw_id))}">
+                        ${_('Download full tree ZIP')}
+                    </a>
+                  % else:
+                    <a href="${h.route_path('repo_archivefile',repo_name=c.repo_name, fname='{}.zip'.format(c.commit.raw_id))}">
+                        ${_('Download this tree ZIP')}
+                    </a>
+                  % endif
               </div>
             % endif
 
@@ -45,6 +55,7 b''
         </div>
 
     </div>
+
     ## file tree is computed from caches, and filled in
     <div id="file-tree">
     ${c.file_tree |n}

rhodecode/templates/files/files_browser_tree.mako

@@ -17,19 +17,13 b''
         </thead>
 
         <tbody id="tbody">
-          %if c.file.parent:
-          <tr class="parity0">
-            <td class="td-componentname">
-              <a href="${h.route_path('repo_files',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.file.parent.path, _query=query)}">
-                <i class="icon-directory"></i>..
-              </a>
+        <tr>
+            <td colspan="5">
+
+                ${h.files_breadcrumbs(c.repo_name,c.commit.raw_id,c.file.path, request.GET.get('at'), limit_items=True)}
+
             </td>
-            <td></td>
-            <td></td>
-            <td></td>
-            <td></td>
-          </tr>
-          %endif
+        </tr>
           %for cnt,node in enumerate(c.file):
           <tr class="parity${cnt%2}">
             <td class="td-componentname">

rhodecode/templates/files/files_pjax.mako

@@ -13,14 +13,7 b''
 
     <div class="summary-detail">
         <div class="summary-detail-header">
-            <div class="breadcrumbs files_location">
-                <h4>
-                     ${h.files_breadcrumbs(c.repo_name,c.commit.raw_id,c.file.path, request.GET.get('at'))}
-                    %if c.annotate:
-                    - ${_('annotation')}
-                    %endif
-                </h4>
-            </div>
+
         </div><!--end summary-detail-header-->
 
         % if c.file.is_submodule():

rhodecode/templates/files/files_source.mako

@@ -1,16 +1,61 b''
 <%namespace name="sourceblock" file="/codeblocks/source.mako"/>
 
-<div id="codeblock" class="codeblock">
-    <div class="codeblock-header">
+<div id="codeblock" class="browserblock">
+    <div class="browser-header">
+        <div class="browser-nav">
+            <div class="pull-left">
+                ## loads the history for a file
+                ${h.hidden('file_refs_filter')}
+            </div>
+
+            <div class="pull-right">
+
+            ## Download
+            % if c.lf_node:
+              <a class="btn btn-default" href="${h.route_path('repo_file_download',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path, _query=dict(lf=1))}">
+              ${_('Download largefile')}
+              </a>
+            % else:
+              <a  class="btn btn-default" href="${h.route_path('repo_file_download',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path)}">
+              ${_('Download file')}
+              </a>
+            % endif
+
+            %if h.HasRepoPermissionAny('repository.write','repository.admin')(c.repo_name):
+              ## on branch head, can edit files
+              %if c.on_branch_head and c.branch_or_raw_id and not c.file.is_binary:
+                  ## binary files are delete only
+                  % if c.file.is_binary:
+                    ${h.link_to(_('Edit'), '#Edit', class_="btn btn-default disabled tooltip", title=_('Editing binary files not allowed'))}
+                    ${h.link_to(_('Delete'), h.route_path('repo_files_remove_file',repo_name=c.repo_name,commit_id=c.branch_or_raw_id,f_path=c.f_path, _anchor='edit'),class_="btn btn-danger")}
+                  % else:
+                    <a  class="btn btn-default" href="${h.route_path('repo_files_edit_file',repo_name=c.repo_name,commit_id=c.branch_or_raw_id,f_path=c.f_path, _anchor='edit')}">
+                        ${_('Edit on branch: ')}<code>${c.branch_name}</code>
+                    </a>
+
+                    <a class="btn btn-danger" href="${h.route_path('repo_files_remove_file',repo_name=c.repo_name,commit_id=c.branch_or_raw_id,f_path=c.f_path, _anchor='edit')}">
+                        ${_('Delete')}
+                    </a>
+                  % endif
+              ## not on head, forbid all
+              % else:
+               ${h.link_to(_('Edit'), '#Edit', class_="btn btn-default disabled tooltip", title=_('Editing files allowed only when on branch head commit'))}
+               ${h.link_to(_('Delete'), '#Delete', class_="btn btn-default btn-danger disabled tooltip", title=_('Deleting files allowed only when on branch head commit'))}
+              % endif
+            %endif
+
+          </div>
+        </div>
+        <div id="file_history_container"></div>
+
+        </div>
+    </div>
+
+    <div class="codeblock codeblock-header">
+      <div>
+        ${h.files_breadcrumbs(c.repo_name,c.commit.raw_id,c.file.path, request.GET.get('at'))}
+      </div>
       <div class="stats">
-        <span class="stats-filename">
-            <strong>
-                <i class="icon-file-text"></i>
-                ${c.file.unicode_path_safe}
-            </strong>
-        </span>
-        <span class="item last"><i class="tooltip icon-clipboard clipboard-action" data-clipboard-text="${c.f_path}" title="${_('Copy the full path')}"></i></span>
-        <br/>
 
         % if c.lf_node:
         <span title="${_('This file is a pointer to large binary file')}"> | ${_('LargeFile')} ${h.format_byte_size_binary(c.lf_node.size)} </span>
@@ -22,50 +67,22 b''
           <span> | ${c.file.mimetype} </span>
           <span> | ${h.get_lexer_for_filenode(c.file).__class__.__name__}</span>
         </div>
+
       </div>
-      <div class="buttons">
-        <a id="file_history_overview" href="#">
-            ${_('History')}
-        </a>
-        <a id="file_history_overview_full" style="display: none" href="${h.route_path('repo_changelog_file',repo_name=c.repo_name, commit_id=c.commit.raw_id, f_path=c.f_path)}">
-           ${_('Show Full History')}
-        </a> |
-        %if c.annotate:
-          ${h.link_to(_('Source'), h.route_path('repo_files', repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path))}
-        %else:
-          ${h.link_to(_('Annotation'), h.route_path('repo_files:annotated',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path))}
-        %endif
-         | ${h.link_to(_('Raw'), h.route_path('repo_file_raw',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path))}
-         |
-          % if c.lf_node:
-              <a href="${h.route_path('repo_file_download',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path, _query=dict(lf=1))}">
-              ${_('Download largefile')}
-              </a>
-          % else:
-              <a href="${h.route_path('repo_file_download',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path)}">
-              ${_('Download')}
-              </a>
-          % endif
+      <div class="pull-right">
+            <a id="file_history_overview" href="#loadHistory">
+                ${_('History')}
+            </a>
+             |
+            %if c.annotate:
+              ${h.link_to(_('Source'), h.route_path('repo_files', repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path))}
+            %else:
+              ${h.link_to(_('Annotation'), h.route_path('repo_files:annotated',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path))}
+            %endif
+             | ${h.link_to(_('Raw'), h.route_path('repo_file_raw',repo_name=c.repo_name,commit_id=c.commit.raw_id,f_path=c.f_path))}
 
-        %if h.HasRepoPermissionAny('repository.write','repository.admin')(c.repo_name):
-           |
-         %if c.on_branch_head and c.branch_or_raw_id and not c.file.is_binary:
-            <a href="${h.route_path('repo_files_edit_file',repo_name=c.repo_name,commit_id=c.branch_or_raw_id,f_path=c.f_path, _anchor='edit')}">
-              ${_('Edit on Branch:{}').format(c.branch_name)}
-            </a>
-            | <a class="btn-danger btn-link" href="${h.route_path('repo_files_remove_file',repo_name=c.repo_name,commit_id=c.branch_or_raw_id,f_path=c.f_path, _anchor='edit')}">${_('Delete')}
-            </a>
-         %elif c.on_branch_head and c.branch_or_raw_id and c.file.is_binary:
-          ${h.link_to(_('Edit'), '#', class_="btn btn-link disabled tooltip", title=_('Editing binary files not allowed'))}
-           | ${h.link_to(_('Delete'), h.route_path('repo_files_remove_file',repo_name=c.repo_name,commit_id=c.branch_or_raw_id,f_path=c.f_path, _anchor='edit'),class_="btn-danger btn-link")}
-         %else:
-          ${h.link_to(_('Edit'), '#', class_="btn btn-link disabled tooltip", title=_('Editing files allowed only when on branch head commit'))}
-           | ${h.link_to(_('Delete'), '#', class_="btn btn-danger btn-link disabled tooltip", title=_('Deleting files allowed only when on branch head commit'))}
-         %endif
-        %endif
       </div>
-    </div>
-    <div id="file_history_container"></div>
+
     <div class="code-body">
      %if c.file.is_binary:
            <% rendered_binary = h.render_binary(c.repo_name, c.file)%>

rhodecode/templates/files/files_source_header.mako

@@ -36,29 +36,6 b''
           </div>
         </div>
       </div>
-
-
-      <div class="fieldset collapsable-content" data-toggle="summary-details">
-        <div class="left-label-summary-files">
-          <p class="spacing">${_('Show/Diff file')}</p>
-          <div class="right-label-summary">
-            ${h.hidden('diff1')}
-            ${h.hidden('diff2',c.commit.raw_id)}
-            ${h.hidden('annotate', c.annotate)}
-          </div>
-        </div>
-      </div>
-
-
-      <div class="fieldset collapsable-content" data-toggle="summary-details">
-        <div class="left-label-summary-files">
-          <p>${_('Action')}</p>
-          <div class="right-label-summary">
-            ${h.submit('diff_to_commit',_('Diff to Commit'),class_="btn disabled",disabled="true")}
-            ${h.submit('show_at_commit',_('Show at Commit'),class_="btn disabled",disabled="true")}
-          </div>
-        </div>
-      </div>
     </div>
 
     <div class="right-content">