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

diff --git a/SL/ClientJS.pm b/SL/ClientJS.pm
index 91c9e1abec6462cd7f6081359e86a35ab7116ecb..4cdb2037e2770d66b2bfeb9d9f69a29f94378989 100644 (file)
--- a/SL/ClientJS.pm
+++ b/SL/ClientJS.pm
@@ -10,7 +10,7 @@ use SL::JSON ();
 use Rose::Object::MakeMethods::Generic
 (
   scalar                  => [ qw() ],
-  'scalar --get_set_init' => [ qw(controller _actions _flash _error) ],
+  'scalar --get_set_init' => [ qw(controller _actions _flash _flash_detail _error) ],
 );
 
 my %supported_methods = (
@@ -115,6 +115,7 @@ my %supported_methods = (
   redirect_to            => 1,  # window.location.href = <TARGET>
 
   flash                  => 2,  # kivi.display_flash(<TARGET>, <ARGS>)
+  flash_detail           => 2,  # kivi.display_flash_detail(<TARGET>, <ARGS>)
   reinit_widgets         => 0,  # kivi.reinit_widgets()
   run                    => -1, # kivi.run(<TARGET>, <ARGS>)
   run_once_for           => 3,  # kivi.run_once_for(<TARGET>, <ARGS>)
@@ -180,6 +181,10 @@ sub init__flash {
   return {};
 }
 
+sub init__flash_detail {
+  return {};
+}
+
 sub init__error {
   return '';
 }
@@ -236,6 +241,21 @@ sub flash {
   return $self;
 }
 
+sub flash_detail {
+  my ($self, $type, @messages) = @_;
+
+  my $message = join '<br>', grep { $_ } @messages;
+
+  if (!$self->_flash_detail->{$type}) {
+    $self->_flash_detail->{$type} = [ 'flash_detail', $type, $message ];
+    push @{ $self->_actions }, $self->_flash_detail->{$type};
+  } else {
+    $self->_flash_detail->{$type}->[-1] .= ' ' . $message;
+  }
+
+  return $self;
+}
+
 sub error {
   my ($self, @messages) = @_;
 

diff --git a/js/client_js.js b/js/client_js.js
index 6d898199088da375094c449c4e680ddc48867c95..6b3784a5a9fe9c50a9bbc88c2496f75a4bc42502 100644 (file)
--- a/js/client_js.js
+++ b/js/client_js.js
@@ -8,6 +8,22 @@ namespace("kivi", function(ns) {
 ns.display_flash = function(type, message) {
   $('#flash_' + type + '_content').text(message);
   $('#flash_' + type).show();
+  $('#frame-header')[0].scrollIntoView();
+};
+
+ns.display_flash_detail = function(type, message) {
+  $('#flash_' + type + '_detail').html(message);
+  $('#flash_' + type + '_disp').show();
+};
+
+ns.clear_flash = function(category , timeout) {
+  window.setTimeout(function(){
+    $('#flash_' + category).hide();
+    $('#flash_detail_' + category).hide();
+    $('#flash_' + category + '_disp').hide();
+    $('#flash_' + category + '_content').empty();
+    $('#flash_' + category + '_detail').empty();
+  }, timeout);
 };
 
 ns.eval_json_result = function(data) {
@@ -19,7 +35,10 @@ ns.eval_json_result = function(data) {
 
   $(['info', 'warning', 'error']).each(function(idx, category) {
     $('#flash_' + category).hide();
+    $('#flash_detail_' + category).hide();
+    $('#flash_' + category + '_disp').hide();
     $('#flash_' + category + '_content').empty();
+    $('#flash_' + category + '_detail').empty();
   });
 
   if ((data.js || '') != '')
@@ -128,6 +147,7 @@ ns.eval_json_result = function(data) {
       // ## other stuff ##
       else if (action[0] == 'redirect_to')          window.location.href = action[1];
       else if (action[0] == 'flash')                kivi.display_flash(action[1], action[2]);
+      else if (action[0] == 'flash_detail')         kivi.display_flash_detail(action[1], action[2]);
       else if (action[0] == 'reinit_widgets')       kivi.reinit_widgets();
       else if (action[0] == 'run')                  kivi.run(action[1], action.slice(2, action.length));
       else if (action[0] == 'run_once_for')         kivi.run_once_for(action[1], action[2], action[3]);

diff --git a/scripts/generate_client_js_actions.tpl b/scripts/generate_client_js_actions.tpl
index 9e2180289895405366ebe851edf7f91ba71471da..50a427c458964ff2c1decd910140a24fed5e2fbf 100644 (file)
--- a/scripts/generate_client_js_actions.tpl
+++ b/scripts/generate_client_js_actions.tpl
@@ -8,6 +8,12 @@ namespace("kivi", function(ns) {
 ns.display_flash = function(type, message) {
   $('#flash_' + type + '_content').text(message);
   $('#flash_' + type).show();
+  $('#frame-header')[0].scrollIntoView();
+};
+
+ns.display_flash_detail = function(type, message) {
+  $('#flash_' + type + '_detail').html(message);
+  $('#flash_' + type + '_disp').show();
 };
 
 ns.eval_json_result = function(data) {
@@ -19,7 +25,10 @@ ns.eval_json_result = function(data) {
 
   $(['info', 'warning', 'error']).each(function(idx, category) {
     $('#flash_' + category).hide();
+    $('#flash_detail_' + category).hide();
+    $('#flash_' + category + '_disp').hide();
     $('#flash_' + category + '_content').empty();
+    $('#flash_' + category + '_detail').empty();
   });
 
   if ((data.js || '') != '')

diff --git a/templates/webpages/common/flash.html b/templates/webpages/common/flash.html
index 4b705cdfcdf9dd1650d3149d687fc980186c3a3b..1f537ac4a9f0ab8e19c047c9b0a81a498cb75053 100644 (file)
--- a/templates/webpages/common/flash.html
+++ b/templates/webpages/common/flash.html
@@ -1,14 +1,26 @@
 [%- USE HTML -%][%- USE LxERP %][%- USE T8 %]
 [%- BLOCK output %]
  <div id="flash_[% type %]" class="flash_message_[% type %]"[% IF !messages || !messages.size %] style="display: none"[% END %]>
-  <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>
+  <a href='#' style='float:right' 
+     onclick='$("#flash_[% type %]_content").empty();$("#flash_[% type %]_detail").empty();$("#flash_[% type %]").hide()'> 
+     <img src='image/close.png' border='0' alt='[% 'Close Flash' | $T8 %]'></a> 
   <span class="flash_title">[%- title %]:</span>
-  <span id="flash_[% type %]_content" class="flash_content">
+  <span id="flash_[% type %]_content">
    [% FOREACH message = messages %]
     [%- HTML.escape(message) %]
     [%- UNLESS loop.last %]<br>[% END %]
    [%- END %]
   </span>
+  <span id="flash_[% type %]_disp" style="display: none">
+  <a href='#' style='float:left' onclick='$("#flash_detail_[% type %]").toggle();'>
+     [[% 'Details' | $T8 %]]</a>&nbsp;&nbsp;</span>
+  <div id="flash_detail_[% type %]" style="display: none">
+    <br>
+    <span id="flash_[% type %]_detail"></span><br>
+    <a href='#' style='float:left' 
+      onclick='$("#flash_detail_[% type %]").hide()'> 
+      <img src='image/close.png' border='0' alt='[% 'Close Details' | $T8 %]'></a><br>
+  </div>
  </div>
 [%- END %]
 [%- PROCESS output title=LxERP.t8('Error')       type='error'   messages = FLASH.error %]