Merge pull request #507 from ScratchAddons/feedback

Updates regarding PSW (and feedback docs)

content/docs/getting-started/feedback.md

@@ -0,0 +1,28 @@
+---
+title: Send feedback to Scratch Addons developers
+description: How to send feedback to Scratch Addons.
+weight: 3
+no_comments: true
+toc_title: Send Feedback
+---
+
+Have something to say about Scratch Addons, the browser extension? Let us know through the feedback form located on https://scratchaddons.com/feedback/.
+
+{{< admonition warning >}}
+
+We can't help with issues related to Scratch moderation. Instead, use the Report button on the Scratch website, or reach Scratch through their official channels.
+
+{{</ admonition >}}
+
+## Alternatives
+
+In case you need an alternative, here are some choices.
+
+- Create a issue on [the repository](https://github.com/ScratchAddons/ScratchAddons/issues).
+- Create a post on [our Discussions tab](https://github.com/ScratchAddons/ScratchAddons/discussions)
+- Send a message on [our Discord server](https://discord.gg/R5NBqwMjNc)
+- Contact one of the contributors on Discord, Twitter, or other methods
+
+It is discouraged to contact one of the contributors through Scratch due to [the policy that forbids advertising extensions/userscripts](https://scratch.mit.edu/discuss/post/2907564/).
+
+By the way, we have [a FAQ page](https://scratchaddons.com/docs/faq/) for your usual questions.

content/feedback.html

@@ -29,8 +29,32 @@ <h2>Alternatives</h2>
 	</div>
 </div>
 
+<div class="modal fade" id="feedback-psw-modal" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="feedback-psw-modal-label" aria-hidden="true">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="feedback-psw-modal-label">Warning</h5>
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+					<span aria-hidden="true">&times;</span>
+				</button>
+			</div>
+			<div class="modal-body">
+				<p class="mb-3">Your feedback triggers this warning.</p>
+				<div id="feedback-psw" class="alert alert-warning mb-3" role="alert">
+					<p id="feedback-psw-heading" class="font-weight-bold"></p>
+					<p id="feedback-psw-description"></p>
+				</div>
+				<p>Please read it carefully before proceeding. You may need to update your message accordingly. If you are really sure that this warning doesn't apply to you, you may ignore this message and send it anyway.</p>
+			</div>
+			<div class="modal-footer">
+				<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
+			</div>
+		</div>
+	</div>
+</div>
+
 <style>
 	#feedback-content {
 		height: 200px
 	}
-</style>
+</style>

i18n/en.yaml

@@ -179,7 +179,7 @@ FeedbackPage:
     Variations:
       NotST:
         Heading: We are not the Scratch Team.
-        Description: Keep in mind that Scratch Addons is not affiliated with the Scratch website or the organizations that maintain it. You are still welcome to give ideas to improve your experience on Scratch with Scratch Addons.
+        Description: Scratch Addons is not affiliated with the Scratch website or the organizations that maintain it. We have no control of the content and the moderation on the Scratch website. You are still welcome to give ideas to improve your experience on Scratch with Scratch Addons.
       Punishment:
         Heading: We can't punish people. We are not the Scratch Team.
         Description: "Scratch Addons is not affiliated with the Scratch website or the organizations that maintain it. We have no control of the content and the moderation on the Scratch website. {{ .Tag1Start }}There are many ways that you can report on the Scratch website.{{ .Tag1End }}"

static/assets/js/feedback.js

@@ -27,6 +27,9 @@ const variations = {
         patterns: [
             /\bscratch\s*team\b/i,
             /\bst\b/,
+            /\bscratcher\b/,
+            /\bforg[oe]t\s*password\b/,
+            /\bdelete\s*account\b/,
         ]
     },
     folders: {
@@ -50,6 +53,11 @@ const submitButton = form.querySelector("#feedback-submit")
 const addonsListCheckbox = form.querySelector("#feedback-addons-list")
 const statusEl = document.querySelector('#feedback-status')
 let hasWarnedContent = false
+let closePswModalButton1 = document.querySelector('#feedback-psw-modal .close')
+let closePswModalButton2 = document.querySelector('#feedback-psw-modal .modal-footer button')
+const closePswButtonText = closePswModalButton2.textContent
+const pswHeadingEl = document.querySelector('#feedback-psw-heading')
+const pswDescriptionEl = document.querySelector('#feedback-psw-description')
 
 const version = new URL(location.href).searchParams.get("ext_version") || new URL(location.href).searchParams.get("version")
 
@@ -104,6 +112,8 @@ const startUpServer = () => {
 // Credit to https://stackoverflow.com/a/29972322 for the timer logic
 const holdSendButton = seconds => {
     submitButton.disabled = true
+    closePswModalButton1.disabled = true
+    closePswModalButton2.disabled = true
     let remaining = seconds, expected = Date.now()
     const step = () => {
         var dt = Date.now() - expected
@@ -115,29 +125,24 @@ const holdSendButton = seconds => {
         if (remaining) {
             setTimeout(step, Math.max(0, 1000 - dt))
             submitButton.textContent = i18n.submitButton + " (" + remaining + ")"
+            closePswModalButton2.textContent = closePswButtonText + " (" + remaining + ")"
         } else {
             submitButton.disabled = false
+            closePswModalButton1.disabled = false
+            closePswModalButton2.disabled = false
             submitButton.textContent = i18n.submitButton
+            closePswModalButton2.textContent = closePswButtonText
         }
         remaining--
     }
     step()
 }
 
 const setPreSendWarning = (heading, description) => {
-    setStatus("", "warning")
-    const headingEl = document.createElement('p')
-    headingEl.textContent = heading
-    statusEl.appendChild(headingEl)
-    headingEl.insertAdjacentHTML('afterbegin', `<b>${i18n.preSendWarning.warning}</b> `)
-    const descriptionEl = document.createElement('p')
-    descriptionEl.innerHTML = description
-    statusEl.appendChild(descriptionEl)
-    const overrideEl = document.createElement('p')
-    overrideEl.textContent = i18n.preSendWarning.override
-    overrideEl.classList.add('mb-0')
-    statusEl.appendChild(overrideEl)
-    statusEl.scrollIntoView()
+    statusEl.hidden = true
+    $('#feedback-psw-modal').modal('show')
+    pswHeadingEl.textContent = heading
+    pswDescriptionEl.innerHTML = description
     holdSendButton(5)
 }