var target = $(this),
mainelement = target.closest('[data-inplaceeditable]');
- var add_spinner = function(element) {
+ var addSpinner = function(element) {
element.addClass('updating');
var spinner = element.find('img.spinner');
if (spinner.length) {
spinner.show();
} else {
- spinner = $('<img/>').attr('src', url.imageUrl('i/loading_small')).
- addClass('spinner').addClass('iconsmall');
+ spinner = $('<img/>')
+ .attr('src', url.imageUrl('i/loading_small'))
+ .addClass('spinner').addClass('smallicon')
+ ;
element.append(spinner);
}
};
- var remove_spinner = function(element) {
+ var removeSpinner = function(element) {
element.removeClass('updating');
element.find('img.spinner').hide();
};
- var update_value = function(mainelement, value) {
- add_spinner(mainelement);
- var promises = ajax.call([{
- methodname: 'core_update_inplace_editable',
- args: { itemid : mainelement.attr('data-itemid'),
- component : mainelement.attr('data-component') ,
- itemtype : mainelement.attr('data-itemtype') ,
- value : value }
- }], true);
-
- $.when.apply($, promises)
- .done( function(data) {
- var oldvalue = mainelement.attr('data-value');
- templates.render('core/inplace_editable', data).done(function(html, js) {
- var newelement = $(html);
- templates.replaceNode(mainelement, newelement, js);
- newelement.find('[data-inplaceeditablelink]').focus();
- newelement.trigger({type: 'updated', ajaxreturn: data, oldvalue: oldvalue});
- });
- }).fail(function(ex) {
- var e = $.Event('updatefailed', { exception: ex, newvalue: value });
- remove_spinner(mainelement);
- mainelement.trigger(e);
- if (!e.isDefaultPrevented()) {
- notification.exception(ex);
+ var updateValue = function(mainelement, value) {
+ addSpinner(mainelement);
+ ajax
+ .call([{
+ methodname: 'core_update_inplace_editable',
+ args: {
+ itemid: mainelement.attr('data-itemid'),
+ component: mainelement.attr('data-component'),
+ itemtype: mainelement.attr('data-itemtype'),
+ value: value
+ },
+ done: function(data) {
+ var oldvalue = mainelement.attr('data-value');
+ templates.render('core/inplace_editable', data).done(function(html, js) {
+ var newelement = $(html);
+ templates.replaceNode(mainelement, newelement, js);
+ newelement.find('[data-inplaceeditablelink]').focus();
+ newelement.trigger({type: 'updated', ajaxreturn: data, oldvalue: oldvalue});
+ });
+ },
+ fail: function(ex) {
+ var e = $.Event('updatefailed', {
+ exception: ex,
+ newvalue: value
+ });
+ removeSpinner(mainelement);
+ mainelement.trigger(e);
+ if (!e.isDefaultPrevented()) {
+ notification.exception(ex);
+ }
}
- });
+ }], true);
};
- var turn_editing_off = function(el) {
+ var turnEditingOff = function(el) {
el.find('input').off();
el.find('select').off();
el.html(el.attr('data-oldcontent'));
el.find('[data-inplaceeditablelink]').focus();
};
- var turn_editing_off_everywhere = function() {
+ var turnEditingOffEverywhere = function() {
$('span.inplaceeditable.inplaceeditingon').each(function() {
- turn_editing_off($( this));
+ turnEditingOff($(this));
});
};
- var unique_id = function(prefix, idlength) {
- var uniqid = prefix;
- for (var i = 0; i < idlength; i++) {
+ var uniqueId = function(prefix, idlength) {
+ var uniqid = prefix,
+ i;
+ for (i = 0; i < idlength; i++) {
uniqid += String(Math.floor(Math.random() * 10));
}
// Make sure this ID is not already taken by an existing element.
if ($("#" + uniqid).length === 0) {
return uniqid;
}
- return unique_id(prefix, idlength);
+ return uniqueId(prefix, idlength);
};
- var turn_editing_on_text = function(el) {
+ var turnEditingOnText = function(el) {
str.get_string('edittitleinstructions').done(function(s) {
var instr = $('<span class="editinstructions">' + s + '</span>').
- attr('id', unique_id('id_editinstructions_', 20)),
+ attr('id', uniqueId('id_editinstructions_', 20)),
inputelement = $('<input type="text"/>').
- attr('id', unique_id('id_inplacevalue_', 20)).
+ attr('id', uniqueId('id_inplacevalue_', 20)).
attr('value', el.attr('data-value')).
attr('aria-describedby', instr.attr('id')),
lbl = $('<label class="accesshide">' + mainelement.attr('data-editlabel') + '</label>').
// We need 'keypress' event for Enter because keyup/keydown would catch Enter that was
// pressed in other fields.
var val = inputelement.val();
- turn_editing_off(el);
- update_value(el, val);
+ turnEditingOff(el);
+ updateValue(el, val);
}
if ((e.type === 'keyup' && e.keyCode === 27) || e.type === 'focusout') {
// We need 'keyup' event for Escape because keypress does not work with Escape.
- turn_editing_off(el);
+ turnEditingOff(el);
}
});
});
};
- var turn_editing_on_toggle = function(el, newvalue) {
- turn_editing_off(el);
- update_value(el, newvalue);
+ var turnEditingOnToggle = function(el, newvalue) {
+ turnEditingOff(el);
+ updateValue(el, newvalue);
};
- var turn_editing_on_select = function(el, options) {
- var inputelement = $('<select></select>').
- attr('id', unique_id('id_inplacevalue_', 20)),
- lbl = $('<label class="accesshide">' + mainelement.attr('data-editlabel') + '</label>').
- attr('for', inputelement.attr('id'));
- for (var i in options) {
- inputelement.append($('<option>').attr('value', i).html(options[i]));
+ var turnEditingOnSelect = function(el, options) {
+ var i,
+ inputelement = $('<select></select>')
+ .attr('id', uniqueId('id_inplacevalue_', 20)),
+ lbl = $('<label class="accesshide">' + mainelement.attr('data-editlabel') + '</label>')
+ .attr('for', inputelement.attr('id'));
+ for (i in options) {
+ inputelement
+ .append($('<option>')
+ .attr('value', i)
+ .html(options[i]));
}
inputelement.val(el.attr('data-value'));
- el.html('').append(lbl).append(inputelement);
+ el.html('')
+ .append(lbl)
+ .append(inputelement);
inputelement.focus();
inputelement.select();
}
if (e.type === 'change') {
var val = inputelement.val();
- turn_editing_off(el);
- update_value(el, val);
+ turnEditingOff(el);
+ updateValue(el, val);
}
if ((e.type === 'keyup' && e.keyCode === 27) || e.type === 'focusout') {
// We need 'keyup' event for Escape because keypress does not work with Escape.
- turn_editing_off(el);
+ turnEditingOff(el);
}
});
};
- var turn_editing_on = function(el) {
+ var turnEditingOn = function(el) {
el.addClass('inplaceeditingon');
el.attr('data-oldcontent', el.html());
var options = el.attr('data-options');
if (type === 'toggle') {
- turn_editing_on_toggle(el, options);
+ turnEditingOnToggle(el, options);
} else if (type === 'select') {
- turn_editing_on_select(el, $.parseJSON(options));
+ turnEditingOnSelect(el, $.parseJSON(options));
} else {
- turn_editing_on_text(el);
+ turnEditingOnText(el);
}
};
// Turn editing on for the current element and register handler for Enter/Esc keys.
- turn_editing_off_everywhere();
- turn_editing_on(mainelement);
+ turnEditingOffEverywhere();
+ turnEditingOn(mainelement);
});