{"version":3,"sources":["webpack:///./app/javascript/responseTemplates/responseTemplates.js","webpack:///./app/javascript/packs/responseTemplates.js"],"names":["toggleTemplateTypeButton","form","e","targetType","target","dataset","activeType","classList","toggle","getElementsByClassName","addClickListeners","responsesContainer","parentCommentId","id","includes","insertButtons","Array","from","moderatorSubmitButtons","forEach","button","addEventListener","event","content","textArea","querySelector","value","confirm","dispatchEvent","Event","focus","responseTemplateId","parentId","commentableId","preventDefault","document","getElementById","fetch","method","headers","Accept","window","csrfToken","body","JSON","stringify","response_template","comment","body_markdown","commentable_id","commentable_type","parent_id","then","response","json","status","location","pathname","path","alert","error","fetchResponseTemplates","typeOf","formId","dataContainer","innerHTML","length","map","obj","title","join","buildHTML","parentElement","openButtonCallback","dataFetched","containerHidden","contains","copyData","loadData","userData","moderator_for_tags","personalTemplateButton","modTemplateButton","remove","topLevelData","childElementCount","once","prepareHeaderButtons","add","observeForReplyClick","observer","MutationObserver","mutations","addedNodes","filter","node","nodeName","hasListener","prepareOpenButton","commentTree","observe","childList","subtree","disconnect","InstantClick","on","loadResponseTemplates","userStatus","showLoginModal"],"mappings":"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","file":"js/responseTemplates-d6eeebff799b08a17f6f.chunk.js","sourcesContent":["/* eslint-disable no-alert */\n/* eslint-disable no-restricted-globals */\n/* global showLoginModal */\n\nfunction toggleTemplateTypeButton(form, e) {\n  const { targetType } = e.target.dataset;\n  const activeType = targetType === 'personal' ? 'moderator' : 'personal';\n  e.target.classList.toggle('active');\n  form\n    .getElementsByClassName(`${activeType}-template-button`)[0]\n    .classList.toggle('active');\n  form\n    .getElementsByClassName(`${targetType}-responses-container`)[0]\n    .classList.toggle('hidden');\n  form\n    .getElementsByClassName(`${activeType}-responses-container`)[0]\n    .classList.toggle('hidden');\n}\n\nconst noResponsesHTML = `\n<div class=\"mod-response-wrapper mod-response-wrapper-empty\">\n  <p>🤔... It looks like you don't have any templates yet.</p>\n</div>\n`;\n\nfunction buildHTML(response, typeOf) {\n  if (response.length === 0 && typeOf === 'personal_comment') {\n    return noResponsesHTML;\n  }\n  if (typeOf === 'personal_comment') {\n    return response\n      .map((obj) => {\n        return `\n          <div class=\"mod-response-wrapper flex mb-4\">\n            <div class=\"flex-1\">\n              <h4>${obj.title}</h4>\n              <p>${obj.content}</p>\n            </div>\n            <div class=\"pl-2\">\n              <button class=\"crayons-btn crayons-btn--secondary crayons-btn--s insert-template-button\" type=\"button\" data-content=\"${obj.content}\">Insert</button>\n            </div>\n          </div>\n        `;\n      })\n      .join('');\n  }\n  if (typeOf === 'mod_comment') {\n    return response\n      .map((obj) => {\n        return `\n            <div class=\"mod-response-wrapper mb-4 flex\">\n              <div class=\"flex-1\">\n                <h4>${obj.title}</h4>\n                <p>${obj.content}</p>\n              </div>\n              <div class=\"flex flex-nowrap pl-2\">\n                <button class=\"crayons-btn crayons-btn--s crayons-btn--secondary moderator-submit-button\" type=\"submit\" data-response-template-id=\"${obj.id}\">Send as Mod</button>\n                <button class=\"crayons-btn crayons-btn--s crayons-btn--outlined insert-template-button\" type=\"button\" data-content=\"${obj.content}\">Insert</button>\n              </div>\n            </div>\n          `;\n      })\n      .join('');\n  }\n  return `Error 😞`;\n}\n\nfunction submitAsModerator(responseTemplateId, parentId) {\n  const commentableId = document.getElementById('comment_commentable_id').value;\n\n  fetch(`/comments/moderator_create`, {\n    method: 'POST',\n    headers: {\n      Accept: 'application/json',\n      'X-CSRF-Token': window.csrfToken,\n      'Content-Type': 'application/json',\n    },\n    body: JSON.stringify({\n      response_template: {\n        id: responseTemplateId,\n      },\n      comment: {\n        body_markdown: '',\n        commentable_id: commentableId,\n        commentable_type: 'Article',\n        parent_id: parentId,\n      },\n    }),\n  })\n    .then((response) => response.json())\n    .then((response) => {\n      if (response.status === 'created') {\n        window.location.pathname = response.path;\n      } else if (response.status === 'comment already exists') {\n        alert('This comment already exists.');\n      } else if (response.error === 'error') {\n        alert(\n          `There was a problem submitting this comment: ${response.status}`,\n        );\n      }\n    });\n}\n\nconst confirmMsg = `\nAre you sure you want to submit this comment as Sloan?\n\nIt will be sent immediately and users will be notified.\n\nMake sure this is the appropriate comment for the situation.\n\nThis action is not reversible.`;\n\nfunction addClickListeners(form) {\n  const responsesContainer = form.getElementsByClassName(\n    'response-templates-container',\n  )[0];\n  const parentCommentId =\n    form.id !== 'new_comment' && !form.id.includes('edit_comment');\n  const insertButtons = Array.from(\n    responsesContainer.getElementsByClassName('insert-template-button'),\n  );\n  const moderatorSubmitButtons = Array.from(\n    responsesContainer.getElementsByClassName('moderator-submit-button'),\n  );\n\n  insertButtons.forEach((button) => {\n    button.addEventListener('click', (event) => {\n      const { content } = event.target.dataset;\n      // We need to grab the textarea that is not the comment mention auto-complete component\n      const textArea = event.target.form.querySelector(\n        '.comment-textarea:not([role=combobox])',\n      );\n      const textAreaReplaceable =\n        textArea.value === null ||\n        textArea.value === '' ||\n        confirm('Are you sure you want to replace your current comment draft?');\n\n      if (textAreaReplaceable) {\n        textArea.value = content;\n        textArea.dispatchEvent(new Event('input', { target: textArea }));\n        textArea.focus();\n        responsesContainer.classList.toggle('hidden');\n      }\n    });\n  });\n\n  moderatorSubmitButtons.forEach((button) => {\n    button.addEventListener('click', (e) => {\n      e.preventDefault();\n\n      if (confirm(confirmMsg)) {\n        submitAsModerator(e.target.dataset.responseTemplateId, parentCommentId);\n      }\n    });\n  });\n}\n\nfunction fetchResponseTemplates(typeOf, formId) {\n  const form = document.getElementById(formId);\n  let dataContainer;\n  if (typeOf === 'personal_comment') {\n    dataContainer = form.getElementsByClassName(\n      'personal-responses-container',\n    )[0];\n  } else if (typeOf === 'mod_comment') {\n    dataContainer = form.getElementsByClassName(\n      'moderator-responses-container',\n    )[0];\n  }\n  /* eslint-disable-next-line no-undef */\n  fetch(`/response_templates?type_of=${typeOf}`, {\n    method: 'GET',\n    headers: {\n      Accept: 'application/json',\n      'X-CSRF-Token': window.csrfToken,\n      'Content-Type': 'application/json',\n    },\n  })\n    .then((response) => response.json())\n    .then((response) => {\n      form.querySelector('img.loading-img').classList.toggle('hidden');\n      dataContainer.innerHTML = buildHTML(response, typeOf);\n      const topLevelData = document.getElementById('response-templates-data');\n      topLevelData.innerHTML = dataContainer.parentElement.innerHTML;\n      addClickListeners(form);\n    });\n}\n\nfunction prepareHeaderButtons(form) {\n  const personalTemplateButton = form.getElementsByClassName(\n    'personal-template-button',\n  )[0];\n  const modTemplateButton = form.getElementsByClassName(\n    'moderator-template-button',\n  )[0];\n\n  personalTemplateButton.addEventListener('click', (e) => {\n    toggleTemplateTypeButton(form, e);\n  });\n  modTemplateButton.addEventListener('click', (e) => {\n    toggleTemplateTypeButton(form, e);\n  });\n  modTemplateButton.classList.remove('hidden');\n\n  modTemplateButton.addEventListener(\n    'click',\n    () => {\n      const topLevelData = document.getElementById('response-templates-data');\n      const modDataNotFetched =\n        topLevelData.innerHTML !== ''\n          ? topLevelData.getElementsByClassName(\n              'moderator-responses-container',\n            )[0].childElementCount === 0\n          : false;\n      if (modDataNotFetched) {\n        form.querySelector('img.loading-img').classList.toggle('hidden');\n        fetchResponseTemplates('mod_comment', form.id);\n      }\n    },\n    { once: true },\n  );\n}\n\nfunction copyData(responsesContainer) {\n  responsesContainer.innerHTML = document.getElementById(\n    'response-templates-data',\n  ).innerHTML;\n}\n\nfunction loadData(form) {\n  form.querySelector('img.loading-img').classList.toggle('hidden');\n  fetchResponseTemplates('personal_comment', form.id);\n}\n\nfunction openButtonCallback(form) {\n  const responsesContainer = form.getElementsByClassName(\n    'response-templates-container',\n  )[0];\n  const dataFetched =\n    document.getElementById('response-templates-data').innerHTML !== '';\n\n  responsesContainer.classList.toggle('hidden');\n\n  const containerHidden = responsesContainer.classList.contains('hidden');\n\n  if (dataFetched && !containerHidden) {\n    copyData(responsesContainer);\n    addClickListeners(form);\n  } else if (!dataFetched && !containerHidden) {\n    loadData(form);\n  }\n  /* eslint-disable-next-line no-undef */\n  if (userData().moderator_for_tags.length > 0) {\n    prepareHeaderButtons(form);\n  } else {\n    form\n      .getElementsByClassName('personal-template-button')[0]\n      .classList.add('hidden');\n  }\n}\n\nfunction prepareOpenButton(form) {\n  const button = form.getElementsByClassName('response-templates-button')[0];\n  if (!button) {\n    return;\n  }\n\n  button.addEventListener('click', () => {\n    openButtonCallback(form);\n  });\n\n  button.dataset.hasListener = 'true';\n}\n\nfunction observeForReplyClick() {\n  const config = { childList: true, subtree: true };\n\n  const callback = (mutations) => {\n    const form = Array.from(mutations[0].addedNodes).filter(\n      (node) => node.nodeName === 'FORM',\n    );\n    if (form.length > 0) {\n      prepareOpenButton(form[0]);\n    }\n  };\n\n  const observer = new MutationObserver(callback);\n\n  const commentTree = document.getElementById('comment-trees-container');\n  if (commentTree) {\n    observer.observe(commentTree, config);\n  }\n\n  window.addEventListener('beforeunload', () => {\n    observer.disconnect();\n  });\n\n  window.InstantClick.on('change', () => {\n    observer.disconnect();\n  });\n}\n\nfunction handleLoggedOut() {\n  document\n    .getElementsByClassName('response-templates-button')[0]\n    ?.addEventListener(\n      'click',\n      // eslint-disable-next-line no-undef\n      showLoginModal,\n    );\n}\n/* eslint-enable no-alert */\n/* eslint-enable no-restricted-globals */\n\nexport function loadResponseTemplates() {\n  const { userStatus } = document.body.dataset;\n\n  const form = document.getElementsByClassName('comment-form')[0];\n\n  if (document.getElementById('response-templates-data')) {\n    if (userStatus === 'logged-out') {\n      handleLoggedOut();\n    }\n    //if (\n      //form &&\n      // form.getElementsByClassName('response-templates-button')[0].dataset\n      //   .hasListener === 'false'\n    // ) {\n    //   //prepareOpenButton(form);\n    // }\n    observeForReplyClick();\n  }\n}\n","import { loadResponseTemplates } from '../responseTemplates/responseTemplates';\n\nwindow.InstantClick.on('change', () => {\n  loadResponseTemplates();\n});\n\nloadResponseTemplates();\n"],"sourceRoot":""}