From c29104ba832959a88a36629d579c56dfa4983dd1 Mon Sep 17 00:00:00 2001
From: Phyks <webmaster@phyks.me>
Date: Wed, 4 Sep 2013 23:04:05 +0200
Subject: [PATCH] Toggle to set password visible

---
 TODO                      |   1 +
 index.php                 |   4 ++++
 install.php               |   4 ++--
 tpl/connection.html       |   2 +-
 tpl/css/style.css         |  11 +++++++++++
 tpl/edit_users.html       |   4 ++--
 tpl/img/toggleVisible.png | Bin 0 -> 490 bytes
 tpl/settings.html         |   2 +-
 8 files changed, 22 insertions(+), 6 deletions(-)
 create mode 100644 tpl/img/toggleVisible.png

diff --git a/TODO b/TODO
index 8ff3bfb..14a5cb8 100755
--- a/TODO
+++ b/TODO
@@ -18,6 +18,7 @@ TODO :
 * Add / Edit a bill
 * JSON output
 * Arrow to toggle visible password
+* Change tpl easily
 
 To test :
 =========
diff --git a/index.php b/index.php
index 1397179..af4d643 100644
--- a/index.php
+++ b/index.php
@@ -10,6 +10,7 @@
     require_once('inc/CSRF.inc.php');
     raintpl::$tpl_dir = 'tpl/';
     raintpl::$cache_dir = 'tmp/';
+    raintpl::configure('base_url', htmlspecialchars(BASE_URL));
 
     // Define raintpl instance
     $tpl = new raintpl();
@@ -20,6 +21,9 @@
     $tpl->assign('base_url', htmlspecialchars(BASE_URL));
     $tpl->assign('currency', htmlspecialchars(CURRENCY));
     $tpl->assign('email_webmaster', htmlspecialchars(EMAIL_WEBMASTER));
+    
+    // TODO : Avoid a bug in rainTPL with img near input
+    $tpl->configure('path_replace_list', array('a', 'img', 'link', 'script'));
 
     // Set sessions parameters
     ini_set('session.use_cookies', 1);
diff --git a/install.php b/install.php
index 7826415..6207175 100644
--- a/install.php
+++ b/install.php
@@ -139,7 +139,7 @@
                 <p><label for="mysql_host">MySQL host : </label><input type="text" name="mysql_host" id="mysql_host" value="<?php echo (!empty($_POST['mysql_host'])) ? htmlspecialchars($_POST['mysql_host']) : 'localhost';?>"/></p>
 
                 <p><label for="mysql_login">MySQL login : </label><input type="text" name="mysql_login" id="mysql_login" value="<?php echo (!empty($_POST['mysql_login'])) ? htmlspecialchars($_POST['mysql_login']) : '';?>"/></p>
-                <p><label for="mysql_password">MySQL password : </label><input type="password" name="mysql_password" id="mysql_password"/> <a href="" onclick="toggle_password('mysql_password'); return false;"><img src="img/toggle_password.jpg" alt="Toggle visible"/></a></p>
+                <p><label for="mysql_password">MySQL password : </label><input type="password" name="mysql_password" id="mysql_password"/> <a href="" onclick="toggle_password('mysql_password'); return false;"><img src="tpl/img/toggleVisible.png" alt="Toggle visible"/></a></p>
                 <p>
                 <label for="mysql_db">Name of the MySQL database to use : </label><input type="text" name="mysql_db" id="mysql_db" value="<?php echo (!empty($_POST['mysql_db'])) ? htmlspecialchars($_POST['mysql_db']) : 'Bouffe@Ulm';?>"/><br/>
                     <em>Note :</em> You <em>must</em> create this database first.
@@ -165,7 +165,7 @@
                 <legend>Administrator</legend>
                 <p><label for="admin_login">Username of the admin : </label><input type="text" name="admin_login" id="admin_login" <?php echo (!empty($_POST['admin_login'])) ? 'value="'.htmlspecialchars($_POST['admin_login']).'"' : '';?>/></p>
                 <p><label for="admin_display_name">Displayed name for admin user : </label><input type="text" name="admin_display_name" id="admin_display_name" <?php echo (!empty($_POST['admin_display_name']) ? 'value="'.htmlspecialchars($_POST['admin_display_name']).'"' : '');?>/></p>
-                <p><label for="admin_password">Password for the admin : </label><input type="password" name="admin_password" id="admin_password"/> <a href="" onclick="toggle_password('admin_password'); return false;"><img src="img/toggle_password.jpg" alt="Toggle visible"/></a></p>
+                <p><label for="admin_password">Password for the admin : </label><input type="password" name="admin_password" id="admin_password"/> <a href="" onclick="toggle_password('admin_password'); return false;"><img src="tpl/img/toggleVisible.jpg" alt="Toggle visible"/></a></p>
             </fieldset>
             <p class="center"><input <?php echo (!empty($block_form)) ? 'disabled ' : '';?>type="submit" value="Install"><input type="hidden" name="token" value="<?php echo generate_token('install');?>"/></p>
         </form>
diff --git a/tpl/connection.html b/tpl/connection.html
index f206ce4..f1e722a 100644
--- a/tpl/connection.html
+++ b/tpl/connection.html
@@ -4,7 +4,7 @@
 
 <form method="post" action="index.php?do=connect" id="connexion_form">
     <p><label for="login" class="label-block">Username : </label><input type="text" name="login" id="login" value="{$user_post}"/></p>
-    <p><label for="password" class="label-block">Password : </label><input type="password" name="password" id="password"/></p>
+    <p><label for="password" class="label-block">Password : </label><input type="password" name="password" id="password"/> <a href="" onclick="toggle_password('password'); return false;"><img src="img/toggleVisible.png" alt="Toggle visible"/></a></p>
     <p><input type="checkbox" name="remember_me" id="remember_me" value="1"/><label for="remember_me"> Remember me ?</label></p>
     <p><input type="submit" value="Connect"/><input type="hidden" name="token" value="{$token}"/></p>
     <p><a href="mailto:{$email_webmaster}?subject={$instance_title}%20password">Forgotten password ?</a></p>
diff --git a/tpl/css/style.css b/tpl/css/style.css
index 6212b21..33ade18 100644
--- a/tpl/css/style.css
+++ b/tpl/css/style.css
@@ -15,6 +15,17 @@ fieldset {
     margin-bottom: 1em;
 }
 
+form a {
+    position: relative;
+}
+
+form img {
+    height: 1.5em;
+    vertical-align: middle;
+    position: absolute;
+    left: .5em;
+}
+
 table {
     margin: auto;
     text-align: center;
diff --git a/tpl/edit_users.html b/tpl/edit_users.html
index 0093843..1e85862 100644
--- a/tpl/edit_users.html
+++ b/tpl/edit_users.html
@@ -37,7 +37,7 @@
         <label for="display_name" class="label-block">Displayed name : </label><input type="text" name="display_name" id="display_name" {if condition="$display_name_post != ''"} value="{$display_name_post}" {else} {$user_id != -1 ? 'value="'.$user_data->getDisplayName().'"' : ''} {/if}/>
     </p>
     <p>
-        <label for="password" class="label-block">Password : </label><input type="password" name="password" id="password"/>
+        <label for="password" class="label-block">Password : </label><input type="password" name="password" id="password"/>  <a href="" onclick="toggle_password('password'); return false;"><img src="img/toggleVisible.png" alt="Toggle visible"/></a>
         {if condition="$user_id != -1"}
             <br/><em>Note :</em> Leave blank this field if you don't want to edit password.
         {/if}
@@ -58,7 +58,7 @@
 <h2>Edit your password</h2>
 <form method="post" action="index.php?do=password" id="edit_password_form">
     <p><label for="password" class="label-block">New password : </label><input type="password" id="password" name="password"/></p>
-    <p><label for="password_confirm" class="label-block">Confirm new password : </label><input type="password" id="password_confirm" name="password_confirm"/></p>
+    <p><label for="password_confirm" class="label-block">Confirm new password : </label><input type="password" id="password_confirm" name="password_confirm"/> <a href="" onclick="toggle_password('password_confirm'); return false;"><img src="img/toggleVisible.png" alt="Toggle visible"/></a></p>
     <p class="center"><input type="submit" value="Update"/><input type="hidden" name="token" value="{$token}"</p>
 </form>
 {/if}
diff --git a/tpl/img/toggleVisible.png b/tpl/img/toggleVisible.png
new file mode 100644
index 0000000000000000000000000000000000000000..4fad9d27042af0b979e619eed29cc75a8bc7f25f
GIT binary patch
literal 490
zcmV<G0Tup<P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY3ljhU3ljkVnw%H_000McNliru-3bH~5G0N0ty=&90e4A6
zK~!ko)tW&P!ypJn#mSL!zc%;tPIT2wYmG|aLv__fZU5r~8YaZdY2}sE;wv0r-*;6C
zP*e)l!b>T%j04)JhXPoNPbsBsRpG7<pv1$ASR;J4s9^w>QSZS(08lB@0x<<Z=K2*x
zUP*lGe?$(@LFbqG!Q?Hz<-`!+Q*<pn!hsqhTZq@(WgrI`9mEpxkq|#AR12RKAC*#H
z04?!%0VEK$a}xNB60b?AQVPxP%^sZsxi|NsZwY}aaFqj6a0EmbU?%^gAt*f)--Wny
zR<yd!2<oaU4Nu~KNU2dvHSa>+DFtbxt*Z#CJ!k8PTJ1G;Koe07M6Y<?pEnONbP#K<
zB)ys;W_Gb!+G<<TZxy`TWKQCSWbhj@-0e9oom!vI1D<I#8VpFzhN%ad$XXD!QL7*I
z5`Q^XK{<g4P<Jk534(HWdNQYhL8j*I;qDBOM@{7w3bnVkRfR(w@D^_h5FuVw#Mam3
g5P*MJ%fGGi0yE<sG3e`Owg3PC07*qoM6N<$f(mcLwg3PC

literal 0
HcmV?d00001

diff --git a/tpl/settings.html b/tpl/settings.html
index 471f42c..a5b25ee 100644
--- a/tpl/settings.html
+++ b/tpl/settings.html
@@ -26,7 +26,7 @@
 
         <p><label for="mysql_login">MySQL login : </label><input type="text" name="mysql_login" id="mysql_login" value="{$mysql_login}"/></p>
         <p>
-            <label for="mysql_password">MySQL password : </label><input type="password" name="mysql_password" id="mysql_password"/> <a href="" onclick="toggle_password('mysql_password'); return false;"><img src="img/toggle_password.jpg" alt="Toggle visible"/></a><br/>
+            <label for="mysql_password">MySQL password : </label><input type="password" name="mysql_password" id="mysql_password"/> <a href="" onclick="toggle_password('mysql_password'); return false;"><img src="img/toggleVisible.png" alt="Toggle visible"/></a><br/>
             <em>Note :</em> Leave the above field blank if you don't want to change your password.
         </p>
         <p>