qna.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361
  1. var QnA = {
  2. // @fixme: Should use ID
  3. close: function (form, best) {
  4. var notice = $(form).closest('li.h-entry.notice.question');
  5. notice.find('input#qna-best-answer,#qna-question-close').hide();
  6. notice.find('textarea').hide();
  7. var list = notice.find('ul');
  8. notice.find('ul > li.notice-answer-placeholder').remove();
  9. notice.find('ul > li.notice-answer').remove();
  10. if (best) {
  11. var p = notice.parent().find('div.question-description > form > fieldset > p');
  12. if (p.length != 0) {
  13. p.append($('<span class="question-closed">This question is closed.</span>'));
  14. }
  15. }
  16. },
  17. init: function () {
  18. QnA.NoticeInlineAnswerSetup();
  19. $(document).on('submit', 'form.form_question_show', function () {
  20. QnA.close(this);
  21. });
  22. $(document).on('submit', 'form.form_answer_show', function () {
  23. QnA.close(this, true);
  24. });
  25. },
  26. /**
  27. * Open up a question's inline answer box.
  28. *
  29. * @param {jQuery} notice: jQuery object containing one notice
  30. */
  31. NoticeInlineAnswerTrigger: function (notice) {
  32. // Find the notice we're replying to...
  33. var id = $($('.notice_id', notice)[0]).text();
  34. var parentNotice = notice;
  35. // Find the threaded replies view we'll be adding to...
  36. var list = notice.closest('.notices');
  37. if (list.hasClass('threaded-replies')) {
  38. // We're replying to a reply; use reply form on the end of this list.
  39. // We'll add our form at the end of this; grab the root notice.
  40. parentNotice = list.closest('.notice');
  41. } else {
  42. // We're replying to a parent notice; pull its threaded list
  43. // and we'll add on the end of it. Will add if needed.
  44. list = $('ul.threaded-replies', notice);
  45. }
  46. // See if the form's already open...
  47. var answerForm = $('.qna_answer_form', list);
  48. var hideReplyPlaceholders = function (notice) {
  49. // Do we still have a dummy answer placeholder? If so get rid of
  50. // reply place holders for this question. If the current user hasn't
  51. // answered the question we want to direct her to providing an
  52. // answer. She can still reply by hitting the reply button if she
  53. // really wants to.
  54. var dummyAnswer = $('ul.qna-dummy', notice);
  55. if (dummyAnswer.length > 0) {
  56. notice.find('li.notice-reply-placeholder').hide();
  57. }
  58. }
  59. var nextStep = function () {
  60. var dummyAnswer = $('ul.qna-dummy', notice);
  61. dummyAnswer.hide();
  62. // Set focus...
  63. var text = answerForm.find('textarea');
  64. if (text.length == 0) {
  65. throw "No textarea";
  66. }
  67. text.focus();
  68. $('body').click(function (e) {
  69. var dummyAnswer = $('ul.qna-dummy', notice);
  70. var style = dummyAnswer.attr('style');
  71. var ans = $(notice).find('li.h-entry.notice.anwer', notice)
  72. if (ans > 0) {
  73. hideReplyPlaceholders(notice);
  74. }
  75. var openAnswers = $('li.notice-answer');
  76. if (openAnswers.length > 0) {
  77. var target = $(e.target);
  78. openAnswers.each(function () {
  79. // Did we click outside this one?
  80. var answerItem = $(this);
  81. var parentNotice = answerItem.closest('li.notice');
  82. if (answerItem.has(e.target).length == 0) {
  83. var textarea = answerItem.find('.notice_data-text:first');
  84. var cur = $.trim(textarea.val());
  85. // Only close if there's been no edit.
  86. if (cur == '' || cur == textarea.data('initialText')) {
  87. answerItem.remove();
  88. dummyAnswer.show();
  89. }
  90. }
  91. });
  92. }
  93. });
  94. };
  95. // See if the form's already open...
  96. if (answerForm.length > 0 ) {
  97. nextStep();
  98. } else {
  99. var placeholder = list.find('li.qna-dummy-placeholder').hide();
  100. // Create the answer form entry at the end
  101. var answerItem = $('li.notice-answer', list);
  102. if (answerItem.length == 0) {
  103. answerItem = $('<li class="notice-answer"></li>');
  104. var intermediateStep = function (formMaster) {
  105. // @todo cache the form if we can (worth it?)
  106. var formEl = document._importNode(formMaster, true);
  107. $(formEl).data('NoticeFormSetup', true);
  108. answerItem.append(formEl);
  109. list.prepend(answerItem); // *before* the placeholder
  110. var form = answerForm = $(formEl);
  111. QnA.AnswerFormSetup(form);
  112. nextStep();
  113. };
  114. if (QnA.AnswerFormMaster) {
  115. // @todo if we had a cached for here's where we'd use it'
  116. intermediateStep(QnA.AnswerFormMaster);
  117. } else {
  118. // Fetch a fresh copy of the answer form over AJAX.
  119. // Warning: this can have a delay, which looks bad.
  120. // @fixme this fallback may or may not work
  121. var url = $('#answer-action').attr('value');
  122. $.get(url, {ajax: 1}, function (data, textStatus, xhr) {
  123. intermediateStep($('form', data)[0]);
  124. });
  125. }
  126. }
  127. }
  128. },
  129. /**
  130. * Setup function -- DOES NOT apply immediately.
  131. *
  132. * Sets up event handlers for inline reply mini-form placeholders.
  133. * Uses 'live' rather than 'bind', so applies to future as well as present items.
  134. */
  135. NoticeInlineAnswerSetup: function () {
  136. $(document).on('focus',
  137. 'li.qna-dummy-placeholder input.placeholder',
  138. function () {
  139. var notice = $(this).closest('li.notice');
  140. QnA.NoticeInlineAnswerTrigger(notice);
  141. return false;
  142. });
  143. },
  144. AnswerFormSetup: function (form) {
  145. form.find('textarea').focus();
  146. if (!form.data('NoticeFormSetup')) {
  147. alert('gargargar');
  148. }
  149. if (!form.data('AnswerFormSetup')) {
  150. //SN.U.NoticeLocationAttach(form);
  151. QnA.FormAnswerXHR(form);
  152. //SN.U.FormNoticeEnhancements(form);
  153. //SN.U.NoticeDataAttach(form);
  154. form.data('NoticeFormSetup', true);
  155. }
  156. },
  157. /**
  158. * Setup function -- DOES NOT trigger actions immediately.
  159. *
  160. * Sets up event handlers for special-cased async submission of the
  161. * answer-posting form, including some pre-post validation.
  162. *
  163. * @fixme geodata
  164. * @fixme refactor and unify with FormNoticeXHR in util.js
  165. *
  166. * @param {jQuery} form: jQuery object whose first element is a form
  167. *
  168. * @access public
  169. */
  170. FormAnswerXHR: function (form) {
  171. //SN.C.I.NoticeDataGeo = {};
  172. form.append('<input type="hidden" name="ajax" value="1"/>');
  173. // Make sure we don't have a mixed HTTP/HTTPS submission...
  174. form.attr('action', SN.U.RewriteAjaxAction(form.attr('action')));
  175. /**
  176. * Show a response feedback bit under the new-notice dialog.
  177. *
  178. * @param {String} cls: CSS class name to use ('error' or 'success')
  179. * @param {String} text
  180. * @access private
  181. */
  182. var showFeedback = function (cls, text) {
  183. form.append(
  184. $('<p class="form_response"></p>')
  185. .addClass(cls)
  186. .text(text)
  187. );
  188. };
  189. /**
  190. * Hide the previous response feedback, if any.
  191. */
  192. var removeFeedback = function () {
  193. form.find('.form_response').remove();
  194. };
  195. form.ajaxForm({
  196. dataType: 'xml',
  197. timeout: '60000',
  198. beforeSend: function (formData) {
  199. if (form.find('.notice_data-text:first').val() == '') {
  200. form.addClass(SN.C.S.Warning);
  201. return false;
  202. }
  203. form
  204. .addClass(SN.C.S.Processing)
  205. .find('.submit')
  206. .addClass(SN.C.S.Disabled)
  207. .attr(SN.C.S.Disabled, SN.C.S.Disabled);
  208. return true;
  209. },
  210. error: function (xhr, textStatus, errorThrown) {
  211. form
  212. .removeClass(SN.C.S.Processing)
  213. .find('.submit')
  214. .removeClass(SN.C.S.Disabled)
  215. .removeAttr(SN.C.S.Disabled, SN.C.S.Disabled);
  216. removeFeedback();
  217. if (textStatus == 'timeout') {
  218. // @fixme i18n
  219. showFeedback('error', 'Sorry! We had trouble sending your notice. The servers are overloaded. Please try again, and contact the site administrator if this problem persists.');
  220. }
  221. else {
  222. var response = SN.U.GetResponseXML(xhr);
  223. if ($('.'+SN.C.S.Error, response).length > 0) {
  224. form.append(document._importNode($('.'+SN.C.S.Error, response)[0], true));
  225. }
  226. else {
  227. if (parseInt(xhr.status) === 0 || jQuery.inArray(parseInt(xhr.status), SN.C.I.HTTP20x30x) >= 0) {
  228. form
  229. .resetForm()
  230. .find('.attach-status').remove();
  231. SN.U.FormNoticeEnhancements(form);
  232. }
  233. else {
  234. // @fixme i18n
  235. showFeedback('error', '(Sorry! We had trouble sending your notice ('+xhr.status+' '+xhr.statusText+'). Please report the problem to the site administrator if this happens again.');
  236. }
  237. }
  238. }
  239. },
  240. success: function (data, textStatus) {
  241. removeFeedback();
  242. var errorResult = $('#'+SN.C.S.Error, data);
  243. if (errorResult.length > 0) {
  244. showFeedback('error', errorResult.text());
  245. }
  246. else {
  247. // New notice post was successful. If on our timeline, show it!
  248. var notice = document._importNode($('li', data)[0], true);
  249. var notices = $('#notices_primary .notices:first');
  250. var answerItem = form.closest('li.notice-answer');
  251. var questionItem = form.closest('li.question');
  252. var dummyAnswer = form.find('ul.qna-dummy', questionItem).remove();
  253. if (answerItem.length > 0) {
  254. // If this is an inline answer, remove the form...
  255. var list = form.closest('.threaded-replies');
  256. // if the inserted notice's parent question needs it give it a placeholder
  257. var ans = questionItem.find('ul > li.h-entry.notice.answer');
  258. if (ans.length == 0) {
  259. SN.U.NoticeInlineReplyPlaceholder(questionItem);
  260. }
  261. var id = $(notice).attr('id');
  262. if ($("#"+id).length == 0) {
  263. $(notice).insertBefore(answerItem);
  264. answerItem.remove();
  265. } else {
  266. // NOP
  267. // Realtime came through before us...
  268. }
  269. } else if (notices.length > 0 && SN.U.belongsOnTimeline(notice)) {
  270. // Not a reply. If on our timeline, show it at the
  271. if ($('#'+notice.id).length === 0) {
  272. var notice_irt_value = form.find('#inreplyto').val();
  273. var notice_irt = '#notices_primary #notice-'+notice_irt_value;
  274. if($('body')[0].id == 'conversation') {
  275. if(notice_irt_value.length > 0 && $(notice_irt+' .notices').length < 1) {
  276. $(notice_irt).append('<ul class="notices"></ul>');
  277. }
  278. $($(notice_irt+' .notices')[0]).append(notice);
  279. }
  280. else {
  281. notices.prepend(notice);
  282. }
  283. $('#'+notice.id)
  284. .css({display:'none'})
  285. .fadeIn(2500);
  286. }
  287. // realtime injected the notice first
  288. } else {
  289. // Not on a timeline that this belongs on?
  290. // Just show a success message.
  291. // @fixme inline
  292. showFeedback('success', $('title', data).text());
  293. }
  294. }
  295. },
  296. complete: function (xhr, textStatus) {
  297. form
  298. .removeClass(SN.C.S.Processing)
  299. .find('.submit')
  300. .removeAttr(SN.C.S.Disabled)
  301. .removeClass(SN.C.S.Disabled);
  302. }
  303. });
  304. }
  305. };
  306. $(document).ready(function () {
  307. QnA.init();
  308. });