view pylons_app/templates/admin/repos/repo_edit.html @ 298:15e96b5a2685

autocomplete for repository managment of users
author Marcin Kuzminski <marcin@python-works.com>
date Sat, 26 Jun 2010 18:42:13 +0200
parents 29370bb76fa6
children d303aacb3349
line wrap: on
line source

## -*- coding: utf-8 -*-
<%inherit file="/base/base.html"/>

<%def name="title()">
    ${_('Repositories administration')}
</%def>
<%def name="breadcrumbs()">
	${h.link_to(u'Admin',h.url('admin_home'))}
	 /  
	 ${_('Repos')}
</%def>
<%def name="page_nav()">
	${self.menu('admin')}
	${self.submenu('repos')}
</%def>
<%def name="main()">
	<div>
        <h2>${_('Repositories')} - ${_('edit')}</h2>
        ${h.form(url('repo', id=c.repo_info.repo_name),method='put')}
        <table>
        	<tr>
        		<td>${_('Name')}</td>
        		<td>${h.text('repo_name')}</td>
        		<td>${self.get_form_error('repo_name')}</td>
        	</tr>
        	<tr>
        		<td>${_('Description')}</td>
        		<td>${h.textarea('description',cols=23,rows=5)}</td>
        		<td>${self.get_form_error('description')}</td>
        	</tr>
        	<tr>
        		<td>${_('Private')}</td>
        		<td>${h.checkbox('private')}</td>
        		<td>${self.get_form_error('private')}</td>
        	</tr>
        	<tr>
        		<td>${_('Owner')}</td>
				<td class='ac'>
					<div id="perm_ac">
						${h.text('user',class_='yui-ac-input')}
						<div id="owner_container"></div>
					</div>
				</td>        		
        		<td>${self.get_form_error('user')}</td>
        	</tr>
        	<tr>
        		<td>${_('Permissions')}</td>
        		<td>
        			<table>
        				<tr>
        					<td>${_('none')}</td>
        					<td>${_('read')}</td>
        					<td>${_('write')}</td>
        					<td>${_('admin')}</td>
        					<td>${_('user')}</td>
        				</tr>
        				
        				%for r2p in c.repo_info.repo2perm:
	        				<tr>
	        					<td>${h.radio('perm_%s' % r2p.user.username,'repository.none')}</td>
	        					<td>${h.radio('perm_%s' % r2p.user.username,'repository.read')}</td>
	        					<td>${h.radio('perm_%s' % r2p.user.username,'repository.write')}</td>
	        					<td>${h.radio('perm_%s' % r2p.user.username,'repository.admin')}</td>
	        					<td>${r2p.user.username}</td>
	        				</tr>
						%endfor
						<%
							if not hasattr(c,'form_errors'):
								d = 'display:none;'
							else:
								d=''
						%>

        				<tr id="add_perm_input" style="${d}">
        					<td>${h.radio('perm_new_user','repository.none')}</td>
        					<td>${h.radio('perm_new_user','repository.read')}</td>
        					<td>${h.radio('perm_new_user','repository.write')}</td>
        					<td>${h.radio('perm_new_user','repository.admin')}</td>
        					<td class='ac'>
        						<div id="perm_ac">
        							${h.text('perm_new_user_name',class_='yui-ac-input')}
									<div id="perm_container"></div>
        						</div>
        					</td>
        					<td>${self.get_form_error('perm_new_user_name')}</td>     					
        				</tr>
        				<tr>
        					<td colspan="4">
        						<span id="add_perm" class="add_icon" style="cursor: pointer;">
        						${_('Add another user')}
        						</span>
        					</td>
        				</tr>
        			</table>
        		</td>
        		
        	</tr>
        	<tr>
        		<td></td>
        		<td>${h.submit('update','update')}</td>
        	</tr>
        	        	        	
        </table>
        ${h.end_form()}
        <script type="text/javascript">
        	YAHOO.util.Event.onDOMReady(function(){
				var D = YAHOO.util.Dom;
				YAHOO.util.Event.addListener('add_perm','click',function(){
					D.setStyle('add_perm_input','display','');
					D.setStyle('add_perm','opacity','0.6');
					D.setStyle('add_perm','cursor','default');
				});
            });
        </script>
		<script type="text/javascript">    
		YAHOO.example.FnMultipleFields = function(){
		    var myContacts = ${c.users_array|n}
		    
		    // Define a custom search function for the DataSource
		    var matchNames = function(sQuery) {
		        // Case insensitive matching
		        var query = sQuery.toLowerCase(),
		            contact,
		            i=0,
		            l=myContacts.length,
		            matches = [];
		        
		        // Match against each name of each contact
		        for(; i<l; i++) {
		            contact = myContacts[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;
		    };
		
		    // Use a FunctionDataSource
		    var oDS = new YAHOO.util.FunctionDataSource(matchNames);
		    oDS.responseSchema = {
		        fields: ["id", "fname", "lname", "nname"]
		    }
		
		    // Instantiate AutoComplete for perms
		    var oAC_perms = new YAHOO.widget.AutoComplete("perm_new_user_name", "perm_container", oDS);
		    oAC_perms.useShadow = false;
		    oAC_perms.resultTypeList = false;
		    
		    // Instantiate AutoComplete for owner
		 	var oAC_owner = new YAHOO.widget.AutoComplete("user", "owner_container", oDS);
		 	oAC_owner.useShadow = false;
		 	oAC_owner.resultTypeList = false;
		    
		    
		    // Custom formatter to highlight the matching letters
		    var custom_formatter = function(oResultData, sQuery, sResultMatch) {
		        var query = sQuery.toLowerCase(),
		            fname = oResultData.fname,
		            lname = oResultData.lname,
		            nname = oResultData.nname || "", // Guard against null value
		            query = sQuery.toLowerCase(),
		            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 displayfname + " " + displaylname + " " + displaynname;
		        
		    };
		    oAC_perms.formatResult = custom_formatter; 
		    oAC_owner.formatResult = custom_formatter;
		    			    
		    // Helper 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);
		    };
		
		    var myHandler = 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;
		    };

		    oAC_perms.itemSelectEvent.subscribe(myHandler);
		    oAC_owner.itemSelectEvent.subscribe(myHandler);
		    
		    return {
		        oDS: oDS,
		        oAC_perms: oAC_perms,
		        oAC_owner: oAC_owner, 
		    };
		}();
		    
		</script>        
    </div>
</%def>