Revision 5bc3c720
Von Martin Helmling vor mehr als 8 Jahren hinzugefügt
| SL/ClientJS.pm | ||
|---|---|---|
| 10 | 10 |
use Rose::Object::MakeMethods::Generic |
| 11 | 11 |
( |
| 12 | 12 |
scalar => [ qw() ], |
| 13 |
'scalar --get_set_init' => [ qw(controller _actions _flash _error) ], |
|
| 13 |
'scalar --get_set_init' => [ qw(controller _actions _flash _flash_detail _error) ],
|
|
| 14 | 14 |
); |
| 15 | 15 |
|
| 16 | 16 |
my %supported_methods = ( |
| ... | ... | |
| 115 | 115 |
redirect_to => 1, # window.location.href = <TARGET> |
| 116 | 116 |
|
| 117 | 117 |
flash => 2, # kivi.display_flash(<TARGET>, <ARGS>) |
| 118 |
flash_detail => 2, # kivi.display_flash_detail(<TARGET>, <ARGS>) |
|
| 118 | 119 |
reinit_widgets => 0, # kivi.reinit_widgets() |
| 119 | 120 |
run => -1, # kivi.run(<TARGET>, <ARGS>) |
| 120 | 121 |
run_once_for => 3, # kivi.run_once_for(<TARGET>, <ARGS>) |
| ... | ... | |
| 180 | 181 |
return {};
|
| 181 | 182 |
} |
| 182 | 183 |
|
| 184 |
sub init__flash_detail {
|
|
| 185 |
return {};
|
|
| 186 |
} |
|
| 187 |
|
|
| 183 | 188 |
sub init__error {
|
| 184 | 189 |
return ''; |
| 185 | 190 |
} |
| ... | ... | |
| 236 | 241 |
return $self; |
| 237 | 242 |
} |
| 238 | 243 |
|
| 244 |
sub flash_detail {
|
|
| 245 |
my ($self, $type, @messages) = @_; |
|
| 246 |
|
|
| 247 |
my $message = join '<br>', grep { $_ } @messages;
|
|
| 248 |
|
|
| 249 |
if (!$self->_flash_detail->{$type}) {
|
|
| 250 |
$self->_flash_detail->{$type} = [ 'flash_detail', $type, $message ];
|
|
| 251 |
push @{ $self->_actions }, $self->_flash_detail->{$type};
|
|
| 252 |
} else {
|
|
| 253 |
$self->_flash_detail->{$type}->[-1] .= ' ' . $message;
|
|
| 254 |
} |
|
| 255 |
|
|
| 256 |
return $self; |
|
| 257 |
} |
|
| 258 |
|
|
| 239 | 259 |
sub error {
|
| 240 | 260 |
my ($self, @messages) = @_; |
| 241 | 261 |
|
| js/client_js.js | ||
|---|---|---|
| 8 | 8 |
ns.display_flash = function(type, message) {
|
| 9 | 9 |
$('#flash_' + type + '_content').text(message);
|
| 10 | 10 |
$('#flash_' + type).show();
|
| 11 |
$('#frame-header')[0].scrollIntoView();
|
|
| 12 |
}; |
|
| 13 |
|
|
| 14 |
ns.display_flash_detail = function(type, message) {
|
|
| 15 |
$('#flash_' + type + '_detail').html(message);
|
|
| 16 |
$('#flash_' + type + '_disp').show();
|
|
| 17 |
}; |
|
| 18 |
|
|
| 19 |
ns.clear_flash = function(category , timeout) {
|
|
| 20 |
window.setTimeout(function(){
|
|
| 21 |
$('#flash_' + category).hide();
|
|
| 22 |
$('#flash_detail_' + category).hide();
|
|
| 23 |
$('#flash_' + category + '_disp').hide();
|
|
| 24 |
$('#flash_' + category + '_content').empty();
|
|
| 25 |
$('#flash_' + category + '_detail').empty();
|
|
| 26 |
}, timeout); |
|
| 11 | 27 |
}; |
| 12 | 28 |
|
| 13 | 29 |
ns.eval_json_result = function(data) {
|
| ... | ... | |
| 19 | 35 |
|
| 20 | 36 |
$(['info', 'warning', 'error']).each(function(idx, category) {
|
| 21 | 37 |
$('#flash_' + category).hide();
|
| 38 |
$('#flash_detail_' + category).hide();
|
|
| 39 |
$('#flash_' + category + '_disp').hide();
|
|
| 22 | 40 |
$('#flash_' + category + '_content').empty();
|
| 41 |
$('#flash_' + category + '_detail').empty();
|
|
| 23 | 42 |
}); |
| 24 | 43 |
|
| 25 | 44 |
if ((data.js || '') != '') |
| ... | ... | |
| 128 | 147 |
// ## other stuff ## |
| 129 | 148 |
else if (action[0] == 'redirect_to') window.location.href = action[1]; |
| 130 | 149 |
else if (action[0] == 'flash') kivi.display_flash(action[1], action[2]); |
| 150 |
else if (action[0] == 'flash_detail') kivi.display_flash_detail(action[1], action[2]); |
|
| 131 | 151 |
else if (action[0] == 'reinit_widgets') kivi.reinit_widgets(); |
| 132 | 152 |
else if (action[0] == 'run') kivi.run(action[1], action.slice(2, action.length)); |
| 133 | 153 |
else if (action[0] == 'run_once_for') kivi.run_once_for(action[1], action[2], action[3]); |
| scripts/generate_client_js_actions.tpl | ||
|---|---|---|
| 8 | 8 |
ns.display_flash = function(type, message) {
|
| 9 | 9 |
$('#flash_' + type + '_content').text(message);
|
| 10 | 10 |
$('#flash_' + type).show();
|
| 11 |
$('#frame-header')[0].scrollIntoView();
|
|
| 12 |
}; |
|
| 13 |
|
|
| 14 |
ns.display_flash_detail = function(type, message) {
|
|
| 15 |
$('#flash_' + type + '_detail').html(message);
|
|
| 16 |
$('#flash_' + type + '_disp').show();
|
|
| 11 | 17 |
}; |
| 12 | 18 |
|
| 13 | 19 |
ns.eval_json_result = function(data) {
|
| ... | ... | |
| 19 | 25 |
|
| 20 | 26 |
$(['info', 'warning', 'error']).each(function(idx, category) {
|
| 21 | 27 |
$('#flash_' + category).hide();
|
| 28 |
$('#flash_detail_' + category).hide();
|
|
| 29 |
$('#flash_' + category + '_disp').hide();
|
|
| 22 | 30 |
$('#flash_' + category + '_content').empty();
|
| 31 |
$('#flash_' + category + '_detail').empty();
|
|
| 23 | 32 |
}); |
| 24 | 33 |
|
| 25 | 34 |
if ((data.js || '') != '') |
| templates/webpages/common/flash.html | ||
|---|---|---|
| 1 | 1 |
[%- USE HTML -%][%- USE LxERP %][%- USE T8 %] |
| 2 | 2 |
[%- BLOCK output %] |
| 3 | 3 |
<div id="flash_[% type %]" class="flash_message_[% type %]"[% IF !messages || !messages.size %] style="display: none"[% END %]> |
| 4 |
<a href='#' style='float:right' onclick='$(this).closest("div").find(".flash_content").empty(); $(this).closest("div").hide()'><img src='image/close.png' border='0' alt='[% 'Close Flash' | $T8 %]'></a>
|
|
| 4 |
<a href='#' style='float:right' |
|
| 5 |
onclick='$("#flash_[% type %]_content").empty();$("#flash_[% type %]_detail").empty();$("#flash_[% type %]").hide()'>
|
|
| 6 |
<img src='image/close.png' border='0' alt='[% 'Close Flash' | $T8 %]'></a> |
|
| 5 | 7 |
<span class="flash_title">[%- title %]:</span> |
| 6 |
<span id="flash_[% type %]_content" class="flash_content">
|
|
| 8 |
<span id="flash_[% type %]_content"> |
|
| 7 | 9 |
[% FOREACH message = messages %] |
| 8 | 10 |
[%- HTML.escape(message) %] |
| 9 | 11 |
[%- UNLESS loop.last %]<br>[% END %] |
| 10 | 12 |
[%- END %] |
| 11 | 13 |
</span> |
| 14 |
<span id="flash_[% type %]_disp" style="display: none"> |
|
| 15 |
<a href='#' style='float:left' onclick='$("#flash_detail_[% type %]").toggle();'>
|
|
| 16 |
[[% 'Details' | $T8 %]]</a> </span> |
|
| 17 |
<div id="flash_detail_[% type %]" style="display: none"> |
|
| 18 |
<br> |
|
| 19 |
<span id="flash_[% type %]_detail"></span><br> |
|
| 20 |
<a href='#' style='float:left' |
|
| 21 |
onclick='$("#flash_detail_[% type %]").hide()'>
|
|
| 22 |
<img src='image/close.png' border='0' alt='[% 'Close Details' | $T8 %]'></a><br> |
|
| 23 |
</div> |
|
| 12 | 24 |
</div> |
| 13 | 25 |
[%- END %] |
| 14 | 26 |
[%- PROCESS output title=LxERP.t8('Error') type='error' messages = FLASH.error %]
|
Auch abrufbar als: Unified diff
Flashanzeige erweitert: Nun auch Details
Für alle drei Flashanzeigen gibt es Detailanzeigen/optionalen Timeout
Details als textueller Link [Details]
ebenfalls wird Fenster nach oben gescrolled, damit flash info sichtbar ist.
Bei einigen Fehlermeldungen, z.B. bei LaTex Fehlern empfiehlt es sich,
kleinere Fehlermeldungen anzuzeigen, die dem Kunden verständlicher sind,
in den Details kann der lange Fehlertext (z.B auch sql Fehler) angezeigt werden
Änderung in clientjs:
nach Ausgabe einer Flash Anzeige (Info/Warning/Error)
wird nach oben gesprungen ( derzeit zum frame-header).
Damit wird die Anzeige auf jeden Fall sichtbar.
Flashanzeige erweitert: Funktion zum Text löschen nach Timeout
Bei neuen Controllern, die per AJAX laufen, ist es empfehlenswert
bestimmte Texte nach einer gewissen Zeit implizit zu löschen,
damit eine weitere identische Anzeige erkennbar ist.
Die Funktion ist derzeit explizit per js->run('kivi.clear_flash','info',10000) im Controller einzubauen,
ggf, später als eigenständige clientjs - Funktion