Reply.js 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915
  1. Namespace.register("U.MD.R");
  2. /**
  3. * 评论控件全局变量
  4. * PID // 项目id,请查看api文档说明,找到你所在项目的id。
  5. * AID // 对应的文章id,获取url网址的主机,加上url网址的目录,形成的文章id。
  6. * URL // 文章对应的url地址。
  7. * PageIndex // 当前页数
  8. * PageSize // 一页请求数
  9. * AllCount // 此文章对应的有多少数据
  10. * */
  11. U.MD.R.data = {
  12. PID: "",
  13. AID: "",
  14. URL: "",
  15. PageIndex: 1,
  16. PageSize: 20,
  17. AllCount: "",
  18. CB: null
  19. }
  20. /**
  21. * 评论控件初始化函数,调用函数
  22. * @param {object} 参数。
  23. * obj={
  24. * pid // 项目id,请查看api文档说明,找到你所在项目的id。
  25. * type //引用方式为弹窗还是嵌入式,true 为嵌入式方式,false 为窗体。
  26. * el // 评论控件追加的元素。注意:当控件为嵌入式时,才需要填写此参数,如果为弹窗时,不需要填写此参数。
  27. * }
  28. */
  29. U.MD.R.reply = function (obj) {
  30. //alert();
  31. //定义变量,获取调用方式、控件追加的元素、以及项目id.
  32. U.MD.R.login.cookieLogin(function () {
  33. var _type = obj.type,
  34. _el = obj.el,
  35. _cb = obj.cb;
  36. U.MD.R.data.PID = obj.pid; //项目id全局设置
  37. U.MD.R.data.AID = U.MD.R.reply.getUrlHash(); //文章id全局设置
  38. U.MD.R.data.URL = U.MD.R.reply.getUrl(); //文章url全局设置
  39. U.MD.R.data.CB = _cb;
  40. //调用类型判断
  41. if (!_type) {//如果调用方式是窗体,那么先创建一个窗体,并且重新更新变量_el的值。
  42. _el = new U.UF.UI.form('', $$("div"), {
  43. "style": {
  44. "width": "800px",
  45. "height": "800px"
  46. }
  47. }).content;
  48. }
  49. U.MD.R.reply.init(_el); //控件初始化
  50. U.UF.DL.asynLoadCss({
  51. "href": "/css/Controls/Basic/Picture.css",
  52. type: "text/css",
  53. rel: "stylesheet"
  54. }); //动态添加css文件
  55. U.UF.DL.asynLoadJs({ type: "text/javascript", src: "/js/Controls/Basic/Picture.js" });
  56. }); //cookie自动登录
  57. }
  58. /**
  59. * 评论控件初始化函数,调用函数
  60. * @param {element} 追加元素
  61. */
  62. U.MD.R.reply.init = function (el) {
  63. var _pageindex = U.MD.R.data.PageIndex, //当前页数
  64. _pagesize = U.MD.R.data.PageSize; //一页请求数
  65. U.MD.R.initPrintHtml(el); //创建基础html
  66. U.MD.R.getReplyData(_pageindex, _pagesize, function (data) {//获取评论数据
  67. U.MD.R.data.AllCount = data[0][0] ? Math.ceil(data[0][0].allcount / U.MD.R.data.PageSize) : ""; //取数完成之后进行将页数全局赋值给id。
  68. U.MD.R.printComment($("#U_MD_R_content_user_comment")[0], 1, data, false, false, false); //打印数据
  69. U.MD.R.initLoadMoreBtn(data[0]); //创建
  70. });
  71. }
  72. /**
  73. * 获取url地址
  74. */
  75. U.MD.R.reply.getUrl = function () {
  76. return window.location.href;
  77. }
  78. /**
  79. * 获取url网址的主机,加上url网址的目录
  80. */
  81. U.MD.R.reply.getUrlHash = function () {
  82. return U.UF.EC.SparkMD5.hash(window.location.href);
  83. }
  84. /**
  85. * 获取评论数据
  86. * @param {number} 页码数
  87. * @param {number} 一页的请求量
  88. * @param {function} 回调函数
  89. */
  90. U.MD.R.getReplyData = function (pageindex, pagesize, cb) {
  91. U.A.Request("http://cd.1473.cn/php", ["db.1473.cn", "UseStudio_Reply", "test", U.MD.R.data.AID, "1", "", pageindex, pagesize], function (r) {//获取数据
  92. cb && cb(r.value); //执行回调函数,并且返回数据。
  93. });
  94. }
  95. /**
  96. * 初始化创建回复元素
  97. * @param {element} 追加元素
  98. */
  99. U.MD.R.initPrintHtml = function (el) {
  100. var _el = el,
  101. _comment,
  102. _content,
  103. _content_operation,
  104. _userhead,
  105. _headimg,
  106. _operation,
  107. _username,
  108. _editorbox,
  109. _bottom,
  110. _picturewarp,
  111. _picture,
  112. _clear,
  113. _emoji_frame,
  114. _input,
  115. _button,
  116. _img_warp,
  117. _box;
  118. _comment = $$("div", { "className": "U_MD_R_comment" }, _el); //创建最外成元素
  119. _content = $$("div", { "className": "U_MD_R_content" }, _comment); //创建评论内容元素最外元素
  120. _content_operation = $$("div", { "className": "U_MD_R_content_operation" }, _content); //创建用户评论区域最外成元素
  121. _userhead = $$("div", { className: "U_MD_R_content_operation_userhead U_MD_R_Reply_Header" }, _content_operation); //创建头像最外成元素
  122. _headimg = $$("img", {//创建头像img元素
  123. "className": "img",
  124. "src": "/img/UserHead/UseHead.jpg",
  125. "onerror": function () { this.src = '/img/UserHead/UseHead.jpg' }
  126. }, _userhead);
  127. _operation = $$("div", {
  128. "className": "U_MD_R_content_operation_right",
  129. style: { width: "calc(100% - 40px - 20px )" }
  130. }, _content_operation); //创建内容框架div
  131. U.selectEl(_operation).attr({
  132. "data-RPID": null,
  133. "data-RD": 1,
  134. "data-RPUID": null
  135. });
  136. _username = $$("div", {//创建用户名元素
  137. "innerHTML": "登录/注册",
  138. "className": "U_MD_R_content_operation_userlogin U_MD_R_Reply_Name"
  139. }, _operation);
  140. //判断是否登录
  141. if (US.userInfo.userid) {//已登录
  142. _username.innerHTML = US.userInfo.UserName; //设置用户名
  143. _headimg.src = 'http://fs.1473.cn/' + US.userInfo.UserThumbnailImageHead; //设置头像
  144. }
  145. else {//未登录
  146. _username.onclick = function () {
  147. U.MD.R.login();
  148. }
  149. }
  150. _editorbox = $$("div", {
  151. "id": "editorbox",
  152. "className": "U_MD_R_Reply_Content",
  153. "contenteditable": "true",
  154. "style": { "min-height": "100px", "background": "#fff", "border": "1px solid black" }
  155. }, _operation)//创建编辑器容器
  156. var _scrolltop = document.documentElement.scrollTop;
  157. U.UF.E.initEditor(_editorbox); //调用函数
  158. document.documentElement.scrollTop = _scrolltop;
  159. _bottom = $$("div", { "className": "U_MD_R_content_operation_right_bottom" }, _operation); //创建用户评论底部区域
  160. $$("div", {//创建表情包按钮
  161. "className": "U_MD_R_content_operation_right_bottom_emoji",
  162. "onclick": function () {
  163. U.UF.EV.stopBubble();
  164. U.MD.UI.face(this, U.selectEl('#editorbox')[0]);
  165. //$(this)[0].append($("#U_MD_UI_face")[0]);
  166. //$(this)[0].append($("#U_MD_UI_face")[0]);
  167. U.selectEl("#U_MD_UI_face").css({ "position": "relative", "height": "140px", "overflow-y": "scroll", "top": "-150px", "width": "450px", "display": "block" });
  168. }
  169. }, _bottom);
  170. _picturewarp = $$("div", { "className": "U_MD_R_content_operation_right_bottom_picturewarp" }, _bottom); //图片最外成
  171. _picture = $$("img", { src: "/img/reply/img.png" }, _picturewarp);
  172. _input = $$("input", { "type": "file" }, _picturewarp); //上传
  173. _button = $$("div", {
  174. "className": "U_MD_R_content_operation_right_bottom_release",
  175. "innerHTML": "发表评论"
  176. }, _bottom); //内容发布
  177. _button.onclick = function () {
  178. if ($(".U_MD_R_Reply_Content")[0].textContent != '' || U.selectEl(".U_MD_R_Reply_Content")[0].innerHTML != '') {
  179. U.MD.R.release(_operation, 1, false, 1);
  180. } else {
  181. U.alert("评论不能为空!");
  182. }
  183. }
  184. _img_warp = $$("div", { "className": "U_MD_R_content_operation_right_bottom_imgloadbox U_MD_R_Reply_Image" }, _operation); //图片加载
  185. _box = $$("div", { "className": "U_MD_R_content_comment", "id": "U_MD_R_content_user_comment" }, _content); //内容盒子
  186. _input.onchange = function () {
  187. U.MD.R.uploadImages(this, _img_warp);
  188. }
  189. U.MD.R.data.CB && U.MD.R.data.CB();
  190. }
  191. /**
  192. * 创建加载更多按钮
  193. */
  194. U.MD.R.initLoadMoreBtn = function (data) {
  195. var _btn = $$("div", { "className": "U_MD_R_content_loading" }, U.selectEl(".U_MD_R_comment")[0]);
  196. if (data.length > 0) {
  197. if (U.MD.R.data.PageIndex < U.MD.R.data.AllCount) {
  198. _btn.innerHTML = "点击加载更多评论";
  199. _btn.onclick = function () {
  200. var _pageindex = ++U.MD.R.data.PageIndex,
  201. _pagesize = U.MD.R.data.PageSize;
  202. if (U.MD.R.data.PageIndex <= U.MD.R.data.AllCount) {
  203. U.MD.R.getReplyData(_pageindex, _pagesize, function (data) {//获取评论数据
  204. U.MD.R.data.AllCount = Math.ceil(data[0][0].allcount / U.MD.R.data.PageSize);
  205. U.MD.R.printComment($("#U_MD_R_content_user_comment")[0], 1, data, false, false, false); //打印数据
  206. });
  207. }
  208. else {
  209. U.selectEl(_btn).hide();
  210. }
  211. }
  212. }
  213. }
  214. else {
  215. // _btn.innerHTML = "还没有人评论";
  216. }
  217. }
  218. /**
  219. * 打印一级评论
  220. * @param {object} 评论数据
  221. * @param {element} 追加元素
  222. * @param {number} 用于判断层级而显示指定内容
  223. * @param {boolean}元素插入类型
  224. * @param {boolean} 是否需要回复功能,默认为false
  225. * @param {boolean} 是否需要查看更多,用于区分设置查看更多类型
  226. */
  227. U.MD.R.printComment = function (el, type, data, appendtype, isreply, readmore) {
  228. var _count = U.A.Request("http://cd.1473.cn/php", ["db.1473.cn", "UseStudio_Reply", "Reply_SelectTypeReplyEnable", U.MD.R.data.PID]);
  229. if (_count.value[0].ProjectReplyEnable == 1) {
  230. var _el = el,
  231. _type = type,
  232. _data = data,
  233. _appendtype = appendtype,
  234. _isreply = isreply,
  235. _readmore = readmore,
  236. _shownum;
  237. for (var i = 0; i < data[0].length; i++) {//遍历评论数据
  238. if (readmore) {
  239. _shownum = data[0][i].TopReplyNum;
  240. }
  241. else {
  242. _shownum = U.Json.select(_data[2], { ReplyID: _data[0][i].ReplyID }).length > 0 ? U.Json.select(_data[2], { ReplyID: _data[0][i].ReplyID })[0].AllReplyNum : "0"; //评论子集(所有子集)的评论数
  243. }
  244. U.MD.R.printCommentHtml(_el, _type, {
  245. rid: _data[0][i].ReplyID, //评论id
  246. rpid: _data[0][i].ReplyParentID, //评论父级id
  247. deep: _data[0][i].ReplyDeep, //评论深度
  248. topid: _data[0][i].ReplyID, //评论顶级id
  249. uid: _data[0][i].UserID, //评论用户id
  250. un: _data[0][i].UserName, //评论用户名
  251. tx: _data[0][i].ReplyUserThumbnailImageHead, //评论用户头像
  252. time: _data[0][i].ReplyAddTime, //评论时间
  253. content: _data[0][i].ReplyContent, //评论内容
  254. shownum: _shownum,
  255. likesnum: _type == 2 ? U.Json.select(_data[4], { ReplyID: _data[0][i].ReplyID })[0]:U.Json.select(_data[1], { ReplyID: _data[0][i].ReplyID })[0]
  256. }, _appendtype, _isreply, _readmore);
  257. }
  258. } else {
  259. var _btn = $$("div", { "className": "U_MD_R_content_loading" }, U.selectEl(".U_MD_R_comment")[0]);
  260. _btn.innerHTML = "该评论系统已关闭";
  261. U.selectEl("#U_MD_R_content_loading")[0].innerHTML = '';
  262. }
  263. }
  264. /**
  265. * 打印二级评论,用于区分用户点击回复或者查看更多。
  266. * @param {sring} 评论id
  267. * @param {boolean} 是否需要查看更多,用于区分设置查看更多类型
  268. */
  269. U.MD.R.viewComment = function (rid, type) {
  270. if (US.userInfo.userid) {
  271. var
  272. _rid = rid, //父级id
  273. _form, //窗体变量
  274. _data, //数据
  275. _firstbox, //一级评论内容区域
  276. _secondbox, //二级评论内容区域
  277. _thirdbox, //三级评论内容区域
  278. _type = type;
  279. _form = new U.UF.UI.form('', $$("div", { "style": { "padding": "20px"} }), {
  280. "style": {
  281. "width": "800px",
  282. "height": "600px"
  283. }
  284. });
  285. U.A.Request("http://cd.1473.cn/php", ["db.1473.cn", "UseStudio_Reply", "Reply_SelectThisReply", _rid], function (r) {//根据评论id,获取此评论,此评论点赞数,以及子目录下所有的评论还有点赞数
  286. _data = r.value;
  287. U.MD.R.printComment(_form.content, 2, _data, true, true, true); //打印一级目录
  288. if (_type) {
  289. U.selectEl(_form.content).find(".U_MD_R_content_box_content_edit").show();
  290. }
  291. _firstbox = $$("div", { "className": "U_MD_R_content_warp_box" }, _form.content);
  292. //创建二级目录
  293. for (var i = 0; i < _data[1].length; i++) {
  294. _secondbox = U.MD.R.printCommentHtml(_firstbox, 2, {
  295. rid: _data[1][i].ReplyID,
  296. rpid: _data[1][i].ReplyParentID,
  297. deep: _data[1][i].ReplyDeep,
  298. topid: _data[1][i].ReplyTopID,
  299. uid: _data[1][i].UserID,
  300. tx: _data[1][i].ReplyUserThumbnailImageHead,
  301. un: _data[1][i].UserName,
  302. time: _data[1][i].ReplyAddTime,
  303. content: _data[1][i].ReplyContent,
  304. likesnum: U.Json.select(_data[3], { ReplyID: _data[1][i].ReplyID })[0]
  305. }, false, true, true);
  306. //创建三级以下目录(包括三级)
  307. _thirdbox = $$("div", { "className": "U_MD_R_content_warp_box" }, _secondbox);
  308. U.selectEl(_thirdbox).attr({ "data-replyid": _data[1][i].ReplyID });
  309. for (var j = 0; j < _data[2].length; j++) {
  310. if (_data[1][i].ReplyID == _data[2][j].ReplyParentID) {
  311. U.MD.R.printCommentHtml(_thirdbox, 3, {
  312. rid: _data[2][j].ReplyID,
  313. rpid: _data[2][j].ReplyParentID,
  314. deep: _data[2][j].ReplyDeep,
  315. topid: _data[2][j].ReplyTopID,
  316. uid: _data[2][j].UserID,
  317. tx: _data[2][j].ReplyUserThumbnailImageHead,
  318. un: _data[2][j].UserName,
  319. time: _data[2][j].ReplyAddTime,
  320. content: _data[2][j].ReplyContent,
  321. likesnum: U.Json.select(_data[3], { ReplyID: _data[2][j].ReplyID })[0],
  322. replyinfo: {
  323. uid: _data[2][j].uid, //评论的用户id
  324. un: _data[2][j].un, //评论的用户名
  325. tx: _data[2][j].tx//评论的头像
  326. }
  327. }, false, true, true);
  328. }
  329. }
  330. }
  331. });
  332. }
  333. else {
  334. U.Alert("请先登录");
  335. }
  336. }
  337. /**
  338. * 打印评论数据内容
  339. * @param {object} 评论数据
  340. * @param {element} 追加元素
  341. * @param {object} 用于判断层级而显示指定内容
  342. * object={
  343. * rid,//评论id
  344. * rpid,//评论父级id
  345. * deep,//评论深度
  346. * topid,//评论顶级id
  347. * uid,//评论用户id
  348. * un,//评论用户名
  349. * tx,//评论用户头像
  350. * time,//评论时间
  351. * content,//评论内容
  352. * likesnum,//评论点赞数
  353. * shownum,//评论子集(所有子集)的评论数
  354. * }
  355. * @param {boolean} 元素插入类型
  356. * @param {boolean} 是否需要回复功能,默认为false
  357. * @param {boolean} 是否需要查看更多,用于区分设置查看更多类型
  358. */
  359. U.MD.R.printCommentHtml = function (el, type, data, appendtype, isreply, readmore) {
  360. var _data = data,
  361. _el = el,
  362. _type = type,
  363. // _eltype = obj.eltype ? obj.eltype : false,
  364. // _showmore = obj.showmore,
  365. _rid = _data.rid, //评论id
  366. _rpid = _data.rpid, //评论父级id
  367. _deep = _data.deep, //评论顶级id
  368. _topid = _data.topid, //评论顶级id
  369. _uid = _data.uid, //评论用户id
  370. _tx = _data.tx, //评论用户名
  371. _un = _data.un, //评论用户头像
  372. _time = _data.time, //评论时间
  373. _datacontent = _data.content, //评论内容
  374. _likesnumjson = _data.likesnum, //点赞数
  375. _showmoretxtjson = _data.shownum, //评论子集(所有子集)的评论数
  376. _replyinfo_uid = _data.replyinfo ? _data.replyinfo.uid : "", //评论的用户id
  377. _replyinfo_un = _data.replyinfo ? _data.replyinfo.un : "", //评论的用户名
  378. _replyinfo_tx = _data.replyinfo ? _data.replyinfo.tx : "", //评论的头像
  379. _appendtype = appendtype, //评论插入的方式,如果为true,那么就插入到所有评论的第一个(用于以及评论和二级评论),如果为false,那么就插入到最后一个
  380. _isreply = isreply, //点击回复按钮,是否是弹出回复框,还是弹出查看更多,默认为false,
  381. _readmore = readmore, //点击获取是
  382. _box, //评论最外层元素
  383. _info, //评论内层元素
  384. _head, //评论用户头像最外层
  385. _headimg, //评论用户头像
  386. _content, //评论头像右侧内容
  387. _content_top, //评论右侧内容-头部用户名区域
  388. _username, //评论右侧内容-头部用户名区域-用户名
  389. _commenttime, //评论右侧内容-头部用户名区域-评论时间
  390. _text,
  391. _content_bottom, //评论右侧内容-底部区域
  392. _likeswarp, //评论右侧内容-底部区域-点赞最外层
  393. _likesimg, //评论右侧内容-底部区域-点赞图片
  394. _likesnum, //评论右侧内容-底部区域-点赞数
  395. _replywarp, //评论右侧内容-底部区域-回复最外层
  396. _showmorewarp, //评论右侧内容-底部区域-查看更多最外层
  397. _showmoretext, //评论右侧内容-底部区域-查看更多文字元素
  398. _position,
  399. _contenteditable, //创建子集评论-评论操作区域最外层
  400. _bottom, //创建子集评论-评论操作区域内层
  401. _picturewarp, //创建子集评论-评论操作区域-图片最外层
  402. _picture, //创建子集评论-评论操作区域-图片元素
  403. _input, //创建子集评论-评论操作区域-上传input
  404. _button, //创建子集评论-评论操作区域-发布按钮
  405. _img_warp, //创建子集评论-评论操作区域-图片显示区域
  406. _childrenbox; //用于存放子集评论
  407. _box = $$("div", { "className": "U_MD_R_content_box" }); //创建内容盒子
  408. if (_appendtype) { //判断插入类型是否为true,如果为true,那么就插入到所有评论的第一个(用于以及评论和二级评论),如果为false,那么就插入到最后一个
  409. U.selectEl(_el).append(_box, 0, U.selectEl(_el)[0].firstChild);
  410. }
  411. else {//如果为false,那么就插入到最后一个
  412. U.selectEl(_el).append(_box);
  413. }
  414. _info = $$("div", { "className": "U_MD_R_content_box_warp" }, _box); //创建信息div
  415. U.selectEl(_info).attr({//给评论内层设置评论id、评论父级id、评论深度、评论顶级id、评论用户id。用于回复时获取信息。
  416. "data-rid": _rid, //评论id
  417. "data-RPID": _rpid, //评论父级id
  418. "data-RD": _deep, //评论深度
  419. "data-RBID": _topid, //评论顶级id
  420. "data-RPUID": _uid//评论用户id
  421. });
  422. _head = $$("div", { "className": "U_MD_R_content_box_userhead" }, _info); //评论用户头像最外层
  423. _headimg = $$("img", {//评论用户头像
  424. "src": _tx,
  425. onerror: "U.MD.R.imgError(this)"
  426. }, _head);
  427. _content = $$("div", {//评论头像右侧内容
  428. "className": "U_MD_R_content_box_content",
  429. style: { width: "calc(100% - 40px - 20px )" }
  430. }, _info); //创建右侧div
  431. _content_top = $$("div", { "className": "U_MD_R_content_box_content_top" }, _content); //评论右侧内容-头部用户名区域
  432. _username = $$("div", {//评论右侧内容-头部用户名区域-用户名
  433. "className": "U_MD_R_content_box_content_top_name",
  434. "innerHTML": _un
  435. }, _content_top);
  436. if (_type == 3) {//如果为三级目录以下,那么就修改显示的用户名
  437. _username.innerHTML = _un + '回复@' + _replyinfo_un;
  438. }
  439. _commenttime = $$("div", {//评论右侧内容-头部用户名区域-评论时间
  440. "className": "U_MD_R_content_box_content_top_time",
  441. "innerHTML": _time
  442. }, _content_top);
  443. _text = $$("div", { "className": "U_MD_R_content_box_content_text", "innerHTML": _datacontent }, _content); //创建内容区域
  444. if ($(_text).find("img").length > 0) {
  445. U.selectEl(_text).find("img")[0].onclick = function () {
  446. // U.MD.UI.picture([this.src, this.src, this.src], 2);
  447. U.MD.UI.picture([this.src], 0);
  448. U.selectEl("#U_MD_UI_PictureForm").css("position", "fixed");
  449. U.UF.F.topWindow($('#U_MD_UI_PictureForm')[0], true);
  450. }
  451. }
  452. _content_bottom = $$("div", { "className": "U_MD_R_content_box_content_bottom" }, _content); //评论右侧内容-底部区域
  453. _likeswarp = $$("div", { "className": "U_MD_R_content_box_content_bottom_likeswarp" }, _content_bottom); //评论右侧内容-底部区域-点赞最外层
  454. _likeswarp.onclick = function () {//设置点赞事件
  455. U.MD.R.like(this, _rid, US.userInfo.userid);
  456. }
  457. _likesimg = $$("img", { "src": "/img/reply/NOFabulous.png" }, _likeswarp); //评论右侧内容-底部区域-点赞图片
  458. _likesnum = $$("div", {//评论右侧内容-底部区域-点赞数
  459. "className": "U_MD_R_content_box_content_bottom_likeswarp_text",
  460. "innerHTML": 0
  461. }, _likeswarp);
  462. if (_likesnumjson) {//如果有点赞数据,那么修改点赞数,并且修改图片。
  463. _likesnum.innerHTML = _likesnumjson.ReplyNum;
  464. U.A.Request("http://cd.1473.cn/net", ["db.1473.cn", "UseStudio_Reply", "Reply_SelectRepeatLikes_Moblie", _rid, US.userInfo.userid], function (r) {
  465. if (r.value[0].mode == 1) {
  466. _likesimg.src = "/img/reply/NOFabulous.png";
  467. }else if (r.value[0].mode == 0) {
  468. _likesimg.src = "/img/reply/Fabulous.png";
  469. } else {
  470. _likesimg.src = "/img/reply/NOFabulous.png";
  471. }
  472. })
  473. //_likesimg.src = "/img/reply/Fabulous.png";
  474. }
  475. _replywarp = $$("div", { "className": "U_MD_R_content_box_content_bottom_replywarp" }, _content_bottom); //评论右侧内容-底部区域-回复最外层
  476. if (_readmore) {//点击回复按钮,是否是弹出回复框,还是弹出查看更多,默认为false。如果为true,在元素下方显示出评论操作元素。
  477. _replywarp.onclick = function () {
  478. U.MD.R.subsetReply(this);
  479. }
  480. }
  481. else {
  482. _replywarp.onclick = function () {//如果为false,弹出一个窗体。
  483. U.MD.R.viewComment(_rid, true);
  484. }
  485. }
  486. $$("img", {//创建回复图片
  487. "src": "/img/reply/reply.png"
  488. }, _replywarp);
  489. $$("div", {//创建回复按钮
  490. "innerHTML": "回复",
  491. "className": "U_MD_R_content_box_content_bottom_replywarp_text"
  492. }, _replywarp);
  493. if (_type == 1) {//如果类型为1,并且点击回复后弹出窗体的,那么显示查看更多。
  494. _showmorewarp = $$("div", { "className": "U_MD_R_content_box_content_bottom_showmorewarp" }, _content_bottom);
  495. $$("img", {
  496. "src": "/img/reply/list.png"
  497. }, _showmorewarp);
  498. _showmoretext = $$("div", {
  499. "className": "U_MD_R_content_box_content_bottom_showmore_text"
  500. }, _showmorewarp);
  501. if (_readmore) {
  502. _showmoretext.className = "U_MD_R_content_box_content_bottom_showmore_text U_MD_R_content_box_content_bottom_showmore_text_secondary"
  503. _showmoretext.innerHTML = _showmoretxtjson ? "共有(" + "<span>" + _showmoretxtjson + "</span>" + ")条评论" : "没有评论(" + "<span>0</span>" + ")";
  504. }
  505. else {
  506. _showmoretext.className = "U_MD_R_content_box_content_bottom_showmore_text U_MD_R_content_box_content_bottom_showmore_text_important"
  507. _showmoretext.innerHTML = _showmoretxtjson ? "查看更多(" + "<span>" + _showmoretxtjson + "</span>" + ")" : "查看更多(" + "<span>" + 0 + "</span>" + ")";
  508. _showmorewarp.onclick = function () {
  509. U.MD.R.viewComment(_rid, false);
  510. }
  511. }
  512. }
  513. if (_type == 1 && !readmore && U.selectEl(".U_MD_R_content_loading")[0]) {
  514. if (U.MD.R.data.PageIndex < U.MD.R.data.AllCount) {
  515. U.selectEl(".U_MD_R_content_loading")[0].innerHTML = "点击加载更多评论";
  516. }
  517. else {
  518. U.selectEl(".U_MD_R_content_loading").hide();
  519. }
  520. }
  521. if (_type == 2 || _type == 3 || (_type == 1 && readmore)) {//如果是2级和3级以下,那么就创建操作区域。
  522. _contenteditable = $$("div", {//创建子集评论-评论操作区域最外层
  523. "className": "U_MD_R_content_box_content_edit",
  524. "style": { "display": "none" }
  525. }, _content);
  526. _replyinput = $$("div", { "className": "U_MD_R_Reply_Content", "contenteditable": "true" }, _contenteditable); //创建回复元素
  527. _bottom = $$("div", { "className": "U_MD_R_content_operation_right_bottom" }, _contenteditable); //创建子集评论-评论操作区域内层
  528. $$("div", {//创建表情包按钮
  529. "className": "U_MD_R_content_operation_right_bottom_emoji",
  530. "onclick": function () {
  531. U.UF.EV.stopBubble();
  532. U.MD.UI.face(this, _replyinput);
  533. U.selectEl(this)[0].append($("#U_MD_UI_face")[0]);
  534. U.selectEl("#U_MD_UI_face").css({ "position": "relative", "height": "140px", "overflow-y": "scroll", "top": "-150px", "width": "450px", "display": "block" });
  535. }
  536. }, _bottom);
  537. _picturewarp = $$("div", { "className": "U_MD_R_content_operation_right_bottom_picturewarp" }, _bottom); //创建子集评论-评论操作区域-图片最外层
  538. _picture = $$("img", { src: "/img/reply/img.png" }, _picturewarp); //创建子集评论-评论操作区域-图片元素
  539. _input = $$("input", { "type": "file" }, _picturewarp); //创建子集评论-评论操作区域-上传input
  540. _input.onchange = function () {//赋予上传事件
  541. U.MD.R.uploadImages(this, _img_warp);
  542. }
  543. _button = $$("div", {////创建子集评论-评论操作区域-发布按钮
  544. "className": "U_MD_R_content_operation_right_bottom_release",
  545. "innerHTML": "发表评论"
  546. }, _bottom); //内容发布
  547. _button.onclick = function () {//赋予时间
  548. if (_type == 1) {
  549. _position = 2;
  550. }
  551. else if (_type == 2) {
  552. _position = 3;
  553. }
  554. else if (_type == 3) {
  555. _position = 4;
  556. }
  557. U.MD.R.release(_info, _type, false, _position);
  558. }
  559. _img_warp = $$("div", { "className": "U_MD_R_content_operation_right_bottom_imgloadbox U_MD_R_Reply_Image" }, _contenteditable); //创建子集评论-评论操作区域-图片显示区域
  560. if (_type != 3) {
  561. _childrenbox = $$("div", { "className": "U_MD_R_content_comment" }, _box); //内容盒子
  562. }
  563. return _childrenbox; //返回元素
  564. }
  565. }
  566. /**
  567. * 图片上传函数
  568. * @param {element} input 元素
  569. * @param {element} 上传成功后,图片插入的位置。
  570. */
  571. U.MD.R.uploadImages = function (input, el) {
  572. var _el = el, _imgwarp, _img, _filetype, _imgtype = /.*(jpg|png|gif|jpeg|JPG|PNG|GIF|JPEG)$/;
  573. U.selectEl(_el)[0].innerHTML = "";
  574. _imgwarp = $$("div", {}, _el);
  575. _img = $$("img", {//创建img
  576. "src": "/img/Reply/loading.gif",
  577. "style": { "width": "100px", "height": "100px", "margin-right": "10px" }
  578. }, _imgwarp);
  579. U.UF.UP.inputUpload([input], "http://disk.1473.cn/USUpfile.ashx?typename=UseStudioEditor&UserId=FA92AAC5-4134-449F-9659-0DC12F4F68E9", function (r) {
  580. _filetype = r.value[0].split(".")[1];
  581. if (_filetype.match(_imgtype)) {//如果获取的文件是符合的文件类型进行上传
  582. U.selectEl(_imgwarp).remove();
  583. _imgwarp = $$("div", { "className": "U_MD_R_content_operation_right_bottom_imgloadbox_warp" }, _el);
  584. $$("img", { "src": "http://fs.1473.cn/" + r.value[0] }, _imgwarp); //创建img
  585. $$("div", { "className": "closebtn", "onclick": "U.MD.R.uploadImages.close(this)" }, _imgwarp);
  586. U.alert("上传成功");
  587. } else {//否则提醒用户选择上传图片文件
  588. U.alert("请上传图片文件");
  589. return;
  590. }
  591. }, []);
  592. }
  593. /**
  594. * 图片关闭函数
  595. * @param {element} 事件源
  596. */
  597. U.MD.R.uploadImages.close = function (el) {
  598. U.selectEl(el).Parent().remove();
  599. }
  600. /**
  601. * 二级以下(包括二级、三级等等)评论点击回复后显示隐藏操作区域
  602. * @param {element} 事件源
  603. */
  604. U.MD.R.subsetReply = function (el) {
  605. // U.selectEl(el)
  606. var _el = U.selectEl($(el).Parent(2)).find(".U_MD_R_content_box_content_edit");
  607. if (_el[0].style.display == "block") {
  608. _el.hide();
  609. }
  610. else {
  611. _el.show();
  612. }
  613. }
  614. /**
  615. * 发表评论插入函数
  616. */
  617. U.MD.R.release = function (el, type, isreply, position) {//发表评论函数
  618. if (US.userInfo.userid) {
  619. var _el = el,
  620. _type = type,
  621. _isreply = isreply,
  622. _position = position,
  623. _content = U.selectEl(_el).find(".U_MD_R_Reply_Content")[0],
  624. _imgwarp = U.selectEl(_el).find(".U_MD_R_Reply_Image"),
  625. _uid = US.userInfo.userid,
  626. _un = US.userInfo.UserName,
  627. _utx = "http://fs.1473.cn/" + US.userInfo.UserImageHead,
  628. _box;
  629. if (_content.innerHTML.trim() != "" || _imgwarp.find("img").length > 0) {
  630. var _rid = Guid.newGuid(),
  631. _rpid = U.selectEl(el).attr("data-rid"),
  632. _pid = U.MD.R.data.PID,
  633. _aid = U.MD.R.data.AID,
  634. _rc = "",
  635. _rip = US.userInfo.RegisterIP,
  636. _url = U.MD.R.data.URL,
  637. _ra = null,
  638. _rd = U.selectEl(el).attr("data-rd"),
  639. _rbid = U.selectEl(el).attr("data-rbid"),
  640. _rpuid = U.selectEl(el).attr("data-rpuid"),
  641. _re = 1;
  642. if (position == 1) {
  643. _rd = 1;
  644. }
  645. else if (position == 2 || position == 3) {
  646. _rd = parseInt($(el).attr("data-rd")) + 1;
  647. }
  648. else {
  649. _rd = 3;
  650. _rpid = U.selectEl(el).attr("data-rpid");
  651. }
  652. if ($(_imgwarp).find("img").length > 0) {
  653. _rc = _content.innerHTML.trim() + _imgwarp.find("img")[0].outerHTML;
  654. }
  655. else {
  656. _rc = _content.innerHTML;
  657. }
  658. U.A.Request("http://cd.1473.cn/net", ["db.1473.cn", "UseStudio_Reply", "Reply_InsertReply", _rid, _rpid, _pid, _aid, _uid, _un, _utx, _rc, _rip, _url, _ra, _rd, _rpuid, _re, U.MD.R.getNowFormatDate()], function (r) {
  659. var _data = r.value[0], _appendtype, _readmore,
  660. _more = U.selectEl("div[data-rid='" + _data.ReplyParentID + "']").find(".U_MD_R_content_box_content_bottom_showmore_text_important span")[0],
  661. _more1 = U.selectEl("div[data-rid='" + _data.ReplyParentID + "']").find(".U_MD_R_content_box_content_bottom_showmore_text_secondary span")[0];
  662. U.selectEl(_el).find(".U_MD_R_Reply_Content")[0].innerHTML = "";
  663. U.UF.E.initEditor($(_el).find(".U_MD_R_Reply_Content")[0]); //调用函数
  664. U.selectEl(_el).find(".U_MD_R_Reply_Image")[0].innerHTML = "";
  665. if (_position == 1) {
  666. _readmore = false;
  667. _appendtype = true;
  668. _el = U.selectEl("#U_MD_R_content_user_comment")[0];
  669. }
  670. else {
  671. _readmore = true;
  672. _val = _more.innerText;
  673. // _val1 = _more1.innerText;
  674. if (_position == 2) {
  675. _el = U.selectEl(_el).Parent().nextSibling;
  676. _type = 2;
  677. _appendtype = true;
  678. }
  679. if (_position == 3) {
  680. if ($($(_el)[0].nextSibling).find(".U_MD_R_content_warp_box").length > 0) {
  681. _el = U.selectEl($(_el)[0].nextSibling).find(".U_MD_R_content_warp_box");
  682. }
  683. else {
  684. _el = $$("div", { "className": "U_MD_R_content_warp_box" }, U.selectEl($(_el)[0].nextSibling)[0]);
  685. //$(_el).attr({"data-replyid": _data[1][i].ReplyID});
  686. }
  687. _type = 2;
  688. }
  689. if (_position == 4) {
  690. _el = U.selectEl($(_el).Parent()).Parent();
  691. _type = 3;
  692. }
  693. _more.innerText = ++_val;
  694. //_more1.innerText = ++_val1;
  695. U.selectEl($(_content).Parent()).hide();
  696. }
  697. var _box = U.MD.R.printCommentHtml(_el, _type, {
  698. rid: _data.ReplyID,
  699. rpid: _data.ReplyParentID,
  700. deep: _data.ReplyDeep,
  701. topid: _data.ReplyTopID,
  702. uid: _data.UserID,
  703. tx: _data.ReplyUserThumbnailImageHead,
  704. un: _data.UserName,
  705. time: U.MD.R.getNowFormatDate() + '.0',
  706. content: _data.ReplyContent,
  707. replyinfo: {
  708. uid: _data.uid, //评论的用户id
  709. un: _data.un, //评论的用户名
  710. tx: _data.tx//评论的头像
  711. }
  712. }, _appendtype, _isreply, _readmore);
  713. // if (_position == 3) {
  714. // var _box1 = $$("div", {"className": "U_MD_R_content_warp_box"}, _box);
  715. // U.selectEl(_box1).attr({"data-replyid": _data[1][i].ReplyID});
  716. // }
  717. U.alert("评论成功");
  718. }
  719. );
  720. }
  721. else {
  722. U.alert("请输入评论内容");
  723. }
  724. }
  725. else {
  726. U.Alert("请先登录");
  727. }
  728. }
  729. /**
  730. * 点赞函数
  731. * @param {element} 事件源
  732. * @param {string} 评论id
  733. * @param {string} 用户id
  734. */
  735. U.MD.R.like = function (e, rid, uid) {
  736. if (US.userInfo.userid) {
  737. var _el = e, _rid = rid, _uid = uid;
  738. U.A.Request("http://cd.1473.cn/net", ["db.1473.cn", "UseStudio_Reply", "Reply_SelectRepeatLikes", _rid, _uid], function (r) {
  739. var _img = U.selectEl(_el).find("img")[0],
  740. _text = U.selectEl(_el).find(".U_MD_R_content_box_content_bottom_likeswarp_text")[0],
  741. _val = parseInt(_text.innerHTML);
  742. if (r.value[0].mode == 0) {
  743. _img.src = "/img/reply/NOFabulous.png";
  744. _text.innerHTML = --_val;
  745. }
  746. else {
  747. _img.src = "/img/reply/Fabulous.png";
  748. _text.innerHTML = ++_val;
  749. }
  750. });
  751. }
  752. else {
  753. U.Alert("请先登录");
  754. }
  755. }
  756. /**
  757. * 图片错误所执行的函数
  758. * @param {element} 事件源
  759. */
  760. U.MD.R.imgError = function (el) {
  761. U.selectEl(el)[0].src = "/img/UserHead/UseHead.jpg";
  762. }
  763. /**
  764. * 函数作用:调用登录函数
  765. */
  766. U.MD.R.login = function () {
  767. if ($("#U_MD_HomeC_Pop")[0]) {
  768. U.UF.F.windowTopCenter($("#U_MD_HomeC_Pop")[0]);
  769. }
  770. else {
  771. U.UF.CD.loadPageCrossDomain(function () { });
  772. U.MD.U.L.setLoginCallBack(function () {
  773. U.MD.R.login.cb();
  774. });
  775. }
  776. }
  777. /**
  778. * cookie登录,如果登录成功,则修改头像以及用户名
  779. */
  780. U.MD.R.login.cookieLogin = function (cb) {
  781. if (U.UF.Cookie.get("usestudiosso") && U.UF.Cookie.get("usestudiosso", "userid")[0]) {
  782. U.UF.CD.loadPageCrossDomain(function () {
  783. U.MD.U.L.loginCallBack = function () {
  784. cb && cb();
  785. U.selectEl(".U_MD_R_content_operation_userhead img")[0].src = 'http://fs.1473.cn/' + US.userInfo.UserThumbnailImageHead; //用户登录后的操作
  786. U.selectEl(".U_MD_R_content_operation_userlogin")[0].innerHTML = US.userInfo.UserName; //设置登录用户头像,登录用户名等操作
  787. }
  788. });
  789. } else {
  790. cb && cb();
  791. }
  792. }
  793. /**
  794. * 登录之后的回调函数
  795. */
  796. U.MD.R.login.cb = function () {
  797. U.selectEl(".U_MD_R_content_operation_userhead img")[0].src = 'http://fs.1473.cn/' + US.userInfo.UserThumbnailImageHead; //用户登录后的操作
  798. U.selectEl(".U_MD_R_content_operation_userlogin")[0].innerHTML = US.userInfo.UserName; //设置登录用户头像,登录用户名等操作
  799. }
  800. //获取当前时间
  801. U.MD.R.getNowFormatDate = function () {
  802. var date = new Date();
  803. var seperator1 = "-";
  804. var seperator2 = ":";
  805. var month = date.getMonth() + 1;
  806. var strDate = date.getDate();
  807. if (month >= 1 && month <= 9) {
  808. month = "0" + month;
  809. }
  810. if (strDate >= 0 && strDate <= 9) {
  811. strDate = "0" + strDate;
  812. }
  813. var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
  814. + " " + date.getHours() + seperator2 + date.getMinutes()
  815. + seperator2 + date.getSeconds();
  816. return currentdate;
  817. }