org.argeo.slc.webapp/src/main/webapp/argeo-ria-src/class/org/argeo/ria/components/Logger.js

   1 /**
   2  * A modal window like console for the logs.
   3  * Also opens a small alert window (qooxdoo, not native) on errors.
   4  *
   5  * @author : Charles du Jeu
   6  */
   7 qx.Class.define("org.argeo.ria.components.Logger",
   8 {
   9         type : "singleton",
  10         extend : qx.ui.window.Window,
  11
  12         construct : function(){
  13                 this.base(arguments, "Logs", "resource/slc/help-contents.png");
  14                 this.set({
  15                         showMaximize : true,
  16                         showMinimize : false,
  17                         width: 550,
  18                         height: 300
  19                 });
  20                 this.setLayout(new qx.ui.layout.Dock(0,5));
  21                 var buttonPane = new qx.ui.container.Composite(new qx.ui.layout.Canvas());
  22                 var closeButton = new qx.ui.form.Button("Close");
  23                 closeButton.addListener("execute", function(e){
  24                         this.hide();
  25                 }, this);
  26                 buttonPane.add(closeButton, {width:'20%',left:'40%'});
  27                 this.add(buttonPane, {edge:'south'});
  28                 this.setModal(false);
  29
  30                 var layout = new qx.ui.layout.VBox(2);
  31                 this._logPane = new qx.ui.container.Composite(layout);
  32                 var deco = new qx.ui.decoration.Single(1, 'solid', '#000000');
  33                 deco.setBackgroundColor("#ffffff")
  34                 var scroller = new qx.ui.container.Scroll(this._logPane);
  35                 scroller.setDecorator(deco);
  36                 this.add(scroller, {edge:'center', width:'100%', height:'100%'});
  37               // Build style sheet content
  38               var style =
  39               [
  40                 '.messages{font-size:0.9em}',
  41                 '.messages div{padding:0px 4px;}',
  42                 '.messages .offset{font-weight:bold;}',
  43                 '.messages .object{font-style:italic;}',
  44
  45                 '.messages .user-command{color:blue}',
  46                 '.messages .user-result{background:white}',
  47                 '.messages .user-error{background:#FFE2D5}',
  48                 '.messages .level-debug{background:white}',
  49                 '.messages .level-info{background:#DEEDFA}',
  50                 '.messages .level-warn{background:#FFF7D5}',
  51                 '.messages .level-error{background:#FFE2D5}',
  52                 '.messages .level-user{background:#E3EFE9}',
  53                 '.messages .type-string{color:black;font-weight:normal;}',
  54                 '.messages .type-number{color:#155791;font-weight:normal;}',
  55                 '.messages .type-boolean{color:#15BC91;font-weight:normal;}',
  56                 '.messages .type-array{color:#CC3E8A;font-weight:bold;}',
  57                 '.messages .type-map{color:#CC3E8A;font-weight:bold;}',
  58                 '.messages .type-key{color:#565656;font-style:italic}',
  59                 '.messages .type-class{color:#5F3E8A;font-weight:bold}',
  60                 '.messages .type-instance{color:#565656;font-weight:bold}',
  61                 '.messages .type-stringify{color:#565656;font-weight:bold}'
  62               ];
  63               // Include stylesheet
  64               qx.bom.Stylesheet.createElement(style.join(""));
  65
  66         },
  67
  68         members : {
  69                 /**
  70                  * Adds a log in the GUI component.
  71                  * @param entry {Map} A log entry
  72                  */
  73                 process : function(entry){
  74                         var wrapper = qx.log.appender.Util.toHtml(entry);
  75                         var label = new qx.ui.basic.Label('<div class="messages"><div class="'+wrapper.className+'">'+wrapper.innerHTML.replace(",","<br/>")+'</div></div>');
  76                         label.setRich(true);
  77                         if(entry.level == "error"){
  78                                 if(!this.alert){
  79                                         this.alert = new org.argeo.ria.components.Modal("Error");
  80                                         this.alert.setPersistent(true);
  81                                         this.alert.addCloseButton();
  82                                 }
  83                                 this.alert.addCenter(label.clone());
  84                                 this.alert.attachAndShow();
  85                         }else if(entry.level == "info"){
  86                                 this.showLogAsPopup(label.clone());
  87                         }
  88                         this._logPane.addAt(label, 0);
  89                 },
  90                 /**
  91                  * Shows the GUI console and center it.
  92                  */
  93                 toggle : function(){
  94                         this.show();
  95                         this.center();
  96                 },
  97
  98                 /**
  99                  * Show a given info log in a small popup right-top aligned.
 100                  * The popup will disappear after 5 seconds.
 101                  * @param content {qx.ui.basic.Label} The content of the popup to display
 102                  */
 103                 showLogAsPopup:function(content){
 104                         if(!this.popup){
 105                       this.popup = new qx.ui.popup.Popup(new qx.ui.layout.Canvas()).set({
 106                         backgroundColor: "#DFFAD3",
 107                         padding: [2, 4],
 108                         width: 350,
 109                         offset:0,
 110                         position: "right-top"
 111                       });
 112                         }
 113                         this.popup.removeAll();
 114                         this.popup.add(content);
 115                         var appRoot = org.argeo.ria.components.ViewsManager.getInstance().getApplicationRoot();
 116                         appRoot.add(this.popup);
 117                         this.popup.show();
 118                         this.popup.moveTo((qx.bom.Viewport.getWidth()-350), 0);
 119                         qx.event.Timer.once(function(){this.popup.hide();}, this, 5000);
 120                 }
 121         },
 122
 123         destruct : function()
 124     {
 125       qx.log.Logger.unregister(this);
 126     }
 127
 128 });