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
|
jQuery(function($) {
"use strict";
var TEMPLATES = new LuigiTemplate.Cache({
user: [
"<a ",
"href='#' ",
"class='list-group-item %{css|h}' ",
"title='Set user to \"%{name|h}.\"' ",
"data-user_id='%{id|h}' ",
">",
"<i class='fa fa-fw fa-spinner fa-spin hidden loading'></i>",
"<i class='fa fa-fw fa-user loading'></i>",
" ",
"%{name|h}",
"</a>",
],
loading: [
"<span class='list-group-item disabled'>",
"<i class='fa fa-spinner fa-spin'></i>",
" ",
"Loading...",
"</span>",
],
error: [
"<span class='list-group-item list-group-item-danger disabled'>",
"<i class='fa fa-exclamation-triangle'></i>",
" ",
"Error: %{responseText|h}",
"</span>",
],
});
function reload() {
var btn = $('#reload'),
list = $('#users');
// show loading
btn.toggleClass('disabled').find('.loading').toggleClass('hidden');
list.html(TEMPLATES.run('loading'));
send('test/get_users').always(function() {
btn.toggleClass('disabled').find('.loading').toggleClass('hidden');
list.html('');
}).fail(function(r) {
console.log('get_users failed: ' + r.responseText);
list.html(TEMPLATES.run('error', r));
}).done(function(r) {
list.html($.map(r.users, function(row) {
return TEMPLATES.run('user', $.extend({}, row, {
css: row.active ? 'active' : '',
}));
}).join(''));
});
// stop event
return false;
}
$('#users').on('click', 'a.list-group-item', function() {
var me = $(this);
// update highlight
var last = $('#users .active').removeClass('active');
me.addClass('active');
// show spinner
me.addClass('disabled').find('.loading').toggleClass('hidden');
send('test/set_user', {
user_id: me.data('user_id'),
}).always(function() {
// hide spinner
me.removeClass('disabled').find('.loading').toggleClass('hidden');
}).fail(function(r) {
alert('Error ' + r.responseText);
// restore old highlight
me.removeClass('active');
last.addClass('active');
}).done(function(r) {
// do nothing
});
// stop event
return false;
});
$('#reload').click(reload);
// load users
reload();
});
|