kallithea Changeset - 4d7d3445e388

Changeset - 4d7d3445e388

Parent rev.

Child rev.

[Not reviewed]

default

0 3 0

Mads Kiilerich - 8 years ago 2017-08-13 17:19:18
mads@kiilerich.com

autocomplete: use select2 when selecting owner of repos and PRs

This is a minimal change to SimpleUserAutoComplete, inspired by Dominik Ruf.

The UX is slightly different than before, with select2 putting up an extra
input field, already before typing anything.

We use minimumInputLength 1 to get the same behaviour as before and avoid
displaying all users in a list. This field will always have an old value and
the placeholder is thus never used, but we show it instead of the default
"Please enter 1 or more character" message.

The initSelection iteration is not pretty, but no more complex than what
happens when filtering the user list, and it has the advantage of giving a nice
name/gravatar display of the current user.

3 files changed with 23 insertions and 21 deletions:

kallithea/public/js/base.js

kallithea/templates/admin/repos/repo_edit_settings.html

kallithea/templates/pullrequests/pullrequest_show.html

0 comments (0 inline, 0 general)

kallithea/public/js/base.js

➞

Show inline comments

@@ @@ -1129,27 +1129,31 @@ var autocompleteCreate = function ($inpu @@
     autocomplete.formatResult = autocompleteFormatter;
     return autocomplete;
+}
 var SimpleUserAutoComplete = function ($inputElement, users_list) {
     var matchUsers = function (sQuery) {
         return autocompleteMatchUsers(sQuery, users_list);
+    }
     var userAC = autocompleteCreate($inputElement, matchUsers);
     // Handler for selection of an entry
     var itemSelectHandler = function (sType, aArgs) {
         var myAC = aArgs[0]; // reference back to the AC instance
         var elLI = aArgs[1]; // reference to the selected LI element
         var oData = aArgs[2]; // object literal of selected item's result data
         myAC.getInputEl().value = oData.nname;
     };
     userAC.itemSelectEvent.subscribe(itemSelectHandler);
     $inputElement.select2(
+    {
         formatInputTooShort: $inputElement.attr('placeholder'),
         initSelection : function (element, callback) {
             var val = $inputElement.val();
             $.each(users_list, function(i, user) {
                 if (user.nname == val)
                     callback(user);
             });
         },
         minimumInputLength: 1,
         query: function (query) {
             query.callback({results: autocompleteMatchUsers(query.term, users_list)});
         },
         formatSelection: autocompleteFormatter,
         formatResult: autocompleteFormatter,
         escapeMarkup: function(m) { return m; },
         id: function(item) { return item.nname; },
     });
+}
 var MembersAutoComplete = function ($inputElement, users_list, groups_list) {
     var matchAll = function (sQuery) {
         var u = autocompleteMatchUsers(sQuery, users_list);

kallithea/templates/admin/repos/repo_edit_settings.html

➞

Show inline comments

@@ @@ -37,19 +37,17 @@ ${h.form(url('update_repo', repo_name=c. @@
                     ${h.select('repo_landing_rev','',c.landing_revs,class_='form-control')}
                     <span class="help-block">${_('Default revision for files page, downloads, whoosh and readme')}</span>
                 </div>
             </div>
             <div class="form-group">
                 <label class="control-label" for="owner">${_('Owner')}:</label>
                 <div class="ac">
                     <div class="perm_ac">
                        ${h.text('owner',class_='yui-ac-input form-control')}
                 <div>
                    ${h.text('owner',class_='form-control', placeholder=_('Type name of user'))}
                        <span class="help-block">${_('Change owner of this repository.')}</span>
                     </div>
                 </div>
              </div>
             <div class="form-group">
                 <label class="control-label" for="repo_description">${_('Description')}:</label>
                 <div>
                     ${h.textarea('repo_description',class_='form-control')}
                     <span class="help-block">${_('Keep it short and to the point. Use a README file for longer descriptions.')}</span>
                 </div>

kallithea/templates/pullrequests/pullrequest_show.html

➞

Show inline comments

@@ @@ -135,14 +135,14 @@ ${self.repo_context_bar('showpullrequest @@
           <label>${_('Owner')}:</label>
           <div class="pr-not-edit">
                   ${h.gravatar_div(c.pull_request.owner.email, size=20)}
                   <span>${c.pull_request.owner.full_name_and_username}</span><br/>
                   <span><a href="mailto:${c.pull_request.owner.email}">${c.pull_request.owner.email}</a></span><br/>
           </div>
           <div class="pr-do-edit ac" style="display:none">
                ${h.text('owner', class_='form-control', value=c.pull_request.owner.username, placeholder=_('Username'))}
           <div class="pr-do-edit" style="display:none">
                ${h.text('owner', class_='form-control', value=c.pull_request.owner.username, placeholder=_('Type name of user'))}
           </div>
         </div>
         <div class="form-group">
           <label>${_('Next iteration')}:</label>
             <div>

0 comments (0 inline, 0 general)