Merge branch 'dev' into dev

banshaotang · Dec 20, 2017 · ad8423a · ad8423a
2 parents 65a2dd8 + 24cf856
commit ad8423a
Show file tree

Hide file tree

Showing 10 changed files with 189 additions and 20 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,13 @@
 English | [简体中文](./CHANGELOG_CN.md)
 
+#### V3.1.0-dev (2017-12-xx)
+
+- [FEATURE] Add `vConsole.showSwitch()` and `vConsole.hideSwitch()` methods, see [Public Properties & Methods](./doc/public_properties_methods.md).
+- [FEATURE] Add `onReady` and `onClearLog` callback function to `vConsole.option`.
+- [FEATURE] Auto clear logs when `console.clear()` is called.
+- [FIX] Fix `\r` error when build in Windows.
+
+
 #### V3.0.0 (2017-09-27)
 
 Basic:

diff --git a/CHANGELOG_CN.md b/CHANGELOG_CN.md
@@ -1,5 +1,13 @@
 [English](./CHANGELOG.md) | 简体中文
 
+#### V3.1.0-dev (2017-12-xx)
+
+- 【特性】新增 `vConsole.showSwitch()` 及 `vConsole.hideSwitch()` 方法，请查阅[公共属性及方法](./doc/public_properties_methods_CN.md)。
+- 【特性】新增 `onReady` 及 `onClearLog` 回调方法，位于 `vConsole.option`。
+- 【特性】调用 `console.clear` 时将自动清除面板中的日志。
+- 【修复】修复 Windows 下构建引起的 `\r` 转义问题。
+
+
 #### V3.0.0 (2017-09-27)
 
 基础：
@@ -48,7 +56,7 @@ Network 插件：
 
 #### V2.5.0 (2016-09-28)
 
-- 【特性】新增 `vConsole.removePlugin()` 方法，请查阅[Public Properties & Methods](./doc/public_properties_methods_CN.md)。
+- 【特性】新增 `vConsole.removePlugin()` 方法，请查阅[公共属性及方法](./doc/public_properties_methods_CN.md)。
 - 【特性】新增 `remove` 插件事件，请查阅[插件：Event 事件列表](./doc/plugin_event_list_CN.md)。
 - 【优化】页面不会随着 vConsole 的滚动而滚动。
 - 【修复】修正 `window.onerror()` 内的函数调用笔误。

diff --git a/dist/vconsole.min.js b/dist/vconsole.min.js
diff --git a/doc/public_properties_methods.md b/doc/public_properties_methods.md
@@ -27,10 +27,11 @@ A configuration object.
 - Writable
 - Type: object
 
-Key            | Type    | Optional | Default value                               | Description
--------------- | ------- | -------- | ------------------------------------------- | -------------------
-defaultPlugins | Array   | true     | ['system', 'network', 'element', 'storage'] | Listed built-in plugins will be inited and loaded into vConsole. 
-maxLogNumber   | Number  | true     | 1000                                        | Overflow logs will be removed from log tabs.
+Key            | Type     | Optional | Default value                               | Description
+-------------- | -------- | -------- | ------------------------------------------- | -------------------
+defaultPlugins | Array    | true     | ['system', 'network', 'element', 'storage'] | Listed built-in plugins will be inited and loaded into vConsole. 
+onReady        | Function | true     |                                             | Trigger after vConsole is inited and default plugins is loaded.
+maxLogNumber   | Number   | true     | 1000                                        | Overflow logs will be removed from log tabs.
 
 Example:
 
@@ -211,4 +212,40 @@ vConsole.hide();
 ```
 
 
+### vConsole.showSwitch()
+
+Show vConsole switch button.
+
+##### Parameters:
+- None
+
+##### Return:
+- None
+
+##### Example:
+
+```javascript
+vConsole.showSwitch();
+```
+
+
+### vConsole.hideSwitch()
+
+Hide vConsole switch button. 
+
+After the button is hidden, the user will not be able to call vConsole manually. The button or panel must be shown programmably via `vConsole.showSwitch()` or `vConsole.show()`.
+
+##### Parameters:
+- None
+
+##### Return:
+- None
+
+##### Example:
+
+```javascript
+vConsole.hideSwitch();
+```
+
+
 [Back to Index](./a_doc_index.md)
diff --git a/doc/public_properties_methods_CN.md b/doc/public_properties_methods_CN.md
@@ -27,10 +27,11 @@ vConsole.version // => "3.0.0"
 - 可写
 - 类型：object
 
-键名           | 类型     | 可选     | 默认值                                       | 描述
--------------- | ------- | -------- | ------------------------------------------- | -------------------
-defaultPlugins | Array   | true     | ['system', 'network', 'element', 'storage'] | 需要自动初始化并加载的内置插件。 
-maxLogNumber   | Number  | true     | 1000                                        | 超出上限的日志会被自动清除。
+键名           | 类型      | 可选     | 默认值                                       | 描述
+-------------- | -------- | -------- | ------------------------------------------- | -------------------
+defaultPlugins | Array    | true     | ['system', 'network', 'element', 'storage'] | 需要自动初始化并加载的内置插件。 
+onReady        | Function | true     |                                             | 回调方法，当 vConsole 完成初始化并加载完内置插件后触发。
+maxLogNumber   | Number   | true     | 1000                                        | 超出上限的日志会被自动清除。
 
 例子：
 
@@ -181,7 +182,7 @@ vConsole.showTab("system"); // 显示 System tab
 
 显示 vConsole 主面板。这个方法会触发插件事件 `showConsole`。
 
-##### 参数
+##### 参数：
 - 无
 
 ##### 返回：
@@ -198,7 +199,7 @@ vConsole.show();
 
 隐藏 vConsole 主面板。这个方法会触发插件事件 `hideConsole`。
 
-##### 参数
+##### 参数：
 - 无
 
 ##### 返回：
@@ -211,4 +212,40 @@ vConsole.hide();
 ```
 
 
+### vConsole.showSwitch()
+
+显示 vConsole 的开关按钮。
+
+##### 参数：
+- 无
+
+##### 返回：
+- 无
+
+##### 例子：
+
+```javascript
+vConsole.showSwitch();
+```
+
+
+### vConsole.hideSwitch()
+
+隐藏 vConsole 的开关按钮
+
+隐藏后，用户将无法手动唤起 vConsole 面板。因此按钮或面板必须通过 `vConsole.showSwitch()` 或 `vConsole.show()` 来展示出来。
+
+##### 参数：
+- 无
+
+##### 返回：
+- 无
+
+##### 例子：
+
+```javascript
+vConsole.hideSwitch();
+```
+
+
 [返回索引](./a_doc_index_CN.md)
diff --git a/example/demo1.html b/example/demo1.html
@@ -32,6 +32,8 @@ <h1 class="page_title">Demo 1</h1>
     <a href="javascript:;" class="weui_btn weui_btn_default js_btn_ajax_get">发起AJAX(GET)</a>
     <a href="javascript:;" class="weui_btn weui_btn_default js_btn_ajax_post">发起AJAX(POST)</a>
 
+    <a href="javascript:;" class="weui_btn weui_btn_default js_btn_clear">清除日志</a>
+    <a href="javascript:;" class="weui_btn weui_btn_warn js_btn_hideswitch">隐藏按钮</a>
     <a href="javascript:;" class="weui_btn weui_btn_warn js_btn_destroy">销毁vConsole</a>
   </div>
   <div class="weui_toptips weui_notice" id="js_tips">已打印log</div>
@@ -41,7 +43,13 @@ <h1 class="page_title">Demo 1</h1>
 // 初始化vConsole
 window.vConsole = new window.VConsole({
   defaultPlugins: ['system', 'network', 'element', 'storage'], // 可以在此设定要默认加载的面板
-  maxLogNumber: 1000
+  maxLogNumber: 1000,
+  onReady: function() {
+    // console.log('vConsole is ready.');
+  },
+  onClearLog: function() {
+    // console.log('on clearLog');
+  }
 });
 
 console.info('欢迎使用 vConsole。vConsole 是一个由微信公众平台前端团队研发的 Web 前端开发者面板，可用于展示 console 日志，方便开发、调试。');
@@ -85,12 +93,38 @@ <h1 class="page_title">Demo 1</h1>
   });
   showTips();
 });
-$('.js_btn_destroy').on('tap', function(e) {
+$('.js_btn_clear').on('tap', function(e) {
+  console.clear();
+});
+$('.js_btn_hideswitch').on('tap', function(e) {
+  var that = this;
   if ($(this).hasClass('weui_btn_disabled')) {
     return false;
   }
   $(this).addClass('weui_btn_disabled');
+  window.vConsole.hideSwitch();
+  var count = 6;
+  var cb = function() {
+    count--;
+    if (count == 0) {
+      window.vConsole.showSwitch();
+      $(that).removeClass('weui_btn_disabled');
+      $(that).html('隐藏按钮');
+      clearInterval(timer);
+      return;
+    }
+    $(that).html('隐藏按钮(' + count + ')');
+  }
+  cb();
+  var timer = setInterval(cb, 1000);
+});
+$('.js_btn_destroy').on('tap', function(e) {
+  if ($(this).hasClass('weui_btn_disabled')) {
+    return false;
+  }
+  $('.weui_btn').addClass('weui_btn_disabled');
   window.vConsole.destroy();
+  $(this).html('刷新页面以重载vConsole');
 });
 
 // 用于页面内展示顶部tips

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vconsole",
-  "version": "3.0.0",
+  "version": "3.1.0-dev",
   "description": "A lightweight, extendable front-end developer tool for mobile web page.",
   "homepage": "https://github.com/Tencent/vConsole",
   "main": "dist/vconsole.min.js",

diff --git a/src/core/core.js b/src/core/core.js
@@ -396,6 +396,19 @@ class VConsole {
     if (this.tabList.length > 0) {
       this.showTab(this.tabList[0]);
     }
+
+    this.triggerEvent('ready');
+  }
+
+  /**
+   * trigger a vConsole.option event
+   * @protect
+   */
+  triggerEvent(eventName, param) {
+    eventName = 'on' + eventName.charAt(0).toUpperCase() + eventName.slice(1);
+    if (tool.isFunction(this.option[eventName])) {
+      this.option[eventName].apply(this, param);
+    }
   }
 
   /**
@@ -627,6 +640,29 @@ class VConsole {
     });
   }
 
+  /**
+   * show switch button
+   * @public
+   */
+  showSwitch() {
+    if (!this.isInited) {
+      return;
+    }
+    let $switch = $.one('.vc-switch', this.$dom);
+    $switch.style.display = 'block';
+  }
+
+  /**
+   * hide switch button
+   */
+  hideSwitch() {
+    if (!this.isInited) {
+      return;
+    }
+    let $switch = $.one('.vc-switch', this.$dom);
+    $switch.style.display = 'none';
+  }
+
   /**
    * show a tab
    * @public

diff --git a/src/lib/mito.js b/src/lib/mito.js
@@ -45,8 +45,8 @@ export default function render(tpl, data, toString) {
   window.__mito_result = "";
   // remove spaces after switch
   tpl = tpl.replace(/(\{\{ ?switch(.+?)\}\})[\r\n\t ]+\{\{/g, '$1{{');
-  // remove all \r\n
-  tpl = tpl.replace(/\r?\n/g, '');
+  // line breaks
+  tpl = tpl.replace(/^[\r\n]/, '').replace(/\n/g, '\\\n').replace(/\r/g, '\\\r');
   // init code
   codeWrap = '(function(){\n';
   code = 'var arr = [];\n';

diff --git a/src/log/log.js b/src/log/log.js
@@ -91,6 +91,7 @@ class VConsoleLogTab extends VConsolePlugin {
       global: false,
       onClick: function() {
         that.clearLog();
+        that.vConsole.triggerEvent('clearLog');
       }
     }];
     callback(toolList);
@@ -156,6 +157,7 @@ class VConsoleLogTab extends VConsolePlugin {
     window.console.warn = this.console.warn;
     window.console.debug = this.console.debug;
     window.console.error = this.console.error;
+    window.console.clear = this.console.clear;
     this.console = {};
   }
 
@@ -237,6 +239,7 @@ class VConsoleLogTab extends VConsolePlugin {
       methodList.map(function(method) {
         that.console[method] = window.console[method];
       });
+      that.console.clear = window.console.clear;
     }
 
     methodList.map(method => {
@@ -247,10 +250,16 @@ class VConsoleLogTab extends VConsolePlugin {
         });
       };
     });
+
+    window.console.clear = (...args) => {
+      that.clearLog();
+      that.console.clear.apply(window.console, args);
+    };
   }
 
   clearLog() {
     $.one('.vc-log', this.$tabbox).innerHTML = '';
+
   }
 
   /**