改进SSH录像播放功能，完美支持字体放大/缩小，支持进度条拖放。 :)

server/www/teleport/static/js/audit/replay-ssh.js

@@ -50,7 +50,7 @@ $app.req_record_data = function (record_id, offset) {
     );
 };
 
-$app.on_init = function (cb_stack, cb_args) {
+$app.on_init = function (cb_stack) {
     var record_id = $app.options.record_id;
 
     $app.dom = {
@@ -63,7 +63,9 @@ $app.on_init = function (cb_stack, cb_args) {
         btn_small_font: $('#btn-small-font'),
         progress: $('#progress'),
         status: $('#play-status'),
-        xterm_box: $('#xterm-box')
+        xterm_box: $('#xterm-box'),
+        xterm_terminal: null,
+        xterm_viewport: null
     };
 
     $app.dom.progress.width($('#toolbar').width()).val(0);
@@ -74,15 +76,16 @@ $app.on_init = function (cb_stack, cb_args) {
         function (ret) {
             if (ret.code === TPE_OK) {
                 g_header = ret.data;
-                // console.log('header', g_header);
+                console.log('header', g_header);
 
                 $('#recorder-info').html(tp_format_datetime(g_header.start) + ': ' + g_header.user_name + '@' + g_header.client_ip + ' 访问 ' + g_header.account + '@' + g_header.conn_ip + ':' + g_header.conn_port);
 
                 $app.req_record_data(record_id, 0);
 
+                g_current_time = 0;
                 setTimeout(init, 1000);
             } else {
-                $tp.notify_error('请求录像数据失败'+tp_error_msg(ret.code, ret.message));
+                $tp.notify_error('请求录像数据失败：' + tp_error_msg(ret.code, ret.message));
                 console.error('load init info error ', ret.code);
             }
         },
@@ -92,12 +95,30 @@ $app.on_init = function (cb_stack, cb_args) {
     );
 
     $app.dom.btn_big_font.click(function () {
-        var obj = $('.terminal');
+        if (_.isNull($app.dom.xterm_terminal))
-        obj.css('font-size', parseInt(obj.css('font-size')) + 2);
+            return;
+        var _size = parseInt($app.dom.xterm_terminal.css('font-size'));
+        if (_size >= 24)
+            return;
+
+        $app.dom.xterm_terminal.css('font-size', _size + 1);
+
+        g_console_term.charMeasure.measure();
+        $app.adjust_viewport();
     });
+
     $app.dom.btn_small_font.click(function () {
-        var obj = $('.terminal');
+        if (_.isNull($app.dom.xterm_terminal))
-        obj.css('font-size', parseInt(obj.css('font-size')) - 2);
+            return;
+
+        var _size = parseInt($app.dom.xterm_terminal.css('font-size'));
+        if (_size <= 12)
+            return;
+
+        $app.dom.xterm_terminal.css('font-size', _size - 1);
+
+        g_console_term.charMeasure.measure();
+        $app.adjust_viewport();
     });
 
     $app.dom.btn_play.click(function () {
@@ -136,13 +157,26 @@ $app.on_init = function (cb_stack, cb_args) {
         $app.dom.btn_speed.text(speed_table[speed_offset].name);
     });
 
-//    $app.dom.progress.change(function () {
+    $app.dom.progress.mousedown(function () {
-//        var process = g_dom_progress.val();
+        pause();
-//        console.log('change.' + process);
+    });
-//        //var beginTime = parseInt(g_header.time_used * process / 100);
+    $app.dom.progress.mouseup(function () {
-//        speed_offset = 0;
+        console.log(g_current_time);
-//        g_dom_btn_speed.text(speed_table[speed_offset].name);
+        setTimeout(function () {
-//    });
+            init();
+        }, 100);
+    });
+    $app.dom.progress.mousemove(function () {
+        g_current_time = parseInt(g_header.time_used * $app.dom.progress.val() / 100);
+        $app.dom.time.text(parseInt((g_current_time) / 1000) + '/' + parseInt(g_header.time_used / 1000) + '秒');
+    });
+
+    $app.adjust_viewport = function () {
+        if (!_.isNull($app.dom.xterm_viewport)) {
+            $app.dom.xterm_viewport.width(parseInt(window.getComputedStyle($app.dom.xterm_rows[0]).width));
+            $app.dom.xterm_viewport.height(parseInt(window.getComputedStyle($app.dom.xterm_rows[0]).height) - 1);
+        }
+    };
 
     function init() {
         if (_.isNull(g_console_term)) {
@@ -150,21 +184,18 @@ $app.on_init = function (cb_stack, cb_args) {
                 cols: g_header.width,
                 rows: g_header.height
             });
-            g_console_term.open(document.getElementById('xterm-box'), false);
 
-            // g_console_term.on('resize', function (obj, x, y) {
+            g_console_term.on('refresh', function () {
-            //     var y = window.getComputedStyle($('#xterm-box .terminal .xterm-rows')[0]);
+                $app.adjust_viewport();
-            //     var w = parseInt(y.width);
+            });
-            //
-            //     // $('#xterm-box .terminal .xterm-viewport').width(w+17);
-            //
-            //     $app.dom.xterm_box.width(w + 17);
-            //     // $app.dom.progress.width(w).val(g_process);
-            // });
 
+            g_console_term.open(document.getElementById('xterm-box'), true);
+
+            $app.dom.xterm_terminal = $('#xterm-box .terminal');
+            $app.dom.xterm_rows = $('#xterm-box .terminal .xterm-rows');
+            $app.dom.xterm_viewport = $('#xterm-box .terminal .xterm-viewport');
         } else {
             g_console_term.reset(g_header.width, g_header.height);
-            // g_console_term.setOption('scrollback', g_header.height);
         }
 
         $app.dom.progress.val(0);
@@ -174,7 +205,6 @@ $app.on_init = function (cb_stack, cb_args) {
         g_need_stop = false;
         g_playing = true;
         g_finish = false;
-        g_current_time = 0;
         g_played_pkg_count = 0;
         setTimeout(done, g_record_tick);
     }
@@ -193,22 +223,18 @@ $app.on_init = function (cb_stack, cb_args) {
 
         $app.dom.status.text("正在播放");
         g_current_time += g_record_tick * speed_table[speed_offset].speed;
+
+        var _record_tick = g_record_tick;
+
         for (var i = g_played_pkg_count; i < g_data.length; i++) {
+            if (g_need_stop)
+                break;
+
             var play_data = g_data[i];
 
-            if (g_skip && play_data.a === 1) {
-                g_console_term.resize(play_data.w, play_data.h);
-                // g_console_term.setOption('scrollback', play_data.h);
-
-                g_played_pkg_count++;
-                continue;
-            }
-
-            // console.log(play_data.t, g_current_time);
             if (play_data.t < g_current_time) {
-                if(play_data.a === 1) {
+                if (play_data.a === 1) {
                     g_console_term.resize(play_data.w, play_data.h);
-                    // g_console_term.setOption('scrollback', play_data.h);
                 } else if (play_data.a === 2) {
                     g_console_term.write(play_data.d);
                 }
@@ -233,16 +259,21 @@ $app.on_init = function (cb_stack, cb_args) {
                 break;
             }
         }
+
+        if (g_need_stop)
+            return;
+
         if (g_skip) {
-            if (play_data.t - g_current_time > 500) {
+            if (play_data.t - g_current_time > 800) {
                 g_current_time = play_data.t; // - g_record_tick * speed_table[speed_offset].speed;
+                _record_tick = 800;
             }
         }
 
         // sync progress bar.
-        var _progress = parseInt((g_current_time) * 100 / g_header.time_used);
+        var _progress = parseInt(g_current_time * 100 / g_header.time_used);
         $app.dom.progress.val(_progress);
-        var temp = parseInt((g_current_time) / 1000);
+        var temp = parseInt(g_current_time / 1000);
         $app.dom.time.text(temp + '/' + parseInt(g_header.time_used / 1000) + '秒');
 
         // if all packages played
@@ -254,7 +285,8 @@ $app.on_init = function (cb_stack, cb_args) {
             g_playing = false;
             $app.dom.btn_play.children().removeClass().addClass('fa fa-play').text(' 播放');
         } else {
-            g_timer = setTimeout(done, g_record_tick);
+            if (!g_need_stop)
+                g_timer = setTimeout(done, _record_tick);
         }
     }
 
@@ -276,6 +308,8 @@ $app.on_init = function (cb_stack, cb_args) {
     }
 
     function pause() {
+        if (!_.isNull(g_timer))
+            clearTimeout(g_timer);
         $app.dom.btn_play.children().removeClass().addClass('fa fa-play').text(' 播放');
         g_need_stop = true;
         g_playing = false;
@@ -283,8 +317,9 @@ $app.on_init = function (cb_stack, cb_args) {
     }
 
     function restart() {
-        if(!_.isNull(g_timer))
+        if (!_.isNull(g_timer))
             clearTimeout(g_timer);
+        g_current_time = 0;
         init();
     }
 

server/www/teleport/view/audit/replay-ssh.mako

@@ -21,7 +21,7 @@
         }
         #xterm-box {
             margin: 10px 0;
-            background-color: #1e1e1e;
+##             background-color: #1e1e1e;
             ##             margin-top: 10px;
             ##             margin-bottom: 48px;
             ##             width: 300px;
@@ -31,7 +31,8 @@
         .terminal {
             font-family: Consolas, Monaco, courier-new, courier, monospace;
             color: #b7b7b7;
-            font-size: 12px;
+            font-size: 13px;
+            display: inline-block;
         }
 
         .terminal {
@@ -42,11 +43,12 @@
             ##             background-color: transparent;
             ##             display:none;
             ##             overflow: auto;
+            padding-right:17px;
         }
 
         .terminal .xterm-rows {
 ##             margin:5px;
-##             padding:5px;
+            padding:5px;
             border-right: 1px dashed #363636;
             background-color: #1e1e1e;
         }

server/www/teleport/webroot/app/controller/audit.py

@@ -220,6 +220,10 @@ class ComandLogHandler(TPBaseHandler):
 class DoGetRecordHeaderHandler(TPBaseJsonHandler):
     @tornado.gen.coroutine
     def post(self):
+        ret = self.check_privilege(TP_PRIVILEGE_OPS | TP_PRIVILEGE_OPS_AUZ | TP_PRIVILEGE_AUDIT_AUZ | TP_PRIVILEGE_AUDIT_OPS_HISTORY)
+        if ret != TPE_OK:
+            return
+
         args = self.get_argument('args', None)
         if args is None:
             return self.write_json(TPE_PARAM)
@@ -236,7 +240,7 @@ class DoGetRecordHeaderHandler(TPBaseJsonHandler):
 
         header, err = record.read_record_head(record_id)
         if header is None:
-            return self.write_json(err, '操作失败')
+            return self.write_json(err)
 
         return self.write_json(0, data=header)