kallithea Changeset - 9364776d1331

Changeset - 9364776d1331

Parent rev.

Child rev.

[Not reviewed]

beta

0 4 0

Marcin Kuzminski - 13 years ago 2012-07-15 18:49:11
marcin@python-works.com

Added autocomplete widget for pull request reviewers, in exchange of 90s style
multi select widget

4 files changed with 226 insertions and 48 deletions:

rhodecode/controllers/pullrequests.py

rhodecode/public/css/style.css

rhodecode/public/js/rhodecode.js

175

rhodecode/templates/pullrequests/pullrequest.html

0 comments (0 inline, 0 general)

rhodecode/controllers/pullrequests.py

➞

Show inline comments

@@ @@ -27,46 +27,50 @@ import traceback @@
 from webob.exc import HTTPNotFound, HTTPForbidden
 from collections import defaultdict
 from itertools import groupby
 from pylons import request, response, session, tmpl_context as c, url
 from pylons.controllers.util import abort, redirect
 from pylons.i18n.translation import _
 from pylons.decorators import jsonify
 from rhodecode.lib.compat import json
 from rhodecode.lib.base import BaseRepoController, render
 from rhodecode.lib.auth import LoginRequired, HasRepoPermissionAnyDecorator
 from rhodecode.lib.auth import LoginRequired, HasRepoPermissionAnyDecorator,\
     NotAnonymous
 from rhodecode.lib import helpers as h
 from rhodecode.lib import diffs
 from rhodecode.lib.utils import action_logger
 from rhodecode.model.db import User, PullRequest, ChangesetStatus,\
     ChangesetComment
 from rhodecode.model.pull_request import PullRequestModel
 from rhodecode.model.meta import Session
 from rhodecode.model.repo import RepoModel
 from rhodecode.model.comment import ChangesetCommentsModel
 from rhodecode.model.changeset_status import ChangesetStatusModel
 log = logging.getLogger(__name__)
 class PullrequestsController(BaseRepoController):
     @LoginRequired()
     @HasRepoPermissionAnyDecorator('repository.read', 'repository.write',
                                    'repository.admin')
     def __before__(self):
         super(PullrequestsController, self).__before__()
         repo_model = RepoModel()
         c.users_array = repo_model.get_users_js()
         c.users_groups_array = repo_model.get_users_groups_js()
     def _get_repo_refs(self, repo):
         hist_l = []
         branches_group = ([('branch:%s:%s' % (k, v), k) for
                          k, v in repo.branches.iteritems()], _("Branches"))
         bookmarks_group = ([('book:%s:%s' % (k, v), k) for
                          k, v in repo.bookmarks.iteritems()], _("Bookmarks"))
         tags_group = ([('tag:%s:%s' % (k, v), k) for
                          k, v in repo.tags.iteritems()], _("Tags"))
         hist_l.append(bookmarks_group)
@@ @@ -119,43 +123,37 @@ class PullrequestsController(BaseRepoCon @@
         if org_repo.parent:
             c.default_pull_request = org_repo.parent.repo_name
             c.other_repos.append((org_repo.parent.repo_name, '%s/%s' % (
                                         org_repo.parent.user.username,
                                         org_repo.parent.repo_name))
+                                     )
             other_repos_info[org_repo.parent.repo_name] = {
                 'gravatar': h.gravatar_url(org_repo.parent.user.email, 24),
                 'description': org_repo.parent.description
+            }
         c.other_repos_info = json.dumps(other_repos_info)
         c.review_members = []
         c.available_members = []
         for u in User.query().filter(User.username != 'default').all():
             uname = u.username
             if org_repo.user == u:
                 uname = _('%s (owner)') % u.username
                 # auto add owner to pull-request recipients
                 c.review_members.append([u.user_id, uname])
             c.available_members.append([u.user_id, uname])
         c.review_members = [org_repo.user]
         return render('/pullrequests/pullrequest.html')
     @NotAnonymous()
     def create(self, repo_name):
         req_p = request.POST
         org_repo = req_p['org_repo']
         org_ref = req_p['org_ref']
         other_repo = req_p['other_repo']
         other_ref = req_p['other_ref']
         revisions = req_p.getall('revisions')
         reviewers = req_p.getall('review_members')
         #TODO: wrap this into a FORM !!!
         title = req_p['pullrequest_title']
         description = req_p['pullrequest_desc']
         try:
             pull_request = PullRequestModel().create(
                 self.rhodecode_user.user_id, org_repo, org_ref, other_repo,
                 other_ref, revisions, reviewers, title, description
+            )
             Session().commit()
             h.flash(_('Successfully opened new pull request'),

rhodecode/public/css/style.css

➞

Show inline comments

@@ @@ -1420,25 +1420,26 @@ tbody .yui-dt-editable { cursor: pointer @@
 #content div.box div.form div.fields div.field div.input.summary-short {
     margin: 0 0 0 110px;
+}
 #content div.box div.form div.fields div.field div.file {
 	margin: 0 0 0 200px;
+}
 #content div.box-left div.form div.fields div.field div.input,#content div.box-right div.form div.fields div.field div.input
+	{
 	margin: 0 0 0 0px;
+}
 #content div.box div.form div.fields div.field div.input input {
 #content div.box div.form div.fields div.field div.input input,
 .reviewer_ac input {
 	background: #FFF;
 	border-top: 1px solid #b3b3b3;
 	border-left: 1px solid #b3b3b3;
 	border-right: 1px solid #eaeaea;
 	border-bottom: 1px solid #eaeaea;
 	color: #000;
 	font-size: 11px;
 	margin: 0;
 	padding: 7px 7px 6px;
+}
 #content div.box div.form div.fields div.field div.input input#clone_url,
@@ @@ -1540,30 +1541,39 @@ input.disabled { @@
 	width: auto;
 	border: none;
 	margin: 0;
 	padding: 0;
+}
 #content div.box div.form div.fields div.field div.textarea table td table td
+	{
 	font-size: 11px;
 	padding: 5px 5px 5px 0;
+}
 #content div.box div.form div.fields div.field input[type=text]:focus,#content div.box div.form div.fields div.field input[type=password]:focus,#content div.box div.form div.fields div.field input[type=file]:focus,#content div.box div.form div.fields div.field textarea:focus,#content div.box div.form div.fields div.field select:focus
 #content div.box div.form div.fields div.field input[type=text]:focus,
 #content div.box div.form div.fields div.field input[type=password]:focus,
 #content div.box div.form div.fields div.field input[type=file]:focus,
 #content div.box div.form div.fields div.field textarea:focus,
 #content div.box div.form div.fields div.field select:focus,
 .reviewer_ac input:focus
+	{
 	background: #f6f6f6;
 	border-color: #666;
+}
 .reviewer_ac {
 	padding:10px
+}
 div.form div.fields div.field div.button {
 	margin: 0;
 	padding: 0 0 0 8px;
+}
 #content div.box table.noborder {
 	border: 1px solid transparent;
+}
 #content div.box table {
 	width: 100%;
 	border-collapse: separate;
 	margin: 0;
@@ @@ -3774,24 +3784,29 @@ div#legend_container table td,div#legend @@
+}
 .group_members_wrap{
+}
 .group_members .group_member{
 	height: 30px;
 	padding:0px 0px 0px 10px;
+}
 .reviewers_member{
     height: 15px;
     padding:0px 0px 0px 10px;
+}
 .emails_wrap{
 	padding: 0px 20px;
+}
 .emails_wrap .email_entry{
     height: 30px;
     padding:0px 0px 0px 10px;
+}
 .emails_wrap .email_entry .email{
 	float: left
+}
 .emails_wrap .email_entry .email_action{

rhodecode/public/js/rhodecode.js

➞

Show inline comments

@@ @@ -54,24 +54,36 @@ String.prototype.lstrip = function(char) @@
 	if(char === undefined){
 	    char = '\\s';
+	}
 	return this.replace(new RegExp('^'+char+'+'),'');
+}
 String.prototype.rstrip = function(char) {
 	if(char === undefined){
 	    char = '\\s';
+	}
 	return this.replace(new RegExp(''+char+'+$'),'');
+}
 if(!Array.prototype.indexOf) {
     Array.prototype.indexOf = function(needle) {
         for(var i = 0; i < this.length; i++) {
             if(this[i] === needle) {
                 return i;
+            }
+        }
         return -1;
     };
+}
 /**
  * SmartColorGenerator
+ *
  *usage::
  *	var CG = new ColorGenerator();
  *  var col = CG.getColor(key); //returns array of RGB
  *  'rgb({0})'.format(col.join(',')
+ *
  * @returns {ColorGenerator}
  */
 var ColorGenerator = function(){
 	this.GOLDEN_RATIO = 0.618033988749895;
@@ @@ -1195,49 +1207,211 @@ var MentionsAutoComplete = function (div @@
 		chunks.push(org.substr(0,at_pos))// prefix chunk
 		chunks.push(msg2)                // search chunk
 		chunks.push(org.substr(max_pos)) // postfix chunk
 		// clean up msg2 for filtering and regex match
 		var msg2 = msg2.lstrip(' ').lstrip('\n');
 		if(re.test(msg2)){
 			var unam = re.exec(msg2)[1];
 			return [unam, chunks];
+		}
 		return [null, null];
     };
     };
 	ownerAC.textboxKeyUpEvent.subscribe(function(type, args){
 		var ac_obj = args[0];
 		var currentMessage = args[1];
 		var currentCaretPosition = args[0]._elTextbox.selectionStart;
 		var unam = ownerAC.get_mention(currentMessage, currentCaretPosition);
 		var curr_search = null;
 		if(unam[0]){
 			curr_search = unam[0];
+		}
 		ownerAC.dataSource.chunks = unam[1];
 		ownerAC.dataSource.mentionQuery = curr_search;
 	})
     return {
         ownerDS: ownerDS,
         ownerAC: ownerAC,
     };
+}
 var PullRequestAutoComplete = function (divid, cont, users_list, groups_list) {
     var myUsers = users_list;
     var myGroups = groups_list;
     // Define a custom search function for the DataSource of users
     var matchUsers = function (sQuery) {
             // Case insensitive matching
             var query = sQuery.toLowerCase();
             var i = 0;
             var l = myUsers.length;
             var matches = [];
             // Match against each name of each contact
             for (; i < l; i++) {
                 contact = myUsers[i];
                 if (((contact.fname+"").toLowerCase().indexOf(query) > -1) ||
                    	 ((contact.lname+"").toLowerCase().indexOf(query) > -1) ||
                    	 ((contact.nname) && ((contact.nname).toLowerCase().indexOf(query) > -1))) {
                        matches[matches.length] = contact;
+                   }
+            }
             return matches;
         };
     // Define a custom search function for the DataSource of usersGroups
     var matchGroups = function (sQuery) {
             // Case insensitive matching
             var query = sQuery.toLowerCase();
             var i = 0;
             var l = myGroups.length;
             var matches = [];
             // Match against each name of each contact
             for (; i < l; i++) {
                 matched_group = myGroups[i];
                 if (matched_group.grname.toLowerCase().indexOf(query) > -1) {
                     matches[matches.length] = matched_group;
+                }
+            }
             return matches;
         };
     //match all
     var matchAll = function (sQuery) {
             u = matchUsers(sQuery);
             return u
         };
     // DataScheme for owner
     var ownerDS = new YAHOO.util.FunctionDataSource(matchUsers);
     ownerDS.responseSchema = {
         fields: ["id", "fname", "lname", "nname", "gravatar_lnk"]
     };
     // Instantiate AutoComplete for mentions
     var reviewerAC = new YAHOO.widget.AutoComplete(divid, cont, ownerDS);
     reviewerAC.useShadow = false;
     reviewerAC.resultTypeList = false;
     reviewerAC.suppressInputUpdate = true;
     reviewerAC.animVert = false;
     reviewerAC.animHoriz = false;
     reviewerAC.animSpeed = 0.1;
     // Helper highlight function for the formatter
     var highlightMatch = function (full, snippet, matchindex) {
             return full.substring(0, matchindex)
             + "<span class='match'>"
             + full.substr(matchindex, snippet.length)
             + "</span>" + full.substring(matchindex + snippet.length);
         };
     // Custom formatter to highlight the matching letters
     reviewerAC.formatResult = function (oResultData, sQuery, sResultMatch) {
 		    var org_sQuery = sQuery;
 		    if(this.dataSource.mentionQuery != null){
 		    	sQuery = this.dataSource.mentionQuery;
+		    }
             var query = sQuery.toLowerCase();
             var _gravatar = function(res, em, group){
             	if (group !== undefined){
             		em = '/images/icons/group.png'
+            	}
             	tmpl = '<div class="ac-container-wrap"><img class="perm-gravatar-ac" src="{0}"/>{1}</div>'
             	return tmpl.format(em,res)
+            }
             if (oResultData.nname != undefined) {
                 var fname = oResultData.fname || "";
                 var lname = oResultData.lname || "";
                 var nname = oResultData.nname;
                 // Guard against null value
                 var fnameMatchIndex = fname.toLowerCase().indexOf(query),
                     lnameMatchIndex = lname.toLowerCase().indexOf(query),
                     nnameMatchIndex = nname.toLowerCase().indexOf(query),
                     displayfname, displaylname, displaynname;
                 if (fnameMatchIndex > -1) {
                     displayfname = highlightMatch(fname, query, fnameMatchIndex);
                 } else {
                     displayfname = fname;
+                }
                 if (lnameMatchIndex > -1) {
                     displaylname = highlightMatch(lname, query, lnameMatchIndex);
                 } else {
                     displaylname = lname;
+                }
                 if (nnameMatchIndex > -1) {
                     displaynname = "(" + highlightMatch(nname, query, nnameMatchIndex) + ")";
                 } else {
                     displaynname = nname ? "(" + nname + ")" : "";
+                }
                 return _gravatar(displayfname + " " + displaylname + " " + displaynname, oResultData.gravatar_lnk);
             } else {
                 return '';
+            }
         };
     //members cache to catch duplicates
     reviewerAC.dataSource.cache = [];
     // hack into select event
     if(reviewerAC.itemSelectEvent){
     	reviewerAC.itemSelectEvent.subscribe(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
             var members  = YUD.get('review_members');
             //fill the autocomplete with value
             if (oData.nname != undefined) {
             	if (myAC.dataSource.cache.indexOf(oData.id) != -1){
             		return
+            	}
             	var tmpl = '<li>'+
 		                      '<div class="reviewers_member">'+
 		                        '<div class="gravatar"><img alt="gravatar" src="{0}"/> </div>'+
 		                        '<div style="float:left">{1}</div>'+
 		                        '<input type="hidden" value="{2}" name="review_members" />'+
 		                      '</div>'+
 		                   '</li>'
 		        var displayname = "{0} {1} ({2})".format(oData.fname,oData.lname,oData.nname);
             	var element = tmpl.format(oData.gravatar_lnk,displayname,oData.id);
             	members.innerHTML += element;
             	myAC.dataSource.cache.push(oData.id);
+            }
     	});
+    }
     return {
         ownerDS: ownerDS,
         reviewerAC: reviewerAC,
     };
+}
 /**
  * QUICK REPO MENU
  */
 var quick_repo_menu = function(){
     YUE.on(YUQ('.quick_repo_menu'),'mouseenter',function(e){
             var menu = e.currentTarget.firstElementChild.firstElementChild;
             if(YUD.hasClass(menu,'hidden')){
                 YUD.replaceClass(e.currentTarget,'hidden', 'active');
                 YUD.replaceClass(menu, 'hidden', 'active');
+            }
         })
     YUE.on(YUQ('.quick_repo_menu'),'mouseleave',function(e){

rhodecode/templates/pullrequests/pullrequest.html

➞

Show inline comments

@@ @@ -60,58 +60,46 @@ @@
             <div style="clear:both;padding-top: 10px"></div>
         </div>
        <div style="clear:both;padding-top: 10px"></div>
        ## overview pulled by ajax
        <div style="float:left" id="pull_request_overview"></div>
        <div style="float:left;clear:both;padding:10px 10px 10px 0px;display:none">
             <a id="pull_request_overview_url" href="#">${_('Detailed compare view')}</a>
        </div>
      </div>
     <div style="float:left; border-left:1px dashed #eee">
         <h4>${_('Pull request reviewers')}</h4>
         <div id="reviewers" style="padding:0px 0px 0px 15px">
         ##TODO: make this nicer :)
           <table class="table noborder">
                   <tr>
                       <td>
                           <div>
                               <div style="float:left">
                                   <div class="text" style="padding: 0px 0px 6px;">${_('Chosen reviewers')}</div>
                                   ${h.select('review_members',[x[0] for x in c.review_members],c.review_members,multiple=True,size=8,style="min-width:210px")}
                                  <div  id="remove_all_elements" style="cursor:pointer;text-align:center">
                                      ${_('Remove all elements')}
                                      <img alt="remove" style="vertical-align:text-bottom" src="${h.url('/images/icons/arrow_right.png')}"/>
                                  </div>
                               </div>
                               <div style="float:left;width:20px;padding-top:50px">
                                   <img alt="add" id="add_element"
                                       style="padding:2px;cursor:pointer"
                                       src="${h.url('/images/icons/arrow_left.png')}"/>
                                   <br />
                                   <img alt="remove" id="remove_element"
                                       style="padding:2px;cursor:pointer"
                                       src="${h.url('/images/icons/arrow_right.png')}"/>
                               </div>
                               <div style="float:left">
                                    <div class="text" style="padding: 0px 0px 6px;">${_('Available reviewers')}</div>
                                    ${h.select('available_members',[],c.available_members,multiple=True,size=8,style="min-width:210px")}
                                    <div id="add_all_elements" style="cursor:pointer;text-align:center">
                                          <img alt="add" style="vertical-align:text-bottom" src="${h.url('/images/icons/arrow_left.png')}"/>
                                           ${_('Add all elements')}
                                    </div>
                               </div>
                           </div>
                       </td>
                   </tr>
           </table>
           ## members goes here !
           <div class="group_members_wrap">
             <ul id="review_members" class="group_members">
             %for member in c.review_members:
                   <li>
                     <div class="reviewers_member">
                       <div class="gravatar"><img alt="gravatar" src="${h.gravatar_url(member.email,14)}"/> </div>
                       <div style="float:left">${member.full_name} (${_('owner')})</div>
                       <input type="hidden" value="${member.user_id}" name="review_members" />
                     </div>
                  </li>
             %endfor
             </ul>
           </div>
           <div class='ac'>
             <div class="reviewer_ac">
                ${h.text('user', class_='yui-ac-input')}
                <span class="help-block">${_('Add reviewer to this pull request.')}</span>
                <div id="reviewers_container"></div>
             </div>
           </div>
         </div>
     </div>
     <h3>${_('Create new pull request')}</h3>
     <div class="form">
         <!-- fields -->
         <div class="fields">
              <div class="field">
                 <div class="label">
                     <label for="pullrequest_title">${_('Title')}:</label>
@@ @@ -132,25 +120,28 @@ @@
             <div class="buttons">
                 ${h.submit('save',_('Send pull request'),class_="ui-btn large")}
                 ${h.reset('reset',_('Reset'),class_="ui-btn large")}
            </div>
         </div>
     </div>
     ${h.end_form()}
 </div>
 <script type="text/javascript">
   MultiSelectWidget('review_members','available_members','pull_request_form');
   var _USERS_AC_DATA = ${c.users_array|n};
   var _GROUPS_AC_DATA = ${c.users_groups_array|n};
   PullRequestAutoComplete('user', 'reviewers_container', _USERS_AC_DATA, _GROUPS_AC_DATA);
   var other_repos_info = ${c.other_repos_info|n};
   var loadPreview = function(){
 	  YUD.setStyle(YUD.get('pull_request_overview_url').parentElement,'display','none');
       var url = "${h.url('compare_url',
           repo_name='org_repo',
           org_ref_type='branch', org_ref='org_ref',
           other_ref_type='branch', other_ref='other_ref',
           repo='other_repo',
           as_form=True)}";
       var select_refs = YUQ('#pull_request_form select.refs')

0 comments (0 inline, 0 general)