www/manager/panel/LogView.js

   1 Ext.define('PVE.panel.LogView', {
   2     extend: 'Ext.panel.Panel',
   3
   4     alias: ['widget.pveLogView'],
   5
   6     pageSize: 500,
   7
   8     lineHeight: 16,
   9
  10     viewInfo: undefined,
  11
  12     scrollToEnd: true,
  13
  14     getMaxDown: function(scrollToEnd) {
  15         var me = this;
  16
  17         var target = me.getTargetEl();
  18         var dom = target.dom;
  19         if (scrollToEnd) {
  20             dom.scrollTop = dom.scrollHeight - dom.clientHeight;
  21         }
  22
  23         var maxDown = dom.scrollHeight - dom.clientHeight -
  24             dom.scrollTop;
  25
  26         return maxDown;
  27     },
  28
  29     updateView: function(start, end, total, text) {
  30         var me = this;
  31         var el = me.dataCmp.el;
  32
  33         if (me.viewInfo && me.viewInfo.start === start &&
  34             me.viewInfo.end === end && me.viewInfo.total === total &&
  35             me.viewInfo.textLength === text.length) {
  36             return; // same content
  37         }
  38
  39         var maxDown = me.getMaxDown();
  40         var scrollToEnd = (maxDown <= 0) && me.scrollToEnd;
  41
  42         el.setStyle('padding-top', start*me.lineHeight);
  43         el.update(text);
  44         me.dataCmp.setHeight(total*me.lineHeight);
  45
  46         if (scrollToEnd) {
  47             me.getMaxDown(true);
  48         }
  49
  50         me.viewInfo = {
  51             start: start,
  52             end: end,
  53             total: total,
  54             textLength:  text.length
  55         };
  56     },
  57
  58     doAttemptLoad: function(start) {
  59         var me = this;
  60
  61         PVE.Utils.API2Request({
  62             url: me.url,
  63             params: {
  64                 start: start,
  65                 limit: me.pageSize
  66             },
  67             method: 'GET',
  68             success: function(response) {
  69                 PVE.Utils.setErrorMask(me, false);
  70                 var list = response.result.data;
  71                 var total = response.result.total;
  72                 var first = 0, last = 0;
  73                 var text = '';
  74                 Ext.Array.each(list, function(item) {
  75                     if (!first|| item.n < first) {
  76                         first = item.n;
  77                     }
  78                     if (!last || item.n > last) {
  79                         last = item.n;
  80                     }
  81                     text = text + Ext.htmlEncode(item.t) + "<br>";
  82                 });
  83
  84                 if (first && last && total) {
  85                     me.updateView(first -1 , last -1, total, text);
  86                 } else {
  87                     me.updateView(0, 0, 0, '');
  88                 }
  89             },
  90             failure: function(response) {
  91                 var msg = response.htmlStatus;
  92                 PVE.Utils.setErrorMask(me, msg);
  93             }
  94         });
  95     },
  96
  97     attemptLoad: function(start) {
  98         var me = this;
  99         if (!me.loadTask) {
 100             me.loadTask = Ext.create('Ext.util.DelayedTask', me.doAttemptLoad, me, []);
 101         }
 102         me.loadTask.delay(200, me.doAttemptLoad, me, [start]);
 103     },
 104
 105     requestUpdate: function(top, force) {
 106         var me = this;
 107
 108         if (top === undefined) {
 109             var target = me.getTargetEl();
 110             top = target.dom.scrollTop;
 111         }
 112
 113         var viewStart = parseInt((top / me.lineHeight) - 1, 10);
 114         if (viewStart < 0) {
 115             viewStart = 0;
 116         }
 117         var viewEnd = parseInt(((top + me.getHeight())/ me.lineHeight) + 1, 10);
 118         var info = me.viewInfo;
 119         if (info && !force) {
 120             if (viewStart >= info.start && viewEnd <= info.end) {
 121                 return;
 122             }
 123         }
 124         var line = parseInt((top / me.lineHeight) - (me.pageSize / 2) + 10, 10);
 125         if (line < 0) {
 126             line = 0;
 127         }
 128
 129         me.attemptLoad(line);
 130     },
 131
 132     afterRender: function() {
 133         var me = this;
 134
 135         me.callParent(arguments);
 136
 137         Ext.Function.defer(function() {
 138             var target = me.getTargetEl();
 139             target.on('scroll',  function(e) {
 140                 me.requestUpdate();
 141             });
 142             me.requestUpdate(0);
 143         }, 20);
 144     },
 145
 146     onShow: function() {
 147         /*jslint confusion: true */
 148         var me = this;
 149
 150         me.callParent(arguments);
 151
 152         var target = me.getTargetEl();
 153         target.dom.scrollTop = me.savedScrollTop;
 154
 155         me.task = Ext.TaskManager.start({
 156             run: function() {
 157                 if (!me.scrollToEnd || !me.viewInfo) {
 158                     return;
 159                 }
 160
 161                 var maxDown = me.getMaxDown();
 162                 if (maxDown > 0) {
 163                     return;
 164                 }
 165
 166                 me.requestUpdate(undefined, true);
 167             },
 168             interval: 1000
 169         });
 170     },
 171
 172     onHide: function() {
 173         var me = this;
 174
 175         var target = me.getTargetEl();
 176         // Hack: chrome reset scrollTop to 0, so we save/restore
 177         me.savedScrollTop = target.dom.scrollTop;
 178         if (me.task) {
 179             Ext.TaskManager.stop(me.task);
 180         }
 181
 182         me.callParent(arguments);
 183     },
 184
 185     onDestroy: function() {
 186         var me = this;
 187
 188         if (me.task) {
 189             Ext.TaskManager.stop(me.task);
 190         }
 191
 192         me.callParent(arguments);
 193     },
 194
 195     initComponent : function() {
 196         var me = this;
 197
 198         if (!me.url) {
 199             throw "no url specified";
 200         }
 201
 202         me.dataCmp = Ext.create('Ext.Component', {
 203             style: 'font:normal 11px tahoma, arial, verdana, sans-serif;' +
 204                 'line-height: ' + me.lineHeight.toString() + 'px; white-space: pre;'
 205         });
 206
 207         Ext.apply(me, {
 208             autoScroll: true,
 209             layout: 'auto',
 210             items: me.dataCmp,
 211             bodyStyle: 'padding: 5px;'
 212         });
 213
 214         me.callParent();
 215     }
 216 });