comparison 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
comparison
equal deleted inserted replaced
297:a074dec6ee40 298:15e96b5a2685
33 <td>${h.checkbox('private')}</td> 33 <td>${h.checkbox('private')}</td>
34 <td>${self.get_form_error('private')}</td> 34 <td>${self.get_form_error('private')}</td>
35 </tr> 35 </tr>
36 <tr> 36 <tr>
37 <td>${_('Owner')}</td> 37 <td>${_('Owner')}</td>
38 <td>${h.text('user')}</td> 38 <td class='ac'>
39 <div id="perm_ac">
40 ${h.text('user',class_='yui-ac-input')}
41 <div id="owner_container"></div>
42 </div>
43 </td>
39 <td>${self.get_form_error('user')}</td> 44 <td>${self.get_form_error('user')}</td>
40 </tr> 45 </tr>
41 <tr> 46 <tr>
42 <td>${_('Permissions')}</td> 47 <td>${_('Permissions')}</td>
43 <td> 48 <td>
57 <td>${h.radio('perm_%s' % r2p.user.username,'repository.write')}</td> 62 <td>${h.radio('perm_%s' % r2p.user.username,'repository.write')}</td>
58 <td>${h.radio('perm_%s' % r2p.user.username,'repository.admin')}</td> 63 <td>${h.radio('perm_%s' % r2p.user.username,'repository.admin')}</td>
59 <td>${r2p.user.username}</td> 64 <td>${r2p.user.username}</td>
60 </tr> 65 </tr>
61 %endfor 66 %endfor
62
63
64 <% 67 <%
65
66 if not hasattr(c,'form_errors'): 68 if not hasattr(c,'form_errors'):
67 d = 'display:none;' 69 d = 'display:none;'
68 else: 70 else:
69 d='' 71 d=''
70 %> 72 %>
72 <tr id="add_perm_input" style="${d}"> 74 <tr id="add_perm_input" style="${d}">
73 <td>${h.radio('perm_new_user','repository.none')}</td> 75 <td>${h.radio('perm_new_user','repository.none')}</td>
74 <td>${h.radio('perm_new_user','repository.read')}</td> 76 <td>${h.radio('perm_new_user','repository.read')}</td>
75 <td>${h.radio('perm_new_user','repository.write')}</td> 77 <td>${h.radio('perm_new_user','repository.write')}</td>
76 <td>${h.radio('perm_new_user','repository.admin')}</td> 78 <td>${h.radio('perm_new_user','repository.admin')}</td>
77 <td>${h.text('perm_new_user_name',size=10)}</td> 79 <td class='ac'>
80 <div id="perm_ac">
81 ${h.text('perm_new_user_name',class_='yui-ac-input')}
82 <div id="perm_container"></div>
83 </div>
84 </td>
78 <td>${self.get_form_error('perm_new_user_name')}</td> 85 <td>${self.get_form_error('perm_new_user_name')}</td>
79 </tr> 86 </tr>
80 <tr> 87 <tr>
81 <td colspan="4"> 88 <td colspan="4">
82 <span id="add_perm" class="add_icon" style="cursor: pointer;"> 89 <span id="add_perm" class="add_icon" style="cursor: pointer;">
103 D.setStyle('add_perm','opacity','0.6'); 110 D.setStyle('add_perm','opacity','0.6');
104 D.setStyle('add_perm','cursor','default'); 111 D.setStyle('add_perm','cursor','default');
105 }); 112 });
106 }); 113 });
107 </script> 114 </script>
115 <script type="text/javascript">
116 YAHOO.example.FnMultipleFields = function(){
117 var myContacts = ${c.users_array|n}
118
119 // Define a custom search function for the DataSource
120 var matchNames = function(sQuery) {
121 // Case insensitive matching
122 var query = sQuery.toLowerCase(),
123 contact,
124 i=0,
125 l=myContacts.length,
126 matches = [];
127
128 // Match against each name of each contact
129 for(; i<l; i++) {
130 contact = myContacts[i];
131 if((contact.fname.toLowerCase().indexOf(query) > -1) ||
132 (contact.lname.toLowerCase().indexOf(query) > -1) ||
133 (contact.nname && (contact.nname.toLowerCase().indexOf(query) > -1))) {
134 matches[matches.length] = contact;
135 }
136 }
137
138 return matches;
139 };
140
141 // Use a FunctionDataSource
142 var oDS = new YAHOO.util.FunctionDataSource(matchNames);
143 oDS.responseSchema = {
144 fields: ["id", "fname", "lname", "nname"]
145 }
146
147 // Instantiate AutoComplete for perms
148 var oAC_perms = new YAHOO.widget.AutoComplete("perm_new_user_name", "perm_container", oDS);
149 oAC_perms.useShadow = false;
150 oAC_perms.resultTypeList = false;
151
152 // Instantiate AutoComplete for owner
153 var oAC_owner = new YAHOO.widget.AutoComplete("user", "owner_container", oDS);
154 oAC_owner.useShadow = false;
155 oAC_owner.resultTypeList = false;
156
157
158 // Custom formatter to highlight the matching letters
159 var custom_formatter = function(oResultData, sQuery, sResultMatch) {
160 var query = sQuery.toLowerCase(),
161 fname = oResultData.fname,
162 lname = oResultData.lname,
163 nname = oResultData.nname || "", // Guard against null value
164 query = sQuery.toLowerCase(),
165 fnameMatchIndex = fname.toLowerCase().indexOf(query),
166 lnameMatchIndex = lname.toLowerCase().indexOf(query),
167 nnameMatchIndex = nname.toLowerCase().indexOf(query),
168 displayfname, displaylname, displaynname;
169
170 if(fnameMatchIndex > -1) {
171 displayfname = highlightMatch(fname, query, fnameMatchIndex);
172 }
173 else {
174 displayfname = fname;
175 }
176
177 if(lnameMatchIndex > -1) {
178 displaylname = highlightMatch(lname, query, lnameMatchIndex);
179 }
180 else {
181 displaylname = lname;
182 }
183
184 if(nnameMatchIndex > -1) {
185 displaynname = "(" + highlightMatch(nname, query, nnameMatchIndex) + ")";
186 }
187 else {
188 displaynname = nname ? "(" + nname + ")" : "";
189 }
190
191 return displayfname + " " + displaylname + " " + displaynname;
192
193 };
194 oAC_perms.formatResult = custom_formatter;
195 oAC_owner.formatResult = custom_formatter;
196
197 // Helper function for the formatter
198 var highlightMatch = function(full, snippet, matchindex) {
199 return full.substring(0, matchindex) +
200 "<span class='match'>" +
201 full.substr(matchindex, snippet.length) +
202 "</span>" +
203 full.substring(matchindex + snippet.length);
204 };
205
206 var myHandler = function(sType, aArgs) {
207 var myAC = aArgs[0]; // reference back to the AC instance
208 var elLI = aArgs[1]; // reference to the selected LI element
209 var oData = aArgs[2]; // object literal of selected item's result data
210 myAC.getInputEl().value = oData.nname;
211 };
212
213 oAC_perms.itemSelectEvent.subscribe(myHandler);
214 oAC_owner.itemSelectEvent.subscribe(myHandler);
215
216 return {
217 oDS: oDS,
218 oAC_perms: oAC_perms,
219 oAC_owner: oAC_owner,
220 };
221 }();
222
223 </script>
108 </div> 224 </div>
109 </%def> 225 </%def>