1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
|
import { $gettext } from './gettext';
const Overlay = {
delay: 300,
element: null,
selector: '.ui-front.modal-overlay',
timeout: null
};
Overlay.reset = function() {
if (this.timeout !== null) {
clearTimeout(this.timeout);
this.timeout = null;
}
};
Overlay.schedule = function(callback, delay) {
this.reset();
if (delay !== undefined && !delay) {
callback.call(this);
} else {
this.timeout = setTimeout(callback.bind(this), this.delay);
}
};
Overlay.show = function(ajax, containment, secure, callback, delay) {
this.schedule(function() {
if (this.element === null) {
containment = containment || 'body';
this.element = $('<div class="ui-front modal-overlay">');
if (ajax) {
this.element.addClass('modal-overlay-ajax');
if (ajax === 'dark') {
this.element.addClass('modal-overlay-dark');
}
}
if (containment !== 'body') {
this.element.addClass('modal-overlay-local');
} else {
// Blur background
$('body').addClass('has-overlay');
}
this.element.appendTo(containment);
}
if (secure) {
$(window).on('beforeunload.overlay', Overlay.securityHandler);
}
if ($.type(callback) === 'function') {
callback.call(this);
}
}, delay);
};
Overlay.hide = function(delay) {
this.schedule(function() {
if (this.element !== null) {
this.element.remove();
this.element = null;
}
$('body').removeClass('has-overlay');
$(window).off('beforeunload.overlay');
}, delay);
};
// Secure the overlay
Overlay.securityHandler = function(event) {
event = event || window.event || {};
event.returnValue = $gettext('Ihre Eingaben wurden bislang noch nicht gespeichert.');
return event.returnValue;
};
// Allows progress information
Overlay.showProgress = function(title, ajax, secure, delay) {
this.show(
ajax,
null,
secure,
function() {
if ($('h1', this.selector).length === 0) {
$(this.selector)
.append($('<h1>').text(title))
.append('<progress max="100" value="0">')
.append('<ul class="overlay-progress-log">');
}
},
delay
);
};
Overlay.updateProgress = function(percent, message) {
$('progress', this.selector).val(percent);
if (message) {
this.progressInfo(message);
}
};
Overlay.progressInfo = function(message) {
var li = $('<li>').text(message);
$('.overlay-progress-log', this.selector).prepend(li);
li.delay(1000).hide('fade', 300, function() {
$(this).remove();
});
};
export default Overlay;
|
