Changeset - bfde3237d6ad
[Not reviewed]
default
0 2 0
Takumi IINO - 10 years ago 2015-11-12 16:22:35
trot.thunder@gmail.com
select2: show prefix matches first in #repo-switcher

Do as 4f4d2e899a02 introduced for the PR/changelog branch select2 boxes.
2 files changed with 32 insertions and 0 deletions:
0 comments (0 inline, 0 general)
kallithea/public/js/base.js
Show inline comments
 
@@ -1693,208 +1693,239 @@ var YUI_paginator = function(links_per_p
 
                this.link.innerHTML = label;
 
                this.link.title     = title;
 
                YUE.on(this.link,'click',this.onClick,this,true);
 

	
 
                setId(this.span, id_base + '-last-span');
 
                this.span.className = c;
 
                this.span.innerHTML = label;
 

	
 
                setId(this.na, id_base + '-last-na');
 

	
 
                if (this.rightmost_page < p.getTotalPages()){
 
                    this.current = this.link;
 
                }
 
                else{
 
                    this.current = this.span;
 
                }
 

	
 
                this.current.innerHTML = p.getTotalPages();
 
                return this.current;
 
            },
 

	
 
            update : function (e) {
 
                var p      = this.paginator;
 

	
 
                var _pos = this.getPos(p.getCurrentPage(), p.getTotalPages(), 5);
 
                this.leftmost_page = _pos[0];
 
                this.rightmost_page = _pos[2];
 

	
 
                if (e && e.prevValue === e.newValue) {
 
                    return;
 
                }
 

	
 
                var par   = this.current ? this.current.parentNode : null,
 
                    after = this.link;
 
                if (par) {
 

	
 
                    // only show the last page if the rightmost one is
 
                    // lower, so we don't have doubled entries at the end
 
                    if (!(this.rightmost_page < p.getTotalPages())){
 
                        after = this.span
 
                    }
 

	
 
                    if (this.current !== after) {
 
                        par.replaceChild(after,this.current);
 
                        this.current = after;
 
                    }
 
                }
 
                this.current.innerHTML = this.paginator.getTotalPages();
 

	
 
            },
 
            destroy : function () {
 
                YUE.purgeElement(this.link);
 
                this.current.parentNode.removeChild(this.current);
 
                this.link = this.span = null;
 
            },
 
            onClick : function (e) {
 
                YUE.stopEvent(e);
 
                this.paginator.setPage(this.paginator.getTotalPages());
 
            }
 
        };
 

	
 
        })();
 

	
 
    var pagi = new YAHOO.widget.Paginator({
 
        rowsPerPage: links_per_page,
 
        alwaysVisible: false,
 
        template : "{PreviousPageLink} {MyFirstPageLink} {PageLinks} {MyLastPageLink} {NextPageLink}",
 
        pageLinks: 5,
 
        containerClass: 'pagination-wh',
 
        currentPageClass: 'pager_curpage',
 
        pageLinkClass: 'pager_link',
 
        nextPageLinkLabel: '&gt;',
 
        previousPageLinkLabel: '&lt;',
 
        containers:containers
 
    });
 

	
 
    return pagi
 
}
 

	
 
var YUI_datatable = function(data, fields, columns, countnode, sortkey, rows){
 
    var myDataSource = new YAHOO.util.DataSource(data);
 
    myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
 
    myDataSource.responseSchema = {
 
        resultsList: "records",
 
        fields: fields
 
        };
 
    myDataSource.doBeforeCallback = function(req, raw, res, cb) {
 
        // This is the filter function
 
        var data     = res.results || [],
 
            filtered = [],
 
            i, l;
 

	
 
        if (req) {
 
            req = req.toLowerCase();
 
            for (i = 0; i<data.length; i++) {
 
                var pos = data[i].raw_name.toLowerCase().indexOf(req);
 
                if (pos != -1) {
 
                    filtered.push(data[i]);
 
                }
 
            }
 
            res.results = filtered;
 
        }
 
        $(countnode).html(res.results.length);
 
        return res;
 
    }
 

	
 
    var myDataTable = new YAHOO.widget.DataTable("datatable_list_wrap", columns, myDataSource, {
 
        sortedBy: {key:sortkey, dir:"asc"},
 
        paginator: YUI_paginator(rows !== undefined && rows ? rows : 25, ['user-paginator']),
 
        MSG_SORTASC: _TM['MSG_SORTASC'],
 
        MSG_SORTDESC: _TM['MSG_SORTDESC'],
 
        MSG_EMPTY: _TM['MSG_EMPTY'],
 
        MSG_ERROR: _TM['MSG_ERROR'],
 
        MSG_LOADING: _TM['MSG_LOADING']
 
        });
 
    myDataTable.subscribe('postRenderEvent',function(oArgs) {
 
        tooltip_activate();
 
        quick_repo_menu();
 
        });
 

	
 
    var filterTimeout = null;
 
    var $q_filter = $('#q_filter');
 

	
 
    var updateFilter = function () {
 
        // Reset timeout
 
        filterTimeout = null;
 

	
 
        // Reset sort
 
        var state = myDataTable.getState();
 
        state.sortedBy = {key:sortkey, dir:YAHOO.widget.DataTable.CLASS_ASC};
 

	
 
        // Get filtered data
 
        myDataSource.sendRequest($q_filter.val(), {
 
            success : myDataTable.onDataReturnInitializeTable,
 
            failure : myDataTable.onDataReturnInitializeTable,
 
            scope   : myDataTable,
 
            argument: state});
 
        };
 

	
 
    $q_filter.click(function(){
 
            if(!$q_filter.hasClass('loaded')){
 
                //TODO: load here full list later to do search within groups
 
                $q_filter.addClass('loaded');
 
            }
 
        });
 

	
 
    $q_filter.keyup(function (e) {
 
            clearTimeout(filterTimeout);
 
            filterTimeout = setTimeout(updateFilter, 600);
 
        });
 
}
 

	
 
/**
 
 Branch Sorting callback for select2, modifying the filtered result so prefix
 
 matches come before matches in the line.
 
 **/
 
var branchSort = function(results, container, query) {
 
    if (query.term) {
 
        return results.sort(function (a, b) {
 
            // Put closed branches after open ones (a bit of a hack ...)
 
            var aClosed = a.text.indexOf("(closed)") > -1,
 
                bClosed = b.text.indexOf("(closed)") > -1;
 
            if (aClosed && !bClosed) {
 
                return 1;
 
            }
 
            if (bClosed && !aClosed) {
 
                return -1;
 
            }
 

	
 
            // Put prefix matches before matches in the line
 
            var aPos = a.text.toLowerCase().indexOf(query.term.toLowerCase()),
 
                bPos = b.text.toLowerCase().indexOf(query.term.toLowerCase());
 
            if (aPos === 0 && bPos !== 0) {
 
                return -1;
 
            }
 
            if (bPos === 0 && aPos !== 0) {
 
                return 1;
 
            }
 

	
 
            // Default sorting
 
            if (a.text > b.text) {
 
                return 1;
 
            }
 
            if (a.text < b.text) {
 
                return -1;
 
            }
 
            return 0;
 
        });
 
    }
 
    return results;
 
};
 

	
 
var prefixFirstSort = function(results, container, query) {
 
    if (query.term) {
 
        return results.sort(function (a, b) {
 
            // if parent node, no sorting
 
            if (a.children != undefined || b.children != undefined) {
 
                return 0;
 
            }
 

	
 
            // Put prefix matches before matches in the line
 
            var aPos = a.text.toLowerCase().indexOf(query.term.toLowerCase()),
 
                bPos = b.text.toLowerCase().indexOf(query.term.toLowerCase());
 
            if (aPos === 0 && bPos !== 0) {
 
                return -1;
 
            }
 
            if (bPos === 0 && aPos !== 0) {
 
                return 1;
 
            }
 

	
 
            // Default sorting
 
            if (a.text > b.text) {
 
                return 1;
 
            }
 
            if (a.text < b.text) {
 
                return -1;
 
            }
 
            return 0;
 
        });
 
    }
 
    return results;
 
};
 

	
 
// global hooks after DOM is loaded
 

	
 
$(document).ready(function(){
 
    $('.diff-collapse-button').click(function(e) {
 
        var $button = $(e.currentTarget);
 
        var $target = $('#' + $button.prop('target'));
 
        if($target.hasClass('hidden')){
 
            $target.removeClass('hidden');
 
            $button.html("&uarr; {0} &uarr;".format(_TM['Collapse Diff']));
 
        }
 
        else if(!$target.hasClass('hidden')){
 
            $target.addClass('hidden');
 
            $button.html("&darr; {0} &darr;".format(_TM['Expand Diff']));
 
        }
 
    });
 
});
kallithea/templates/base/base.html
Show inline comments
 
@@ -201,384 +201,385 @@
 
  </script>
 
  <!--- END CONTEXT BAR -->
 
</%def>
 

	
 
<%def name="menu(current=None)">
 
  <%
 
  def is_current(selected):
 
      if selected == current:
 
          return h.literal('class="current"')
 
  %>
 

	
 
  <ul id="quick" class="horizontal-list">
 
    <!-- repo switcher -->
 
    <li ${is_current('repositories')}>
 
      <input id="repo_switcher" name="repo_switcher" type="hidden">
 
    </li>
 

	
 
    ##ROOT MENU
 
    %if c.authuser.username != 'default':
 
      <li ${is_current('journal')}>
 
        <a class="menu_link" title="${_('Show recent activity')}"  href="${h.url('journal')}">
 
          <i class="icon-book"></i> ${_('Journal')}
 
        </a>
 
      </li>
 
    %else:
 
      <li ${is_current('journal')}>
 
        <a class="menu_link" title="${_('Public journal')}"  href="${h.url('public_journal')}">
 
          <i class="icon-book"></i> ${_('Public journal')}
 
        </a>
 
      </li>
 
    %endif
 
      <li ${is_current('gists')}>
 
        <a class="menu_link childs" title="${_('Show public gists')}"  href="${h.url('gists')}">
 
          <i class="icon-clippy"></i> ${_('Gists')}
 
        </a>
 
          <ul class="admin_menu">
 
            <li><a href="${h.url('new_gist', public=1)}"><i class="icon-paste"></i> ${_('Create New Gist')}</a></li>
 
            <li><a href="${h.url('gists')}"><i class="icon-globe"></i> ${_('All Public Gists')}</a></li>
 
            %if c.authuser.username != 'default':
 
              <li><a href="${h.url('gists', public=1)}"><i class="icon-user"></i> ${_('My Public Gists')}</a></li>
 
              <li><a href="${h.url('gists', private=1)}"><i class="icon-keyhole-circled"></i> ${_('My Private Gists')}</a></li>
 
            %endif
 
          </ul>
 
      </li>
 
    <li ${is_current('search')}>
 
        <a class="menu_link" title="${_('Search in repositories')}"  href="${h.url('search')}">
 
          <i class="icon-search"></i> ${_('Search')}
 
        </a>
 
    </li>
 
    % if h.HasPermissionAll('hg.admin')('access admin main page'):
 
      <li ${is_current('admin')}>
 
        <a class="menu_link childs" title="${_('Admin')}" href="${h.url('admin_home')}">
 
          <i class="icon-gear"></i> ${_('Admin')}
 
        </a>
 
        ${admin_menu()}
 
      </li>
 
    % elif c.authuser.repositories_admin or c.authuser.repository_groups_admin or c.authuser.user_groups_admin:
 
    <li ${is_current('admin')}>
 
        <a class="menu_link childs" title="${_('Admin')}">
 
          <i class="icon-gear"></i> ${_('Admin')}
 
        </a>
 
        ${admin_menu_simple(c.authuser.repositories_admin,
 
                            c.authuser.repository_groups_admin,
 
                            c.authuser.user_groups_admin or h.HasPermissionAny('hg.usergroup.create.true')())}
 
    </li>
 
    % endif
 

	
 
    <li ${is_current('my_pullrequests')}>
 
      <a class="menu_link" title="${_('My Pull Requests')}" href="${h.url('my_pullrequests')}">
 
        <i class="icon-git-pull-request"></i> ${_('My Pull Requests')}
 
        %if c.my_pr_count != 0:
 
          <span class="menu_link_notifications">${c.my_pr_count}</span>
 
        %endif
 
      </a>
 
    </li>
 

	
 
    ## USER MENU
 
    <li>
 
      <a class="menu_link childs" id="quick_login_link">
 
          <span class="icon">
 
            ${h.gravatar(c.authuser.email, size=20)}
 
          </span>
 
          %if c.authuser.username != 'default':
 
            <span class="menu_link_user">${c.authuser.username}</span>
 
            %if c.unread_notifications != 0:
 
              <span class="menu_link_notifications">${c.unread_notifications}</span>
 
            %endif
 
          %else:
 
              <span>${_('Not Logged In')}</span>
 
          %endif
 
      </a>
 

	
 
      <div class="user-menu">
 
        <div id="quick_login">
 
          %if c.authuser.username == 'default' or c.authuser.user_id is None:
 
            <h4>${_('Login to Your Account')}</h4>
 
            ${h.form(h.url('login_home', came_from=request.path_qs))}
 
            <div class="form">
 
                <div class="fields">
 
                    <div class="field">
 
                        <div class="label">
 
                            <label for="username">${_('Username')}:</label>
 
                        </div>
 
                        <div class="input">
 
                            ${h.text('username',class_='focus')}
 
                        </div>
 

	
 
                    </div>
 
                    <div class="field">
 
                        <div class="label">
 
                            <label for="password">${_('Password')}:</label>
 
                        </div>
 
                        <div class="input">
 
                            ${h.password('password',class_='focus')}
 
                        </div>
 

	
 
                    </div>
 
                    <div class="buttons">
 
                        <div class="password_forgoten">${h.link_to(_('Forgot password ?'),h.url('reset_password'))}</div>
 
                        <div class="register">
 
                        %if h.HasPermissionAny('hg.admin', 'hg.register.auto_activate', 'hg.register.manual_activate')():
 
                         ${h.link_to(_("Don't have an account ?"),h.url('register'))}
 
                        %endif
 
                        </div>
 
                        <div class="submit">
 
                            ${h.submit('sign_in',_('Log In'),class_="btn btn-mini")}
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
            ${h.end_form()}
 
          %else:
 
            <div class="links_left">
 
                <div class="big_gravatar">
 
                  ${h.gravatar(c.authuser.email, size=48)}
 
                </div>
 
                <div class="full_name">${c.authuser.full_name_or_username}</div>
 
                <div class="email">${c.authuser.email}</div>
 
            </div>
 
            <div class="links_right">
 
            <ol class="links">
 
              <li><a href="${h.url('notifications')}">${_('Notifications')}: ${c.unread_notifications}</a></li>
 
              <li>${h.link_to(_('My Account'),h.url('my_account'))}</li>
 
              %if not c.authuser.is_external_auth:
 
                ## Cannot log out if using external (container) authentication.
 
                <li class="logout">${h.link_to(_('Log Out'), h.url('logout_home'))}</li>
 
              %endif
 
            </ol>
 
            </div>
 
          %endif
 
        </div>
 
      </div>
 
    </li>
 

	
 
    <script type="text/javascript">
 
        $(document).ready(function(){
 
            var visual_show_public_icon = "${c.visual.show_public_icon}" == "True";
 
            var cache = {}
 
            /*format the look of items in the list*/
 
            var format = function(state){
 
                if (!state.id){
 
                  return state.text; // optgroup
 
                }
 
                var obj_dict = state.obj;
 
                var tmpl = '';
 

	
 
                if(obj_dict && state.type == 'repo'){
 
                    tmpl += '<span class="repo-icons">';
 
                    if(obj_dict['repo_type'] === 'hg'){
 
                        tmpl += '<span class="repotag">hg</span> ';
 
                    }
 
                    else if(obj_dict['repo_type'] === 'git'){
 
                        tmpl += '<span class="repotag">git</span> ';
 
                    }
 
                    if(obj_dict['private']){
 
                        tmpl += '<i class="icon-keyhole-circled"></i> ';
 
                    }
 
                    else if(visual_show_public_icon){
 
                        tmpl += '<i class="icon-globe"></i> ';
 
                    }
 
                    tmpl += '</span>';
 
                }
 
                if(obj_dict && state.type == 'group'){
 
                        tmpl += '<i class="icon-folder"></i> ';
 
                }
 
                tmpl += state.text;
 
                return tmpl;
 
            }
 

	
 
            $("#repo_switcher").select2({
 
                placeholder: '<i class="icon-database"></i> ${_('Repositories')}',
 
                dropdownAutoWidth: true,
 
                sortResults: prefixFirstSort,
 
                formatResult: format,
 
                formatSelection: format,
 
                formatNoMatches: function(term){
 
                    return "${_('No matches found')}";
 
                },
 
                containerCssClass: "repo-switcher",
 
                dropdownCssClass: "repo-switcher-dropdown",
 
                escapeMarkup: function(m){
 
                    // don't escape our custom placeholder
 
                    if(m.substr(0,29) == '<i class="icon-database"></i>'){
 
                        return m;
 
                    }
 

	
 
                    return Select2.util.escapeMarkup(m);
 
                },
 
                query: function(query){
 
                  var key = 'cache';
 
                  var cached = cache[key] ;
 
                  if(cached) {
 
                    var data = {results: []};
 
                    //filter results
 
                    $.each(cached.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({'id': this.id, 'text': this.text, 'type': this.type, 'obj': this.obj});
 
                            }
 
                        });
 
                        if(children.length !== 0){
 
                            data.results.push({'text': section, 'children': children});
 
                        }
 

	
 
                    });
 
                    query.callback(data);
 
                  }else{
 
                      $.ajax({
 
                        url: "${h.url('repo_switcher_data')}",
 
                        data: {},
 
                        dataType: 'json',
 
                        type: 'GET',
 
                        success: function(data) {
 
                          cache[key] = data;
 
                          query.callback({results: data.results});
 
                        }
 
                      });
 
                  }
 
                }
 
            });
 

	
 
            $("#repo_switcher").on('select2-selecting', function(e){
 
                e.preventDefault();
 
                window.location = pyroutes.url('summary_home', {'repo_name': e.val});
 
            });
 
        });
 

	
 
        ## Global mouse bindings ##
 

	
 
        // general help "?"
 
        Mousetrap.bind(['?'], function(e) {
 
            $('#help_kb').modal({});
 
        });
 

	
 
        // / open the quick filter
 
        Mousetrap.bind(['/'], function(e) {
 
            $("#repo_switcher").select2("open");
 

	
 
            // return false to prevent default browser behavior
 
            // and stop event from bubbling
 
            return false;
 
        });
 

	
 
        // ctrl/command+b, show the the main bar
 
        Mousetrap.bind(['command+b', 'ctrl+b'], function(e) {
 
            if($('#header-inner').hasClass('hover') && $('#content').hasClass('hover')){
 
                $('#header-inner').removeClass('hover');
 
                $('#content').removeClass('hover');
 
            }
 
            else{
 
                $('#header-inner').addClass('hover');
 
                $('#content').addClass('hover');
 
            }
 
            return false;
 
        });
 

	
 
        // general nav g + action
 
        Mousetrap.bind(['g h'], function(e) {
 
            window.location = pyroutes.url('home');
 
        });
 
        Mousetrap.bind(['g g'], function(e) {
 
            window.location = pyroutes.url('gists', {'private':1});
 
        });
 
        Mousetrap.bind(['g G'], function(e) {
 
            window.location = pyroutes.url('gists', {'public':1});
 
        });
 
        Mousetrap.bind(['n g'], function(e) {
 
            window.location = pyroutes.url('new_gist');
 
        });
 
        Mousetrap.bind(['n r'], function(e) {
 
            window.location = pyroutes.url('new_repo');
 
        });
 

	
 
        % if hasattr(c, 'repo_name') and hasattr(c, 'db_repo'):
 
            // nav in repo context
 
            Mousetrap.bind(['g s'], function(e) {
 
                window.location = pyroutes.url('summary_home', {'repo_name': REPO_NAME});
 
            });
 
            Mousetrap.bind(['g c'], function(e) {
 
                window.location = pyroutes.url('changelog_home', {'repo_name': REPO_NAME});
 
            });
 
            Mousetrap.bind(['g F'], function(e) {
 
                window.location = pyroutes.url('files_home', {'repo_name': REPO_NAME, 'revision': '${c.db_repo.landing_rev[1]}', 'f_path': '', 'search': '1'});
 
            });
 
            Mousetrap.bind(['g f'], function(e) {
 
                window.location = pyroutes.url('files_home', {'repo_name': REPO_NAME, 'revision': '${c.db_repo.landing_rev[1]}', 'f_path': ''});
 
            });
 
            Mousetrap.bind(['g o'], function(e) {
 
                window.location = pyroutes.url('edit_repo', {'repo_name': REPO_NAME});
 
            });
 
            Mousetrap.bind(['g O'], function(e) {
 
                window.location = pyroutes.url('edit_repo_perms', {'repo_name': REPO_NAME});
 
            });
 
        % endif
 

	
 
    </script>
 
</%def>
 

	
 
%if 0:
 
<div class="modal" id="help_kb" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 
    <div class="modal-dialog">
 
      <div class="modal-content">
 
        <div class="modal-header">
 
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-cancel-circled"></i></button>
 
          <h4 class="modal-title">${_('Keyboard shortcuts')}</h4>
 
        </div>
 
        <div class="modal-body">
 
           <div class="row">
 
              <div class="col-md-5">
 
                <table class="keyboard-mappings">
 
                    <tbody>
 
                  <tr>
 
                    <th></th>
 
                    <th>${_('Site-wide shortcuts')}</th>
 
                  </tr>
 
                  <%
 
                     elems = [
 
                         ('/', 'Open quick search box'),
 
                         ('ctrl/cmd+b', 'Show main settings bar'),
 
                         ('g h', 'Goto home page'),
 
                         ('g g', 'Goto my private gists page'),
 
                         ('g G', 'Goto my public gists page'),
 
                         ('n r', 'New repository page'),
 
                         ('n g', 'New gist page'),
 
                     ]
 
                  %>
 
                  %for key, desc in elems:
 
                  <tr>
 
                    <td class="keys">
 
                      <span class="key">${key}</span>
 
                    </td>
 
                    <td>${desc}</td>
 
                  </tr>
 
                %endfor
 
                </tbody>
 
                  </table>
 
              </div>
 
              <div class="col-md-offset-5">
 
                <table class="keyboard-mappings">
 
                <tbody>
 
                  <tr>
 
                    <th></th>
 
                    <th>${_('Repositories')}</th>
 
                  </tr>
 
                  <%
 
                     elems = [
 
                         ('g s', 'Goto summary page'),
 
                         ('g c', 'Goto changelog page'),
 
                         ('g f', 'Goto files page'),
 
                         ('g F', 'Goto files page with file search activated'),
 
                         ('g o', 'Goto repository settings'),
 
                         ('g O', 'Goto repository permissions settings'),
 
                     ]
 
                  %>
 
                  %for key, desc in elems:
 
                  <tr>
 
                    <td class="keys">
 
                      <span class="key">${key}</span>
 
                    </td>
 
                    <td>${desc}</td>
 
                  </tr>
 
                %endfor
 
                </tbody>
0 comments (0 inline, 0 general)