Move JS from query form template into js/query-form.js

hinted-selects
Vitaliy Filippov 2014-06-16 17:04:58 +04:00
parent 3d9d70d18c
commit 8fba371d1a
4 changed files with 69 additions and 158 deletions

View File

@ -21,75 +21,6 @@
// Functions to update form select elements based on a
// collection of javascript arrays containing strings.
/**
* Reads the selected classifications and updates product, component,
* version and milestone lists accordingly.
*
* @param classfield Select element that contains classifications.
* @param product Select element that contains products.
* @param component Select element that contains components. Can be null if
* there is no such element to update.
* @param version Select element that contains versions. Can be null if
* there is no such element to update.
* @param milestone Select element that contains milestones. Can be null if
* there is no such element to update.
*
* @global prods Array of products indexed by classification name.
* @global first_load Boolean; true if this is the first time this page loads
* or false if not.
* @global last_sel Array that contains last list of products so we know what
* has changed, and optimize for additions.
*/
function selectClassification(classfield, product, component, version, milestone) {
// This is to avoid handling events that occur before the form
// itself is ready, which could happen in buggy browsers.
if (!classfield)
return;
// If this is the first load and nothing is selected, no need to
// merge and sort all lists; they are created sorted.
if ((first_load) && (classfield.selectedIndex == -1)) {
first_load = false;
return;
}
// Don't reset first_load as done in selectProduct. That's because we
// want selectProduct to handle the first_load attribute.
// Stores classifications that are selected.
var sel = Array();
// True if sel array has a full list or false if sel contains only
// new classifications that are to be merged to the current list.
var merging = false;
// If nothing selected, pick all.
var findall = classfield.selectedIndex == -1;
sel = get_selection(classfield, findall, false);
if (!findall) {
// Save sel for the next invocation of selectClassification().
var tmp = sel;
// This is an optimization: if we have just added classifications to an
// existing selection, no need to clear the form elements and add
// everything again; just merge the new ones with the existing
// options.
if ((last_sel.length > 0) && (last_sel.length < sel.length)) {
sel = fake_diff_array(sel, last_sel);
merging = true;
}
last_sel = tmp;
}
// Save original options selected.
var saved_prods = get_selection(product, false, true, null);
// Do the actual fill/update, reselect originally selected options.
updateSelect(prods, sel, product, merging, null);
restoreSelection(product, saved_prods);
selectProduct(product, component, version, milestone, null);
}
/**
* Reads the selected products and updates component, version and milestone
* lists accordingly.

66
js/query-form.js Normal file
View File

@ -0,0 +1,66 @@
// JS for the query form
// License: Dual-license GPL 3.0+ or MPL 1.1+
// Author(s): Vitaliy Filippov <vitalif@mail.ru>
// Requires global vars: queryform, allKeywords, checkwidths, userAutocomplete
addListener(window, 'load', function()
{
document.forms[queryform].content.focus();
new SimpleAutocomplete("keywords",
function(h) { keywordAutocomplete(h, allKeywords); },
{ emptyText: 'No keywords found', multipleDelimiter: "," }
);
if (document.getElementById('deadlinefrom'))
{
Calendar.set('deadlinefrom');
Calendar.set('deadlineto');
}
new SimpleAutocomplete("email1", userAutocomplete, { emptyText: 'No users found' });
new SimpleAutocomplete("email2", userAutocomplete, { emptyText: 'No users found' });
Calendar.set('chfieldfrom');
Calendar.set('chfieldto');
new SimpleAutocomplete("chfieldwho", userAutocomplete, { emptyText: 'No users found' });
var lim = 250;
function checkw(e)
{
var s = document.getElementById(e);
s.style.minWidth = '100%';
if (s && s.offsetWidth > lim)
{
s.style.width = lim+'px';
addListener(s, 'mouseover', function(e)
{
e = e || window.event;
var f = e.relatedTarget || e.fromElement;
if (f == s || f.parentNode == s || !s.style.width && s.offsetWidth <= lim)
return;
var c = s;
while (c && c.nodeName != 'TABLE')
c = c.parentNode;
// FIXME: Удалить вторую таблицу внутри каждой ячейки! Она там нах* не нужна!
c = c.parentNode;
while (c && c.nodeName != 'TABLE')
c = c.parentNode;
var w = (lim+c.parentNode.offsetWidth-c.offsetWidth);
if (w > lim+10)
{
s.style.width = '';
s.style.maxWidth = w + 'px';
}
});
addListener(s, 'mouseout', function(e) {
e = e || window.event;
var t = e.relatedTarget || e.toElement;
if (t == s || t.parentNode == s)
return;
s.style.width = lim+'px';
s.style.maxWidth = '';
});
}
}
for (var i in checkwidths)
{
checkw(checkwidths[i]);
}
});

View File

@ -25,58 +25,7 @@
<script type="text/javascript" src="js/query-visibility.js"></script>
<script type="text/javascript" src="js/field.js"></script>
<script type="text/javascript" src="fieldvaluecontrol.cgi?type=search&user=[% Bugzilla.user.id %]"></script>
<script type="text/javascript">
var first_load = true; [%# is this the first time we load the page? %]
var last_sel = new Array(); [%# caches last selection %]
var useclassification = [% Param('useclassification') ? 'true' : 'false' %];
addListener(window, 'load', function()
{
var lim = 250;
function checkw(e)
{
var s = document.getElementById(e);
s.style.minWidth = '100%';
if (s && s.offsetWidth > lim)
{
s.style.width = lim+'px';
addListener(s, 'mouseover', function(e)
{
e = e || window.event;
var f = e.relatedTarget || e.fromElement;
if (f == s || f.parentNode == s || !s.style.width && s.offsetWidth <= lim)
return;
var c = s;
while (c && c.nodeName != 'TABLE')
c = c.parentNode;
[%# FIXME: Удалить вторую таблицу внутри каждой ячейки! Она там нах* не нужна! %]
c = c.parentNode;
while (c && c.nodeName != 'TABLE')
c = c.parentNode;
var w = (lim+c.parentNode.offsetWidth-c.offsetWidth);
if (w > lim+10)
{
s.style.width = '';
s.style.maxWidth = w + 'px';
}
});
addListener(s, 'mouseout', function(e) {
e = e || window.event;
var t = e.relatedTarget || e.toElement;
if (t == s || t.parentNode == s)
return;
s.style.width = lim+'px';
s.style.maxWidth = '';
});
}
}
for (var i in checkwidths)
checkw(checkwidths[i]);
});
</script>
<script type="text/javascript" src="js/query-form.js"></script>
[% SET checkwidths = [] %]
@ -94,10 +43,6 @@ addListener(window, 'load', function()
<td>
<input name="content" size="40" id="content"
value="[% default.content.0 FILTER html %]">
<script type="text/javascript"> <!--
document.forms[queryform].content.focus();
// -->
</script>
</td>
</tr>
@ -109,10 +54,6 @@ addListener(window, 'load', function()
<td>
<input name="short_desc" id="short_desc" size="40"
value="[% default.short_desc.0 FILTER html %]">
<script type="text/javascript"> <!--
document.forms[queryform].short_desc.focus();
// -->
</script>
</td>
<td>
[% IF button_name %]
@ -274,16 +215,6 @@ addListener(window, 'load', function()
<td>
<input name="keywords" id="keywords" size="40"
value="[% default.keywords.0 FILTER html %]">
<script type="text/javascript">
addListener(window, 'load', function() {
var emptyOptions = [% keyword_list ? json(keyword_list) : "null" %];
new SimpleAutocomplete("keywords",
function(h) { keywordAutocomplete(h, emptyOptions); },
{ emptyText: 'No keywords found', multipleDelimiter: "," }
);
});
</script>
</td>
</tr>
[% END %]
@ -299,10 +230,6 @@ addListener(window, 'load', function()
value="[% default.deadlinefrom.0 FILTER html %]">
to <input name="deadlineto" id="deadlineto" size="10" maxlength="10"
value="[% default.deadlineto.0 FILTER html %]">
<script type="text/javascript">
Calendar.set('deadlinefrom');
Calendar.set('deadlineto');
</script>
</td>
<td>
<small>(YYYY-MM-DD or relative dates)</small>
@ -508,11 +435,6 @@ addListener(window, 'load', function()
</table>
</td>
<script language="JavaScript">
addListener(window, 'load', function() {
new SimpleAutocomplete("email[% n %]", userAutocomplete, { emptyText: 'No users found' });
});
</script>
[% END %]
</tr>
</table>
@ -566,10 +488,6 @@ addListener(window, 'load', function()
size="10" value="[% default.chfieldfrom.0 FILTER html %]" />
and <input name="chfieldto" id="chfieldto" size="10" value="[% default.chfieldto.0 FILTER html %]" />
<br />(YYYY-MM-DD or relative dates)
<script type="text/javascript">
Calendar.set('chfieldfrom');
Calendar.set('chfieldto');
</script>
</dd>
<dt><label for="chfieldwho">By user:</label></dt>
<dd><input name="chfieldwho" id="chfieldwho" size="20" value="[% default.chfieldwho.0 | html %]" /> (user login)</dd>
@ -581,11 +499,6 @@ addListener(window, 'load', function()
size="20" value="[% default.chfieldvalue.0 FILTER html %]">
</dd>
</dl>
<script language="JavaScript">
addListener(window, 'load', function() {
new SimpleAutocomplete("chfieldwho", userAutocomplete, { emptyText: 'No users found' });
});
</script>
</fieldset>
</td>
@ -615,4 +528,5 @@ addListener(window, 'load', function() {
<script type="text/javascript">
var checkwidths = [% json(checkwidths) %];
var allKeywords = [% keyword_list ? json(keyword_list) : "null" %];
</script>

View File

@ -35,7 +35,7 @@ var queryform = "queryform"
title = "Search for $terms.bugs"
onload = "enableHelp();"
javascript = js_data
javascript_urls = [ "js/productform.js", "js/help.js", "js/calendar.js" ]
javascript_urls = [ "js/help.js", "js/calendar.js" ]
style_urls = [ "skins/standard/help.css", "skins/standard/calendar.css" ]
doc_section = "query.html"
style = "dl.bug_changes dt {