# TVConsole

**Repository Path**: jaimor/TVConsole

## Basic Information

- **Project Name**: TVConsole
- **Description**: 基于VConsole的机顶盒console
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 5
- **Forks**: 2
- **Created**: 2020-04-17
- **Last Updated**: 2021-11-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

TVConsole
==============================
基于腾讯开发的[vConsole(一个轻量、可拓展、针对手机网页的前端开发者调试面板)](https://github.com/Tencent/vConsole)。对其二次封装，适配机顶盒调试开发的TVConsole。目前是对其进行源码上的修改、添加，后期计划使用插件开发，将其封装为一个插件，不污染原框架代码。

## 为什么要二次封装？
因为机顶盒开发的特殊性，一般不能使用鼠标键盘，也不能使用触摸功能，能使用的仅仅只有遥控器，所以需要对其进行按键的监听，并处理tab切换等操作。

## 特性

- 查看 console 日志
  - console.log('foo');   // 白底黑字
  - console.info('bar');  // 白底紫字
  - console.debug('oh');  // 白底黄字
  - console.warn('foo');  // 黄底黄字
  - console.error('bar'); // 红底红字
- 查看 system 系统信息


## 上手

下载 TVConsole `dist/tvconsole.min.js`文件。

```html
<script src="path/to/tvconsole.min.js"></script>
<script>
  // 初始化
  var tvConsole = new TVConsole();
  setTimeout(function () {
    tvConsole.show();
    console.log('Hello world');
  }, 1);
</script>
```

对于 TypeScript，可引入 d.ts 文件（__注意__：目前未使用到ts文件，也未对其兼容）：

```javascript
import 'path/to/vconsole.min.d.ts';
```

## 文档

- [vConsole使用教程](https://github.com/Tencent/vConsole/blob/dev/doc/a_doc_index_CN.md)
- TVConsole新增
  - `options` 构造参数新增 `keyMap` `delay` 两个属性，分别为`按键对应的tab` `按键延迟处理时间`
  - `isShow` 方法判断当前console面板是否显示
  - `showTopbar` 方法控制topbar的显示
  - `openFold` 方法展开控制台中的Object展示
  - `closeFold` 方法收起控制台中的Object展示
  - `registerOnKeyEvent` 方法用于注册TVConsole面板的按键事件
  - `removeOnKeyEvent` 方法移除TVConsole面板的按键事件
  - `resumeOnKeyEvent` 恢复系统原先的按键事件

## 使用实例

暂需要完善

如有侵权、开源协议等问题，或者其他问题，请联系QQ：1239666205 将及时更正。