Reputation: 1427
I am trying to show an spinner in a button when is pressed, the executing is very fastbut I would like to vissually make it slower, so I want to add a delay to the hide spinner and then execute another function. What I have is:
$$('.LinkButton').each(function (el) {
el.addEvent('click', function (e) {
e = new Event(e);
e.stop();
var data = MyData Parameters;
var ID = MyID;
loadingSpinner = new Spinner(el, { containerPosition: { relativeTo: el, position: 'left', class: 'spinner-img' } });
var myRequest = new Request.HTML({
method: 'post', url: 'URL.ashx',
onRequest: function () {
loadingSpinner.show(true);
SetButtonEnable(ID);
},
onSuccess:
function()
{
loadingSpinner.hide(true).delay(5000);
TextOut(el.get('title'));
}
});
myRequest.send(data);
})
})
As you can see is very simple! I just when press button to show the spinner, disable the button, wait a few seconds and then hide the spinner and put a text on a div that the element was inserted. Thats all, but I dont know how is not possible with delay... Any advice guys... thanks!!!
EDITED:
function TextOut(Title) {
var elementAdd = new Element('div', { 'class': 'MyClass', 'text': Title, 'styles': { 'opacity': 0 } });
elementAdd.inject($('DivElement'), 'top').fade('in');
}
Upvotes: 1
Views: 142
Reputation: 26165
I cannot see the souce code of things like TextOut
but...
function() {
// create an anonymous function that does both.
(function(){
loadingSpinner.hide(true);
TextOut(el.get('title'));
}).delay(5000); // optional context (this) and args after 5000
}
// also works
loadingSpinner.hide.delay(5000, loadingSpinner, true);
Upvotes: 2