crowi.js 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937
  1. /* jshint browser: true, jquery: true */
  2. /* Author: Sotaro KARASAWA <sotarok@crocos.co.jp>
  3. */
  4. var jsdiff = require('diff');
  5. var io = require('socket.io-client');
  6. //require('bootstrap-sass');
  7. //require('jquery.cookie');
  8. var Crowi = {};
  9. if (!window) {
  10. window = {};
  11. }
  12. window.Crowi = Crowi;
  13. Crowi.createErrorView = function(msg) {
  14. $('#main').prepend($('<p class="alert-message error">' + msg + '</p>'));
  15. };
  16. Crowi.linkPath = function(revisionPath) {
  17. var $revisionPath = revisionPath || '#revision-path';
  18. var $title = $($revisionPath);
  19. var pathData = $('#content-main').data('path');
  20. if (!pathData) {
  21. return ;
  22. }
  23. var realPath = pathData.trim();
  24. if (realPath.substr(-1, 1) == '/') {
  25. realPath = realPath.substr(0, realPath.length - 1);
  26. }
  27. var path = '';
  28. var pathHtml = '';
  29. var splittedPath = realPath.split(/\//);
  30. splittedPath.shift();
  31. splittedPath.forEach(function(sub) {
  32. path += '/';
  33. pathHtml += ' <a href="' + Crowi.escape(path) + '">/</a> ';
  34. if (sub) {
  35. path += sub;
  36. pathHtml += '<a href="' + Crowi.escape(path) + '">' + Crowi.escape(sub) + '</a>';
  37. }
  38. });
  39. if (path.substr(-1, 1) != '/') {
  40. path += '/';
  41. pathHtml += ' <a href="' + Crowi.escape(path) + '" class="last-path">/</a>';
  42. }
  43. $title.html(pathHtml);
  44. };
  45. Crowi.correctHeaders = function(contentId) {
  46. // h1 ~ h6 の id 名を補正する
  47. var $content = $(contentId || '#revision-body-content');
  48. var i = 0;
  49. $('h1,h2,h3,h4,h5,h6', $content).each(function(idx, elm) {
  50. var id = 'head' + i++;
  51. $(this).attr('id', id);
  52. $(this).addClass('revision-head');
  53. $(this).append('<span class="revision-head-link"><a href="#' + id +'"><i class="fa fa-link"></i></a></span>');
  54. });
  55. };
  56. Crowi.revisionToc = function(contentId, tocId) {
  57. var $content = $(contentId || '#revision-body-content');
  58. var $tocId = $(tocId || '#revision-toc');
  59. var $tocContent = $('<div id="revision-toc-content" class="revision-toc-content collapse"></div>');
  60. $tocId.append($tocContent);
  61. $('h1', $content).each(function(idx, elm) {
  62. var id = $(this).attr('id');
  63. var title = $(this).text();
  64. var selector = '#' + id + ' ~ h2:not(#' + id + ' ~ h1 ~ h2)';
  65. var $toc = $('<ul></ul>');
  66. var $tocLi = $('<li><a href="#' + id +'">' + title + '</a></li>');
  67. $tocContent.append($toc);
  68. $toc.append($tocLi);
  69. $(selector).each(function()
  70. {
  71. var id2 = $(this).attr('id');
  72. var title2 = $(this).text();
  73. var selector2 = '#' + id2 + ' ~ h3:not(#' + id2 + ' ~ h2 ~ h3)';
  74. var $toc2 = $('<ul></ul>');
  75. var $tocLi2 = $('<li><a href="#' + id2 +'">' + title2 + '</a></li>');
  76. $tocLi.append($toc2);
  77. $toc2.append($tocLi2);
  78. $(selector2).each(function()
  79. {
  80. var id3 = $(this).attr('id');
  81. var title3 = $(this).text();
  82. var $toc3 = $('<ul></ul>');
  83. var $tocLi3 = $('<li><a href="#' + id3 +'">' + title3 + '</a></li>');
  84. $tocLi2.append($toc3);
  85. $toc3.append($tocLi3);
  86. });
  87. });
  88. });
  89. };
  90. Crowi.escape = function(s) {
  91. s = s.replace(/&/g, '&amp;')
  92. .replace(/</g, '&lt;')
  93. .replace(/>/g, '&gt;')
  94. .replace(/'/g, '&#39;')
  95. .replace(/"/g, '&quot;')
  96. ;
  97. return s;
  98. };
  99. Crowi.unescape = function(s) {
  100. s = s.replace(/&nbsp;/g, ' ')
  101. .replace(/&amp;/g, '&')
  102. .replace(/&lt;/g, '<')
  103. .replace(/&gt;/g, '>')
  104. .replace(/&#39;/g, '\'')
  105. .replace(/&quot;/g, '"')
  106. ;
  107. return s;
  108. };
  109. // original: middleware.swigFilter
  110. Crowi.userPicture = function (user) {
  111. if (!user) {
  112. return '/images/userpicture.png';
  113. }
  114. if (user.image && user.image != '/images/userpicture.png') {
  115. return user.image;
  116. } else {
  117. return '/images/userpicture.png';
  118. }
  119. };
  120. Crowi.modifyScrollTop = function() {
  121. var offset = 10;
  122. var hash = window.location.hash;
  123. if (hash === "") {
  124. return;
  125. }
  126. var pageHeader = document.querySelector('#page-header');
  127. if (!pageHeader) {
  128. return;
  129. }
  130. var pageHeaderRect = pageHeader.getBoundingClientRect();
  131. var sectionHeader = document.querySelector(hash);
  132. if (sectionHeader === null) {
  133. return;
  134. }
  135. var timeout = 0;
  136. if (window.scrollY === 0) {
  137. timeout = 200;
  138. }
  139. setTimeout(function() {
  140. var sectionHeaderRect = sectionHeader.getBoundingClientRect();
  141. if (sectionHeaderRect.top >= pageHeaderRect.bottom) {
  142. return;
  143. }
  144. window.scrollTo(0, (window.scrollY - pageHeaderRect.height - offset));
  145. }, timeout);
  146. }
  147. $(function() {
  148. var pageId = $('#content-main').data('page-id');
  149. var revisionId = $('#content-main').data('page-revision-id');
  150. var revisionCreatedAt = $('#content-main').data('page-revision-created');
  151. var currentUser = $('#content-main').data('current-user');
  152. var isSeen = $('#content-main').data('page-is-seen');
  153. var pagePath= $('#content-main').data('path');
  154. Crowi.linkPath();
  155. $('[data-toggle="popover"]').popover();
  156. $('[data-toggle="tooltip"]').tooltip();
  157. $('[data-tooltip-stay]').tooltip('show');
  158. $('#toggle-sidebar').click(function(e) {
  159. var $mainContainer = $('.main-container');
  160. if ($mainContainer.hasClass('aside-hidden')) {
  161. $('.main-container').removeClass('aside-hidden');
  162. $.cookie('aside-hidden', 0, { expires: 30, path: '/' });
  163. } else {
  164. $mainContainer.addClass('aside-hidden');
  165. $.cookie('aside-hidden', 1, { expires: 30, path: '/' });
  166. }
  167. return false;
  168. });
  169. if ($.cookie('aside-hidden') == 1) {
  170. $('.main-container').addClass('aside-hidden');
  171. }
  172. $('.copy-link').on('click', function () {
  173. $(this).select();
  174. });
  175. $('#create-page').on('shown.bs.modal', function (e) {
  176. var input2Width = $('#create-page-today .col-xs-10').outerWidth();
  177. var newWidth = input2Width
  178. - $('#create-page-today .page-today-prefix').outerWidth()
  179. - $('#create-page-today .page-today-input1').outerWidth()
  180. - $('#create-page-today .page-today-suffix').outerWidth()
  181. - 40
  182. ;
  183. $('#create-page-today .form-control.page-today-input2').css({width: newWidth}).focus();
  184. });
  185. $('#create-page-today').submit(function(e) {
  186. var prefix1 = $('input.page-today-input1', this).data('prefix');
  187. var input1 = $('input.page-today-input1', this).val();
  188. var prefix2 = $('input.page-today-input2', this).data('prefix');
  189. var input2 = $('input.page-today-input2', this).val();
  190. if (input1 === '') {
  191. prefix1 = 'メモ';
  192. }
  193. if (input2 === '') {
  194. prefix2 = prefix2.slice(0, -1);
  195. }
  196. top.location.href = prefix1 + input1 + prefix2 + input2;
  197. return false;
  198. });
  199. $('#create-page-under-tree').submit(function(e) {
  200. var name = $('input', this).val();
  201. if (!name.match(/^\//)) {
  202. name = '/' + name;
  203. }
  204. if (name.match(/.+\/$/)) {
  205. name = name.substr(0, name.length - 1);
  206. }
  207. top.location.href = name;
  208. return false;
  209. });
  210. // rename
  211. $('#renamePage').on('shown.bs.modal', function (e) {
  212. $('#newPageName').focus();
  213. });
  214. $('#renamePageForm, #unportalize-form').submit(function(e) {
  215. $.ajax({
  216. type: 'POST',
  217. url: '/_api/pages.rename',
  218. data: $(this).serialize(),
  219. dataType: 'json'
  220. }).done(function(res) {
  221. if (!res.ok) {
  222. $('#newPageNameCheck').html('<i class="fa fa-times-circle"></i> ' + res.error);
  223. $('#newPageNameCheck').addClass('alert-danger');
  224. } else {
  225. var page = res.page;
  226. $('#newPageNameCheck').removeClass('alert-danger');
  227. $('#newPageNameCheck').html('<img src="/images/loading_s.gif"> 移動しました。移動先にジャンプします。');
  228. setTimeout(function() {
  229. top.location.href = page.path + '?renamed=' + pagePath;
  230. }, 1000);
  231. }
  232. });
  233. return false;
  234. });
  235. // delete
  236. $('#delete-page-form').submit(function(e) {
  237. $.ajax({
  238. type: 'POST',
  239. url: '/_api/pages.remove',
  240. data: $('#delete-page-form').serialize(),
  241. dataType: 'json'
  242. }).done(function(res) {
  243. if (!res.ok) {
  244. $('#delete-errors').html('<i class="fa fa-times-circle"></i> ' + res.error);
  245. $('#delete-errors').addClass('alert-danger');
  246. } else {
  247. var page = res.page;
  248. top.location.href = page.path;
  249. }
  250. });
  251. return false;
  252. });
  253. $('#revert-delete-page-form').submit(function(e) {
  254. $.ajax({
  255. type: 'POST',
  256. url: '/_api/pages.revertRemove',
  257. data: $('#revert-delete-page-form').serialize(),
  258. dataType: 'json'
  259. }).done(function(res) {
  260. if (!res.ok) {
  261. $('#delete-errors').html('<i class="fa fa-times-circle"></i> ' + res.error);
  262. $('#delete-errors').addClass('alert-danger');
  263. } else {
  264. var page = res.page;
  265. top.location.href = page.path;
  266. }
  267. });
  268. return false;
  269. });
  270. $('#create-portal-button').on('click', function(e) {
  271. $('.portal').removeClass('hide');
  272. $('.content-main').addClass('on-edit');
  273. $('.portal a[data-toggle="tab"][href="#edit-form"]').tab('show');
  274. var path = $('.content-main').data('path');
  275. if (path != '/' && $('.content-main').data('page-id') == '') {
  276. var upperPage = path.substr(0, path.length - 1);
  277. $.get('/_api/pages.get', {path: upperPage}, function(res) {
  278. if (res.ok && res.page) {
  279. $('#portal-warning-modal').modal('show');
  280. }
  281. });
  282. }
  283. });
  284. $('#portal-form-close').on('click', function(e) {
  285. $('.portal').addClass('hide');
  286. $('.content-main').removeClass('on-edit');
  287. return false;
  288. });
  289. // list-link
  290. $('.page-list-link').each(function() {
  291. var $link = $(this);
  292. var text = $link.text();
  293. var path = $link.data('path');
  294. var shortPath = new String($link.data('short-path'));
  295. var escape = function(s) {
  296. return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
  297. };
  298. path = Crowi.escape(path);
  299. var pattern = escape(Crowi.escape(shortPath)) + '(/)?$';
  300. $link.html(path.replace(new RegExp(pattern), '<strong>' + shortPath + '$1</strong>'));
  301. });
  302. // for list page
  303. $('a[data-toggle="tab"][href="#view-timeline"]').on('show.bs.tab', function() {
  304. var isShown = $('#view-timeline').data('shown');
  305. if (isShown == 0) {
  306. $('#view-timeline .timeline-body').each(function()
  307. {
  308. var id = $(this).attr('id');
  309. var contentId = '#' + id + ' > script';
  310. var revisionBody = '#' + id + ' .revision-body';
  311. var revisionPath = '#' + id + ' .revision-path';
  312. var markdown = Crowi.unescape($(contentId).html());
  313. var parsedHTML = crowiRenderer.render(markdown);
  314. $(revisionBody).html(parsedHTML);
  315. $('.template-create-button', revisionBody).on('click', function() {
  316. var path = $(this).data('path');
  317. var templateId = $(this).data('template');
  318. var template = $('#' + templateId).html();
  319. crowi.saveDraft(path, template);
  320. top.location.href = path;
  321. });
  322. });
  323. $('#view-timeline').data('shown', 1);
  324. }
  325. });
  326. // login
  327. $('#register').on('click', function() {
  328. $('#login-dialog').addClass('to-flip');
  329. return false;
  330. });
  331. $('#login').on('click', function() {
  332. $('#login-dialog').removeClass('to-flip');
  333. return false;
  334. });
  335. $('#register-form input[name="registerForm[username]"]').change(function(e) {
  336. var username = $(this).val();
  337. $('#input-group-username').removeClass('has-error');
  338. $('#help-block-username').html("");
  339. $.getJSON('/_api/check_username', {username: username}, function(json) {
  340. if (!json.valid) {
  341. $('#help-block-username').html('<i class="fa fa-warning"></i>このユーザーIDは利用できません。<br>');
  342. $('#input-group-username').addClass('has-error');
  343. }
  344. });
  345. });
  346. if (pageId) {
  347. // if page exists
  348. var $rawTextOriginal = $('#raw-text-original');
  349. if ($rawTextOriginal.length > 0) {
  350. var markdown = Crowi.unescape($('#raw-text-original').html());
  351. var parsedHTML = crowiRenderer.render(markdown);
  352. $('#revision-body-content').html(parsedHTML);
  353. $('.template-create-button').on('click', function() {
  354. var path = $(this).data('path');
  355. var templateId = $(this).data('template');
  356. var template = $('#' + templateId).html();
  357. crowi.saveDraft(path, template);
  358. top.location.href = path;
  359. });
  360. Crowi.correctHeaders('#revision-body-content');
  361. Crowi.revisionToc('#revision-body-content', '#revision-toc');
  362. }
  363. // header
  364. var $header = $('#page-header');
  365. if ($header.length > 0) {
  366. var headerHeight = $header.outerHeight(true);
  367. $('.header-wrap').css({height: (headerHeight + 16) + 'px'});
  368. $header.affix({
  369. offset: {
  370. top: function() {
  371. return headerHeight + 86; // (54 header + 16 header padding-top + 16 content padding-top)
  372. }
  373. }
  374. });
  375. $('[data-affix-disable]').on('click', function(e) {
  376. var $elm = $($(this).data('affix-disable'));
  377. $(window).off('.affix');
  378. $elm.removeData('affix').removeClass('affix affix-top affix-bottom');
  379. return false;
  380. });
  381. }
  382. // omg
  383. function createCommentHTML(revision, creator, comment, commentedAt) {
  384. var $comment = $('<div>');
  385. var $commentImage = $('<img class="picture picture-rounded">')
  386. .attr('src', Crowi.userPicture(creator));
  387. var $commentCreator = $('<div class="page-comment-creator">')
  388. .text(creator.username);
  389. var $commentRevision = $('<a class="page-comment-revision label">')
  390. .attr('href', '?revision=' + revision)
  391. .text(revision.substr(0,8));
  392. if (revision !== revisionId) {
  393. $commentRevision.addClass('label-default');
  394. } else {
  395. $commentRevision.addClass('label-primary');
  396. }
  397. var $commentMeta = $('<div class="page-comment-meta">')
  398. .text(commentedAt + ' ')
  399. .append($commentRevision);
  400. var $commentBody = $('<div class="page-comment-body">')
  401. .html(comment.replace(/(\r\n|\r|\n)/g, '<br>'));
  402. var $commentMain = $('<div class="page-comment-main">')
  403. .append($commentCreator)
  404. .append($commentBody)
  405. .append($commentMeta)
  406. $comment.addClass('page-comment');
  407. if (creator._id === currentUser) {
  408. $comment.addClass('page-comment-me');
  409. }
  410. if (revision !== revisionId) {
  411. $comment.addClass('page-comment-old');
  412. }
  413. $comment
  414. .append($commentImage)
  415. .append($commentMain);
  416. return $comment;
  417. }
  418. // get comments
  419. var $pageCommentList = $('.page-comments-list');
  420. var $pageCommentListNewer = $('#page-comments-list-newer');
  421. var $pageCommentListCurrent = $('#page-comments-list-current');
  422. var $pageCommentListOlder = $('#page-comments-list-older');
  423. var hasNewer = false;
  424. var hasOlder = false;
  425. $.get('/_api/comments.get', {page_id: pageId}, function(res) {
  426. if (res.ok) {
  427. var comments = res.comments;
  428. $.each(comments, function(i, comment) {
  429. var commentContent = createCommentHTML(comment.revision, comment.creator, comment.comment, comment.createdAt);
  430. if (comment.revision == revisionId) {
  431. $pageCommentListCurrent.append(commentContent);
  432. } else {
  433. if (Date.parse(comment.createdAt)/1000 > revisionCreatedAt) {
  434. $pageCommentListNewer.append(commentContent);
  435. hasNewer = true;
  436. } else {
  437. $pageCommentListOlder.append(commentContent);
  438. hasOlder = true;
  439. }
  440. }
  441. });
  442. }
  443. }).fail(function(data) {
  444. }).always(function() {
  445. if (!hasNewer) {
  446. $('.page-comments-list-toggle-newer').hide();
  447. }
  448. if (!hasOlder) {
  449. $pageCommentListOlder.addClass('collapse');
  450. $('.page-comments-list-toggle-older').hide();
  451. }
  452. });
  453. // post comment event
  454. $('#page-comment-form').on('submit', function() {
  455. var $button = $('#comment-form-button');
  456. $button.attr('disabled', 'disabled');
  457. $.post('/_api/comments.add', $(this).serialize(), function(data) {
  458. $button.removeAttr('disabled');
  459. if (data.ok) {
  460. var comment = data.comment;
  461. $pageCommentList.prepend(createCommentHTML(comment.revision, comment.creator, comment.comment, comment.createdAt));
  462. $('#comment-form-comment').val('');
  463. $('#comment-form-message').text('');
  464. } else {
  465. $('#comment-form-message').text(data.error);
  466. }
  467. }).fail(function(data) {
  468. if (data.status !== 200) {
  469. $('#comment-form-message').text(data.statusText);
  470. }
  471. });
  472. return false;
  473. });
  474. // attachment
  475. var $pageAttachmentList = $('.page-attachments ul');
  476. $.get('/_api/attachment/page/' + pageId, function(res) {
  477. var attachments = res.data.attachments;
  478. if (attachments.length > 0) {
  479. $.each(attachments, function(i, file) {
  480. $pageAttachmentList.append(
  481. '<li><a href="' + file.fileUrl + '">' + (file.originalName || file.fileName) + '</a> <span class="label label-default">' + file.fileFormat + '</span></li>'
  482. );
  483. })
  484. } else {
  485. $('.page-attachments').remove();
  486. }
  487. });
  488. // bookmark
  489. var $bookmarkButton = $('#bookmark-button');
  490. $.get('/_api/bookmarks.get', {page_id: pageId}, function(res) {
  491. if (res.ok) {
  492. if (res.bookmark) {
  493. MarkBookmarked();
  494. }
  495. }
  496. });
  497. $bookmarkButton.click(function() {
  498. var bookmarked = $bookmarkButton.data('bookmarked');
  499. var token = $bookmarkButton.data('csrftoken');
  500. if (!bookmarked) {
  501. $.post('/_api/bookmarks.add', {_csrf: token, page_id: pageId}, function(res) {
  502. if (res.ok && res.bookmark) {
  503. MarkBookmarked();
  504. }
  505. });
  506. } else {
  507. $.post('/_api/bookmarks.remove', {_csrf: token, page_id: pageId}, function(res) {
  508. if (res.ok) {
  509. MarkUnBookmarked();
  510. }
  511. });
  512. }
  513. return false;
  514. });
  515. function MarkBookmarked()
  516. {
  517. $('i', $bookmarkButton)
  518. .removeClass('fa-star-o')
  519. .addClass('fa-star');
  520. $bookmarkButton.data('bookmarked', 1);
  521. }
  522. function MarkUnBookmarked()
  523. {
  524. $('i', $bookmarkButton)
  525. .removeClass('fa-star')
  526. .addClass('fa-star-o');
  527. $bookmarkButton.data('bookmarked', 0);
  528. }
  529. // Like
  530. var $likeButton = $('#like-button');
  531. var $likeCount = $('#like-count');
  532. $likeButton.click(function() {
  533. var liked = $likeButton.data('liked');
  534. var token = $likeButton.data('csrftoken');
  535. if (!liked) {
  536. $.post('/_api/likes.add', {_csrf: token, page_id: pageId}, function(res) {
  537. if (res.ok) {
  538. MarkLiked();
  539. }
  540. });
  541. } else {
  542. $.post('/_api/likes.remove', {_csrf: token, page_id: pageId}, function(res) {
  543. if (res.ok) {
  544. MarkUnLiked();
  545. }
  546. });
  547. }
  548. return false;
  549. });
  550. var $likerList = $("#liker-list");
  551. var likers = $likerList.data('likers');
  552. if (likers && likers.length > 0) {
  553. // FIXME: user data cache
  554. $.get('/_api/users.list', {user_ids: likers}, function(res) {
  555. // ignore unless response has error
  556. if (res.ok) {
  557. AddToLikers(res.users);
  558. }
  559. });
  560. }
  561. function AddToLikers (users) {
  562. $.each(users, function(i, user) {
  563. $likerList.append(CreateUserLinkWithPicture(user));
  564. });
  565. }
  566. function MarkLiked()
  567. {
  568. $likeButton.addClass('active');
  569. $likeButton.data('liked', 1);
  570. $likeCount.text(parseInt($likeCount.text()) + 1);
  571. }
  572. function MarkUnLiked()
  573. {
  574. $likeButton.removeClass('active');
  575. $likeButton.data('liked', 0);
  576. $likeCount.text(parseInt($likeCount.text()) - 1);
  577. }
  578. if (!isSeen) {
  579. $.post('/_api/pages.seen', {page_id: pageId}, function(res) {
  580. // ignore unless response has error
  581. if (res.ok && res.seenUser) {
  582. $('#content-main').data('page-is-seen', 1);
  583. }
  584. });
  585. }
  586. var $seenUserList = $("#seen-user-list");
  587. if ($seenUserList && $seenUserList.length > 0) {
  588. var seenUsers = $seenUserList.data('seen-users');
  589. var seenUsersArray = seenUsers.split(',');
  590. if (seenUsers && seenUsersArray.length > 0 && seenUsersArray.length <= 10) {
  591. // FIXME: user data cache
  592. $.get('/_api/users.list', {user_ids: seenUsers}, function(res) {
  593. // ignore unless response has error
  594. if (res.ok) {
  595. AddToSeenUser(res.users);
  596. }
  597. });
  598. }
  599. }
  600. function CreateUserLinkWithPicture (user) {
  601. var $userHtml = $('<a>');
  602. $userHtml.data('user-id', user._id);
  603. $userHtml.attr('href', '/user/' + user.username);
  604. $userHtml.attr('title', user.name);
  605. var $userPicture = $('<img class="picture picture-xs picture-rounded">');
  606. $userPicture.attr('alt', user.name);
  607. $userPicture.attr('src', Crowi.userPicture(user));
  608. $userHtml.append($userPicture);
  609. return $userHtml;
  610. }
  611. function AddToSeenUser (users) {
  612. $.each(users, function(i, user) {
  613. $seenUserList.append(CreateUserLinkWithPicture(user));
  614. });
  615. }
  616. // History Diff
  617. var allRevisionIds = [];
  618. $.each($('.diff-view'), function() {
  619. allRevisionIds.push($(this).data('revisionId'));
  620. });
  621. $('.diff-view').on('click', function(e) {
  622. e.preventDefault();
  623. var getBeforeRevisionId = function(revisionId) {
  624. var currentPos = $.inArray(revisionId, allRevisionIds);
  625. if (currentPos < 0) {
  626. return false;
  627. }
  628. var beforeRevisionId = allRevisionIds[currentPos + 1];
  629. if (typeof beforeRevisionId === 'undefined') {
  630. return false;
  631. }
  632. return beforeRevisionId;
  633. };
  634. var revisionId = $(this).data('revisionId');
  635. var beforeRevisionId = getBeforeRevisionId(revisionId);
  636. var $diffDisplay = $('#diff-display-' + revisionId);
  637. var $diffIcon = $('#diff-icon-' + revisionId);
  638. if ($diffIcon.hasClass('fa-arrow-circle-right')) {
  639. $diffIcon.removeClass('fa-arrow-circle-right');
  640. $diffIcon.addClass('fa-arrow-circle-down');
  641. } else {
  642. $diffIcon.removeClass('fa-arrow-circle-down');
  643. $diffIcon.addClass('fa-arrow-circle-right');
  644. }
  645. if (beforeRevisionId === false) {
  646. $diffDisplay.text('差分はありません');
  647. $diffDisplay.slideToggle();
  648. } else {
  649. var revisionIds = revisionId + ',' + beforeRevisionId;
  650. if ($diffDisplay.data('loaded')) {
  651. $diffDisplay.slideToggle();
  652. return true;
  653. }
  654. $.ajax({
  655. type: 'GET',
  656. url: '/_api/revisions.list?revision_ids=' + revisionIds,
  657. dataType: 'json'
  658. }).done(function(res) {
  659. var currentText = res[0].body;
  660. var previousText = res[1].body;
  661. $diffDisplay.text('');
  662. var diff = jsdiff.diffLines(previousText, currentText);
  663. diff.forEach(function(part) {
  664. var color = part.added ? 'green' : part.removed ? 'red' : 'grey';
  665. var $span = $('<span>');
  666. $span.css('color', color);
  667. $span.text(part.value);
  668. $diffDisplay.append($span);
  669. });
  670. $diffDisplay.data('loaded', 1);
  671. $diffDisplay.slideToggle();
  672. });
  673. }
  674. });
  675. // default open
  676. $('a[data-toggle="tab"][href="#revision-history"]').on('show.bs.tab', function() {
  677. $('.diff-view').each(function(i, diffView) {
  678. if (i < 2) {
  679. $(diffView).click();
  680. }
  681. });
  682. });
  683. // presentation
  684. var presentaionInitialized = false
  685. , $b = $('body');
  686. $(document).on('click', '.toggle-presentation', function(e) {
  687. var $a = $(this);
  688. e.preventDefault();
  689. $b.toggleClass('overlay-on');
  690. if (!presentaionInitialized) {
  691. presentaionInitialized = true;
  692. $('<iframe />').attr({
  693. src: $a.attr('href')
  694. }).appendTo($('#presentation-container'));
  695. }
  696. }).on('click', '.fullscreen-layer', function() {
  697. $b.toggleClass('overlay-on');
  698. });
  699. //
  700. var me = $('body').data('me');
  701. var socket = io();
  702. socket.on('page edited', function (data) {
  703. if (data.user._id != me
  704. && data.page.path == pagePath) {
  705. $('#notifPageEdited').show();
  706. $('#notifPageEdited .edited-user').html(data.user.name);
  707. }
  708. });
  709. } // end if pageId
  710. // hash handling
  711. $('a[data-toggle="tab"][href="#revision-history"]').on('show.bs.tab', function() {
  712. window.history.pushState('', 'History', '#revision-history');
  713. });
  714. $('a[data-toggle="tab"][href="#edit-form"]').on('show.bs.tab', function() {
  715. window.history.pushState('', 'Edit', '#edit-form');
  716. });
  717. $('a[data-toggle="tab"][href="#revision-body"]').on('show.bs.tab', function() {
  718. window.history.pushState('', '', location.href.replace(location.hash, ''));
  719. });
  720. });
  721. Crowi.findHashFromUrl = function(url)
  722. {
  723. var match;
  724. if (match = url.match(/#(.+)$/)) {
  725. return '#' + match[1];
  726. }
  727. return "";
  728. }
  729. Crowi.unhighlightSelectedSection = function(hash)
  730. {
  731. if (!hash || hash == "" || !hash.match(/^#head.+/)) {
  732. // とりあえず head* だけ (検索結果ページで副作用出た
  733. return true;
  734. }
  735. $(hash).removeClass('highlighted');
  736. }
  737. Crowi.highlightSelectedSection = function(hash)
  738. {
  739. if (!hash || hash == "" || !hash.match(/^#head.+/)) {
  740. // とりあえず head* だけ (検索結果ページで副作用出た
  741. return true;
  742. }
  743. $(hash).addClass('highlighted');
  744. }
  745. window.addEventListener('load', function(e) {
  746. // hash on page
  747. if (location.hash) {
  748. if (location.hash == '#edit-form') {
  749. $('a[data-toggle="tab"][href="#edit-form"]').tab('show');
  750. }
  751. if (location.hash == '#revision-history') {
  752. $('a[data-toggle="tab"][href="#revision-history"]').tab('show');
  753. }
  754. }
  755. if (crowi && crowi.users || crowi.users.length == 0) {
  756. var totalUsers = crowi.users.length;
  757. var $listLiker = $('.page-list-liker');
  758. $listLiker.each(function(i, liker) {
  759. var count = $(liker).data('count') || 0;
  760. if (count/totalUsers > 0.05) {
  761. $(liker).addClass('popular-page-high');
  762. // 5%
  763. } else if (count/totalUsers > 0.02) {
  764. $(liker).addClass('popular-page-mid');
  765. // 2%
  766. } else if (count/totalUsers > 0.005) {
  767. $(liker).addClass('popular-page-low');
  768. // 0.5%
  769. }
  770. });
  771. var $listSeer = $('.page-list-seer');
  772. $listSeer.each(function(i, seer) {
  773. var count = $(seer).data('count') || 0;
  774. if (count/totalUsers > 0.10) {
  775. // 10%
  776. $(seer).addClass('popular-page-high');
  777. } else if (count/totalUsers > 0.05) {
  778. // 5%
  779. $(seer).addClass('popular-page-mid');
  780. } else if (count/totalUsers > 0.02) {
  781. // 2%
  782. $(seer).addClass('popular-page-low');
  783. }
  784. });
  785. }
  786. Crowi.highlightSelectedSection(location.hash);
  787. Crowi.modifyScrollTop();
  788. });
  789. window.addEventListener('hashchange', function(e) {
  790. Crowi.unhighlightSelectedSection(Crowi.findHashFromUrl(e.oldURL));
  791. Crowi.highlightSelectedSection(Crowi.findHashFromUrl(e.newURL));
  792. Crowi.modifyScrollTop();
  793. // hash on page
  794. if (location.hash) {
  795. if (location.hash == '#edit-form') {
  796. $('a[data-toggle="tab"][href="#edit-form"]').tab('show');
  797. }
  798. if (location.hash == '#revision-history') {
  799. $('a[data-toggle="tab"][href="#revision-history"]').tab('show');
  800. }
  801. }
  802. if (location.hash == '' || location.hash.match(/^#head.+/)) {
  803. $('a[data-toggle="tab"][href="#revision-body"]').tab('show');
  804. }
  805. });