To check out this repository please hg clone the following URL, or open the URL using EasyMercurial or your preferred Mercurial client.
root / plugins / redmine_tags / assets / javascripts / tags_input.js @ 1251:9523dff58d3d
History | View | Annotate | Download (3.48 KB)
| 1 |
/**
|
|---|---|
| 2 |
* This file is a part of redmine_tags
|
| 3 |
* redMine plugin, that adds tagging support.
|
| 4 |
*
|
| 5 |
* Copyright (c) 2010 Aleksey V Zapparov AKA ixti
|
| 6 |
*
|
| 7 |
* redmine_tags is free software: you can redistribute it and/or modify
|
| 8 |
* it under the terms of the GNU General Public License as published by
|
| 9 |
* the Free Software Foundation, either version 3 of the License, or
|
| 10 |
* (at your option) any later version.
|
| 11 |
*
|
| 12 |
* redmine_tags is distributed in the hope that it will be useful,
|
| 13 |
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
| 14 |
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
| 15 |
* GNU General Public License for more details.
|
| 16 |
*
|
| 17 |
* You should have received a copy of the GNU General Public License
|
| 18 |
* along with redmine_tags. If not, see <http://www.gnu.org/licenses/>.
|
| 19 |
*/
|
| 20 |
|
| 21 |
var Redmine = Redmine || {};
|
| 22 |
|
| 23 |
Redmine.TagsInput = Class.create({
|
| 24 |
initialize: function(element, update) { |
| 25 |
this.element = $(element); |
| 26 |
this.input = new Element('input', { 'type': 'text', 'autocomplete': 'off', 'size': 10 }); |
| 27 |
this.button = new Element('span', { 'class': 'tag-add icon icon-add' }); |
| 28 |
this.tags = new Hash(); |
| 29 |
|
| 30 |
this.update = update;
|
| 31 |
|
| 32 |
var uri_params = window.location.href.toQueryParams();
|
| 33 |
if (uri_params["project[tag_list]"] != undefined){ |
| 34 |
this.addTag(uri_params["project[tag_list]"].stripTags(), true); |
| 35 |
}; |
| 36 |
|
| 37 |
Event.observe(this.button, 'click', this.readTags.bind(this)); |
| 38 |
Event.observe(this.input, 'keypress', this.onKeyPress.bindAsEventListener(this)); |
| 39 |
|
| 40 |
this.element.insert({ 'after': this.input }); |
| 41 |
this.input.insert({ 'after': this.button }); |
| 42 |
this.addTagsList(this.element.value); |
| 43 |
}, |
| 44 |
|
| 45 |
readTags: function() { |
| 46 |
this.addTagsList(this.input.value); |
| 47 |
this.input.value = ''; |
| 48 |
if(this.update){ |
| 49 |
submitForm(); |
| 50 |
}; |
| 51 |
}, |
| 52 |
|
| 53 |
onKeyPress: function(event) { |
| 54 |
if (Event.KEY_RETURN == event.keyCode) {
|
| 55 |
this.readTags(event);
|
| 56 |
Event.stop(event); |
| 57 |
} |
| 58 |
}, |
| 59 |
|
| 60 |
addTag: function(tag, noSubmit) { |
| 61 |
if (tag.blank() || this.tags.get(tag)) return; |
| 62 |
|
| 63 |
if(noSubmit==undefined){noSubmit=false;} |
| 64 |
|
| 65 |
var button = new Element('span', { 'class': 'tag-delete icon icon-del' }); |
| 66 |
var label = new Element('span', { 'class': 'tag-label' }).insert(tag).insert(button); |
| 67 |
|
| 68 |
this.tags.set(tag, 1); |
| 69 |
this.element.value = this.getTagsList(); |
| 70 |
this.element.insert({ 'before': label }); |
| 71 |
|
| 72 |
if(noSubmit==false){ |
| 73 |
if(this.update){ |
| 74 |
submitForm(); |
| 75 |
}; |
| 76 |
}; |
| 77 |
|
| 78 |
Event.observe(button, 'click', function(){ |
| 79 |
this.tags.unset(tag);
|
| 80 |
this.element.value = this.getTagsList(); |
| 81 |
label.remove(); |
| 82 |
if(this.update){submitForm();}; |
| 83 |
}.bind(this));
|
| 84 |
}, |
| 85 |
|
| 86 |
addTagsList: function(tags_list) { |
| 87 |
var tags = tags_list.split(','); |
| 88 |
for (var i = 0; i < tags.length; i++) { |
| 89 |
this.addTag(tags[i].strip().stripTags().toLowerCase());
|
| 90 |
} |
| 91 |
}, |
| 92 |
|
| 93 |
getTagsList: function() { |
| 94 |
return this.tags.keys().join(','); |
| 95 |
}, |
| 96 |
|
| 97 |
autocomplete: function(container, url) { |
| 98 |
new Ajax.Autocompleter(this.input, container, url, { |
| 99 |
'minChars': 1, |
| 100 |
'frequency': 0.5, |
| 101 |
'paramName': 'q', |
| 102 |
'updateElement': function(el) { |
| 103 |
this.input.value = el.getAttribute('name'); |
| 104 |
this.readTags();
|
| 105 |
}.bind(this)
|
| 106 |
}); |
| 107 |
} |
| 108 |
}); |
| 109 |
|
| 110 |
|
| 111 |
function observeIssueTagsField(url) { |
| 112 |
new Redmine.TagsInput('issue_tag_list', false).autocomplete('issue_tag_candidates', url); |
| 113 |
} |
| 114 |
|
| 115 |
function observeProjectTagsField(url, update) { |
| 116 |
if(!update) {
|
| 117 |
var update = false; |
| 118 |
}; |
| 119 |
|
| 120 |
new Redmine.TagsInput('project_tag_list', update).autocomplete('project_tag_candidates', url); |
| 121 |
} |