Merge remote-tracking branch 'node/fix/classname'

# Conflicts:
#	assets/example.html
#	assets/example.js
#	src/index.js

README.md

 
 ### 在非 React.js 项目中使用 ~~作为静态文件引入~~
 
-1. 引入通用评论的 css 和 js 文件。在 `./assets/static` 目录。
+**使用`assets` 分支的 `./assets/static` 目录[https://git.links123.net/npm/comment/src/branch/assets/assets/static](https://git.links123.net/npm/comment/src/branch/assets/assets/static)的静态文件**
+
+1. 引入通用评论的 css 和 js 文件。在 `assets` 分支的 `./assets/static` 目录: [https://git.links123.net/npm/comment/src/branch/assets/assets/static](https://git.links123.net/npm/comment/src/branch/assets/assets/static)。
 2. 调用 `window.renderComment` 方法并传入对应参数来渲染通用评论。参数列表：
   - `id`: string, 必填, 渲染评论的节点的 ID
   - `type`: number, 必填, 评论的 type    
-  - `businessId`: string, 必填, 评论的 businessId    
+  - `businessId`: string, 选填, 评论的 businessId，默认 test
+  - `API`: string, 选填, 评论的 businessId，默认 http://api.links123.net/comment/v1
 
 具体可参考 `./assets/example.html`。
 
   <script type="text/javascript">
     // 调用 renderComment 这个方法，渲染通用评论
     window.renderComment({
-      id: 'comment', // 渲染通用评论到 comment 这个节点，id 名称可 自定义
-      type: 1, // 评论的 type
-      businessId: 'test' // 评论的 businessId
-    })
+      id: 'comment', // required, 渲染通用评论到 comment 这个节点，id 名称可 自定义
+      type: 1, // required, 评论的 type
+      businessId: 'test' // 评论的 businessId, 默认 test
+      API: 'http://api.links123.net/comment/v1', // API 前缀, 默认 http://api.links123.net/comment/v1 
+    });
   </script>
 </body>
 </html>
 
 ```html
 <!-- ... -->
-  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/comment.0.5.13.css" />
+  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/xxx.css" />
 <!-- ... -->
   <div id="RENDER_ELEMENT_WRAPPER"></div>
 <!-- ... -->
-  <script type="text/javascript" src="./static/js/comment.0.5.13.js"></script>
+  <script type="text/javascript" src="./static/js/xxx.js"></script>
 <!-- ... -->
 ```
 
     window.renderComment({
       id: id,
       type: 1,
-      businessId: 'test'
+      businessId: 'test',
+      API: 'http://api.links123.net/comment/v1',
     })
   })
   
     window.renderComment({
       id: id,
       type: 1,
-      businessId: 'test1'
+      businessId: 'test1',
+      API: 'http://api.links123.net/comment/v1',
     })
   })
-
 }
 
 main();
 ```
 
-#### class 样式冲突
+#### ~~class 样式冲突~~
+
+> assets 分支已修复。
 
-`master` 分支的图片预览 `container` 样式和 boostrap 有冲突。在 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支对评论的样式名称做了修改，改为了 `comment-image-preview-container`。
+~~`master` 分支的图片预览 `container` 样式和 boostrap 有冲突。在 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支对评论的样式名称做了修改，改为了 `comment-image-preview-container`。~~
 
 解决办法就是使用 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支中的静态文件：
 
-- css:
-- js:
+- [https://git.links123.net/node/npmcomment/src/branch/fix/classname](https://git.links123.net/node/npmcomment/src/branch/fix/classname)
 
 尝试过使用 CSS Module 进行修改，不过改造量较大，改动的过程中影响了其他样式，所以暂时放弃了。
 

assets/example.html

   </div>
   
   <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk.min.js"></script>
-  <script type="text/javascript" src="./static/js/main.1e964a23.js"></script>
+  <script type="text/javascript" src="./static/js/main.426815d8.js"></script>
   <script type="text/javascript" src="example.js"></script>
 </body>
 </html>

assets/example.js

 }
 
 
+
 main();

lib/components/Editor/index.js

               showUpload ? _react2.default.createElement(
                 _popover2.default,
                 {
-                  trigger: "click",
-                  visible: this.state.showUpload,
-                  overlayStyle: { zIndex: 999 },
+                  trigger: "click"
+                  // TODO: 针对非 react.js，直接使用 click 事件来控制展开或关闭
+                  // visible={this.state.showUpload}
+                  , overlayStyle: { zIndex: 999 },
                   onVisibleChange: closeUploadWhenBlur ? function (visible) {
                     _this3.handleShowUpload(visible);
                   } : null,
                         maxUpload - this.state.fileList.length,
                         "\u5F20\u56FE\u7247)"
                       ) : null
-                    ),
-                    _react2.default.createElement(_icon2.default, {
-                      type: "close",
-                      onClick: function onClick() {
-                        return _this3.handleShowUpload(false);
-                      },
-                      style: {
-                        float: "right",
-                        cursor: "pointer",
-                        marginTop: 4
-                      }
-                    })
+                    )
                   )
                 },
                 imageToolIcon ? _react2.default.cloneElement(imageToolIcon, {

lib/index.js

 
 var _App2 = _interopRequireDefault(_App);
 
-var _registerServiceWorker = require("./registerServiceWorker");
-
-var _registerServiceWorker2 = _interopRequireDefault(_registerServiceWorker);
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+// import registerServiceWorker from "./registerServiceWorker";
+
 var Index = function Index(props) {
   return _react2.default.createElement(
     _App2.default,
  *  - {string} id 渲染评论的DOM的 ID
  *  - {number} type 评论的 type
  *  - {string} businessId 评论的 businessId
+ *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1
  */
 function renderComment(config) {
   if (!config.id) {
     throw new Error("id is required");
   }
-  if (!config.id) {
+  if (!config.type) {
     throw new Error("type is required");
   }
-  if (!config.id) {
-    throw new Error("businessId is required");
+  if (!config.businessId) {
+    // throw new Error("businessId is required");
+    console.warn("没有传入 businessId 参数，默认使用: test");
+  }
+  if (!config.API) {
+    // throw new Error("API is required");
+    console.warn("没有传入 API 参数，默认使用: http://api.links123.net/comment/v1");
   }
   var id = config.id,
       _config$type = config.type,
       type = _config$type === undefined ? 1 : _config$type,
       _config$businessId = config.businessId,
       businessId = _config$businessId === undefined ? "test" : _config$businessId,
+      _config$API = config.API,
+      API = _config$API === undefined ? "http://api.links123.net/comment/v1" : _config$API,
       userId = config.userId;
 
 
-  _reactDom2.default.render(_react2.default.createElement(Index, { type: type, businessId: businessId, userId: userId }), document.getElementById(id));
+  _reactDom2.default.render(_react2.default.createElement(Index, { type: type, businessId: businessId, API: API, userId: userId }), document.getElementById(id));
   // registerServiceWorker();
 }
 
 // renderComment({
 //   id: "root-comment",
 //   type: 1,
-//   businessId: "test"
+//   businessId: "test",
+//   API: 'http://api.links123.net/comment/v1',
 // });
 //# sourceMappingURL=index.js.map

lib/index.js.map

-{"version":3,"sources":["../src/index.js"],"names":["Index","props","renderComment","config","id","Error","type","businessId","userId","ReactDOM","render","document","getElementById","window"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;AACA;;;;;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,IAAQ,WAAW,CAAnB,EAAsB,eAAtB;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;AAOA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,wBAAV,CAAN;AACD;AAT4B,MAUrBD,EAVqB,GAUyBD,MAVzB,CAUrBC,EAVqB;AAAA,qBAUyBD,MAVzB,CAUjBG,IAViB;AAAA,MAUjBA,IAViB,gCAUV,CAVU;AAAA,2BAUyBH,MAVzB,CAUPI,UAVO;AAAA,MAUPA,UAVO,sCAUM,MAVN;AAAA,MAUcC,MAVd,GAUyBL,MAVzB,CAUcK,MAVd;;;AAY7BC,qBAASC,MAAT,CACE,8BAAC,KAAD,IAAO,MAAMJ,IAAb,EAAmB,YAAYC,UAA/B,EAA2C,QAAQC,MAAnD,GADF,EAEEG,SAASC,cAAT,CAAwBR,EAAxB,CAFF;AAIA;AACD;;AAEDS,OAAOX,aAAP,GAAuBA,aAAvB;;AAEA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport App, { Editor } from \"./App\";\r\nimport registerServiceWorker from \"./registerServiceWorker\";\r\n\r\nconst Index = props => (\r\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\r\n    <Editor maxUpload={9} autoFocus />\r\n  </App>\r\n);\r\n\r\n/**\r\n * 渲染评论组件\r\n * @param {object} config 编辑器配置\r\n *  - {string} id 渲染评论的DOM的 ID\r\n *  - {number} type 评论的 type\r\n *  - {string} businessId 评论的 businessId\r\n */\r\nfunction renderComment(config) {\r\n  if (!config.id) {\r\n    throw new Error(\"id is required\");\r\n  }\r\n  if (!config.id) {\r\n    throw new Error(\"type is required\");\r\n  }\r\n  if (!config.id) {\r\n    throw new Error(\"businessId is required\");\r\n  }\r\n  const { id, type = 1, businessId = \"test\", userId } = config;\r\n\r\n  ReactDOM.render(\r\n    <Index type={type} businessId={businessId} userId={userId} />,\r\n    document.getElementById(id)\r\n  );\r\n  // registerServiceWorker();\r\n}\r\n\r\nwindow.renderComment = renderComment;\r\n\r\n// renderComment({\r\n//   id: \"root-comment\",\r\n//   type: 1,\r\n//   businessId: \"test\"\r\n// });\r\n"]}
+{"version":3,"sources":["../src/index.js"],"names":["Index","props","renderComment","config","id","Error","type","businessId","console","warn","API","userId","ReactDOM","render","document","getElementById","window"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;;;AACA;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,IAAQ,WAAW,CAAnB,EAAsB,eAAtB;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;;AAQA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOG,IAAZ,EAAkB;AAChB,UAAM,IAAID,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOI,UAAZ,EAAwB;AACtB;AACAC,YAAQC,IAAR,CAAa,+BAAb;AACD;AACD,MAAI,CAACN,OAAOO,GAAZ,EAAiB;AACf;AACAF,YAAQC,IAAR,CACE,sDADF;AAGD;AAhB4B,MAkB3BL,EAlB2B,GAuBzBD,MAvByB,CAkB3BC,EAlB2B;AAAA,qBAuBzBD,MAvByB,CAmB3BG,IAnB2B;AAAA,MAmB3BA,IAnB2B,gCAmBpB,CAnBoB;AAAA,2BAuBzBH,MAvByB,CAoB3BI,UApB2B;AAAA,MAoB3BA,UApB2B,sCAoBd,MApBc;AAAA,oBAuBzBJ,MAvByB,CAqB3BO,GArB2B;AAAA,MAqB3BA,GArB2B,+BAqBrB,oCArBqB;AAAA,MAsB3BC,MAtB2B,GAuBzBR,MAvByB,CAsB3BQ,MAtB2B;;;AAyB7BC,qBAASC,MAAT,CACE,8BAAC,KAAD,IAAO,MAAMP,IAAb,EAAmB,YAAYC,UAA/B,EAA2C,KAAKG,GAAhD,EAAqD,QAAQC,MAA7D,GADF,EAEEG,SAASC,cAAT,CAAwBX,EAAxB,CAFF;AAIA;AACD;;AAEDY,OAAOd,aAAP,GAAuBA,aAAvB;;AAEA;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport App, { Editor } from \"./App\";\r\n// import registerServiceWorker from \"./registerServiceWorker\";\r\n\r\nconst Index = props => (\r\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\r\n    <Editor maxUpload={9} autoFocus />\r\n  </App>\r\n);\r\n\r\n/**\r\n * 渲染评论组件\r\n * @param {object} config 编辑器配置\r\n *  - {string} id 渲染评论的DOM的 ID\r\n *  - {number} type 评论的 type\r\n *  - {string} businessId 评论的 businessId\r\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\r\n */\r\nfunction renderComment(config) {\r\n  if (!config.id) {\r\n    throw new Error(\"id is required\");\r\n  }\r\n  if (!config.type) {\r\n    throw new Error(\"type is required\");\r\n  }\r\n  if (!config.businessId) {\r\n    // throw new Error(\"businessId is required\");\r\n    console.warn(\"没有传入 businessId 参数，默认使用: test\");\r\n  }\r\n  if (!config.API) {\r\n    // throw new Error(\"API is required\");\r\n    console.warn(\r\n      \"没有传入 API 参数，默认使用: http://api.links123.net/comment/v1\"\r\n    );\r\n  }\r\n  const {\r\n    id,\r\n    type = 1,\r\n    businessId = \"test\",\r\n    API = \"http://api.links123.net/comment/v1\",\r\n    userId\r\n  } = config;\r\n\r\n  ReactDOM.render(\r\n    <Index type={type} businessId={businessId} API={API} userId={userId} />,\r\n    document.getElementById(id)\r\n  );\r\n  // registerServiceWorker();\r\n}\r\n\r\nwindow.renderComment = renderComment;\r\n\r\n// renderComment({\r\n//   id: \"root-comment\",\r\n//   type: 1,\r\n//   businessId: \"test\",\r\n//   API: 'http://api.links123.net/comment/v1',\r\n// });\r\n"]}

src/components/Editor/index.js

               {showUpload ? (
                 <Popover
                   trigger="click"
-                  visible={this.state.showUpload}
+                  // TODO: 针对非 react.js，直接使用 click 事件来控制展开或关闭
+                  // visible={this.state.showUpload}
                   overlayStyle={{ zIndex: 999 }}
                   onVisibleChange={
                     closeUploadWhenBlur
                         上传图片
                         {maxUpload >= 2 ? (
                           <span style={{ color: "#666", fontWeight: 400 }}>
-                            (您还能上传{maxUpload - this.state.fileList.length}张图片)
+                            (您还能上传
+                            {maxUpload - this.state.fileList.length}
+                            张图片)
                           </span>
                         ) : null}
                       </span>
-                      <Icon
+                      {/* 因为是点击别的区域关闭，所以不用右上角的 Icon */}
+                      {/* <Icon
                         type="close"
                         onClick={() => this.handleShowUpload(false)}
                         style={{
                           cursor: "pointer",
                           marginTop: 4
                         }}
-                      />
+                      /> */}
                     </div>
                   }
                 >

src/index.js

 import React from "react";
 import ReactDOM from "react-dom";
 import App, { Editor } from "./App";
-import registerServiceWorker from "./registerServiceWorker";
+// import registerServiceWorker from "./registerServiceWorker";
 
 const Index = props => (
   <App showAlertComment showAlertReply showAlertFavor showError {...props}>
  *  - {string} id 渲染评论的DOM的 ID
  *  - {number} type 评论的 type
  *  - {string} businessId 评论的 businessId
+ *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1
  */
 function renderComment(config) {
   if (!config.id) {
     throw new Error("id is required");
   }
-  if (!config.id) {
+  if (!config.type) {
     throw new Error("type is required");
   }
-  if (!config.id) {
-    throw new Error("businessId is required");
+  if (!config.businessId) {
+    // throw new Error("businessId is required");
+    console.warn("没有传入 businessId 参数，默认使用: test");
+  }
+  if (!config.API) {
+    // throw new Error("API is required");
+    console.warn(
+      "没有传入 API 参数，默认使用: http://api.links123.net/comment/v1"
+    );
   }
-  const { id, type = 1, businessId = "test", userId } = config;
+  const {
+    id,
+    type = 1,
+    businessId = "test",
+    API = "http://api.links123.net/comment/v1",
+    userId
+  } = config;
 
   ReactDOM.render(
-    <Index type={type} businessId={businessId} userId={userId} />,
+    <Index type={type} businessId={businessId} API={API} userId={userId} />,
     document.getElementById(id)
   );
   // registerServiceWorker();
 // renderComment({
 //   id: "root-comment",
 //   type: 1,
-//   businessId: "test"
+//   businessId: "test",
+//   API: 'http://api.links123.net/comment/v1',
 // });