JQuery in, Prototype/Scriptaculous out (#11445).
git-svn-id: svn+ssh://rubyforge.org/var/svn/redmine/trunk@10068 e93f8b46-1217-0410-a6f0-8f06a7374b81
This commit is contained in:
Jean-Philippe Lang
+285
-327
@@ -1,70 +1,65 @@
|
||||
/* Redmine - project management software
|
||||
Copyright (C) 2006-2012 Jean-Philippe Lang */
|
||||
|
||||
function checkAll (id, checked) {
|
||||
var els = Element.descendants(id);
|
||||
for (var i = 0; i < els.length; i++) {
|
||||
if (els[i].disabled==false) {
|
||||
els[i].checked = checked;
|
||||
}
|
||||
function checkAll(id, checked) {
|
||||
if (checked) {
|
||||
$('#'+id).find('input[type=checkbox]').attr('checked', true);
|
||||
} else {
|
||||
$('#'+id).find('input[type=checkbox]').removeAttr('checked');
|
||||
}
|
||||
}
|
||||
|
||||
function toggleCheckboxesBySelector(selector) {
|
||||
boxes = $$(selector);
|
||||
var all_checked = true;
|
||||
for (i = 0; i < boxes.length; i++) { if (boxes[i].checked == false) { all_checked = false; } }
|
||||
for (i = 0; i < boxes.length; i++) { boxes[i].checked = !all_checked; }
|
||||
}
|
||||
|
||||
function setCheckboxesBySelector(checked, selector) {
|
||||
var boxes = $$(selector);
|
||||
boxes.each(function(ele) {
|
||||
ele.checked = checked;
|
||||
$(selector).each(function(index) {
|
||||
if (!$(this).is(':checked')) { all_checked = false; }
|
||||
});
|
||||
$(selector).attr('checked', !all_checked)
|
||||
}
|
||||
|
||||
function showAndScrollTo(id, focus) {
|
||||
Element.show(id);
|
||||
if (focus!=null) { Form.Element.focus(focus); }
|
||||
Element.scrollTo(id);
|
||||
$('#'+id).show();
|
||||
if (focus!=null) {
|
||||
$('#'+focus).focus();
|
||||
}
|
||||
$('html, body').animate({scrollTop: $('#'+id).offset().top}, 100);
|
||||
}
|
||||
|
||||
function toggleRowGroup(el) {
|
||||
var tr = Element.up(el, 'tr');
|
||||
var n = Element.next(tr);
|
||||
tr.toggleClassName('open');
|
||||
while (n != undefined && !n.hasClassName('group')) {
|
||||
Element.toggle(n);
|
||||
n = Element.next(n);
|
||||
var tr = $(el).parents('tr').first();
|
||||
var n = tr.next();
|
||||
tr.toggleClass('open');
|
||||
while (n.length && !n.hasClass('group')) {
|
||||
n.toggle();
|
||||
n = n.next('tr');
|
||||
}
|
||||
}
|
||||
|
||||
function collapseAllRowGroups(el) {
|
||||
var tbody = Element.up(el, 'tbody');
|
||||
tbody.childElements('tr').each(function(tr) {
|
||||
if (tr.hasClassName('group')) {
|
||||
tr.removeClassName('open');
|
||||
var tbody = $(el).parents('tbody').first();
|
||||
tbody.children('tr').each(function(index) {
|
||||
if ($(this).hasClass('group')) {
|
||||
$(this).removeClass('open');
|
||||
} else {
|
||||
tr.hide();
|
||||
$(this).hide();
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
function expandAllRowGroups(el) {
|
||||
var tbody = Element.up(el, 'tbody');
|
||||
tbody.childElements('tr').each(function(tr) {
|
||||
if (tr.hasClassName('group')) {
|
||||
tr.addClassName('open');
|
||||
var tbody = $(el).parents('tbody').first();
|
||||
tbody.children('tr').each(function(index) {
|
||||
if ($(this).hasClass('group')) {
|
||||
$(this).addClass('open');
|
||||
} else {
|
||||
tr.show();
|
||||
$(this).show();
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
function toggleAllRowGroups(el) {
|
||||
var tr = Element.up(el, 'tr');
|
||||
if (tr.hasClassName('open')) {
|
||||
var tr = $(el).parents('tr').first();
|
||||
if (tr.hasClass('open')) {
|
||||
collapseAllRowGroups(el);
|
||||
} else {
|
||||
expandAllRowGroups(el);
|
||||
@@ -72,68 +67,72 @@ function toggleAllRowGroups(el) {
|
||||
}
|
||||
|
||||
function toggleFieldset(el) {
|
||||
var fieldset = Element.up(el, 'fieldset');
|
||||
fieldset.toggleClassName('collapsed');
|
||||
Effect.toggle(fieldset.down('div'), 'slide', {duration:0.2});
|
||||
var fieldset = $(el).parents('fieldset').first();
|
||||
fieldset.toggleClass('collapsed');
|
||||
fieldset.children('div').toggle();
|
||||
}
|
||||
|
||||
function hideFieldset(el) {
|
||||
var fieldset = Element.up(el, 'fieldset');
|
||||
fieldset.toggleClassName('collapsed');
|
||||
fieldset.down('div').hide();
|
||||
var fieldset = $(el).parents('fieldset').first();
|
||||
fieldset.toggleClass('collapsed');
|
||||
fieldset.children('div').hide();
|
||||
}
|
||||
|
||||
function add_filter() {
|
||||
select = $('add_filter_select');
|
||||
field = select.value
|
||||
Element.show('tr_' + field);
|
||||
check_box = $('cb_' + field);
|
||||
check_box.checked = true;
|
||||
var select = $('#add_filter_select');
|
||||
var field = select.val();
|
||||
$('#tr_'+field).show();
|
||||
var check_box = $('#cb_' + field);
|
||||
check_box.attr('checked', true);
|
||||
toggle_filter(field);
|
||||
select.selectedIndex = 0;
|
||||
select.val('');
|
||||
|
||||
for (i=0; i<select.options.length; i++) {
|
||||
if (select.options[i].value == field) {
|
||||
select.options[i].disabled = true;
|
||||
select.children('option').each(function(index) {
|
||||
if ($(this).attr('value') == field) {
|
||||
$(this).attr('disabled', true);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function toggle_filter(field) {
|
||||
check_box = $('cb_' + field);
|
||||
if (check_box.checked) {
|
||||
Element.show("operators_" + field);
|
||||
Form.Element.enable("operators_" + field);
|
||||
check_box = $('#cb_' + field);
|
||||
if (check_box.is(':checked')) {
|
||||
$("#operators_" + field).show().removeAttr('disabled');
|
||||
toggle_operator(field);
|
||||
} else {
|
||||
Element.hide("operators_" + field);
|
||||
Form.Element.disable("operators_" + field);
|
||||
$("#operators_" + field).hide().attr('disabled', true);
|
||||
enableValues(field, []);
|
||||
}
|
||||
}
|
||||
|
||||
function enableValues(field, indexes) {
|
||||
var f = $$(".values_" + field);
|
||||
for(var i=0;i<f.length;i++) {
|
||||
if (indexes.include(i)) {
|
||||
Form.Element.enable(f[i]);
|
||||
f[i].up('span').show();
|
||||
$(".values_" + field).each(function(index) {
|
||||
if (indexes.indexOf(index) >= 0) {
|
||||
$(this).removeAttr('disabled');
|
||||
$(this).parents('span').first().show();
|
||||
} else {
|
||||
f[i].value = '';
|
||||
Form.Element.disable(f[i]);
|
||||
f[i].up('span').hide();
|
||||
$(this).val('');
|
||||
$(this).attr('disabled', true);
|
||||
$(this).parents('span').first().hide();
|
||||
}
|
||||
}
|
||||
|
||||
if ($(this).hasClass('group')) {
|
||||
$(this).addClass('open');
|
||||
} else {
|
||||
$(this).show();
|
||||
}
|
||||
});
|
||||
|
||||
if (indexes.length > 0) {
|
||||
Element.show("div_values_" + field);
|
||||
$("#div_values_" + field).show();
|
||||
} else {
|
||||
Element.hide("div_values_" + field);
|
||||
$("#div_values_" + field).hide();
|
||||
}
|
||||
}
|
||||
|
||||
function toggle_operator(field) {
|
||||
operator = $("operators_" + field);
|
||||
switch (operator.value) {
|
||||
operator = $("#operators_" + field);
|
||||
switch (operator.val()) {
|
||||
case "!*":
|
||||
case "*":
|
||||
case "t":
|
||||
@@ -159,48 +158,45 @@ function toggle_operator(field) {
|
||||
}
|
||||
}
|
||||
|
||||
function toggle_multi_select(el) {
|
||||
var select = $(el);
|
||||
if (select.multiple == true) {
|
||||
select.multiple = false;
|
||||
function toggle_multi_select(id) {
|
||||
var select = $('#'+id);
|
||||
if (select.attr('multiple')) {
|
||||
select.removeAttr('multiple');
|
||||
} else {
|
||||
select.multiple = true;
|
||||
select.attr('multiple', true);
|
||||
}
|
||||
}
|
||||
|
||||
function submit_query_form(id) {
|
||||
selectAllOptions("selected_columns");
|
||||
$(id).submit();
|
||||
$('#'+id).submit();
|
||||
}
|
||||
|
||||
function apply_filters_observer() {
|
||||
$$("#query_form input[type=text]").invoke("observe", "keypress", function(e){
|
||||
if(e.keyCode == Event.KEY_RETURN) {
|
||||
submit_query_form("query_form");
|
||||
}
|
||||
function observeIssueFilters() {
|
||||
$('#query_form input[type=text]').keypress(function(e){
|
||||
if (e.keyCode == 13) submit_query_form("query_form");
|
||||
});
|
||||
}
|
||||
|
||||
var fileFieldCount = 1;
|
||||
|
||||
function addFileField() {
|
||||
var fields = $('attachments_fields');
|
||||
if (fields.childElements().length >= 10) return false;
|
||||
var fields = $('#attachments_fields');
|
||||
if (fields.children().length >= 10) return false;
|
||||
fileFieldCount++;
|
||||
var s = new Element('span');
|
||||
s.update(fields.down('span').innerHTML);
|
||||
s.down('input.file').name = "attachments[" + fileFieldCount + "][file]";
|
||||
s.down('input.description').name = "attachments[" + fileFieldCount + "][description]";
|
||||
fields.appendChild(s);
|
||||
var s = fields.children('span').first().clone();
|
||||
s.children('input.file').attr('name', "attachments[" + fileFieldCount + "][file]").val('');
|
||||
s.children('input.description').attr('name', "attachments[" + fileFieldCount + "][description]").val('');
|
||||
fields.append(s);
|
||||
}
|
||||
|
||||
function removeFileField(el) {
|
||||
var fields = $('attachments_fields');
|
||||
var s = Element.up(el, 'span');
|
||||
if (fields.childElements().length > 1) {
|
||||
var fields = $('#attachments_fields');
|
||||
var s = $(el).parents('span').first();
|
||||
if (fields.children().length > 1) {
|
||||
s.remove();
|
||||
} else {
|
||||
s.update(s.innerHTML);
|
||||
s.children('input.file').val('');
|
||||
s.children('input.description').val('');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -217,182 +213,152 @@ function checkFileSize(el, maxSize, message) {
|
||||
}
|
||||
|
||||
function showTab(name) {
|
||||
var f = $$('div#content .tab-content');
|
||||
for(var i=0; i<f.length; i++){
|
||||
Element.hide(f[i]);
|
||||
}
|
||||
var f = $$('div.tabs a');
|
||||
for(var i=0; i<f.length; i++){
|
||||
Element.removeClassName(f[i], "selected");
|
||||
}
|
||||
Element.show('tab-content-' + name);
|
||||
Element.addClassName('tab-' + name, "selected");
|
||||
$('div#content .tab-content').hide();
|
||||
$('div.tabs a').removeClass('selected');
|
||||
$('#tab-content-' + name).show();
|
||||
$('#tab-' + name).addClass('selected');
|
||||
return false;
|
||||
}
|
||||
|
||||
function moveTabRight(el) {
|
||||
var lis = Element.up(el, 'div.tabs').down('ul').childElements();
|
||||
var lis = $(el).parents('div.tabs').first().find('ul').children();
|
||||
var tabsWidth = 0;
|
||||
var i;
|
||||
for (i=0; i<lis.length; i++) {
|
||||
if (lis[i].visible()) {
|
||||
tabsWidth += lis[i].getWidth() + 6;
|
||||
var i = 0;
|
||||
lis.each(function(){
|
||||
if ($(this).is(':visible')) {
|
||||
tabsWidth += $(this).width() + 6;
|
||||
}
|
||||
}
|
||||
if (tabsWidth < Element.up(el, 'div.tabs').getWidth() - 60) {
|
||||
return;
|
||||
}
|
||||
i=0;
|
||||
while (i<lis.length && !lis[i].visible()) {
|
||||
i++;
|
||||
}
|
||||
lis[i].hide();
|
||||
});
|
||||
if (tabsWidth < $(el).parents('div.tabs').first().width() - 60) { return; }
|
||||
while (i<lis.length && !lis.eq(i).is(':visible')) { i++; }
|
||||
lis.eq(i).hide();
|
||||
}
|
||||
|
||||
function moveTabLeft(el) {
|
||||
var lis = Element.up(el, 'div.tabs').down('ul').childElements();
|
||||
var lis = $(el).parents('div.tabs').first().find('ul').children();
|
||||
var i = 0;
|
||||
while (i<lis.length && !lis[i].visible()) {
|
||||
i++;
|
||||
}
|
||||
while (i<lis.length && !lis.eq(i).is(':visible')) { i++; }
|
||||
if (i>0) {
|
||||
lis[i-1].show();
|
||||
lis.eq(i-1).show();
|
||||
}
|
||||
}
|
||||
|
||||
function displayTabsButtons() {
|
||||
var lis;
|
||||
var tabsWidth = 0;
|
||||
var i;
|
||||
$$('div.tabs').each(function(el) {
|
||||
lis = el.down('ul').childElements();
|
||||
for (i=0; i<lis.length; i++) {
|
||||
if (lis[i].visible()) {
|
||||
tabsWidth += lis[i].getWidth() + 6;
|
||||
var el;
|
||||
$('div.tabs').each(function() {
|
||||
el = $(this);
|
||||
lis = el.find('ul').children();
|
||||
lis.each(function(){
|
||||
if ($(this).is(':visible')) {
|
||||
tabsWidth += $(this).width() + 6;
|
||||
}
|
||||
}
|
||||
if ((tabsWidth < el.getWidth() - 60) && (lis[0].visible())) {
|
||||
el.down('div.tabs-buttons').hide();
|
||||
});
|
||||
if ((tabsWidth < el.width() - 60) && (lis.first().is(':visible'))) {
|
||||
el.find('div.tabs-buttons').hide();
|
||||
} else {
|
||||
el.down('div.tabs-buttons').show();
|
||||
el.find('div.tabs-buttons').show();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function setPredecessorFieldsVisibility() {
|
||||
relationType = $('relation_relation_type');
|
||||
if (relationType && (relationType.value == "precedes" || relationType.value == "follows")) {
|
||||
Element.show('predecessor_fields');
|
||||
} else {
|
||||
Element.hide('predecessor_fields');
|
||||
}
|
||||
}
|
||||
|
||||
function promptToRemote(text, param, url) {
|
||||
value = prompt(text + ':');
|
||||
if (value) {
|
||||
new Ajax.Request(url + '?' + param + '=' + encodeURIComponent(value), {asynchronous:true, evalScripts:true});
|
||||
return false;
|
||||
}
|
||||
var relationType = $('#relation_relation_type');
|
||||
if (relationType.val() == "precedes" || relationType.val() == "follows") {
|
||||
$('#predecessor_fields').show();
|
||||
} else {
|
||||
$('#predecessor_fields').hide();
|
||||
}
|
||||
}
|
||||
|
||||
function showModal(id, width) {
|
||||
el = $(id);
|
||||
if (el == undefined || el.visible()) {return;}
|
||||
var h = $$('body')[0].getHeight();
|
||||
el = $('#'+id).first();
|
||||
if (el.length == 0 || el.is(':visible')) {return;}
|
||||
var h = $('body').height();
|
||||
var d = document.createElement("div");
|
||||
d.id = 'modalbg';
|
||||
$('main').appendChild(d);
|
||||
$('modalbg').setStyle({ width: '100%', height: h + 'px' });
|
||||
$('modalbg').show();
|
||||
$(d).appendTo('#main').css('width', '100%').css('height', h + 'px').show();
|
||||
|
||||
var pageWidth = document.viewport.getWidth();
|
||||
var pageWidth = $(window).width();
|
||||
if (width) {
|
||||
el.setStyle({'width': width});
|
||||
el.css('width', width);
|
||||
}
|
||||
el.setStyle({'left': (((pageWidth - el.getWidth())/2 *100) / pageWidth) + '%'});
|
||||
el.addClassName('modal');
|
||||
el.css('left', (((pageWidth - el.width())/2 *100) / pageWidth) + '%');
|
||||
el.addClass('modal');
|
||||
el.show();
|
||||
|
||||
if (el.down("input[type=text]")) {
|
||||
el.down("input[type=text]").focus();
|
||||
} else if (el.down("input[type=submit]")) {
|
||||
el.down("input[type=submit]").focus();
|
||||
}
|
||||
el.find("input[type=text], input[type=submit]").first().focus();
|
||||
}
|
||||
|
||||
function hideModal(el) {
|
||||
var modal;
|
||||
if (el) {
|
||||
modal = Element.up(el, 'div.modal');
|
||||
} else {
|
||||
modal = $('ajax-modal');
|
||||
}
|
||||
if (modal) {
|
||||
modal.hide();
|
||||
}
|
||||
var bg = $('modalbg');
|
||||
if (bg) {
|
||||
bg.remove();
|
||||
if (el) {
|
||||
modal = $(el).parents('div.modal').first();
|
||||
} else {
|
||||
modal = $('#ajax-modal');
|
||||
}
|
||||
modal.hide();
|
||||
$('#modalbg').remove();
|
||||
}
|
||||
|
||||
function submitPreview(url, form, target) {
|
||||
new Ajax.Updater(target, url, {
|
||||
asynchronous:true,
|
||||
evalScripts:true,
|
||||
method:'post',
|
||||
onComplete:function(request){Element.scrollTo(target)},
|
||||
parameters:Form.serialize(form)
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'post',
|
||||
data: $('#'+form).serialize(),
|
||||
success: function(data){
|
||||
$('#'+target).html(data);
|
||||
$('html, body').animate({scrollTop: $('#'+target).offset().top}, 100);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function collapseScmEntry(id) {
|
||||
var els = document.getElementsByClassName(id, 'browser');
|
||||
for (var i = 0; i < els.length; i++) {
|
||||
if (els[i].hasClassName('open')) {
|
||||
collapseScmEntry(els[i].id);
|
||||
}
|
||||
Element.hide(els[i]);
|
||||
}
|
||||
$(id).removeClassName('open');
|
||||
$('.'+id).each(function() {
|
||||
if ($(this).hasClass('open')) {
|
||||
collapseScmEntry($(this).attr('id'));
|
||||
}
|
||||
$(this).hide();
|
||||
});
|
||||
$('#'+id).removeClass('open');
|
||||
}
|
||||
|
||||
function expandScmEntry(id) {
|
||||
var els = document.getElementsByClassName(id, 'browser');
|
||||
for (var i = 0; i < els.length; i++) {
|
||||
Element.show(els[i]);
|
||||
if (els[i].hasClassName('loaded') && !els[i].hasClassName('collapsed')) {
|
||||
expandScmEntry(els[i].id);
|
||||
}
|
||||
$('.'+id).each(function() {
|
||||
$(this).show();
|
||||
if ($(this).hasClass('loaded') && !$(this).hasClass('collapsed')) {
|
||||
expandScmEntry($(this).attr('id'));
|
||||
}
|
||||
$(id).addClassName('open');
|
||||
});
|
||||
$('#'+id).addClass('open');
|
||||
}
|
||||
|
||||
function scmEntryClick(id) {
|
||||
el = $(id);
|
||||
if (el.hasClassName('open')) {
|
||||
function scmEntryClick(id, url) {
|
||||
el = $('#'+id);
|
||||
if (el.hasClass('open')) {
|
||||
collapseScmEntry(id);
|
||||
el.addClassName('collapsed');
|
||||
el.addClass('collapsed');
|
||||
return false;
|
||||
} else if (el.hasClassName('loaded')) {
|
||||
} else if (el.hasClass('loaded')) {
|
||||
expandScmEntry(id);
|
||||
el.removeClassName('collapsed');
|
||||
el.removeClass('collapsed');
|
||||
return false;
|
||||
}
|
||||
if (el.hasClassName('loading')) {
|
||||
if (el.hasClass('loading')) {
|
||||
return false;
|
||||
}
|
||||
el.addClassName('loading');
|
||||
el.addClass('loading');
|
||||
$.ajax({
|
||||
url: url,
|
||||
success: function(data){
|
||||
el.after(data);
|
||||
el.addClass('open').addClass('loaded').removeClass('loading');
|
||||
}
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
function scmEntryLoaded(id) {
|
||||
Element.addClassName(id, 'open');
|
||||
Element.addClassName(id, 'loaded');
|
||||
Element.removeClassName(id, 'loading');
|
||||
}
|
||||
|
||||
function randomKey(size) {
|
||||
var chars = new Array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z');
|
||||
var key = '';
|
||||
@@ -402,147 +368,139 @@ function randomKey(size) {
|
||||
return key;
|
||||
}
|
||||
|
||||
function observeParentIssueField(url) {
|
||||
new Ajax.Autocompleter('issue_parent_issue_id',
|
||||
'parent_issue_candidates',
|
||||
url,
|
||||
{ minChars: 3,
|
||||
frequency: 0.5,
|
||||
paramName: 'q',
|
||||
method: 'get',
|
||||
updateElement: function(value) {
|
||||
document.getElementById('issue_parent_issue_id').value = value.id;
|
||||
}});
|
||||
// Can't use Rails' remote select because we need the form data
|
||||
function updateIssueFrom(url) {
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'post',
|
||||
data: $('#issue-form').serialize()
|
||||
});
|
||||
}
|
||||
|
||||
function observeRelatedIssueField(url) {
|
||||
new Ajax.Autocompleter('relation_issue_to_id',
|
||||
'related_issue_candidates',
|
||||
url,
|
||||
{ minChars: 3,
|
||||
frequency: 0.5,
|
||||
paramName: 'q',
|
||||
method: 'get',
|
||||
updateElement: function(value) {
|
||||
document.getElementById('relation_issue_to_id').value = value.id;
|
||||
},
|
||||
parameters: 'scope=all'
|
||||
});
|
||||
function updateBulkEditFrom(url) {
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'post',
|
||||
data: $('#bulk_edit_form').serialize()
|
||||
});
|
||||
}
|
||||
|
||||
function setVisible(id, visible) {
|
||||
var el = $(id);
|
||||
if (el) {if (visible) {el.show();} else {el.hide();}}
|
||||
function observeAutocompleteField(fieldId, url) {
|
||||
$('#'+fieldId).autocomplete({
|
||||
source: url,
|
||||
minLength: 2,
|
||||
});
|
||||
}
|
||||
|
||||
function observeSearchfield(fieldId, targetId, url) {
|
||||
$('#'+fieldId).each(function() {
|
||||
var $this = $(this);
|
||||
$this.attr('data-value-was', $this.val());
|
||||
var check = function() {
|
||||
var val = $this.val();
|
||||
if ($this.attr('data-value-was') != val){
|
||||
$this.attr('data-value-was', val);
|
||||
if (val != '') {
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'get',
|
||||
data: {q: $this.val()},
|
||||
success: function(data){ $('#'+targetId).html(data); },
|
||||
beforeSend: function(){ $this.addClass('ajax-loading'); },
|
||||
complete: function(){ $this.removeClass('ajax-loading'); }
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
var reset = function() {
|
||||
if (timer) {
|
||||
clearInterval(timer);
|
||||
timer = setInterval(check, 300);
|
||||
}
|
||||
};
|
||||
var timer = setInterval(check, 300);
|
||||
$this.bind('keyup click mousemove', reset);
|
||||
});
|
||||
}
|
||||
|
||||
function observeProjectModules() {
|
||||
var f = function() {
|
||||
/* Hides trackers and issues custom fields on the new project form when issue_tracking module is disabled */
|
||||
var c = ($('project_enabled_module_names_issue_tracking').checked == true);
|
||||
setVisible('project_trackers', c);
|
||||
setVisible('project_issue_custom_fields', c);
|
||||
if ($('#project_enabled_module_names_issue_tracking').attr('checked')) {
|
||||
$('#project_trackers').show();
|
||||
}else{
|
||||
$('#project_trackers').hide();
|
||||
}
|
||||
};
|
||||
|
||||
Event.observe(window, 'load', f);
|
||||
Event.observe('project_enabled_module_names_issue_tracking', 'change', f);
|
||||
$(window).load(f);
|
||||
$('#project_enabled_module_names_issue_tracking').change(f);
|
||||
}
|
||||
|
||||
/*
|
||||
* Class used to warn user when leaving a page with unsaved textarea
|
||||
* Author: mathias.fischer@berlinonline.de
|
||||
*/
|
||||
|
||||
var WarnLeavingUnsaved = Class.create({
|
||||
observedForms: false,
|
||||
observedElements: false,
|
||||
changedForms: false,
|
||||
message: null,
|
||||
|
||||
initialize: function(message){
|
||||
this.observedForms = $$('form');
|
||||
this.observedElements = $$('textarea');
|
||||
this.message = message;
|
||||
|
||||
this.observedElements.each(this.observeChange.bind(this));
|
||||
this.observedForms.each(this.submitAction.bind(this));
|
||||
|
||||
window.onbeforeunload = this.unload.bind(this);
|
||||
},
|
||||
|
||||
unload: function(){
|
||||
this.observedElements.each(function(el) {el.blur();})
|
||||
if(this.changedForms)
|
||||
return this.message;
|
||||
},
|
||||
|
||||
setChanged: function(){
|
||||
this.changedForms = true;
|
||||
},
|
||||
|
||||
setUnchanged: function(){
|
||||
this.changedForms = false;
|
||||
},
|
||||
|
||||
observeChange: function(element){
|
||||
element.observe('change',this.setChanged.bindAsEventListener(this));
|
||||
},
|
||||
|
||||
submitAction: function(element){
|
||||
element.observe('submit',this.setUnchanged.bindAsEventListener(this));
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
* 1 - registers a callback which copies the csrf token into the
|
||||
* X-CSRF-Token header with each ajax request. Necessary to
|
||||
* work with rails applications which have fixed
|
||||
* CVE-2011-0447
|
||||
* 2 - shows and hides ajax indicator
|
||||
*/
|
||||
Ajax.Responders.register({
|
||||
onCreate: function(request){
|
||||
var csrf_meta_tag = $$('meta[name=csrf-token]')[0];
|
||||
|
||||
if (csrf_meta_tag) {
|
||||
var header = 'X-CSRF-Token',
|
||||
token = csrf_meta_tag.readAttribute('content');
|
||||
|
||||
if (!request.options.requestHeaders) {
|
||||
request.options.requestHeaders = {};
|
||||
}
|
||||
request.options.requestHeaders[header] = token;
|
||||
}
|
||||
|
||||
if ($('ajax-indicator') && Ajax.activeRequestCount > 0 && $$('input.ajax-loading').size() == 0) {
|
||||
Element.show('ajax-indicator');
|
||||
}
|
||||
},
|
||||
onComplete: function(){
|
||||
if ($('ajax-indicator') && Ajax.activeRequestCount == 0) {
|
||||
Element.hide('ajax-indicator');
|
||||
}
|
||||
function initMyPageSortable(list, url) {
|
||||
$('#list-'+list).sortable({
|
||||
connectWith: '.block-receiver',
|
||||
tolerance: 'pointer',
|
||||
update: function(){
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'post',
|
||||
data: {'blocks': $.map($('#list-'+list).children(), function(el){return $(el).attr('id');})}
|
||||
});
|
||||
}
|
||||
});
|
||||
$("#list-top, #list-left, #list-right").disableSelection();
|
||||
}
|
||||
|
||||
var warnLeavingUnsavedMessage;
|
||||
function warnLeavingUnsaved(message) {
|
||||
warnLeavingUnsavedMessage = message;
|
||||
|
||||
$('form').submit(function(){
|
||||
$('textarea').removeData('changed');
|
||||
});
|
||||
$('textarea').change(function(){
|
||||
$(this).data('changed', 'changed');
|
||||
});
|
||||
window.onbeforeunload = function(){
|
||||
var warn = false;
|
||||
$('textarea').blur().each(function(){
|
||||
if ($(this).data('changed')) {
|
||||
warn = true;
|
||||
}
|
||||
});
|
||||
if (warn) {return warnLeavingUnsavedMessage;}
|
||||
};
|
||||
};
|
||||
|
||||
$(document).ready(function(){
|
||||
$('#ajax-indicator').bind('ajaxSend', function(){
|
||||
if ($('.ajax-loading').length == 0) {
|
||||
$('#ajax-indicator').show();
|
||||
}
|
||||
});
|
||||
$('#ajax-indicator').bind('ajaxStop', function(){
|
||||
$('#ajax-indicator').hide();
|
||||
});
|
||||
});
|
||||
|
||||
function hideOnLoad() {
|
||||
$$('.hol').each(function(el) {
|
||||
el.hide();
|
||||
});
|
||||
$('.hol').hide();
|
||||
}
|
||||
|
||||
function addFormObserversForDoubleSubmit() {
|
||||
$$('form[method=post]').each(function(form) {
|
||||
if (!form.hasClassName('multiple-submit')) {
|
||||
form.on('submit', function(form_submission) {
|
||||
if (form.getStorage().get('submitted')) {
|
||||
form_submission.stop();
|
||||
$('form[method=post]').each(function() {
|
||||
if (!$(this).hasClass('multiple-submit')) {
|
||||
$(this).submit(function(form_submission) {
|
||||
if ($(form_submission.target).attr('data-submitted')) {
|
||||
form_submission.preventDefault();
|
||||
} else {
|
||||
form.getStorage().set('submitted', true);
|
||||
$(form_submission.target).attr('data-submitted', true);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
Event.observe(window, 'load', hideOnLoad);
|
||||
Event.observe(window, 'load', addFormObserversForDoubleSubmit);
|
||||
$(document).ready(hideOnLoad);
|
||||
$(document).ready(addFormObserversForDoubleSubmit);
|
||||
|
||||
+203
-203
@@ -1,224 +1,224 @@
|
||||
/* Redmine - project management software
|
||||
Copyright (C) 2006-2012 Jean-Philippe Lang */
|
||||
var contextMenuObserving;
|
||||
var contextMenuUrl;
|
||||
|
||||
var observingContextMenuClick;
|
||||
|
||||
ContextMenu = Class.create();
|
||||
ContextMenu.prototype = {
|
||||
initialize: function (url) {
|
||||
this.url = url;
|
||||
this.createMenu();
|
||||
|
||||
if (!observingContextMenuClick) {
|
||||
Event.observe(document, 'click', this.Click.bindAsEventListener(this));
|
||||
Event.observe(document, 'contextmenu', this.RightClick.bindAsEventListener(this));
|
||||
observingContextMenuClick = true;
|
||||
function contextMenuRightClick(event) {
|
||||
var target = $(event.target);
|
||||
if (target.is('a')) {return;}
|
||||
var tr = target.parents('tr').first();
|
||||
if (!tr.hasClass('hascontextmenu')) {return;}
|
||||
event.preventDefault();
|
||||
if (!contextMenuIsSelected(tr)) {
|
||||
contextMenuUnselectAll();
|
||||
contextMenuAddSelection(tr);
|
||||
contextMenuSetLastSelected(tr);
|
||||
}
|
||||
contextMenuShow(event);
|
||||
}
|
||||
|
||||
this.unselectAll();
|
||||
this.lastSelected = null;
|
||||
},
|
||||
function contextMenuClick(event) {
|
||||
var target = $(event.target);
|
||||
var lastSelected;
|
||||
|
||||
RightClick: function(e) {
|
||||
this.hideMenu();
|
||||
// do not show the context menu on links
|
||||
if (Event.element(e).tagName == 'A') { return; }
|
||||
var tr = Event.findElement(e, 'tr');
|
||||
if (tr == document || tr == undefined || !tr.hasClassName('hascontextmenu')) { return; }
|
||||
Event.stop(e);
|
||||
if (!this.isSelected(tr)) {
|
||||
this.unselectAll();
|
||||
this.addSelection(tr);
|
||||
this.lastSelected = tr;
|
||||
}
|
||||
this.showMenu(e);
|
||||
},
|
||||
|
||||
Click: function(e) {
|
||||
if (Event.element(e).tagName == 'A' && Event.element(e).hasClassName('submenu')) {
|
||||
Event.stop(e)
|
||||
return;
|
||||
}
|
||||
this.hideMenu();
|
||||
if (Event.element(e).tagName == 'A' || Event.element(e).tagName == 'IMG') { return; }
|
||||
if (Event.isLeftClick(e) || (navigator.appVersion.match(/\bMSIE\b/))) {
|
||||
var tr = Event.findElement(e, 'tr');
|
||||
if (tr!=null && tr!=document && tr.hasClassName('hascontextmenu')) {
|
||||
// a row was clicked, check if the click was on checkbox
|
||||
var box = Event.findElement(e, 'input');
|
||||
if (box!=document && box!=undefined) {
|
||||
// a checkbox may be clicked
|
||||
if (box.checked) {
|
||||
tr.addClassName('context-menu-selection');
|
||||
} else {
|
||||
tr.removeClassName('context-menu-selection');
|
||||
}
|
||||
if (target.is('a') && target.hasClass('submenu')) {
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
contextMenuHide();
|
||||
if (target.is('a') || target.is('img')) { return; }
|
||||
if (event.which == 1 /*TODO || (navigator.appVersion.match(/\bMSIE\b/))*/) {
|
||||
var tr = target.parents('tr').first();
|
||||
if (tr.length && tr.hasClass('hascontextmenu')) {
|
||||
// a row was clicked, check if the click was on checkbox
|
||||
if (target.is('input')) {
|
||||
// a checkbox may be clicked
|
||||
if (target.attr('checked')) {
|
||||
tr.addClass('context-menu-selection');
|
||||
} else {
|
||||
if (e.ctrlKey || e.metaKey) {
|
||||
this.toggleSelection(tr);
|
||||
} else if (e.shiftKey) {
|
||||
if (this.lastSelected != null) {
|
||||
var toggling = false;
|
||||
var rows = $$('.hascontextmenu');
|
||||
for (i=0; i<rows.length; i++) {
|
||||
if (toggling || rows[i]==tr) {
|
||||
this.addSelection(rows[i]);
|
||||
}
|
||||
if (rows[i]==tr || rows[i]==this.lastSelected) {
|
||||
toggling = !toggling;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.addSelection(tr);
|
||||
}
|
||||
} else {
|
||||
this.unselectAll();
|
||||
this.addSelection(tr);
|
||||
}
|
||||
this.lastSelected = tr;
|
||||
tr.removeClass('context-menu-selection');
|
||||
}
|
||||
} else {
|
||||
// click is outside the rows
|
||||
var t = Event.findElement(e, 'a');
|
||||
if (t == document || t == undefined) {
|
||||
this.unselectAll();
|
||||
} else {
|
||||
if (Element.hasClassName(t, 'disabled') || Element.hasClassName(t, 'submenu')) {
|
||||
Event.stop(e);
|
||||
if (event.ctrlKey || event.metaKey) {
|
||||
contextMenuToggleSelection(tr);
|
||||
} else if (event.shiftKey) {
|
||||
lastSelected = contextMenuLastSelected();
|
||||
if (lastSelected.length) {
|
||||
var toggling = false;
|
||||
$('.hascontextmenu').each(function(){
|
||||
if (toggling || $(this).is(tr)) {
|
||||
contextMenuAddSelection($(this));
|
||||
}
|
||||
if ($(this).is(tr) || $(this).is(lastSelected)) {
|
||||
toggling = !toggling;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
contextMenuAddSelection(tr);
|
||||
}
|
||||
} else {
|
||||
contextMenuUnselectAll();
|
||||
contextMenuAddSelection(tr);
|
||||
}
|
||||
contextMenuSetLastSelected(tr);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
createMenu: function() {
|
||||
if (!$('context-menu')) {
|
||||
var menu = document.createElement("div");
|
||||
menu.setAttribute("id", "context-menu");
|
||||
menu.setAttribute("style", "display:none;");
|
||||
document.getElementById("content").appendChild(menu);
|
||||
}
|
||||
},
|
||||
|
||||
showMenu: function(e) {
|
||||
var mouse_x = Event.pointerX(e);
|
||||
var mouse_y = Event.pointerY(e);
|
||||
var render_x = mouse_x;
|
||||
var render_y = mouse_y;
|
||||
var dims;
|
||||
var menu_width;
|
||||
var menu_height;
|
||||
var window_width;
|
||||
var window_height;
|
||||
var max_width;
|
||||
var max_height;
|
||||
|
||||
$('context-menu').style['left'] = (render_x + 'px');
|
||||
$('context-menu').style['top'] = (render_y + 'px');
|
||||
Element.update('context-menu', '');
|
||||
|
||||
new Ajax.Updater({success:'context-menu'}, this.url,
|
||||
{asynchronous:true,
|
||||
method: 'get',
|
||||
evalScripts:true,
|
||||
parameters:Form.serialize(Event.findElement(e, 'form')),
|
||||
onComplete:function(request){
|
||||
dims = $('context-menu').getDimensions();
|
||||
menu_width = dims.width;
|
||||
menu_height = dims.height;
|
||||
max_width = mouse_x + 2*menu_width;
|
||||
max_height = mouse_y + menu_height;
|
||||
|
||||
var ws = window_size();
|
||||
window_width = ws.width;
|
||||
window_height = ws.height;
|
||||
|
||||
/* display the menu above and/or to the left of the click if needed */
|
||||
if (max_width > window_width) {
|
||||
render_x -= menu_width;
|
||||
$('context-menu').addClassName('reverse-x');
|
||||
} else {
|
||||
$('context-menu').removeClassName('reverse-x');
|
||||
}
|
||||
if (max_height > window_height) {
|
||||
render_y -= menu_height;
|
||||
$('context-menu').addClassName('reverse-y');
|
||||
} else {
|
||||
$('context-menu').removeClassName('reverse-y');
|
||||
}
|
||||
if (render_x <= 0) render_x = 1;
|
||||
if (render_y <= 0) render_y = 1;
|
||||
$('context-menu').style['left'] = (render_x + 'px');
|
||||
$('context-menu').style['top'] = (render_y + 'px');
|
||||
|
||||
Effect.Appear('context-menu', {duration: 0.20});
|
||||
if (window.parseStylesheets) { window.parseStylesheets(); } // IE
|
||||
}})
|
||||
},
|
||||
|
||||
hideMenu: function() {
|
||||
Element.hide('context-menu');
|
||||
},
|
||||
|
||||
addSelection: function(tr) {
|
||||
tr.addClassName('context-menu-selection');
|
||||
this.checkSelectionBox(tr, true);
|
||||
this.clearDocumentSelection();
|
||||
},
|
||||
|
||||
toggleSelection: function(tr) {
|
||||
if (this.isSelected(tr)) {
|
||||
this.removeSelection(tr);
|
||||
} else {
|
||||
this.addSelection(tr);
|
||||
}
|
||||
},
|
||||
|
||||
removeSelection: function(tr) {
|
||||
tr.removeClassName('context-menu-selection');
|
||||
this.checkSelectionBox(tr, false);
|
||||
},
|
||||
|
||||
unselectAll: function() {
|
||||
var rows = $$('.hascontextmenu');
|
||||
for (i=0; i<rows.length; i++) {
|
||||
this.removeSelection(rows[i]);
|
||||
}
|
||||
},
|
||||
|
||||
checkSelectionBox: function(tr, checked) {
|
||||
var inputs = Element.getElementsBySelector(tr, 'input');
|
||||
if (inputs.length > 0) { inputs[0].checked = checked; }
|
||||
},
|
||||
|
||||
isSelected: function(tr) {
|
||||
return Element.hasClassName(tr, 'context-menu-selection');
|
||||
},
|
||||
|
||||
clearDocumentSelection: function() {
|
||||
if (document.selection) {
|
||||
document.selection.clear(); // IE
|
||||
} else {
|
||||
window.getSelection().removeAllRanges();
|
||||
// click is outside the rows
|
||||
if (target.is('a') && (target.hasClass('disabled') || target.hasClass('submenu'))) {
|
||||
event.preventDefault();
|
||||
} else {
|
||||
contextMenuUnselectAll();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function toggleIssuesSelection(el) {
|
||||
var boxes = el.getElementsBySelector('input[type=checkbox]');
|
||||
var all_checked = true;
|
||||
for (i = 0; i < boxes.length; i++) { if (boxes[i].checked == false) { all_checked = false; } }
|
||||
for (i = 0; i < boxes.length; i++) {
|
||||
if (all_checked) {
|
||||
boxes[i].checked = false;
|
||||
boxes[i].up('tr').removeClassName('context-menu-selection');
|
||||
} else if (boxes[i].checked == false) {
|
||||
boxes[i].checked = true;
|
||||
boxes[i].up('tr').addClassName('context-menu-selection');
|
||||
}
|
||||
function contextMenuCreate() {
|
||||
if ($('#context-menu').length < 1) {
|
||||
var menu = document.createElement("div");
|
||||
menu.setAttribute("id", "context-menu");
|
||||
menu.setAttribute("style", "display:none;");
|
||||
document.getElementById("content").appendChild(menu);
|
||||
}
|
||||
}
|
||||
|
||||
function contextMenuShow(event) {
|
||||
var mouse_x = event.pageX;
|
||||
var mouse_y = event.pageY;
|
||||
var render_x = mouse_x;
|
||||
var render_y = mouse_y;
|
||||
var dims;
|
||||
var menu_width;
|
||||
var menu_height;
|
||||
var window_width;
|
||||
var window_height;
|
||||
var max_width;
|
||||
var max_height;
|
||||
|
||||
$('#context-menu').css('left', (render_x + 'px'));
|
||||
$('#context-menu').css('top', (render_y + 'px'));
|
||||
$('#context-menu').html('');
|
||||
|
||||
$.ajax({
|
||||
url: contextMenuUrl,
|
||||
data: $(event.target).parents('form').first().serialize(),
|
||||
success: function(data, textStatus, jqXHR) {
|
||||
$('#context-menu').html(data);
|
||||
menu_width = $('#context-menu').width();
|
||||
menu_height = $('#context-menu').height();
|
||||
max_width = mouse_x + 2*menu_width;
|
||||
max_height = mouse_y + menu_height;
|
||||
|
||||
var ws = window_size();
|
||||
window_width = ws.width;
|
||||
window_height = ws.height;
|
||||
|
||||
/* display the menu above and/or to the left of the click if needed */
|
||||
if (max_width > window_width) {
|
||||
render_x -= menu_width;
|
||||
$('#context-menu').addClass('reverse-x');
|
||||
} else {
|
||||
$('#context-menu').removeClass('reverse-x');
|
||||
}
|
||||
if (max_height > window_height) {
|
||||
render_y -= menu_height;
|
||||
$('#context-menu').addClass('reverse-y');
|
||||
} else {
|
||||
$('#context-menu').removeClass('reverse-y');
|
||||
}
|
||||
if (render_x <= 0) render_x = 1;
|
||||
if (render_y <= 0) render_y = 1;
|
||||
$('#context-menu').css('left', (render_x + 'px'));
|
||||
$('#context-menu').css('top', (render_y + 'px'));
|
||||
$('#context-menu').show();
|
||||
|
||||
//if (window.parseStylesheets) { window.parseStylesheets(); } // IE
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function contextMenuSetLastSelected(tr) {
|
||||
$('.cm-last').removeClass('cm-last');
|
||||
tr.addClass('cm-last');
|
||||
}
|
||||
|
||||
function contextMenuLastSelected() {
|
||||
return $('.cm-last').first();
|
||||
}
|
||||
|
||||
function contextMenuUnselectAll() {
|
||||
$('.hascontextmenu').each(function(){
|
||||
contextMenuRemoveSelection($(this));
|
||||
});
|
||||
$('.cm-last').removeClass('cm-last');
|
||||
}
|
||||
|
||||
function contextMenuHide() {
|
||||
$('#context-menu').hide();
|
||||
}
|
||||
|
||||
function contextMenuToggleSelection(tr) {
|
||||
if (contextMenuIsSelected(tr)) {
|
||||
contextMenuRemoveSelection(tr);
|
||||
} else {
|
||||
contextMenuAddSelection(tr);
|
||||
}
|
||||
}
|
||||
|
||||
function contextMenuAddSelection(tr) {
|
||||
tr.addClass('context-menu-selection');
|
||||
contextMenuCheckSelectionBox(tr, true);
|
||||
contextMenuClearDocumentSelection();
|
||||
}
|
||||
|
||||
function contextMenuRemoveSelection(tr) {
|
||||
tr.removeClass('context-menu-selection');
|
||||
contextMenuCheckSelectionBox(tr, false);
|
||||
}
|
||||
|
||||
function contextMenuIsSelected(tr) {
|
||||
return tr.hasClass('context-menu-selection');
|
||||
}
|
||||
|
||||
function contextMenuCheckSelectionBox(tr, checked) {
|
||||
tr.find('input[type=checkbox]').attr('checked', checked);
|
||||
}
|
||||
|
||||
function contextMenuClearDocumentSelection() {
|
||||
// TODO
|
||||
if (document.selection) {
|
||||
document.selection.clear(); // IE
|
||||
} else {
|
||||
window.getSelection().removeAllRanges();
|
||||
}
|
||||
}
|
||||
|
||||
function contextMenuInit(url) {
|
||||
contextMenuUrl = url;
|
||||
contextMenuCreate();
|
||||
contextMenuUnselectAll();
|
||||
|
||||
if (!contextMenuObserving) {
|
||||
$(document).click(contextMenuClick);
|
||||
$(document).contextmenu(contextMenuRightClick);
|
||||
contextMenuObserving = true;
|
||||
}
|
||||
}
|
||||
|
||||
function toggleIssuesSelection(el) {
|
||||
var boxes = $(el).parents('form').find('input[type=checkbox]');
|
||||
var all_checked = true;
|
||||
boxes.each(function(){ if (!$(this).attr('checked')) { all_checked = false; } });
|
||||
boxes.each(function(){
|
||||
if (all_checked) {
|
||||
$(this).removeAttr('checked');
|
||||
$(this).parents('tr').removeClass('context-menu-selection');
|
||||
} else if (!$(this).attr('checked')) {
|
||||
$(this).attr('checked', true);
|
||||
$(this).parents('tr').addClass('context-menu-selection');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function window_size() {
|
||||
var w;
|
||||
var h;
|
||||
|
||||
Vendored
-963
@@ -1,963 +0,0 @@
|
||||
// Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// (c) 2005-2008 Ivan Krstic (http://blogs.law.harvard.edu/ivan)
|
||||
// (c) 2005-2008 Jon Tirsen (http://www.tirsen.com)
|
||||
// Contributors:
|
||||
// Richard Livsey
|
||||
// Rahul Bhargava
|
||||
// Rob Wills
|
||||
//
|
||||
// script.aculo.us is freely distributable under the terms of an MIT-style license.
|
||||
// For details, see the script.aculo.us web site: http://script.aculo.us/
|
||||
|
||||
// Autocompleter.Base handles all the autocompletion functionality
|
||||
// that's independent of the data source for autocompletion. This
|
||||
// includes drawing the autocompletion menu, observing keyboard
|
||||
// and mouse events, and similar.
|
||||
//
|
||||
// Specific autocompleters need to provide, at the very least,
|
||||
// a getUpdatedChoices function that will be invoked every time
|
||||
// the text inside the monitored textbox changes. This method
|
||||
// should get the text for which to provide autocompletion by
|
||||
// invoking this.getToken(), NOT by directly accessing
|
||||
// this.element.value. This is to allow incremental tokenized
|
||||
// autocompletion. Specific auto-completion logic (AJAX, etc)
|
||||
// belongs in getUpdatedChoices.
|
||||
//
|
||||
// Tokenized incremental autocompletion is enabled automatically
|
||||
// when an autocompleter is instantiated with the 'tokens' option
|
||||
// in the options parameter, e.g.:
|
||||
// new Ajax.Autocompleter('id','upd', '/url/', { tokens: ',' });
|
||||
// will incrementally autocomplete with a comma as the token.
|
||||
// Additionally, ',' in the above example can be replaced with
|
||||
// a token array, e.g. { tokens: [',', '\n'] } which
|
||||
// enables autocompletion on multiple tokens. This is most
|
||||
// useful when one of the tokens is \n (a newline), as it
|
||||
// allows smart autocompletion after linebreaks.
|
||||
|
||||
if(typeof Effect == 'undefined')
|
||||
throw("controls.js requires including script.aculo.us' effects.js library");
|
||||
|
||||
var Autocompleter = { };
|
||||
Autocompleter.Base = Class.create({
|
||||
baseInitialize: function(element, update, options) {
|
||||
element = $(element);
|
||||
this.element = element;
|
||||
this.update = $(update);
|
||||
this.hasFocus = false;
|
||||
this.changed = false;
|
||||
this.active = false;
|
||||
this.index = 0;
|
||||
this.entryCount = 0;
|
||||
this.oldElementValue = this.element.value;
|
||||
|
||||
if(this.setOptions)
|
||||
this.setOptions(options);
|
||||
else
|
||||
this.options = options || { };
|
||||
|
||||
this.options.paramName = this.options.paramName || this.element.name;
|
||||
this.options.tokens = this.options.tokens || [];
|
||||
this.options.frequency = this.options.frequency || 0.4;
|
||||
this.options.minChars = this.options.minChars || 1;
|
||||
this.options.onShow = this.options.onShow ||
|
||||
function(element, update){
|
||||
if(!update.style.position || update.style.position=='absolute') {
|
||||
update.style.position = 'absolute';
|
||||
Position.clone(element, update, {
|
||||
setHeight: false,
|
||||
offsetTop: element.offsetHeight
|
||||
});
|
||||
}
|
||||
Effect.Appear(update,{duration:0.15});
|
||||
};
|
||||
this.options.onHide = this.options.onHide ||
|
||||
function(element, update){ new Effect.Fade(update,{duration:0.15}) };
|
||||
|
||||
if(typeof(this.options.tokens) == 'string')
|
||||
this.options.tokens = new Array(this.options.tokens);
|
||||
// Force carriage returns as token delimiters anyway
|
||||
if (!this.options.tokens.include('\n'))
|
||||
this.options.tokens.push('\n');
|
||||
|
||||
this.observer = null;
|
||||
|
||||
this.element.setAttribute('autocomplete','off');
|
||||
|
||||
Element.hide(this.update);
|
||||
|
||||
Event.observe(this.element, 'blur', this.onBlur.bindAsEventListener(this));
|
||||
Event.observe(this.element, 'keydown', this.onKeyPress.bindAsEventListener(this));
|
||||
},
|
||||
|
||||
show: function() {
|
||||
if(Element.getStyle(this.update, 'display')=='none') this.options.onShow(this.element, this.update);
|
||||
if(!this.iefix &&
|
||||
(Prototype.Browser.IE) &&
|
||||
(Element.getStyle(this.update, 'position')=='absolute')) {
|
||||
new Insertion.After(this.update,
|
||||
'<iframe id="' + this.update.id + '_iefix" '+
|
||||
'style="display:none;position:absolute;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);" ' +
|
||||
'src="javascript:false;" frameborder="0" scrolling="no"></iframe>');
|
||||
this.iefix = $(this.update.id+'_iefix');
|
||||
}
|
||||
if(this.iefix) setTimeout(this.fixIEOverlapping.bind(this), 50);
|
||||
},
|
||||
|
||||
fixIEOverlapping: function() {
|
||||
Position.clone(this.update, this.iefix, {setTop:(!this.update.style.height)});
|
||||
this.iefix.style.zIndex = 1;
|
||||
this.update.style.zIndex = 2;
|
||||
Element.show(this.iefix);
|
||||
},
|
||||
|
||||
hide: function() {
|
||||
this.stopIndicator();
|
||||
if(Element.getStyle(this.update, 'display')!='none') this.options.onHide(this.element, this.update);
|
||||
if(this.iefix) Element.hide(this.iefix);
|
||||
},
|
||||
|
||||
startIndicator: function() {
|
||||
if(this.options.indicator) Element.show(this.options.indicator);
|
||||
},
|
||||
|
||||
stopIndicator: function() {
|
||||
if(this.options.indicator) Element.hide(this.options.indicator);
|
||||
},
|
||||
|
||||
onKeyPress: function(event) {
|
||||
if(this.active)
|
||||
switch(event.keyCode) {
|
||||
case Event.KEY_TAB:
|
||||
case Event.KEY_RETURN:
|
||||
this.selectEntry();
|
||||
Event.stop(event);
|
||||
case Event.KEY_ESC:
|
||||
this.hide();
|
||||
this.active = false;
|
||||
Event.stop(event);
|
||||
return;
|
||||
case Event.KEY_LEFT:
|
||||
case Event.KEY_RIGHT:
|
||||
return;
|
||||
case Event.KEY_UP:
|
||||
this.markPrevious();
|
||||
this.render();
|
||||
Event.stop(event);
|
||||
return;
|
||||
case Event.KEY_DOWN:
|
||||
this.markNext();
|
||||
this.render();
|
||||
Event.stop(event);
|
||||
return;
|
||||
}
|
||||
else
|
||||
if(event.keyCode==Event.KEY_TAB || event.keyCode==Event.KEY_RETURN ||
|
||||
(Prototype.Browser.WebKit > 0 && event.keyCode == 0)) return;
|
||||
|
||||
this.changed = true;
|
||||
this.hasFocus = true;
|
||||
|
||||
if(this.observer) clearTimeout(this.observer);
|
||||
this.observer =
|
||||
setTimeout(this.onObserverEvent.bind(this), this.options.frequency*1000);
|
||||
},
|
||||
|
||||
activate: function() {
|
||||
this.changed = false;
|
||||
this.hasFocus = true;
|
||||
this.getUpdatedChoices();
|
||||
},
|
||||
|
||||
onHover: function(event) {
|
||||
var element = Event.findElement(event, 'LI');
|
||||
if(this.index != element.autocompleteIndex)
|
||||
{
|
||||
this.index = element.autocompleteIndex;
|
||||
this.render();
|
||||
}
|
||||
Event.stop(event);
|
||||
},
|
||||
|
||||
onClick: function(event) {
|
||||
var element = Event.findElement(event, 'LI');
|
||||
this.index = element.autocompleteIndex;
|
||||
this.selectEntry();
|
||||
this.hide();
|
||||
},
|
||||
|
||||
onBlur: function(event) {
|
||||
// needed to make click events working
|
||||
setTimeout(this.hide.bind(this), 250);
|
||||
this.hasFocus = false;
|
||||
this.active = false;
|
||||
},
|
||||
|
||||
render: function() {
|
||||
if(this.entryCount > 0) {
|
||||
for (var i = 0; i < this.entryCount; i++)
|
||||
this.index==i ?
|
||||
Element.addClassName(this.getEntry(i),"selected") :
|
||||
Element.removeClassName(this.getEntry(i),"selected");
|
||||
if(this.hasFocus) {
|
||||
this.show();
|
||||
this.active = true;
|
||||
}
|
||||
} else {
|
||||
this.active = false;
|
||||
this.hide();
|
||||
}
|
||||
},
|
||||
|
||||
markPrevious: function() {
|
||||
if(this.index > 0) this.index--;
|
||||
else this.index = this.entryCount-1;
|
||||
this.getEntry(this.index).scrollIntoView(true);
|
||||
},
|
||||
|
||||
markNext: function() {
|
||||
if(this.index < this.entryCount-1) this.index++;
|
||||
else this.index = 0;
|
||||
this.getEntry(this.index).scrollIntoView(false);
|
||||
},
|
||||
|
||||
getEntry: function(index) {
|
||||
return this.update.firstChild.childNodes[index];
|
||||
},
|
||||
|
||||
getCurrentEntry: function() {
|
||||
return this.getEntry(this.index);
|
||||
},
|
||||
|
||||
selectEntry: function() {
|
||||
this.active = false;
|
||||
this.updateElement(this.getCurrentEntry());
|
||||
},
|
||||
|
||||
updateElement: function(selectedElement) {
|
||||
if (this.options.updateElement) {
|
||||
this.options.updateElement(selectedElement);
|
||||
return;
|
||||
}
|
||||
var value = '';
|
||||
if (this.options.select) {
|
||||
var nodes = $(selectedElement).select('.' + this.options.select) || [];
|
||||
if(nodes.length>0) value = Element.collectTextNodes(nodes[0], this.options.select);
|
||||
} else
|
||||
value = Element.collectTextNodesIgnoreClass(selectedElement, 'informal');
|
||||
|
||||
var bounds = this.getTokenBounds();
|
||||
if (bounds[0] != -1) {
|
||||
var newValue = this.element.value.substr(0, bounds[0]);
|
||||
var whitespace = this.element.value.substr(bounds[0]).match(/^\s+/);
|
||||
if (whitespace)
|
||||
newValue += whitespace[0];
|
||||
this.element.value = newValue + value + this.element.value.substr(bounds[1]);
|
||||
} else {
|
||||
this.element.value = value;
|
||||
}
|
||||
this.oldElementValue = this.element.value;
|
||||
this.element.focus();
|
||||
|
||||
if (this.options.afterUpdateElement)
|
||||
this.options.afterUpdateElement(this.element, selectedElement);
|
||||
},
|
||||
|
||||
updateChoices: function(choices) {
|
||||
if(!this.changed && this.hasFocus) {
|
||||
this.update.innerHTML = choices;
|
||||
Element.cleanWhitespace(this.update);
|
||||
Element.cleanWhitespace(this.update.down());
|
||||
|
||||
if(this.update.firstChild && this.update.down().childNodes) {
|
||||
this.entryCount =
|
||||
this.update.down().childNodes.length;
|
||||
for (var i = 0; i < this.entryCount; i++) {
|
||||
var entry = this.getEntry(i);
|
||||
entry.autocompleteIndex = i;
|
||||
this.addObservers(entry);
|
||||
}
|
||||
} else {
|
||||
this.entryCount = 0;
|
||||
}
|
||||
|
||||
this.stopIndicator();
|
||||
this.index = 0;
|
||||
|
||||
if(this.entryCount==1 && this.options.autoSelect) {
|
||||
this.selectEntry();
|
||||
this.hide();
|
||||
} else {
|
||||
this.render();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
addObservers: function(element) {
|
||||
Event.observe(element, "mouseover", this.onHover.bindAsEventListener(this));
|
||||
Event.observe(element, "click", this.onClick.bindAsEventListener(this));
|
||||
},
|
||||
|
||||
onObserverEvent: function() {
|
||||
this.changed = false;
|
||||
this.tokenBounds = null;
|
||||
if(this.getToken().length>=this.options.minChars) {
|
||||
this.getUpdatedChoices();
|
||||
} else {
|
||||
this.active = false;
|
||||
this.hide();
|
||||
}
|
||||
this.oldElementValue = this.element.value;
|
||||
},
|
||||
|
||||
getToken: function() {
|
||||
var bounds = this.getTokenBounds();
|
||||
return this.element.value.substring(bounds[0], bounds[1]).strip();
|
||||
},
|
||||
|
||||
getTokenBounds: function() {
|
||||
if (null != this.tokenBounds) return this.tokenBounds;
|
||||
var value = this.element.value;
|
||||
if (value.strip().empty()) return [-1, 0];
|
||||
var diff = arguments.callee.getFirstDifferencePos(value, this.oldElementValue);
|
||||
var offset = (diff == this.oldElementValue.length ? 1 : 0);
|
||||
var prevTokenPos = -1, nextTokenPos = value.length;
|
||||
var tp;
|
||||
for (var index = 0, l = this.options.tokens.length; index < l; ++index) {
|
||||
tp = value.lastIndexOf(this.options.tokens[index], diff + offset - 1);
|
||||
if (tp > prevTokenPos) prevTokenPos = tp;
|
||||
tp = value.indexOf(this.options.tokens[index], diff + offset);
|
||||
if (-1 != tp && tp < nextTokenPos) nextTokenPos = tp;
|
||||
}
|
||||
return (this.tokenBounds = [prevTokenPos + 1, nextTokenPos]);
|
||||
}
|
||||
});
|
||||
|
||||
Autocompleter.Base.prototype.getTokenBounds.getFirstDifferencePos = function(newS, oldS) {
|
||||
var boundary = Math.min(newS.length, oldS.length);
|
||||
for (var index = 0; index < boundary; ++index)
|
||||
if (newS[index] != oldS[index])
|
||||
return index;
|
||||
return boundary;
|
||||
};
|
||||
|
||||
Ajax.Autocompleter = Class.create(Autocompleter.Base, {
|
||||
initialize: function(element, update, url, options) {
|
||||
this.baseInitialize(element, update, options);
|
||||
this.options.asynchronous = true;
|
||||
this.options.onComplete = this.onComplete.bind(this);
|
||||
this.options.defaultParams = this.options.parameters || null;
|
||||
this.url = url;
|
||||
},
|
||||
|
||||
getUpdatedChoices: function() {
|
||||
this.startIndicator();
|
||||
|
||||
var entry = encodeURIComponent(this.options.paramName) + '=' +
|
||||
encodeURIComponent(this.getToken());
|
||||
|
||||
this.options.parameters = this.options.callback ?
|
||||
this.options.callback(this.element, entry) : entry;
|
||||
|
||||
if(this.options.defaultParams)
|
||||
this.options.parameters += '&' + this.options.defaultParams;
|
||||
|
||||
new Ajax.Request(this.url, this.options);
|
||||
},
|
||||
|
||||
onComplete: function(request) {
|
||||
this.updateChoices(request.responseText);
|
||||
}
|
||||
});
|
||||
|
||||
// The local array autocompleter. Used when you'd prefer to
|
||||
// inject an array of autocompletion options into the page, rather
|
||||
// than sending out Ajax queries, which can be quite slow sometimes.
|
||||
//
|
||||
// The constructor takes four parameters. The first two are, as usual,
|
||||
// the id of the monitored textbox, and id of the autocompletion menu.
|
||||
// The third is the array you want to autocomplete from, and the fourth
|
||||
// is the options block.
|
||||
//
|
||||
// Extra local autocompletion options:
|
||||
// - choices - How many autocompletion choices to offer
|
||||
//
|
||||
// - partialSearch - If false, the autocompleter will match entered
|
||||
// text only at the beginning of strings in the
|
||||
// autocomplete array. Defaults to true, which will
|
||||
// match text at the beginning of any *word* in the
|
||||
// strings in the autocomplete array. If you want to
|
||||
// search anywhere in the string, additionally set
|
||||
// the option fullSearch to true (default: off).
|
||||
//
|
||||
// - fullSsearch - Search anywhere in autocomplete array strings.
|
||||
//
|
||||
// - partialChars - How many characters to enter before triggering
|
||||
// a partial match (unlike minChars, which defines
|
||||
// how many characters are required to do any match
|
||||
// at all). Defaults to 2.
|
||||
//
|
||||
// - ignoreCase - Whether to ignore case when autocompleting.
|
||||
// Defaults to true.
|
||||
//
|
||||
// It's possible to pass in a custom function as the 'selector'
|
||||
// option, if you prefer to write your own autocompletion logic.
|
||||
// In that case, the other options above will not apply unless
|
||||
// you support them.
|
||||
|
||||
Autocompleter.Local = Class.create(Autocompleter.Base, {
|
||||
initialize: function(element, update, array, options) {
|
||||
this.baseInitialize(element, update, options);
|
||||
this.options.array = array;
|
||||
},
|
||||
|
||||
getUpdatedChoices: function() {
|
||||
this.updateChoices(this.options.selector(this));
|
||||
},
|
||||
|
||||
setOptions: function(options) {
|
||||
this.options = Object.extend({
|
||||
choices: 10,
|
||||
partialSearch: true,
|
||||
partialChars: 2,
|
||||
ignoreCase: true,
|
||||
fullSearch: false,
|
||||
selector: function(instance) {
|
||||
var ret = []; // Beginning matches
|
||||
var partial = []; // Inside matches
|
||||
var entry = instance.getToken();
|
||||
var count = 0;
|
||||
|
||||
for (var i = 0; i < instance.options.array.length &&
|
||||
ret.length < instance.options.choices ; i++) {
|
||||
|
||||
var elem = instance.options.array[i];
|
||||
var foundPos = instance.options.ignoreCase ?
|
||||
elem.toLowerCase().indexOf(entry.toLowerCase()) :
|
||||
elem.indexOf(entry);
|
||||
|
||||
while (foundPos != -1) {
|
||||
if (foundPos == 0 && elem.length != entry.length) {
|
||||
ret.push("<li><strong>" + elem.substr(0, entry.length) + "</strong>" +
|
||||
elem.substr(entry.length) + "</li>");
|
||||
break;
|
||||
} else if (entry.length >= instance.options.partialChars &&
|
||||
instance.options.partialSearch && foundPos != -1) {
|
||||
if (instance.options.fullSearch || /\s/.test(elem.substr(foundPos-1,1))) {
|
||||
partial.push("<li>" + elem.substr(0, foundPos) + "<strong>" +
|
||||
elem.substr(foundPos, entry.length) + "</strong>" + elem.substr(
|
||||
foundPos + entry.length) + "</li>");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
foundPos = instance.options.ignoreCase ?
|
||||
elem.toLowerCase().indexOf(entry.toLowerCase(), foundPos + 1) :
|
||||
elem.indexOf(entry, foundPos + 1);
|
||||
|
||||
}
|
||||
}
|
||||
if (partial.length)
|
||||
ret = ret.concat(partial.slice(0, instance.options.choices - ret.length));
|
||||
return "<ul>" + ret.join('') + "</ul>";
|
||||
}
|
||||
}, options || { });
|
||||
}
|
||||
});
|
||||
|
||||
// AJAX in-place editor and collection editor
|
||||
// Full rewrite by Christophe Porteneuve <tdd@tddsworld.com> (April 2007).
|
||||
|
||||
// Use this if you notice weird scrolling problems on some browsers,
|
||||
// the DOM might be a bit confused when this gets called so do this
|
||||
// waits 1 ms (with setTimeout) until it does the activation
|
||||
Field.scrollFreeActivate = function(field) {
|
||||
setTimeout(function() {
|
||||
Field.activate(field);
|
||||
}, 1);
|
||||
};
|
||||
|
||||
Ajax.InPlaceEditor = Class.create({
|
||||
initialize: function(element, url, options) {
|
||||
this.url = url;
|
||||
this.element = element = $(element);
|
||||
this.prepareOptions();
|
||||
this._controls = { };
|
||||
arguments.callee.dealWithDeprecatedOptions(options); // DEPRECATION LAYER!!!
|
||||
Object.extend(this.options, options || { });
|
||||
if (!this.options.formId && this.element.id) {
|
||||
this.options.formId = this.element.id + '-inplaceeditor';
|
||||
if ($(this.options.formId))
|
||||
this.options.formId = '';
|
||||
}
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl = $(this.options.externalControl);
|
||||
if (!this.options.externalControl)
|
||||
this.options.externalControlOnly = false;
|
||||
this._originalBackground = this.element.getStyle('background-color') || 'transparent';
|
||||
this.element.title = this.options.clickToEditText;
|
||||
this._boundCancelHandler = this.handleFormCancellation.bind(this);
|
||||
this._boundComplete = (this.options.onComplete || Prototype.emptyFunction).bind(this);
|
||||
this._boundFailureHandler = this.handleAJAXFailure.bind(this);
|
||||
this._boundSubmitHandler = this.handleFormSubmission.bind(this);
|
||||
this._boundWrapperHandler = this.wrapUp.bind(this);
|
||||
this.registerListeners();
|
||||
},
|
||||
checkForEscapeOrReturn: function(e) {
|
||||
if (!this._editing || e.ctrlKey || e.altKey || e.shiftKey) return;
|
||||
if (Event.KEY_ESC == e.keyCode)
|
||||
this.handleFormCancellation(e);
|
||||
else if (Event.KEY_RETURN == e.keyCode)
|
||||
this.handleFormSubmission(e);
|
||||
},
|
||||
createControl: function(mode, handler, extraClasses) {
|
||||
var control = this.options[mode + 'Control'];
|
||||
var text = this.options[mode + 'Text'];
|
||||
if ('button' == control) {
|
||||
var btn = document.createElement('input');
|
||||
btn.type = 'submit';
|
||||
btn.value = text;
|
||||
btn.className = 'editor_' + mode + '_button';
|
||||
if ('cancel' == mode)
|
||||
btn.onclick = this._boundCancelHandler;
|
||||
this._form.appendChild(btn);
|
||||
this._controls[mode] = btn;
|
||||
} else if ('link' == control) {
|
||||
var link = document.createElement('a');
|
||||
link.href = '#';
|
||||
link.appendChild(document.createTextNode(text));
|
||||
link.onclick = 'cancel' == mode ? this._boundCancelHandler : this._boundSubmitHandler;
|
||||
link.className = 'editor_' + mode + '_link';
|
||||
if (extraClasses)
|
||||
link.className += ' ' + extraClasses;
|
||||
this._form.appendChild(link);
|
||||
this._controls[mode] = link;
|
||||
}
|
||||
},
|
||||
createEditField: function() {
|
||||
var text = (this.options.loadTextURL ? this.options.loadingText : this.getText());
|
||||
var fld;
|
||||
if (1 >= this.options.rows && !/\r|\n/.test(this.getText())) {
|
||||
fld = document.createElement('input');
|
||||
fld.type = 'text';
|
||||
var size = this.options.size || this.options.cols || 0;
|
||||
if (0 < size) fld.size = size;
|
||||
} else {
|
||||
fld = document.createElement('textarea');
|
||||
fld.rows = (1 >= this.options.rows ? this.options.autoRows : this.options.rows);
|
||||
fld.cols = this.options.cols || 40;
|
||||
}
|
||||
fld.name = this.options.paramName;
|
||||
fld.value = text; // No HTML breaks conversion anymore
|
||||
fld.className = 'editor_field';
|
||||
if (this.options.submitOnBlur)
|
||||
fld.onblur = this._boundSubmitHandler;
|
||||
this._controls.editor = fld;
|
||||
if (this.options.loadTextURL)
|
||||
this.loadExternalText();
|
||||
this._form.appendChild(this._controls.editor);
|
||||
},
|
||||
createForm: function() {
|
||||
var ipe = this;
|
||||
function addText(mode, condition) {
|
||||
var text = ipe.options['text' + mode + 'Controls'];
|
||||
if (!text || condition === false) return;
|
||||
ipe._form.appendChild(document.createTextNode(text));
|
||||
};
|
||||
this._form = $(document.createElement('form'));
|
||||
this._form.id = this.options.formId;
|
||||
this._form.addClassName(this.options.formClassName);
|
||||
this._form.onsubmit = this._boundSubmitHandler;
|
||||
this.createEditField();
|
||||
if ('textarea' == this._controls.editor.tagName.toLowerCase())
|
||||
this._form.appendChild(document.createElement('br'));
|
||||
if (this.options.onFormCustomization)
|
||||
this.options.onFormCustomization(this, this._form);
|
||||
addText('Before', this.options.okControl || this.options.cancelControl);
|
||||
this.createControl('ok', this._boundSubmitHandler);
|
||||
addText('Between', this.options.okControl && this.options.cancelControl);
|
||||
this.createControl('cancel', this._boundCancelHandler, 'editor_cancel');
|
||||
addText('After', this.options.okControl || this.options.cancelControl);
|
||||
},
|
||||
destroy: function() {
|
||||
if (this._oldInnerHTML)
|
||||
this.element.innerHTML = this._oldInnerHTML;
|
||||
this.leaveEditMode();
|
||||
this.unregisterListeners();
|
||||
},
|
||||
enterEditMode: function(e) {
|
||||
if (this._saving || this._editing) return;
|
||||
this._editing = true;
|
||||
this.triggerCallback('onEnterEditMode');
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl.hide();
|
||||
this.element.hide();
|
||||
this.createForm();
|
||||
this.element.parentNode.insertBefore(this._form, this.element);
|
||||
if (!this.options.loadTextURL)
|
||||
this.postProcessEditField();
|
||||
if (e) Event.stop(e);
|
||||
},
|
||||
enterHover: function(e) {
|
||||
if (this.options.hoverClassName)
|
||||
this.element.addClassName(this.options.hoverClassName);
|
||||
if (this._saving) return;
|
||||
this.triggerCallback('onEnterHover');
|
||||
},
|
||||
getText: function() {
|
||||
return this.element.innerHTML.unescapeHTML();
|
||||
},
|
||||
handleAJAXFailure: function(transport) {
|
||||
this.triggerCallback('onFailure', transport);
|
||||
if (this._oldInnerHTML) {
|
||||
this.element.innerHTML = this._oldInnerHTML;
|
||||
this._oldInnerHTML = null;
|
||||
}
|
||||
},
|
||||
handleFormCancellation: function(e) {
|
||||
this.wrapUp();
|
||||
if (e) Event.stop(e);
|
||||
},
|
||||
handleFormSubmission: function(e) {
|
||||
var form = this._form;
|
||||
var value = $F(this._controls.editor);
|
||||
this.prepareSubmission();
|
||||
var params = this.options.callback(form, value) || '';
|
||||
if (Object.isString(params))
|
||||
params = params.toQueryParams();
|
||||
params.editorId = this.element.id;
|
||||
if (this.options.htmlResponse) {
|
||||
var options = Object.extend({ evalScripts: true }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: params,
|
||||
onComplete: this._boundWrapperHandler,
|
||||
onFailure: this._boundFailureHandler
|
||||
});
|
||||
new Ajax.Updater({ success: this.element }, this.url, options);
|
||||
} else {
|
||||
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: params,
|
||||
onComplete: this._boundWrapperHandler,
|
||||
onFailure: this._boundFailureHandler
|
||||
});
|
||||
new Ajax.Request(this.url, options);
|
||||
}
|
||||
if (e) Event.stop(e);
|
||||
},
|
||||
leaveEditMode: function() {
|
||||
this.element.removeClassName(this.options.savingClassName);
|
||||
this.removeForm();
|
||||
this.leaveHover();
|
||||
this.element.style.backgroundColor = this._originalBackground;
|
||||
this.element.show();
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl.show();
|
||||
this._saving = false;
|
||||
this._editing = false;
|
||||
this._oldInnerHTML = null;
|
||||
this.triggerCallback('onLeaveEditMode');
|
||||
},
|
||||
leaveHover: function(e) {
|
||||
if (this.options.hoverClassName)
|
||||
this.element.removeClassName(this.options.hoverClassName);
|
||||
if (this._saving) return;
|
||||
this.triggerCallback('onLeaveHover');
|
||||
},
|
||||
loadExternalText: function() {
|
||||
this._form.addClassName(this.options.loadingClassName);
|
||||
this._controls.editor.disabled = true;
|
||||
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: 'editorId=' + encodeURIComponent(this.element.id),
|
||||
onComplete: Prototype.emptyFunction,
|
||||
onSuccess: function(transport) {
|
||||
this._form.removeClassName(this.options.loadingClassName);
|
||||
var text = transport.responseText;
|
||||
if (this.options.stripLoadedTextTags)
|
||||
text = text.stripTags();
|
||||
this._controls.editor.value = text;
|
||||
this._controls.editor.disabled = false;
|
||||
this.postProcessEditField();
|
||||
}.bind(this),
|
||||
onFailure: this._boundFailureHandler
|
||||
});
|
||||
new Ajax.Request(this.options.loadTextURL, options);
|
||||
},
|
||||
postProcessEditField: function() {
|
||||
var fpc = this.options.fieldPostCreation;
|
||||
if (fpc)
|
||||
$(this._controls.editor)['focus' == fpc ? 'focus' : 'activate']();
|
||||
},
|
||||
prepareOptions: function() {
|
||||
this.options = Object.clone(Ajax.InPlaceEditor.DefaultOptions);
|
||||
Object.extend(this.options, Ajax.InPlaceEditor.DefaultCallbacks);
|
||||
[this._extraDefaultOptions].flatten().compact().each(function(defs) {
|
||||
Object.extend(this.options, defs);
|
||||
}.bind(this));
|
||||
},
|
||||
prepareSubmission: function() {
|
||||
this._saving = true;
|
||||
this.removeForm();
|
||||
this.leaveHover();
|
||||
this.showSaving();
|
||||
},
|
||||
registerListeners: function() {
|
||||
this._listeners = { };
|
||||
var listener;
|
||||
$H(Ajax.InPlaceEditor.Listeners).each(function(pair) {
|
||||
listener = this[pair.value].bind(this);
|
||||
this._listeners[pair.key] = listener;
|
||||
if (!this.options.externalControlOnly)
|
||||
this.element.observe(pair.key, listener);
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl.observe(pair.key, listener);
|
||||
}.bind(this));
|
||||
},
|
||||
removeForm: function() {
|
||||
if (!this._form) return;
|
||||
this._form.remove();
|
||||
this._form = null;
|
||||
this._controls = { };
|
||||
},
|
||||
showSaving: function() {
|
||||
this._oldInnerHTML = this.element.innerHTML;
|
||||
this.element.innerHTML = this.options.savingText;
|
||||
this.element.addClassName(this.options.savingClassName);
|
||||
this.element.style.backgroundColor = this._originalBackground;
|
||||
this.element.show();
|
||||
},
|
||||
triggerCallback: function(cbName, arg) {
|
||||
if ('function' == typeof this.options[cbName]) {
|
||||
this.options[cbName](this, arg);
|
||||
}
|
||||
},
|
||||
unregisterListeners: function() {
|
||||
$H(this._listeners).each(function(pair) {
|
||||
if (!this.options.externalControlOnly)
|
||||
this.element.stopObserving(pair.key, pair.value);
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl.stopObserving(pair.key, pair.value);
|
||||
}.bind(this));
|
||||
},
|
||||
wrapUp: function(transport) {
|
||||
this.leaveEditMode();
|
||||
// Can't use triggerCallback due to backward compatibility: requires
|
||||
// binding + direct element
|
||||
this._boundComplete(transport, this.element);
|
||||
}
|
||||
});
|
||||
|
||||
Object.extend(Ajax.InPlaceEditor.prototype, {
|
||||
dispose: Ajax.InPlaceEditor.prototype.destroy
|
||||
});
|
||||
|
||||
Ajax.InPlaceCollectionEditor = Class.create(Ajax.InPlaceEditor, {
|
||||
initialize: function($super, element, url, options) {
|
||||
this._extraDefaultOptions = Ajax.InPlaceCollectionEditor.DefaultOptions;
|
||||
$super(element, url, options);
|
||||
},
|
||||
|
||||
createEditField: function() {
|
||||
var list = document.createElement('select');
|
||||
list.name = this.options.paramName;
|
||||
list.size = 1;
|
||||
this._controls.editor = list;
|
||||
this._collection = this.options.collection || [];
|
||||
if (this.options.loadCollectionURL)
|
||||
this.loadCollection();
|
||||
else
|
||||
this.checkForExternalText();
|
||||
this._form.appendChild(this._controls.editor);
|
||||
},
|
||||
|
||||
loadCollection: function() {
|
||||
this._form.addClassName(this.options.loadingClassName);
|
||||
this.showLoadingText(this.options.loadingCollectionText);
|
||||
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: 'editorId=' + encodeURIComponent(this.element.id),
|
||||
onComplete: Prototype.emptyFunction,
|
||||
onSuccess: function(transport) {
|
||||
var js = transport.responseText.strip();
|
||||
if (!/^\[.*\]$/.test(js)) // TODO: improve sanity check
|
||||
throw('Server returned an invalid collection representation.');
|
||||
this._collection = eval(js);
|
||||
this.checkForExternalText();
|
||||
}.bind(this),
|
||||
onFailure: this.onFailure
|
||||
});
|
||||
new Ajax.Request(this.options.loadCollectionURL, options);
|
||||
},
|
||||
|
||||
showLoadingText: function(text) {
|
||||
this._controls.editor.disabled = true;
|
||||
var tempOption = this._controls.editor.firstChild;
|
||||
if (!tempOption) {
|
||||
tempOption = document.createElement('option');
|
||||
tempOption.value = '';
|
||||
this._controls.editor.appendChild(tempOption);
|
||||
tempOption.selected = true;
|
||||
}
|
||||
tempOption.update((text || '').stripScripts().stripTags());
|
||||
},
|
||||
|
||||
checkForExternalText: function() {
|
||||
this._text = this.getText();
|
||||
if (this.options.loadTextURL)
|
||||
this.loadExternalText();
|
||||
else
|
||||
this.buildOptionList();
|
||||
},
|
||||
|
||||
loadExternalText: function() {
|
||||
this.showLoadingText(this.options.loadingText);
|
||||
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: 'editorId=' + encodeURIComponent(this.element.id),
|
||||
onComplete: Prototype.emptyFunction,
|
||||
onSuccess: function(transport) {
|
||||
this._text = transport.responseText.strip();
|
||||
this.buildOptionList();
|
||||
}.bind(this),
|
||||
onFailure: this.onFailure
|
||||
});
|
||||
new Ajax.Request(this.options.loadTextURL, options);
|
||||
},
|
||||
|
||||
buildOptionList: function() {
|
||||
this._form.removeClassName(this.options.loadingClassName);
|
||||
this._collection = this._collection.map(function(entry) {
|
||||
return 2 === entry.length ? entry : [entry, entry].flatten();
|
||||
});
|
||||
var marker = ('value' in this.options) ? this.options.value : this._text;
|
||||
var textFound = this._collection.any(function(entry) {
|
||||
return entry[0] == marker;
|
||||
}.bind(this));
|
||||
this._controls.editor.update('');
|
||||
var option;
|
||||
this._collection.each(function(entry, index) {
|
||||
option = document.createElement('option');
|
||||
option.value = entry[0];
|
||||
option.selected = textFound ? entry[0] == marker : 0 == index;
|
||||
option.appendChild(document.createTextNode(entry[1]));
|
||||
this._controls.editor.appendChild(option);
|
||||
}.bind(this));
|
||||
this._controls.editor.disabled = false;
|
||||
Field.scrollFreeActivate(this._controls.editor);
|
||||
}
|
||||
});
|
||||
|
||||
//**** DEPRECATION LAYER FOR InPlace[Collection]Editor! ****
|
||||
//**** This only exists for a while, in order to let ****
|
||||
//**** users adapt to the new API. Read up on the new ****
|
||||
//**** API and convert your code to it ASAP! ****
|
||||
|
||||
Ajax.InPlaceEditor.prototype.initialize.dealWithDeprecatedOptions = function(options) {
|
||||
if (!options) return;
|
||||
function fallback(name, expr) {
|
||||
if (name in options || expr === undefined) return;
|
||||
options[name] = expr;
|
||||
};
|
||||
fallback('cancelControl', (options.cancelLink ? 'link' : (options.cancelButton ? 'button' :
|
||||
options.cancelLink == options.cancelButton == false ? false : undefined)));
|
||||
fallback('okControl', (options.okLink ? 'link' : (options.okButton ? 'button' :
|
||||
options.okLink == options.okButton == false ? false : undefined)));
|
||||
fallback('highlightColor', options.highlightcolor);
|
||||
fallback('highlightEndColor', options.highlightendcolor);
|
||||
};
|
||||
|
||||
Object.extend(Ajax.InPlaceEditor, {
|
||||
DefaultOptions: {
|
||||
ajaxOptions: { },
|
||||
autoRows: 3, // Use when multi-line w/ rows == 1
|
||||
cancelControl: 'link', // 'link'|'button'|false
|
||||
cancelText: 'cancel',
|
||||
clickToEditText: 'Click to edit',
|
||||
externalControl: null, // id|elt
|
||||
externalControlOnly: false,
|
||||
fieldPostCreation: 'activate', // 'activate'|'focus'|false
|
||||
formClassName: 'inplaceeditor-form',
|
||||
formId: null, // id|elt
|
||||
highlightColor: '#ffff99',
|
||||
highlightEndColor: '#ffffff',
|
||||
hoverClassName: '',
|
||||
htmlResponse: true,
|
||||
loadingClassName: 'inplaceeditor-loading',
|
||||
loadingText: 'Loading...',
|
||||
okControl: 'button', // 'link'|'button'|false
|
||||
okText: 'ok',
|
||||
paramName: 'value',
|
||||
rows: 1, // If 1 and multi-line, uses autoRows
|
||||
savingClassName: 'inplaceeditor-saving',
|
||||
savingText: 'Saving...',
|
||||
size: 0,
|
||||
stripLoadedTextTags: false,
|
||||
submitOnBlur: false,
|
||||
textAfterControls: '',
|
||||
textBeforeControls: '',
|
||||
textBetweenControls: ''
|
||||
},
|
||||
DefaultCallbacks: {
|
||||
callback: function(form) {
|
||||
return Form.serialize(form);
|
||||
},
|
||||
onComplete: function(transport, element) {
|
||||
// For backward compatibility, this one is bound to the IPE, and passes
|
||||
// the element directly. It was too often customized, so we don't break it.
|
||||
new Effect.Highlight(element, {
|
||||
startcolor: this.options.highlightColor, keepBackgroundImage: true });
|
||||
},
|
||||
onEnterEditMode: null,
|
||||
onEnterHover: function(ipe) {
|
||||
ipe.element.style.backgroundColor = ipe.options.highlightColor;
|
||||
if (ipe._effect)
|
||||
ipe._effect.cancel();
|
||||
},
|
||||
onFailure: function(transport, ipe) {
|
||||
alert('Error communication with the server: ' + transport.responseText.stripTags());
|
||||
},
|
||||
onFormCustomization: null, // Takes the IPE and its generated form, after editor, before controls.
|
||||
onLeaveEditMode: null,
|
||||
onLeaveHover: function(ipe) {
|
||||
ipe._effect = new Effect.Highlight(ipe.element, {
|
||||
startcolor: ipe.options.highlightColor, endcolor: ipe.options.highlightEndColor,
|
||||
restorecolor: ipe._originalBackground, keepBackgroundImage: true
|
||||
});
|
||||
}
|
||||
},
|
||||
Listeners: {
|
||||
click: 'enterEditMode',
|
||||
keydown: 'checkForEscapeOrReturn',
|
||||
mouseover: 'enterHover',
|
||||
mouseout: 'leaveHover'
|
||||
}
|
||||
});
|
||||
|
||||
Ajax.InPlaceCollectionEditor.DefaultOptions = {
|
||||
loadingCollectionText: 'Loading options...'
|
||||
};
|
||||
|
||||
// Delayed observer, like Form.Element.Observer,
|
||||
// but waits for delay after last key input
|
||||
// Ideal for live-search fields
|
||||
|
||||
Form.Element.DelayedObserver = Class.create({
|
||||
initialize: function(element, delay, callback) {
|
||||
this.delay = delay || 0.5;
|
||||
this.element = $(element);
|
||||
this.callback = callback;
|
||||
this.timer = null;
|
||||
this.lastValue = $F(this.element);
|
||||
Event.observe(this.element,'keyup',this.delayedListener.bindAsEventListener(this));
|
||||
},
|
||||
delayedListener: function(event) {
|
||||
if(this.lastValue == $F(this.element)) return;
|
||||
if(this.timer) clearTimeout(this.timer);
|
||||
this.timer = setTimeout(this.onTimerEvent.bind(this), this.delay * 1000);
|
||||
this.lastValue = $F(this.element);
|
||||
},
|
||||
onTimerEvent: function() {
|
||||
this.timer = null;
|
||||
this.callback(this.element, $F(this.element));
|
||||
}
|
||||
});
|
||||
Vendored
-973
@@ -1,973 +0,0 @@
|
||||
// Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// (c) 2005-2008 Sammi Williams (http://www.oriontransfer.co.nz, sammi@oriontransfer.co.nz)
|
||||
//
|
||||
// script.aculo.us is freely distributable under the terms of an MIT-style license.
|
||||
// For details, see the script.aculo.us web site: http://script.aculo.us/
|
||||
|
||||
if(Object.isUndefined(Effect))
|
||||
throw("dragdrop.js requires including script.aculo.us' effects.js library");
|
||||
|
||||
var Droppables = {
|
||||
drops: [],
|
||||
|
||||
remove: function(element) {
|
||||
this.drops = this.drops.reject(function(d) { return d.element==$(element) });
|
||||
},
|
||||
|
||||
add: function(element) {
|
||||
element = $(element);
|
||||
var options = Object.extend({
|
||||
greedy: true,
|
||||
hoverclass: null,
|
||||
tree: false
|
||||
}, arguments[1] || { });
|
||||
|
||||
// cache containers
|
||||
if(options.containment) {
|
||||
options._containers = [];
|
||||
var containment = options.containment;
|
||||
if(Object.isArray(containment)) {
|
||||
containment.each( function(c) { options._containers.push($(c)) });
|
||||
} else {
|
||||
options._containers.push($(containment));
|
||||
}
|
||||
}
|
||||
|
||||
if(options.accept) options.accept = [options.accept].flatten();
|
||||
|
||||
Element.makePositioned(element); // fix IE
|
||||
options.element = element;
|
||||
|
||||
this.drops.push(options);
|
||||
},
|
||||
|
||||
findDeepestChild: function(drops) {
|
||||
deepest = drops[0];
|
||||
|
||||
for (i = 1; i < drops.length; ++i)
|
||||
if (Element.isParent(drops[i].element, deepest.element))
|
||||
deepest = drops[i];
|
||||
|
||||
return deepest;
|
||||
},
|
||||
|
||||
isContained: function(element, drop) {
|
||||
var containmentNode;
|
||||
if(drop.tree) {
|
||||
containmentNode = element.treeNode;
|
||||
} else {
|
||||
containmentNode = element.parentNode;
|
||||
}
|
||||
return drop._containers.detect(function(c) { return containmentNode == c });
|
||||
},
|
||||
|
||||
isAffected: function(point, element, drop) {
|
||||
return (
|
||||
(drop.element!=element) &&
|
||||
((!drop._containers) ||
|
||||
this.isContained(element, drop)) &&
|
||||
((!drop.accept) ||
|
||||
(Element.classNames(element).detect(
|
||||
function(v) { return drop.accept.include(v) } ) )) &&
|
||||
Position.within(drop.element, point[0], point[1]) );
|
||||
},
|
||||
|
||||
deactivate: function(drop) {
|
||||
if(drop.hoverclass)
|
||||
Element.removeClassName(drop.element, drop.hoverclass);
|
||||
this.last_active = null;
|
||||
},
|
||||
|
||||
activate: function(drop) {
|
||||
if(drop.hoverclass)
|
||||
Element.addClassName(drop.element, drop.hoverclass);
|
||||
this.last_active = drop;
|
||||
},
|
||||
|
||||
show: function(point, element) {
|
||||
if(!this.drops.length) return;
|
||||
var drop, affected = [];
|
||||
|
||||
this.drops.each( function(drop) {
|
||||
if(Droppables.isAffected(point, element, drop))
|
||||
affected.push(drop);
|
||||
});
|
||||
|
||||
if(affected.length>0)
|
||||
drop = Droppables.findDeepestChild(affected);
|
||||
|
||||
if(this.last_active && this.last_active != drop) this.deactivate(this.last_active);
|
||||
if (drop) {
|
||||
Position.within(drop.element, point[0], point[1]);
|
||||
if(drop.onHover)
|
||||
drop.onHover(element, drop.element, Position.overlap(drop.overlap, drop.element));
|
||||
|
||||
if (drop != this.last_active) Droppables.activate(drop);
|
||||
}
|
||||
},
|
||||
|
||||
fire: function(event, element) {
|
||||
if(!this.last_active) return;
|
||||
Position.prepare();
|
||||
|
||||
if (this.isAffected([Event.pointerX(event), Event.pointerY(event)], element, this.last_active))
|
||||
if (this.last_active.onDrop) {
|
||||
this.last_active.onDrop(element, this.last_active.element, event);
|
||||
return true;
|
||||
}
|
||||
},
|
||||
|
||||
reset: function() {
|
||||
if(this.last_active)
|
||||
this.deactivate(this.last_active);
|
||||
}
|
||||
};
|
||||
|
||||
var Draggables = {
|
||||
drags: [],
|
||||
observers: [],
|
||||
|
||||
register: function(draggable) {
|
||||
if(this.drags.length == 0) {
|
||||
this.eventMouseUp = this.endDrag.bindAsEventListener(this);
|
||||
this.eventMouseMove = this.updateDrag.bindAsEventListener(this);
|
||||
this.eventKeypress = this.keyPress.bindAsEventListener(this);
|
||||
|
||||
Event.observe(document, "mouseup", this.eventMouseUp);
|
||||
Event.observe(document, "mousemove", this.eventMouseMove);
|
||||
Event.observe(document, "keypress", this.eventKeypress);
|
||||
}
|
||||
this.drags.push(draggable);
|
||||
},
|
||||
|
||||
unregister: function(draggable) {
|
||||
this.drags = this.drags.reject(function(d) { return d==draggable });
|
||||
if(this.drags.length == 0) {
|
||||
Event.stopObserving(document, "mouseup", this.eventMouseUp);
|
||||
Event.stopObserving(document, "mousemove", this.eventMouseMove);
|
||||
Event.stopObserving(document, "keypress", this.eventKeypress);
|
||||
}
|
||||
},
|
||||
|
||||
activate: function(draggable) {
|
||||
if(draggable.options.delay) {
|
||||
this._timeout = setTimeout(function() {
|
||||
Draggables._timeout = null;
|
||||
window.focus();
|
||||
Draggables.activeDraggable = draggable;
|
||||
}.bind(this), draggable.options.delay);
|
||||
} else {
|
||||
window.focus(); // allows keypress events if window isn't currently focused, fails for Safari
|
||||
this.activeDraggable = draggable;
|
||||
}
|
||||
},
|
||||
|
||||
deactivate: function() {
|
||||
this.activeDraggable = null;
|
||||
},
|
||||
|
||||
updateDrag: function(event) {
|
||||
if(!this.activeDraggable) return;
|
||||
var pointer = [Event.pointerX(event), Event.pointerY(event)];
|
||||
// Mozilla-based browsers fire successive mousemove events with
|
||||
// the same coordinates, prevent needless redrawing (moz bug?)
|
||||
if(this._lastPointer && (this._lastPointer.inspect() == pointer.inspect())) return;
|
||||
this._lastPointer = pointer;
|
||||
|
||||
this.activeDraggable.updateDrag(event, pointer);
|
||||
},
|
||||
|
||||
endDrag: function(event) {
|
||||
if(this._timeout) {
|
||||
clearTimeout(this._timeout);
|
||||
this._timeout = null;
|
||||
}
|
||||
if(!this.activeDraggable) return;
|
||||
this._lastPointer = null;
|
||||
this.activeDraggable.endDrag(event);
|
||||
this.activeDraggable = null;
|
||||
},
|
||||
|
||||
keyPress: function(event) {
|
||||
if(this.activeDraggable)
|
||||
this.activeDraggable.keyPress(event);
|
||||
},
|
||||
|
||||
addObserver: function(observer) {
|
||||
this.observers.push(observer);
|
||||
this._cacheObserverCallbacks();
|
||||
},
|
||||
|
||||
removeObserver: function(element) { // element instead of observer fixes mem leaks
|
||||
this.observers = this.observers.reject( function(o) { return o.element==element });
|
||||
this._cacheObserverCallbacks();
|
||||
},
|
||||
|
||||
notify: function(eventName, draggable, event) { // 'onStart', 'onEnd', 'onDrag'
|
||||
if(this[eventName+'Count'] > 0)
|
||||
this.observers.each( function(o) {
|
||||
if(o[eventName]) o[eventName](eventName, draggable, event);
|
||||
});
|
||||
if(draggable.options[eventName]) draggable.options[eventName](draggable, event);
|
||||
},
|
||||
|
||||
_cacheObserverCallbacks: function() {
|
||||
['onStart','onEnd','onDrag'].each( function(eventName) {
|
||||
Draggables[eventName+'Count'] = Draggables.observers.select(
|
||||
function(o) { return o[eventName]; }
|
||||
).length;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
var Draggable = Class.create({
|
||||
initialize: function(element) {
|
||||
var defaults = {
|
||||
handle: false,
|
||||
reverteffect: function(element, top_offset, left_offset) {
|
||||
var dur = Math.sqrt(Math.abs(top_offset^2)+Math.abs(left_offset^2))*0.02;
|
||||
new Effect.Move(element, { x: -left_offset, y: -top_offset, duration: dur,
|
||||
queue: {scope:'_draggable', position:'end'}
|
||||
});
|
||||
},
|
||||
endeffect: function(element) {
|
||||
var toOpacity = Object.isNumber(element._opacity) ? element._opacity : 1.0;
|
||||
new Effect.Opacity(element, {duration:0.2, from:0.7, to:toOpacity,
|
||||
queue: {scope:'_draggable', position:'end'},
|
||||
afterFinish: function(){
|
||||
Draggable._dragging[element] = false
|
||||
}
|
||||
});
|
||||
},
|
||||
zindex: 1000,
|
||||
revert: false,
|
||||
quiet: false,
|
||||
scroll: false,
|
||||
scrollSensitivity: 20,
|
||||
scrollSpeed: 15,
|
||||
snap: false, // false, or xy or [x,y] or function(x,y){ return [x,y] }
|
||||
delay: 0
|
||||
};
|
||||
|
||||
if(!arguments[1] || Object.isUndefined(arguments[1].endeffect))
|
||||
Object.extend(defaults, {
|
||||
starteffect: function(element) {
|
||||
element._opacity = Element.getOpacity(element);
|
||||
Draggable._dragging[element] = true;
|
||||
new Effect.Opacity(element, {duration:0.2, from:element._opacity, to:0.7});
|
||||
}
|
||||
});
|
||||
|
||||
var options = Object.extend(defaults, arguments[1] || { });
|
||||
|
||||
this.element = $(element);
|
||||
|
||||
if(options.handle && Object.isString(options.handle))
|
||||
this.handle = this.element.down('.'+options.handle, 0);
|
||||
|
||||
if(!this.handle) this.handle = $(options.handle);
|
||||
if(!this.handle) this.handle = this.element;
|
||||
|
||||
if(options.scroll && !options.scroll.scrollTo && !options.scroll.outerHTML) {
|
||||
options.scroll = $(options.scroll);
|
||||
this._isScrollChild = Element.childOf(this.element, options.scroll);
|
||||
}
|
||||
|
||||
Element.makePositioned(this.element); // fix IE
|
||||
|
||||
this.options = options;
|
||||
this.dragging = false;
|
||||
|
||||
this.eventMouseDown = this.initDrag.bindAsEventListener(this);
|
||||
Event.observe(this.handle, "mousedown", this.eventMouseDown);
|
||||
|
||||
Draggables.register(this);
|
||||
},
|
||||
|
||||
destroy: function() {
|
||||
Event.stopObserving(this.handle, "mousedown", this.eventMouseDown);
|
||||
Draggables.unregister(this);
|
||||
},
|
||||
|
||||
currentDelta: function() {
|
||||
return([
|
||||
parseInt(Element.getStyle(this.element,'left') || '0'),
|
||||
parseInt(Element.getStyle(this.element,'top') || '0')]);
|
||||
},
|
||||
|
||||
initDrag: function(event) {
|
||||
if(!Object.isUndefined(Draggable._dragging[this.element]) &&
|
||||
Draggable._dragging[this.element]) return;
|
||||
if(Event.isLeftClick(event)) {
|
||||
// abort on form elements, fixes a Firefox issue
|
||||
var src = Event.element(event);
|
||||
if((tag_name = src.tagName.toUpperCase()) && (
|
||||
tag_name=='INPUT' ||
|
||||
tag_name=='SELECT' ||
|
||||
tag_name=='OPTION' ||
|
||||
tag_name=='BUTTON' ||
|
||||
tag_name=='TEXTAREA')) return;
|
||||
|
||||
var pointer = [Event.pointerX(event), Event.pointerY(event)];
|
||||
var pos = Position.cumulativeOffset(this.element);
|
||||
this.offset = [0,1].map( function(i) { return (pointer[i] - pos[i]) });
|
||||
|
||||
Draggables.activate(this);
|
||||
Event.stop(event);
|
||||
}
|
||||
},
|
||||
|
||||
startDrag: function(event) {
|
||||
this.dragging = true;
|
||||
if(!this.delta)
|
||||
this.delta = this.currentDelta();
|
||||
|
||||
if(this.options.zindex) {
|
||||
this.originalZ = parseInt(Element.getStyle(this.element,'z-index') || 0);
|
||||
this.element.style.zIndex = this.options.zindex;
|
||||
}
|
||||
|
||||
if(this.options.ghosting) {
|
||||
this._clone = this.element.cloneNode(true);
|
||||
this._originallyAbsolute = (this.element.getStyle('position') == 'absolute');
|
||||
if (!this._originallyAbsolute)
|
||||
Position.absolutize(this.element);
|
||||
this.element.parentNode.insertBefore(this._clone, this.element);
|
||||
}
|
||||
|
||||
if(this.options.scroll) {
|
||||
if (this.options.scroll == window) {
|
||||
var where = this._getWindowScroll(this.options.scroll);
|
||||
this.originalScrollLeft = where.left;
|
||||
this.originalScrollTop = where.top;
|
||||
} else {
|
||||
this.originalScrollLeft = this.options.scroll.scrollLeft;
|
||||
this.originalScrollTop = this.options.scroll.scrollTop;
|
||||
}
|
||||
}
|
||||
|
||||
Draggables.notify('onStart', this, event);
|
||||
|
||||
if(this.options.starteffect) this.options.starteffect(this.element);
|
||||
},
|
||||
|
||||
updateDrag: function(event, pointer) {
|
||||
if(!this.dragging) this.startDrag(event);
|
||||
|
||||
if(!this.options.quiet){
|
||||
Position.prepare();
|
||||
Droppables.show(pointer, this.element);
|
||||
}
|
||||
|
||||
Draggables.notify('onDrag', this, event);
|
||||
|
||||
this.draw(pointer);
|
||||
if(this.options.change) this.options.change(this);
|
||||
|
||||
if(this.options.scroll) {
|
||||
this.stopScrolling();
|
||||
|
||||
var p;
|
||||
if (this.options.scroll == window) {
|
||||
with(this._getWindowScroll(this.options.scroll)) { p = [ left, top, left+width, top+height ]; }
|
||||
} else {
|
||||
p = Position.page(this.options.scroll);
|
||||
p[0] += this.options.scroll.scrollLeft + Position.deltaX;
|
||||
p[1] += this.options.scroll.scrollTop + Position.deltaY;
|
||||
p.push(p[0]+this.options.scroll.offsetWidth);
|
||||
p.push(p[1]+this.options.scroll.offsetHeight);
|
||||
}
|
||||
var speed = [0,0];
|
||||
if(pointer[0] < (p[0]+this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[0]+this.options.scrollSensitivity);
|
||||
if(pointer[1] < (p[1]+this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[1]+this.options.scrollSensitivity);
|
||||
if(pointer[0] > (p[2]-this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[2]-this.options.scrollSensitivity);
|
||||
if(pointer[1] > (p[3]-this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[3]-this.options.scrollSensitivity);
|
||||
this.startScrolling(speed);
|
||||
}
|
||||
|
||||
// fix AppleWebKit rendering
|
||||
if(Prototype.Browser.WebKit) window.scrollBy(0,0);
|
||||
|
||||
Event.stop(event);
|
||||
},
|
||||
|
||||
finishDrag: function(event, success) {
|
||||
this.dragging = false;
|
||||
|
||||
if(this.options.quiet){
|
||||
Position.prepare();
|
||||
var pointer = [Event.pointerX(event), Event.pointerY(event)];
|
||||
Droppables.show(pointer, this.element);
|
||||
}
|
||||
|
||||
if(this.options.ghosting) {
|
||||
if (!this._originallyAbsolute)
|
||||
Position.relativize(this.element);
|
||||
delete this._originallyAbsolute;
|
||||
Element.remove(this._clone);
|
||||
this._clone = null;
|
||||
}
|
||||
|
||||
var dropped = false;
|
||||
if(success) {
|
||||
dropped = Droppables.fire(event, this.element);
|
||||
if (!dropped) dropped = false;
|
||||
}
|
||||
if(dropped && this.options.onDropped) this.options.onDropped(this.element);
|
||||
Draggables.notify('onEnd', this, event);
|
||||
|
||||
var revert = this.options.revert;
|
||||
if(revert && Object.isFunction(revert)) revert = revert(this.element);
|
||||
|
||||
var d = this.currentDelta();
|
||||
if(revert && this.options.reverteffect) {
|
||||
if (dropped == 0 || revert != 'failure')
|
||||
this.options.reverteffect(this.element,
|
||||
d[1]-this.delta[1], d[0]-this.delta[0]);
|
||||
} else {
|
||||
this.delta = d;
|
||||
}
|
||||
|
||||
if(this.options.zindex)
|
||||
this.element.style.zIndex = this.originalZ;
|
||||
|
||||
if(this.options.endeffect)
|
||||
this.options.endeffect(this.element);
|
||||
|
||||
Draggables.deactivate(this);
|
||||
Droppables.reset();
|
||||
},
|
||||
|
||||
keyPress: function(event) {
|
||||
if(event.keyCode!=Event.KEY_ESC) return;
|
||||
this.finishDrag(event, false);
|
||||
Event.stop(event);
|
||||
},
|
||||
|
||||
endDrag: function(event) {
|
||||
if(!this.dragging) return;
|
||||
this.stopScrolling();
|
||||
this.finishDrag(event, true);
|
||||
Event.stop(event);
|
||||
},
|
||||
|
||||
draw: function(point) {
|
||||
var pos = Position.cumulativeOffset(this.element);
|
||||
if(this.options.ghosting) {
|
||||
var r = Position.realOffset(this.element);
|
||||
pos[0] += r[0] - Position.deltaX; pos[1] += r[1] - Position.deltaY;
|
||||
}
|
||||
|
||||
var d = this.currentDelta();
|
||||
pos[0] -= d[0]; pos[1] -= d[1];
|
||||
|
||||
if(this.options.scroll && (this.options.scroll != window && this._isScrollChild)) {
|
||||
pos[0] -= this.options.scroll.scrollLeft-this.originalScrollLeft;
|
||||
pos[1] -= this.options.scroll.scrollTop-this.originalScrollTop;
|
||||
}
|
||||
|
||||
var p = [0,1].map(function(i){
|
||||
return (point[i]-pos[i]-this.offset[i])
|
||||
}.bind(this));
|
||||
|
||||
if(this.options.snap) {
|
||||
if(Object.isFunction(this.options.snap)) {
|
||||
p = this.options.snap(p[0],p[1],this);
|
||||
} else {
|
||||
if(Object.isArray(this.options.snap)) {
|
||||
p = p.map( function(v, i) {
|
||||
return (v/this.options.snap[i]).round()*this.options.snap[i] }.bind(this));
|
||||
} else {
|
||||
p = p.map( function(v) {
|
||||
return (v/this.options.snap).round()*this.options.snap }.bind(this));
|
||||
}
|
||||
}}
|
||||
|
||||
var style = this.element.style;
|
||||
if((!this.options.constraint) || (this.options.constraint=='horizontal'))
|
||||
style.left = p[0] + "px";
|
||||
if((!this.options.constraint) || (this.options.constraint=='vertical'))
|
||||
style.top = p[1] + "px";
|
||||
|
||||
if(style.visibility=="hidden") style.visibility = ""; // fix gecko rendering
|
||||
},
|
||||
|
||||
stopScrolling: function() {
|
||||
if(this.scrollInterval) {
|
||||
clearInterval(this.scrollInterval);
|
||||
this.scrollInterval = null;
|
||||
Draggables._lastScrollPointer = null;
|
||||
}
|
||||
},
|
||||
|
||||
startScrolling: function(speed) {
|
||||
if(!(speed[0] || speed[1])) return;
|
||||
this.scrollSpeed = [speed[0]*this.options.scrollSpeed,speed[1]*this.options.scrollSpeed];
|
||||
this.lastScrolled = new Date();
|
||||
this.scrollInterval = setInterval(this.scroll.bind(this), 10);
|
||||
},
|
||||
|
||||
scroll: function() {
|
||||
var current = new Date();
|
||||
var delta = current - this.lastScrolled;
|
||||
this.lastScrolled = current;
|
||||
if(this.options.scroll == window) {
|
||||
with (this._getWindowScroll(this.options.scroll)) {
|
||||
if (this.scrollSpeed[0] || this.scrollSpeed[1]) {
|
||||
var d = delta / 1000;
|
||||
this.options.scroll.scrollTo( left + d*this.scrollSpeed[0], top + d*this.scrollSpeed[1] );
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.options.scroll.scrollLeft += this.scrollSpeed[0] * delta / 1000;
|
||||
this.options.scroll.scrollTop += this.scrollSpeed[1] * delta / 1000;
|
||||
}
|
||||
|
||||
Position.prepare();
|
||||
Droppables.show(Draggables._lastPointer, this.element);
|
||||
Draggables.notify('onDrag', this);
|
||||
if (this._isScrollChild) {
|
||||
Draggables._lastScrollPointer = Draggables._lastScrollPointer || $A(Draggables._lastPointer);
|
||||
Draggables._lastScrollPointer[0] += this.scrollSpeed[0] * delta / 1000;
|
||||
Draggables._lastScrollPointer[1] += this.scrollSpeed[1] * delta / 1000;
|
||||
if (Draggables._lastScrollPointer[0] < 0)
|
||||
Draggables._lastScrollPointer[0] = 0;
|
||||
if (Draggables._lastScrollPointer[1] < 0)
|
||||
Draggables._lastScrollPointer[1] = 0;
|
||||
this.draw(Draggables._lastScrollPointer);
|
||||
}
|
||||
|
||||
if(this.options.change) this.options.change(this);
|
||||
},
|
||||
|
||||
_getWindowScroll: function(w) {
|
||||
var T, L, W, H;
|
||||
with (w.document) {
|
||||
if (w.document.documentElement && documentElement.scrollTop) {
|
||||
T = documentElement.scrollTop;
|
||||
L = documentElement.scrollLeft;
|
||||
} else if (w.document.body) {
|
||||
T = body.scrollTop;
|
||||
L = body.scrollLeft;
|
||||
}
|
||||
if (w.innerWidth) {
|
||||
W = w.innerWidth;
|
||||
H = w.innerHeight;
|
||||
} else if (w.document.documentElement && documentElement.clientWidth) {
|
||||
W = documentElement.clientWidth;
|
||||
H = documentElement.clientHeight;
|
||||
} else {
|
||||
W = body.offsetWidth;
|
||||
H = body.offsetHeight;
|
||||
}
|
||||
}
|
||||
return { top: T, left: L, width: W, height: H };
|
||||
}
|
||||
});
|
||||
|
||||
Draggable._dragging = { };
|
||||
|
||||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
var SortableObserver = Class.create({
|
||||
initialize: function(element, observer) {
|
||||
this.element = $(element);
|
||||
this.observer = observer;
|
||||
this.lastValue = Sortable.serialize(this.element);
|
||||
},
|
||||
|
||||
onStart: function() {
|
||||
this.lastValue = Sortable.serialize(this.element);
|
||||
},
|
||||
|
||||
onEnd: function() {
|
||||
Sortable.unmark();
|
||||
if(this.lastValue != Sortable.serialize(this.element))
|
||||
this.observer(this.element)
|
||||
}
|
||||
});
|
||||
|
||||
var Sortable = {
|
||||
SERIALIZE_RULE: /^[^_\-](?:[A-Za-z0-9\-\_]*)[_](.*)$/,
|
||||
|
||||
sortables: { },
|
||||
|
||||
_findRootElement: function(element) {
|
||||
while (element.tagName.toUpperCase() != "BODY") {
|
||||
if(element.id && Sortable.sortables[element.id]) return element;
|
||||
element = element.parentNode;
|
||||
}
|
||||
},
|
||||
|
||||
options: function(element) {
|
||||
element = Sortable._findRootElement($(element));
|
||||
if(!element) return;
|
||||
return Sortable.sortables[element.id];
|
||||
},
|
||||
|
||||
destroy: function(element){
|
||||
element = $(element);
|
||||
var s = Sortable.sortables[element.id];
|
||||
|
||||
if(s) {
|
||||
Draggables.removeObserver(s.element);
|
||||
s.droppables.each(function(d){ Droppables.remove(d) });
|
||||
s.draggables.invoke('destroy');
|
||||
|
||||
delete Sortable.sortables[s.element.id];
|
||||
}
|
||||
},
|
||||
|
||||
create: function(element) {
|
||||
element = $(element);
|
||||
var options = Object.extend({
|
||||
element: element,
|
||||
tag: 'li', // assumes li children, override with tag: 'tagname'
|
||||
dropOnEmpty: false,
|
||||
tree: false,
|
||||
treeTag: 'ul',
|
||||
overlap: 'vertical', // one of 'vertical', 'horizontal'
|
||||
constraint: 'vertical', // one of 'vertical', 'horizontal', false
|
||||
containment: element, // also takes array of elements (or id's); or false
|
||||
handle: false, // or a CSS class
|
||||
only: false,
|
||||
delay: 0,
|
||||
hoverclass: null,
|
||||
ghosting: false,
|
||||
quiet: false,
|
||||
scroll: false,
|
||||
scrollSensitivity: 20,
|
||||
scrollSpeed: 15,
|
||||
format: this.SERIALIZE_RULE,
|
||||
|
||||
// these take arrays of elements or ids and can be
|
||||
// used for better initialization performance
|
||||
elements: false,
|
||||
handles: false,
|
||||
|
||||
onChange: Prototype.emptyFunction,
|
||||
onUpdate: Prototype.emptyFunction
|
||||
}, arguments[1] || { });
|
||||
|
||||
// clear any old sortable with same element
|
||||
this.destroy(element);
|
||||
|
||||
// build options for the draggables
|
||||
var options_for_draggable = {
|
||||
revert: true,
|
||||
quiet: options.quiet,
|
||||
scroll: options.scroll,
|
||||
scrollSpeed: options.scrollSpeed,
|
||||
scrollSensitivity: options.scrollSensitivity,
|
||||
delay: options.delay,
|
||||
ghosting: options.ghosting,
|
||||
constraint: options.constraint,
|
||||
handle: options.handle };
|
||||
|
||||
if(options.starteffect)
|
||||
options_for_draggable.starteffect = options.starteffect;
|
||||
|
||||
if(options.reverteffect)
|
||||
options_for_draggable.reverteffect = options.reverteffect;
|
||||
else
|
||||
if(options.ghosting) options_for_draggable.reverteffect = function(element) {
|
||||
element.style.top = 0;
|
||||
element.style.left = 0;
|
||||
};
|
||||
|
||||
if(options.endeffect)
|
||||
options_for_draggable.endeffect = options.endeffect;
|
||||
|
||||
if(options.zindex)
|
||||
options_for_draggable.zindex = options.zindex;
|
||||
|
||||
// build options for the droppables
|
||||
var options_for_droppable = {
|
||||
overlap: options.overlap,
|
||||
containment: options.containment,
|
||||
tree: options.tree,
|
||||
hoverclass: options.hoverclass,
|
||||
onHover: Sortable.onHover
|
||||
};
|
||||
|
||||
var options_for_tree = {
|
||||
onHover: Sortable.onEmptyHover,
|
||||
overlap: options.overlap,
|
||||
containment: options.containment,
|
||||
hoverclass: options.hoverclass
|
||||
};
|
||||
|
||||
// fix for gecko engine
|
||||
Element.cleanWhitespace(element);
|
||||
|
||||
options.draggables = [];
|
||||
options.droppables = [];
|
||||
|
||||
// drop on empty handling
|
||||
if(options.dropOnEmpty || options.tree) {
|
||||
Droppables.add(element, options_for_tree);
|
||||
options.droppables.push(element);
|
||||
}
|
||||
|
||||
(options.elements || this.findElements(element, options) || []).each( function(e,i) {
|
||||
var handle = options.handles ? $(options.handles[i]) :
|
||||
(options.handle ? $(e).select('.' + options.handle)[0] : e);
|
||||
options.draggables.push(
|
||||
new Draggable(e, Object.extend(options_for_draggable, { handle: handle })));
|
||||
Droppables.add(e, options_for_droppable);
|
||||
if(options.tree) e.treeNode = element;
|
||||
options.droppables.push(e);
|
||||
});
|
||||
|
||||
if(options.tree) {
|
||||
(Sortable.findTreeElements(element, options) || []).each( function(e) {
|
||||
Droppables.add(e, options_for_tree);
|
||||
e.treeNode = element;
|
||||
options.droppables.push(e);
|
||||
});
|
||||
}
|
||||
|
||||
// keep reference
|
||||
this.sortables[element.id] = options;
|
||||
|
||||
// for onupdate
|
||||
Draggables.addObserver(new SortableObserver(element, options.onUpdate));
|
||||
|
||||
},
|
||||
|
||||
// return all suitable-for-sortable elements in a guaranteed order
|
||||
findElements: function(element, options) {
|
||||
return Element.findChildren(
|
||||
element, options.only, options.tree ? true : false, options.tag);
|
||||
},
|
||||
|
||||
findTreeElements: function(element, options) {
|
||||
return Element.findChildren(
|
||||
element, options.only, options.tree ? true : false, options.treeTag);
|
||||
},
|
||||
|
||||
onHover: function(element, dropon, overlap) {
|
||||
if(Element.isParent(dropon, element)) return;
|
||||
|
||||
if(overlap > .33 && overlap < .66 && Sortable.options(dropon).tree) {
|
||||
return;
|
||||
} else if(overlap>0.5) {
|
||||
Sortable.mark(dropon, 'before');
|
||||
if(dropon.previousSibling != element) {
|
||||
var oldParentNode = element.parentNode;
|
||||
element.style.visibility = "hidden"; // fix gecko rendering
|
||||
dropon.parentNode.insertBefore(element, dropon);
|
||||
if(dropon.parentNode!=oldParentNode)
|
||||
Sortable.options(oldParentNode).onChange(element);
|
||||
Sortable.options(dropon.parentNode).onChange(element);
|
||||
}
|
||||
} else {
|
||||
Sortable.mark(dropon, 'after');
|
||||
var nextElement = dropon.nextSibling || null;
|
||||
if(nextElement != element) {
|
||||
var oldParentNode = element.parentNode;
|
||||
element.style.visibility = "hidden"; // fix gecko rendering
|
||||
dropon.parentNode.insertBefore(element, nextElement);
|
||||
if(dropon.parentNode!=oldParentNode)
|
||||
Sortable.options(oldParentNode).onChange(element);
|
||||
Sortable.options(dropon.parentNode).onChange(element);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
onEmptyHover: function(element, dropon, overlap) {
|
||||
var oldParentNode = element.parentNode;
|
||||
var droponOptions = Sortable.options(dropon);
|
||||
|
||||
if(!Element.isParent(dropon, element)) {
|
||||
var index;
|
||||
|
||||
var children = Sortable.findElements(dropon, {tag: droponOptions.tag, only: droponOptions.only});
|
||||
var child = null;
|
||||
|
||||
if(children) {
|
||||
var offset = Element.offsetSize(dropon, droponOptions.overlap) * (1.0 - overlap);
|
||||
|
||||
for (index = 0; index < children.length; index += 1) {
|
||||
if (offset - Element.offsetSize (children[index], droponOptions.overlap) >= 0) {
|
||||
offset -= Element.offsetSize (children[index], droponOptions.overlap);
|
||||
} else if (offset - (Element.offsetSize (children[index], droponOptions.overlap) / 2) >= 0) {
|
||||
child = index + 1 < children.length ? children[index + 1] : null;
|
||||
break;
|
||||
} else {
|
||||
child = children[index];
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
dropon.insertBefore(element, child);
|
||||
|
||||
Sortable.options(oldParentNode).onChange(element);
|
||||
droponOptions.onChange(element);
|
||||
}
|
||||
},
|
||||
|
||||
unmark: function() {
|
||||
if(Sortable._marker) Sortable._marker.hide();
|
||||
},
|
||||
|
||||
mark: function(dropon, position) {
|
||||
// mark on ghosting only
|
||||
var sortable = Sortable.options(dropon.parentNode);
|
||||
if(sortable && !sortable.ghosting) return;
|
||||
|
||||
if(!Sortable._marker) {
|
||||
Sortable._marker =
|
||||
($('dropmarker') || Element.extend(document.createElement('DIV'))).
|
||||
hide().addClassName('dropmarker').setStyle({position:'absolute'});
|
||||
document.getElementsByTagName("body").item(0).appendChild(Sortable._marker);
|
||||
}
|
||||
var offsets = Position.cumulativeOffset(dropon);
|
||||
Sortable._marker.setStyle({left: offsets[0]+'px', top: offsets[1] + 'px'});
|
||||
|
||||
if(position=='after')
|
||||
if(sortable.overlap == 'horizontal')
|
||||
Sortable._marker.setStyle({left: (offsets[0]+dropon.clientWidth) + 'px'});
|
||||
else
|
||||
Sortable._marker.setStyle({top: (offsets[1]+dropon.clientHeight) + 'px'});
|
||||
|
||||
Sortable._marker.show();
|
||||
},
|
||||
|
||||
_tree: function(element, options, parent) {
|
||||
var children = Sortable.findElements(element, options) || [];
|
||||
|
||||
for (var i = 0; i < children.length; ++i) {
|
||||
var match = children[i].id.match(options.format);
|
||||
|
||||
if (!match) continue;
|
||||
|
||||
var child = {
|
||||
id: encodeURIComponent(match ? match[1] : null),
|
||||
element: element,
|
||||
parent: parent,
|
||||
children: [],
|
||||
position: parent.children.length,
|
||||
container: $(children[i]).down(options.treeTag)
|
||||
};
|
||||
|
||||
/* Get the element containing the children and recurse over it */
|
||||
if (child.container)
|
||||
this._tree(child.container, options, child);
|
||||
|
||||
parent.children.push (child);
|
||||
}
|
||||
|
||||
return parent;
|
||||
},
|
||||
|
||||
tree: function(element) {
|
||||
element = $(element);
|
||||
var sortableOptions = this.options(element);
|
||||
var options = Object.extend({
|
||||
tag: sortableOptions.tag,
|
||||
treeTag: sortableOptions.treeTag,
|
||||
only: sortableOptions.only,
|
||||
name: element.id,
|
||||
format: sortableOptions.format
|
||||
}, arguments[1] || { });
|
||||
|
||||
var root = {
|
||||
id: null,
|
||||
parent: null,
|
||||
children: [],
|
||||
container: element,
|
||||
position: 0
|
||||
};
|
||||
|
||||
return Sortable._tree(element, options, root);
|
||||
},
|
||||
|
||||
/* Construct a [i] index for a particular node */
|
||||
_constructIndex: function(node) {
|
||||
var index = '';
|
||||
do {
|
||||
if (node.id) index = '[' + node.position + ']' + index;
|
||||
} while ((node = node.parent) != null);
|
||||
return index;
|
||||
},
|
||||
|
||||
sequence: function(element) {
|
||||
element = $(element);
|
||||
var options = Object.extend(this.options(element), arguments[1] || { });
|
||||
|
||||
return $(this.findElements(element, options) || []).map( function(item) {
|
||||
return item.id.match(options.format) ? item.id.match(options.format)[1] : '';
|
||||
});
|
||||
},
|
||||
|
||||
setSequence: function(element, new_sequence) {
|
||||
element = $(element);
|
||||
var options = Object.extend(this.options(element), arguments[2] || { });
|
||||
|
||||
var nodeMap = { };
|
||||
this.findElements(element, options).each( function(n) {
|
||||
if (n.id.match(options.format))
|
||||
nodeMap[n.id.match(options.format)[1]] = [n, n.parentNode];
|
||||
n.parentNode.removeChild(n);
|
||||
});
|
||||
|
||||
new_sequence.each(function(ident) {
|
||||
var n = nodeMap[ident];
|
||||
if (n) {
|
||||
n[1].appendChild(n[0]);
|
||||
delete nodeMap[ident];
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
serialize: function(element) {
|
||||
element = $(element);
|
||||
var options = Object.extend(Sortable.options(element), arguments[1] || { });
|
||||
var name = encodeURIComponent(
|
||||
(arguments[1] && arguments[1].name) ? arguments[1].name : element.id);
|
||||
|
||||
if (options.tree) {
|
||||
return Sortable.tree(element, arguments[1]).children.map( function (item) {
|
||||
return [name + Sortable._constructIndex(item) + "[id]=" +
|
||||
encodeURIComponent(item.id)].concat(item.children.map(arguments.callee));
|
||||
}).flatten().join('&');
|
||||
} else {
|
||||
return Sortable.sequence(element, arguments[1]).map( function(item) {
|
||||
return name + "[]=" + encodeURIComponent(item);
|
||||
}).join('&');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Returns true if child is contained within element
|
||||
Element.isParent = function(child, element) {
|
||||
if (!child.parentNode || child == element) return false;
|
||||
if (child.parentNode == element) return true;
|
||||
return Element.isParent(child.parentNode, element);
|
||||
};
|
||||
|
||||
Element.findChildren = function(element, only, recursive, tagName) {
|
||||
if(!element.hasChildNodes()) return null;
|
||||
tagName = tagName.toUpperCase();
|
||||
if(only) only = [only].flatten();
|
||||
var elements = [];
|
||||
$A(element.childNodes).each( function(e) {
|
||||
if(e.tagName && e.tagName.toUpperCase()==tagName &&
|
||||
(!only || (Element.classNames(e).detect(function(v) { return only.include(v) }))))
|
||||
elements.push(e);
|
||||
if(recursive) {
|
||||
var grandchildren = Element.findChildren(e, only, recursive, tagName);
|
||||
if(grandchildren) elements.push(grandchildren);
|
||||
}
|
||||
});
|
||||
|
||||
return (elements.length>0 ? elements.flatten() : []);
|
||||
};
|
||||
|
||||
Element.offsetSize = function (element, type) {
|
||||
return element['offset' + ((type=='vertical' || type=='height') ? 'Height' : 'Width')];
|
||||
};
|
||||
Vendored
-1128
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Vendored
-6082
File diff suppressed because it is too large
Load Diff
@@ -1,202 +0,0 @@
|
||||
(function() {
|
||||
Ajax.Responders.register({
|
||||
onCreate: function(request) {
|
||||
var token = $$('meta[name=csrf-token]')[0];
|
||||
if (token) {
|
||||
if (!request.options.requestHeaders) request.options.requestHeaders = {};
|
||||
request.options.requestHeaders['X-CSRF-Token'] = token.readAttribute('content');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Technique from Juriy Zaytsev
|
||||
// http://thinkweb2.com/projects/prototype/detecting-event-support-without-browser-sniffing/
|
||||
function isEventSupported(eventName) {
|
||||
var el = document.createElement('div');
|
||||
eventName = 'on' + eventName;
|
||||
var isSupported = (eventName in el);
|
||||
if (!isSupported) {
|
||||
el.setAttribute(eventName, 'return;');
|
||||
isSupported = typeof el[eventName] == 'function';
|
||||
}
|
||||
el = null;
|
||||
return isSupported;
|
||||
}
|
||||
|
||||
function isForm(element) {
|
||||
return Object.isElement(element) && element.nodeName.toUpperCase() == 'FORM';
|
||||
}
|
||||
|
||||
function isInput(element) {
|
||||
if (Object.isElement(element)) {
|
||||
var name = element.nodeName.toUpperCase();
|
||||
return name == 'INPUT' || name == 'SELECT' || name == 'TEXTAREA';
|
||||
}
|
||||
else return false;
|
||||
}
|
||||
|
||||
var submitBubbles = isEventSupported('submit'),
|
||||
changeBubbles = isEventSupported('change');
|
||||
|
||||
if (!submitBubbles || !changeBubbles) {
|
||||
// augment the Event.Handler class to observe custom events when needed
|
||||
Event.Handler.prototype.initialize = Event.Handler.prototype.initialize.wrap(
|
||||
function(init, element, eventName, selector, callback) {
|
||||
init(element, eventName, selector, callback);
|
||||
// is the handler being attached to an element that doesn't support this event?
|
||||
if ( (!submitBubbles && this.eventName == 'submit' && !isForm(this.element)) ||
|
||||
(!changeBubbles && this.eventName == 'change' && !isInput(this.element)) ) {
|
||||
// "submit" => "emulated:submit"
|
||||
this.eventName = 'emulated:' + this.eventName;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
if (!submitBubbles) {
|
||||
// discover forms on the page by observing focus events which always bubble
|
||||
document.on('focusin', 'form', function(focusEvent, form) {
|
||||
// special handler for the real "submit" event (one-time operation)
|
||||
if (!form.retrieve('emulated:submit')) {
|
||||
form.on('submit', function(submitEvent) {
|
||||
var emulated = form.fire('emulated:submit', submitEvent, true);
|
||||
// if custom event received preventDefault, cancel the real one too
|
||||
if (emulated.returnValue === false) submitEvent.preventDefault();
|
||||
});
|
||||
form.store('emulated:submit', true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (!changeBubbles) {
|
||||
// discover form inputs on the page
|
||||
document.on('focusin', 'input, select, textarea', function(focusEvent, input) {
|
||||
// special handler for real "change" events
|
||||
if (!input.retrieve('emulated:change')) {
|
||||
input.on('change', function(changeEvent) {
|
||||
input.fire('emulated:change', changeEvent, true);
|
||||
});
|
||||
input.store('emulated:change', true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function handleRemote(element) {
|
||||
var method, url, params;
|
||||
|
||||
var event = element.fire("ajax:before");
|
||||
if (event.stopped) return false;
|
||||
|
||||
if (element.tagName.toLowerCase() === 'form') {
|
||||
method = element.readAttribute('method') || 'post';
|
||||
url = element.readAttribute('action');
|
||||
// serialize the form with respect to the submit button that was pressed
|
||||
params = element.serialize({ submit: element.retrieve('rails:submit-button') });
|
||||
// clear the pressed submit button information
|
||||
element.store('rails:submit-button', null);
|
||||
} else {
|
||||
method = element.readAttribute('data-method') || 'get';
|
||||
url = element.readAttribute('href');
|
||||
params = {};
|
||||
}
|
||||
|
||||
new Ajax.Request(url, {
|
||||
method: method,
|
||||
parameters: params,
|
||||
evalScripts: true,
|
||||
|
||||
onCreate: function(response) { element.fire("ajax:create", response); },
|
||||
onComplete: function(response) { element.fire("ajax:complete", response); },
|
||||
onSuccess: function(response) { element.fire("ajax:success", response); },
|
||||
onFailure: function(response) { element.fire("ajax:failure", response); }
|
||||
});
|
||||
|
||||
element.fire("ajax:after");
|
||||
}
|
||||
|
||||
function insertHiddenField(form, name, value) {
|
||||
form.insert(new Element('input', { type: 'hidden', name: name, value: value }));
|
||||
}
|
||||
|
||||
function handleMethod(element) {
|
||||
var method = element.readAttribute('data-method'),
|
||||
url = element.readAttribute('href'),
|
||||
csrf_param = $$('meta[name=csrf-param]')[0],
|
||||
csrf_token = $$('meta[name=csrf-token]')[0];
|
||||
|
||||
var form = new Element('form', { method: "POST", action: url, style: "display: none;" });
|
||||
$(element.parentNode).insert(form);
|
||||
|
||||
if (method !== 'post') {
|
||||
insertHiddenField(form, '_method', method);
|
||||
}
|
||||
|
||||
if (csrf_param) {
|
||||
insertHiddenField(form, csrf_param.readAttribute('content'), csrf_token.readAttribute('content'));
|
||||
}
|
||||
|
||||
form.submit();
|
||||
}
|
||||
|
||||
function disableFormElements(form) {
|
||||
form.select('input[type=submit][data-disable-with]').each(function(input) {
|
||||
input.store('rails:original-value', input.getValue());
|
||||
input.setValue(input.readAttribute('data-disable-with')).disable();
|
||||
});
|
||||
}
|
||||
|
||||
function enableFormElements(form) {
|
||||
form.select('input[type=submit][data-disable-with]').each(function(input) {
|
||||
input.setValue(input.retrieve('rails:original-value')).enable();
|
||||
});
|
||||
}
|
||||
|
||||
function allowAction(element) {
|
||||
var message = element.readAttribute('data-confirm');
|
||||
return !message || confirm(message);
|
||||
}
|
||||
|
||||
document.on('click', 'a[data-confirm], a[data-remote], a[data-method]', function(event, link) {
|
||||
if (!allowAction(link)) {
|
||||
event.stop();
|
||||
return false;
|
||||
}
|
||||
|
||||
if (link.readAttribute('data-remote')) {
|
||||
handleRemote(link);
|
||||
event.stop();
|
||||
} else if (link.readAttribute('data-method')) {
|
||||
handleMethod(link);
|
||||
event.stop();
|
||||
}
|
||||
});
|
||||
|
||||
document.on("click", "form input[type=submit], form button[type=submit], form button:not([type])", function(event, button) {
|
||||
// register the pressed submit button
|
||||
event.findElement('form').store('rails:submit-button', button.name || false);
|
||||
});
|
||||
|
||||
document.on("submit", function(event) {
|
||||
var form = event.findElement();
|
||||
|
||||
if (!allowAction(form)) {
|
||||
event.stop();
|
||||
return false;
|
||||
}
|
||||
|
||||
if (form.readAttribute('data-remote')) {
|
||||
handleRemote(form);
|
||||
event.stop();
|
||||
} else {
|
||||
disableFormElements(form);
|
||||
}
|
||||
});
|
||||
|
||||
document.on('ajax:create', 'form', function(event, form) {
|
||||
if (form == event.findElement()) disableFormElements(form);
|
||||
});
|
||||
|
||||
document.on('ajax:complete', 'form', function(event, form) {
|
||||
if (form == event.findElement()) enableFormElements(form);
|
||||
});
|
||||
})();
|
||||
@@ -1,35 +1,35 @@
|
||||
Event.observe(window,'load',function() {
|
||||
$(document).ready(function() {
|
||||
/*
|
||||
If we're viewing a tag or branch, don't display it in the
|
||||
revision box
|
||||
*/
|
||||
var branch_selected = $('branch') && $('rev').getValue() == $('branch').getValue();
|
||||
var tag_selected = $('tag') && $('rev').getValue() == $('tag').getValue();
|
||||
var branch_selected = $('#branch').length > 0 && $('#rev').val() == $('#branch').val();
|
||||
var tag_selected = $('#tag').length > 0 && $('#rev').val() == $('#tag').val();
|
||||
if (branch_selected || tag_selected) {
|
||||
$('rev').setValue('');
|
||||
$('#rev').val('');
|
||||
}
|
||||
|
||||
/*
|
||||
Copy the branch/tag value into the revision box, then disable
|
||||
the dropdowns before submitting the form
|
||||
*/
|
||||
$$('#branch,#tag').each(function(e) {
|
||||
e.observe('change',function(e) {
|
||||
$('rev').setValue(e.element().getValue());
|
||||
$$('#branch,#tag').invoke('disable');
|
||||
e.element().parentNode.submit();
|
||||
$$('#branch,#tag').invoke('enable');
|
||||
$('#branch,#tag').each(function() {
|
||||
$(this).change(function() {
|
||||
$('#rev').val($(this).val());
|
||||
$('#branch,#tag').attr('disabled', true);
|
||||
$(this).parent().submit();
|
||||
$('#branch,#tag').removeAttr('disabled');
|
||||
});
|
||||
});
|
||||
|
||||
/*
|
||||
Disable the branch/tag dropdowns before submitting the revision form
|
||||
*/
|
||||
$('rev').observe('keydown', function(e) {
|
||||
$('#rev').keydown(function(e) {
|
||||
if (e.keyCode == 13) {
|
||||
$$('#branch,#tag').invoke('disable');
|
||||
e.element().parentNode.submit();
|
||||
$$('#branch,#tag').invoke('enable');
|
||||
$('#branch,#tag').attr('disabled', true);
|
||||
$(this).parent().submit();
|
||||
$('#branch,#tag').removeAttr('disabled');
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
@@ -5,12 +5,12 @@ function drawRevisionGraph(holder, commits_hash, graph_space) {
|
||||
var XSTEP = 20,
|
||||
CIRCLE_INROW_OFFSET = 10;
|
||||
|
||||
var commits_by_scmid = $H(commits_hash),
|
||||
commits = commits_by_scmid.values();
|
||||
var commits_by_scmid = commits_hash,
|
||||
commits = $.map(commits_by_scmid, function(val,i){return val;});
|
||||
|
||||
var max_rdmid = commits.length - 1;
|
||||
|
||||
var commit_table_rows = $$('table.changesets tr.changeset');
|
||||
var commit_table_rows = $('table.changesets tr.changeset');
|
||||
|
||||
// create graph
|
||||
if(revisionGraph != null)
|
||||
@@ -21,10 +21,10 @@ function drawRevisionGraph(holder, commits_hash, graph_space) {
|
||||
var top = revisionGraph.set();
|
||||
|
||||
// init dimensions
|
||||
var graph_x_offset = Element.select(commit_table_rows.first(),'td').first().getLayout().get('left') - $(holder).getLayout().get('left'),
|
||||
graph_y_offset = $(holder).getLayout().get('top'),
|
||||
var graph_x_offset = commit_table_rows.first().find('td').first().position().left - $(holder).position().left,
|
||||
graph_y_offset = $(holder).position().top,
|
||||
graph_right_side = graph_x_offset + (graph_space + 1) * XSTEP,
|
||||
graph_bottom = commit_table_rows.last().getLayout().get('top') + commit_table_rows.last().getLayout().get('height') - graph_y_offset;
|
||||
graph_bottom = commit_table_rows.last().position().top + commit_table_rows.last().height() - graph_y_offset;
|
||||
|
||||
revisionGraph.setSize(graph_right_side, graph_bottom);
|
||||
|
||||
@@ -40,9 +40,9 @@ function drawRevisionGraph(holder, commits_hash, graph_space) {
|
||||
var path, title;
|
||||
var revision_dot_overlay;
|
||||
|
||||
commits.each(function(commit) {
|
||||
$.each(commits, function(index, commit) {
|
||||
|
||||
y = commit_table_rows[max_rdmid - commit.rdmid].getLayout().get('top') - graph_y_offset + CIRCLE_INROW_OFFSET;
|
||||
y = commit_table_rows.eq(max_rdmid - commit.rdmid).position().top - graph_y_offset + CIRCLE_INROW_OFFSET;
|
||||
x = graph_x_offset + XSTEP / 2 + XSTEP * commit.space;
|
||||
|
||||
revisionGraph.circle(x, y, 3)
|
||||
@@ -52,11 +52,11 @@ function drawRevisionGraph(holder, commits_hash, graph_space) {
|
||||
}).toFront();
|
||||
|
||||
// paths to parents
|
||||
commit.parent_scmids.each(function(parent_scmid) {
|
||||
parent_commit = commits_by_scmid.get(parent_scmid);
|
||||
$.each(commit.parent_scmids, function(index, parent_scmid) {
|
||||
parent_commit = commits_by_scmid[parent_scmid];
|
||||
|
||||
if (parent_commit) {
|
||||
parent_y = commit_table_rows[max_rdmid - parent_commit.rdmid].getLayout().get('top') - graph_y_offset + CIRCLE_INROW_OFFSET;
|
||||
parent_y = commit_table_rows.eq(max_rdmid - parent_commit.rdmid).position().top - graph_y_offset + CIRCLE_INROW_OFFSET;
|
||||
parent_x = graph_x_offset + XSTEP / 2 + XSTEP * parent_commit.space;
|
||||
|
||||
if (parent_commit.space == commit.space) {
|
||||
|
||||
@@ -72,11 +72,12 @@ function moveOptionDown(theSel) {
|
||||
}
|
||||
}
|
||||
|
||||
// OK
|
||||
function selectAllOptions(id)
|
||||
{
|
||||
var select = $(id);
|
||||
var select = $('#'+id);/*
|
||||
for (var i=0; i<select.options.length; i++) {
|
||||
select.options[i].selected = true;
|
||||
}
|
||||
}*/
|
||||
select.children('option').attr('selected', true);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user