Changeset - e4d2fec64955
Parent rev.
Child rev.
[Not reviewed]
default
0 5 0
Mads Kiilerich - 8 years ago 2017-08-11 02:48:15
mads@kiilerich.com
autocompletion: drop explicit container elements - just create them when necessary

The previous wide styling of the @mention selection list didn't look pretty -
just use the default width.

Inspired by select2 port by Dominik Ruf.
5 files changed with 15 insertions and 35 deletions:
kallithea/public/css/style.css
8
kallithea/public/js/base.js
12
16
kallithea/templates/admin/repos/repo_edit_settings.html
1
2
kallithea/templates/changeset/changeset_file_comment.html
5
kallithea/templates/pullrequests/pullrequest_show.html
2
4
0 comments (0 inline, 0 general)
kallithea/public/css/style.css
➞
Show inline comments
 
@@ -1951,14 +1951,6 @@ table.code-browser i[class^='icon-'] {
 
    z-index: 2;
 
}
 

			




	
	
	
		
 

			




	
	
	
		
 
.mentions-container {

			




	
	
	
		
 
    width: 90% !important;

			




	
	
	
		
 
}

			




	
	
	
		
 
.mentions-container .yui-ac-content {

			




	
	
	
		
 
    width: 100% !important;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.ac {

			




	
	
	
		
 
    vertical-align: top;

			




	
	
	
		
 
}

			




        

    


    
    

    

        

                

                    kallithea/public/js/base.js
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
		
 
@@ -649,7 +649,6 @@ function _comment_div_append_form($comme

			




	
	
	
		
 
    $comment_div.append($form_div);

			




	
	
	
		
 
    var $form = $comment_div.find("form");

			




	
	
	
		
 
    var $textarea = $form.find('textarea');

			




	
	
	
		
 
    var $mentions_container = $form.find('div.mentions-container');

			




	
	
	
		
 

			




	
	
	
		
 
    $form.submit(function(e) {

			




	
	
	
		
 
        e.preventDefault();

			




	
	
		
 
@@ -713,7 +712,7 @@ function _comment_div_append_form($comme

			




	
	
	
		
 

			




	
	
	
		
 
    tooltip_activate();

			




	
	
	
		
 
    if ($textarea.length > 0) {

			




	
	
	
		
 
        MentionsAutoComplete($textarea, $mentions_container, _USERS_AC_DATA);

			




	
	
	
		
 
        MentionsAutoComplete($textarea, _USERS_AC_DATA);

			




	
	
	
		
 
    }

			




	
	
	
		
 
    if (f_path) {

			




	
	
	
		
 
        $textarea.focus();

			




	
	
		
 
@@ -1113,7 +1112,8 @@ var autocompleteFormatter = function (oR

			




	
	
	
		
 
};

			




	
	
	
		
 

			




	
	
	
		
 
// Generate a basic autocomplete instance that can be tweaked further by the caller

			




	
	
	
		
 
var autocompleteCreate = function ($inputElement, $container, matchFunc) {

			




	
	
	
		
 
var autocompleteCreate = function ($inputElement, matchFunc) {

			




	
	
	
		
 
    var $container = $('<div/>').insertAfter($inputElement);

			




	
	
	
		
 
    var datasource = new YAHOO.util.FunctionDataSource(matchFunc);

			




	
	
	
		
 

			




	
	
	
		
 
    var autocomplete = new YAHOO.widget.AutoComplete($inputElement[0], $container[0], datasource);

			




	
	
		
 
@@ -1127,13 +1127,13 @@ var autocompleteCreate = function ($inpu

			




	
	
	
		
 
    return autocomplete;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
var SimpleUserAutoComplete = function ($inputElement, $container, users_list) {

			




	
	
	
		
 
var SimpleUserAutoComplete = function ($inputElement, users_list) {

			




	
	
	
		
 

			




	
	
	
		
 
    var matchUsers = function (sQuery) {

			




	
	
	
		
 
        return autocompleteMatchUsers(sQuery, users_list);

			




	
	
	
		
 
    }

			




	
	
	
		
 

			




	
	
	
		
 
    var userAC = autocompleteCreate($inputElement, $container, matchUsers);

			




	
	
	
		
 
    var userAC = autocompleteCreate($inputElement, matchUsers);

			




	
	
	
		
 

			




	
	
	
		
 
    // Handler for selection of an entry

			




	
	
	
		
 
    var itemSelectHandler = function (sType, aArgs) {

			




	
	
		
 
@@ -1145,7 +1145,7 @@ var SimpleUserAutoComplete = function ($

			




	
	
	
		
 
    userAC.itemSelectEvent.subscribe(itemSelectHandler);

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
var MembersAutoComplete = function ($inputElement, $container, users_list, groups_list) {

			




	
	
	
		
 
var MembersAutoComplete = function ($inputElement, users_list, groups_list) {

			




	
	
	
		
 

			




	
	
	
		
 
    var matchAll = function (sQuery) {

			




	
	
	
		
 
        var u = autocompleteMatchUsers(sQuery, users_list);

			




	
	
		
 
@@ -1153,7 +1153,7 @@ var MembersAutoComplete = function ($inp

			




	
	
	
		
 
        return u.concat(g);

			




	
	
	
		
 
    };

			




	
	
	
		
 

			




	
	
	
		
 
    var membersAC = autocompleteCreate($inputElement, $container, matchAll);

			




	
	
	
		
 
    var membersAC = autocompleteCreate($inputElement, matchAll);

			




	
	
	
		
 

			




	
	
	
		
 
    // Handler for selection of an entry

			




	
	
	
		
 
    var itemSelectHandler = function (sType, aArgs) {

			




	
	
		
 
@@ -1175,8 +1175,7 @@ var MembersAutoComplete = function ($inp

			




	
	
	
		
 
    membersAC.itemSelectEvent.subscribe(itemSelectHandler);

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
var MentionsAutoComplete = function ($inputElement, $container, users_list) {

			




	
	
	
		
 

			




	
	
	
		
 
var MentionsAutoComplete = function ($inputElement, users_list) {

			




	
	
	
		
 
    var matchUsers = function (sQuery) {

			




	
	
	
		
 
            var org_sQuery = sQuery;

			




	
	
	
		
 
            if(this.mentionQuery == null){

			




	
	
		
 
@@ -1186,7 +1185,7 @@ var MentionsAutoComplete = function ($in

			




	
	
	
		
 
            return autocompleteMatchUsers(sQuery, users_list);

			




	
	
	
		
 
    }

			




	
	
	
		
 

			




	
	
	
		
 
    var mentionsAC = autocompleteCreate($inputElement, $container, matchUsers);

			




	
	
	
		
 
    var mentionsAC = autocompleteCreate($inputElement, matchUsers);

			




	
	
	
		
 
    mentionsAC.suppressInputUpdate = true;

			




	
	
	
		
 
    // Overwrite formatResult to take into account mentionQuery

			




	
	
	
		
 
    mentionsAC.formatResult = function (oResultData, sQuery, sResultMatch) {

			




	
	
		
 
@@ -1307,13 +1306,12 @@ var removeReviewMember = function(review

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
/* activate auto completion of users as PR reviewers */

			




	
	
	
		
 
var PullRequestAutoComplete = function ($inputElement, $container, users_list) {

			




	
	
	
		
 

			




	
	
	
		
 
var PullRequestAutoComplete = function ($inputElement, users_list) {

			




	
	
	
		
 
    var matchUsers = function (sQuery) {

			




	
	
	
		
 
        return autocompleteMatchUsers(sQuery, users_list);

			




	
	
	
		
 
    };

			




	
	
	
		
 

			




	
	
	
		
 
    var reviewerAC = autocompleteCreate($inputElement, $container, matchUsers);

			




	
	
	
		
 
    var reviewerAC = autocompleteCreate($inputElement, matchUsers);

			




	
	
	
		
 
    reviewerAC.suppressInputUpdate = true;

			




	
	
	
		
 

			




	
	
	
		
 
    // Handler for selection of an entry

			




	
	
		
 
@@ -1341,15 +1339,13 @@ function addPermAction(perm_type, users_

			




	
	
	
		
 
            '<div class="perm_ac" id="perm_ac_{0}">' +

			




	
	
	
		
 
                '<input class="yui-ac-input" id="perm_new_member_name_{0}" name="perm_new_member_name_{0}" value="" type="text">' +

			




	
	
	
		
 
                '<input id="perm_new_member_type_{0}" name="perm_new_member_type_{0}" value="" type="hidden">' +

			




	
	
	
		
 
                '<div id="perm_container_{0}"></div>' +

			




	
	
	
		
 
            '</div>' +

			




	
	
	
		
 
        '</td>' +

			




	
	
	
		
 
        '<td></td>';

			




	
	
	
		
 
    var $last_node = $('.last_new_member').last(); // empty tr between last and add

			




	
	
	
		
 
    var next_id = $('.new_members').length;

			




	
	
	
		
 
    $last_node.before($('<tr class="new_members">').append(template.format(next_id, perm_type)));

			




	
	
	
		
 
    MembersAutoComplete($("#perm_new_member_name_"+next_id),

			




	
	
	
		
 
            $("#perm_container_"+next_id), users_list, groups_list);

			




	
	
	
		
 
    MembersAutoComplete($("#perm_new_member_name_"+next_id), users_list, groups_list);

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
function ajaxActionRevokePermission(url, obj_id, obj_type, field_id, extra_data) {

			




        

    


    
    

    

        

                

                    kallithea/templates/admin/repos/repo_edit_settings.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
		
 
@@ -44,7 +44,6 @@ ${h.form(url('update_repo', repo_name=c.

			




	
	
	
		
 
                    <div class="perm_ac">

			




	
	
	
		
 
                       ${h.text('owner',class_='yui-ac-input form-control')}

			




	
	
	
		
 
                       <span class="help-block">${_('Change owner of this repository.')}</span>

			




	
	
	
		
 
                       <div id="owner_container"></div>

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
             </div>

			




	
	
		
 
@@ -124,6 +123,6 @@ ${h.form(url('update_repo', repo_name=c.

			




	
	
	
		
 

			




	
	
	
		
 
        // autocomplete

			




	
	
	
		
 
        var _USERS_AC_DATA = ${h.js(c.users_array)};

			




	
	
	
		
 
        SimpleUserAutoComplete($('#owner'), $('#owner_container'), _USERS_AC_DATA);

			




	
	
	
		
 
        SimpleUserAutoComplete($('#owner'), _USERS_AC_DATA);

			




	
	
	
		
 
    });

			




	
	
	
		
 
</script>

			




        

    


    
    

    

        

                

                    kallithea/templates/changeset/changeset_file_comment.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
		
 
@@ -57,7 +57,6 @@

			




	
	
	
		
 
        <div class="comment-help">${_('Commenting on line.')}

			




	
	
	
		
 
          <span class="text-muted">${_('Comments are in plain text. Use @username inside this text to notify another user.')|n}</span>

			




	
	
	
		
 
        </div>

			




	
	
	
		
 
        <div class="mentions-container"></div>

			




	
	
	
		
 
        <textarea name="text" class="form-control comment-block-ta yui-ac-input"></textarea>

			




	
	
	
		
 

			




	
	
	
		
 
        <div id="status_block_container" class="status-block general-only hidden">

			




	
	
		
 
@@ -158,10 +157,6 @@

			




	
	
	
		
 

			




	
	
	
		
 
## MAIN COMMENT FORM

			




	
	
	
		
 
<%def name="comments(change_status=True)">

			




	
	
	
		
 

			




	
	
	
		
 
## global, shared for all edit boxes

			




	
	
	
		
 
<div class="mentions-container" id="mentions_container"></div>

			




	
	
	
		
 

			




	
	
	
		
 
<div class="inline-comments inline-comments-general

			




	
	
	
		
 
            ${'show-general-status' if change_status else ''}">

			




	
	
	
		
 
  <div id="comments-general-comments" class="">

			




        

    


    
    

    

        

                

                    kallithea/templates/pullrequests/pullrequest_show.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
		
 
@@ -140,7 +140,6 @@ ${self.repo_context_bar('showpullrequest

			




	
	
	
		
 
          </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 id="owner_completion_container"></div>

			




	
	
	
		
 
          </div>

			




	
	
	
		
 
        </div>

			




	
	
	
		
 

			




	
	
		
 
@@ -243,7 +242,6 @@ ${self.repo_context_bar('showpullrequest

			




	
	
	
		
 
          <div class='ac'>

			




	
	
	
		
 
            <div class="reviewer_ac">

			




	
	
	
		
 
               ${h.text('user', class_='yui-ac-input form-control',placeholder=_('Type name of reviewer to add'))}

			




	
	
	
		
 
               <div id="reviewers_container"></div>

			




	
	
	
		
 
            </div>

			




	
	
	
		
 
          </div>

			




	
	
	
		
 
          %endif

			




	
	
		
 
@@ -360,8 +358,8 @@ ${self.repo_context_bar('showpullrequest

			




	
	
	
		
 

			




	
	
	
		
 
    <script type="text/javascript">

			




	
	
	
		
 
      $(document).ready(function(){

			




	
	
	
		
 
          PullRequestAutoComplete($('#user'), $('#reviewers_container'), _USERS_AC_DATA);

			




	
	
	
		
 
          SimpleUserAutoComplete($('#owner'), $('#owner_completion_container'), _USERS_AC_DATA);

			




	
	
	
		
 
          PullRequestAutoComplete($('#user'), _USERS_AC_DATA);

			




	
	
	
		
 
          SimpleUserAutoComplete($('#owner'), _USERS_AC_DATA);

			




	
	
	
		
 

			




	
	
	
		
 
          $('.code-difftable').on('click', '.add-bubble', function(e){

			




	
	
	
		
 
              show_comment_form($(this));

			




        

    



    


    



    



      

      





    
    0 comments (0 inline, 0 general)
    





    


  

  







  


    




    








    
        
    
    
        This site is powered by
            Kallithea 0.7.0,
        which is
        © 2010–2025 by various authors & licensed under GPLv3.