Merge pull request #386 from knatten/less-x

Less x

Author: knatten

quiz/static/quiz.css

@@ -202,3 +202,31 @@ h4.quiz_mode
 #cppinsights-ce {
     font-style:italic;
 }
+.copy-box {
+    border: 1px solid #ccc;
+    padding: 5px;
+    background: #f9f9f9;
+    font-family: Arial, sans-serif;
+}
+
+.copy-text {
+    flex-grow: 1;
+    margin-right: 10px;
+    font-size: 14px;
+    word-break: break-word;
+}
+
+.copy-button {
+    padding: 5px 10px;
+    border: none;
+    background-color: #ccf;
+}
+
+.copy-button:hover {
+    background-color: #aaf;
+}
+
+.copy-button:disabled {
+    background-color: #ccc;
+    cursor: default;
+}

templates/base.html

@@ -107,7 +107,6 @@ <h1><a href="/">C++ Quiz</a></h1>
 <a href="https://github.com/knatten/cppquiz/blob/master/CODE_OF_CONDUCT.md">CoC</a> |
 <a href="https://mastodon.online/@cppquiz"><img src="{{STATIC_URL}}/mastodon.png" height="15" alt="Mastodon"> Mastodon</a> |
 <a href="https://bsky.app/profile/cppquiz.bsky.social"><img src="{{STATIC_URL}}/bluesky.png" height="15" alt="Bluesky"> Bluesky</a> |
-<a href="https://x.com/intent/follow?screen_name=CppQuiz" class="x-follow"><img src="{{STATIC_URL}}/x.png" height="9" alt="X"> X</a> |
 <a href="https://github.com/knatten/cppquiz"> GitHub</a> |
 © <a href="http://knatten.org">Anders Schau Knatten</a> {% now "Y"%}.
 </p>

templates/quiz/finished.html

@@ -20,11 +20,37 @@ <h3>All right!</h3>
 <p>You finished with {{quiz_in_progress.score|floatformat:2}} out of {{quiz_in_progress.get_total_nof_questions|floatformat:1}} <abbr title="1 point per correct question, but -0.5 points if you used a hint, and /2 for each wrong attempt.".>possible</abbr> points.</p>
 
 <p>
-Now <a href="https://x.com/intent/tweet?hashtags=cpp,cplusplus&text=I got {{quiz_in_progress.score|floatformat:2}}  of {{quiz_in_progress.get_total_nof_questions}} points on this @CppQuiz https://{{request.get_host}}{{request.get_full_path}} ! Can you match that?">boast about it on X</a>!
-<br>
-(This link takes you to x.com, we would never post on your behalf).
+Now boast about it on social media! Here's a suggestion, and feel free to tag us as
+    <a href="https://bsky.app/profile/cppquiz.bsky.social">@cppquiz.bsky.social</a> or
+    <a href="https://mastodon.online/@cppquiz">@cppquiz@mastodon.online</a>:
 </p>
 
+<div class="copy-box">
+  <span class="copy-text" id="quizMessage">
+    I got {{quiz_in_progress.score|floatformat:2}} of {{quiz_in_progress.get_total_nof_questions}} points on this C++ Quiz https://{{request.get_host}}{{request.get_full_path}}! Can you match that?
+  </span>
+    <button class="copy-button" id="copyButton" onclick="copyToClipboard()">Copy</button>
+</div>
+
+<script>
+    function copyToClipboard() {
+        const text = document.getElementById("quizMessage").innerText;
+        const button = document.getElementById("copyButton");
+
+        navigator.clipboard.writeText(text).then(() => {
+            button.innerText = "Copied!";
+            button.disabled = true;
+
+            setTimeout(() => {
+                button.innerText = "Copy";
+                button.disabled = false;
+            }, 1000);
+        }).catch(err => {
+            console.error("Could not copy text: ", err);
+        });
+    }
+</script>
+
 <p>
 Why not <a href="/quiz/start">Start a new quiz</a>, <a href="/">go back to training mode</a>, or <a href="https://pragprog.com/titles/akbrain/c-brain-teasers/">get the official book</a>?
 </p>

templates/quiz/help.html

@@ -4,7 +4,7 @@
 <a href="/">Continue quiz</a>
 <h2>About</h2>
 <p>
-C++ Quiz is written by <a href="http://knatten.org">Anders Schau Knatten</a> with valuable input from <a href="http://www.pvv.org/~oma/cv.html">Olve Maudal</a>, <a href="http://fcacciola.50webs.com/">Fernando Cacciola</a>, other members of the <a href="http://accu.org/">ACCU</a>, and several other contributors. If you discover any errors, or would like to contribute, please contact me at anders AT knatten.org, on <a href="https://x.com/CppQuiz">X</a>, or on <a href="https://github.com/knatten/cppquiz/issues">GitHub</a>.
+C++ Quiz is written by <a href="http://knatten.org">Anders Schau Knatten</a> with valuable input from <a href="http://www.pvv.org/~oma/cv.html">Olve Maudal</a>, <a href="http://fcacciola.50webs.com/">Fernando Cacciola</a>, other members of the <a href="http://accu.org/">ACCU</a>, and several other contributors. If you discover any errors, or would like to contribute, please contact me at anders AT knatten.org or on <a href="https://github.com/knatten/cppquiz/issues">GitHub</a>.
 </p>
 <h2>Help/FAQ</h2>
 <h3>What is this?</h3>
@@ -21,7 +21,7 @@ <h3>What features are planned?</h3>
 <p>See <a href="https://github.com/knatten/cppquiz/issues?state=open">open issues on GitHub</a>.</p>
 </ol>
 <h3>How can I help?</h3>
-<p>If you know C++, by adding more questions, or joining our mailing-list <a href="mailto:cppquiz-discuss@cppquiz.org">cppquiz-discuss@cppquiz.org</a>. If you know Python/Django/JavaScript, by extending functionality. If you know web-design, by improving the design. Please contact me at anders AT knatten.org or <a href="https://x.com/knatten">X</a>.</p>
+<p>If you know C++, by adding more questions, or joining our mailing-list <a href="mailto:cppquiz-discuss@cppquiz.org">cppquiz-discuss@cppquiz.org</a>. If you know Python/Django/JavaScript, by extending functionality. If you know web-design, by improving the design. Please contact me at anders AT knatten.org or have a look at our <a href="https://github.com/knatten/cppquiz/issues">open GitHub issues</a>.
 
 <h3 id="cookies">Cookies</h3>
 <p>