From e59090d3b61ef9e358ccc445e19e8037403ed5bf Mon Sep 17 00:00:00 2001
From: James Cole <thegrumpydictator@gmail.com>
Date: Sat, 12 Aug 2017 07:56:02 +0200
Subject: [PATCH] Text and modal for password security.

---
 resources/lang/en_US/firefly.php             |  1 +
 resources/views/auth/register.twig           | 46 +-------------------
 resources/views/partials/password-modal.twig | 44 +++++++++++++++++++
 resources/views/profile/change-password.twig |  5 ++-
 4 files changed, 50 insertions(+), 46 deletions(-)
 create mode 100644 resources/views/partials/password-modal.twig

diff --git a/resources/lang/en_US/firefly.php b/resources/lang/en_US/firefly.php
index 0c5228923e..6346947288 100644
--- a/resources/lang/en_US/firefly.php
+++ b/resources/lang/en_US/firefly.php
@@ -416,6 +416,7 @@ return [
     'password_changed'                           => 'Password changed!',
     'should_change'                              => 'The idea is to change your password.',
     'invalid_password'                           => 'Invalid password!',
+    'what_is_pw_security'                        => 'What is "verify password security"?',
 
 
     // attachments
diff --git a/resources/views/auth/register.twig b/resources/views/auth/register.twig
index cbe4fe03b0..ee9f6119d9 100644
--- a/resources/views/auth/register.twig
+++ b/resources/views/auth/register.twig
@@ -54,50 +54,6 @@
         <a href="{{ URL.to('/password/reset') }}">I forgot my password</a>
     </div><!-- /.form-box -->
 
-
-    <!-- Modal -->
-    <div class="modal fade" id="passwordModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
-        <div class="modal-dialog" role="document">
-            <div class="modal-content">
-                <div class="modal-header">
-                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-                    <h4 class="modal-title" id="myModalLabel">How to choose a secure password</h4>
-                </div>
-                <div class="modal-body">
-                    <p>
-                        In August 2017 well known security researcher Troy Hunt released a list of 306 million stolen passwords.
-                        These passwords were stolen during breakins at companies like LinkedIn, Adobe and NeoPets (and many more).
-                    </p>
-                    <p>
-                        By checking the box, Firefly III will send the SHA1 hash of your password to
-                        <a href="https://www.troyhunt.com/introducing-306-million-freely-downloadable-pwned-passwords/">the website of Troy Hunt</a>
-                        to see if it is on the list. This will stop you from using unsafe passwords as is recommended in the latest
-                        <a href="https://pages.nist.gov/800-63-3/sp800-63b.html">NIST Special Publication</a> on this subject.
-                    </p>
-                    <h4>But I thought SHA1 was broken?</h4>
-                    <p>
-                        Yes, but not in this context. As you can read on <a href="https://shattered.io/">the website detailing how they broke SHA1</a>, it is
-                        now
-                        slightly easier to find a "collision": another string that results in the same SHA1-hash. It now only takes 10,000 years using a
-                        single-GPU machine.
-                    </p>
-                    <p>
-                        This collision would not be equal to your password, nor would it be useful on (a site like) Firefly III. This application
-                        does not use SHA1 for password verification. So it is safe to check this box. Your password is hashed and sent over HTTPS.
-                    </p>
-                    <h4>Should I check the box?</h4>
-                    <p>
-                        If you just generated a long, single-use password for Firefly III using some kind of password generator: no.
-                    </p>
-                    <p>
-                        If you just entered the password you always use: <em>Christ yes</em>.
-                    </p>
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                </div>
-            </div>
-        </div>
-    </div>
+    {% include 'partials.password-modal' %}
 
 {% endblock %}
diff --git a/resources/views/partials/password-modal.twig b/resources/views/partials/password-modal.twig
new file mode 100644
index 0000000000..16679e262e
--- /dev/null
+++ b/resources/views/partials/password-modal.twig
@@ -0,0 +1,44 @@
+<!-- Modal -->
+<div class="modal fade" id="passwordModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                <h4 class="modal-title" id="myModalLabel">How to choose a secure password</h4>
+            </div>
+            <div class="modal-body">
+                <p>
+                    In August 2017 well known security researcher Troy Hunt released a list of 306 million stolen passwords.
+                    These passwords were stolen during breakins at companies like LinkedIn, Adobe and NeoPets (and many more).
+                </p>
+                <p>
+                    By checking the box, Firefly III will send the SHA1 hash of your password to
+                    <a href="https://www.troyhunt.com/introducing-306-million-freely-downloadable-pwned-passwords/">the website of Troy Hunt</a>
+                    to see if it is on the list. This will stop you from using unsafe passwords as is recommended in the latest
+                    <a href="https://pages.nist.gov/800-63-3/sp800-63b.html">NIST Special Publication</a> on this subject.
+                </p>
+                <h4>But I thought SHA1 was broken?</h4>
+                <p>
+                    Yes, but not in this context. As you can read on <a href="https://shattered.io/">the website detailing how they broke SHA1</a>, it is
+                    now
+                    slightly easier to find a "collision": another string that results in the same SHA1-hash. It now only takes 10,000 years using a
+                    single-GPU machine.
+                </p>
+                <p>
+                    This collision would not be equal to your password, nor would it be useful on (a site like) Firefly III. This application
+                    does not use SHA1 for password verification. So it is safe to check this box. Your password is hashed and sent over HTTPS.
+                </p>
+                <h4>Should I check the box?</h4>
+                <p>
+                    If you just generated a long, single-use password for Firefly III using some kind of password generator: no.
+                </p>
+                <p>
+                    If you just entered the password you always use: <em>Christ yes</em>.
+                </p>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/resources/views/profile/change-password.twig b/resources/views/profile/change-password.twig
index 575c1e3722..4908d533f7 100644
--- a/resources/views/profile/change-password.twig
+++ b/resources/views/profile/change-password.twig
@@ -53,7 +53,9 @@
                         </div>
 
                         {{ ExpandedForm.checkbox('verify_password','1', false) }}
-
+                        <p>
+                            <a data-toggle="modal" data-target="#passwordModal" href="#passwordModal">{{ 'what_is_pw_security'|_ }}</a>
+                        </p>
 
                     </div>
                     <div class="box-footer">
@@ -63,4 +65,5 @@
             </div>
         </div>
     </form>
+    {% include 'partials.password-modal' %}
 {% endblock %}