bug fixed: replace obsolet tn_width and tn_height language keys by their new

equivalent.

improvement: HTML properties forms rewritten to offer labelled Yes/No click
on checkboxes.

improvement: onblur onfocus attribute used on every HTML properties form.


git-svn-id: http://piwigo.org/svn/trunk@1129 68402e56-0260-453c-a942-63ccdbb3a9ee

1 files changed, 69 insertions, 49 deletions

diff --git a/template/yoga/admin/configuration.tpl b/template/yoga/admin/configuration.tpl
index fb9b0f590..a0578692d 100644
--- a/template/yoga/admin/configuration.tpl
+++ b/template/yoga/admin/configuration.tpl
@@ -14,44 +14,48 @@
 
   <ul>
     <li>
-      <label for="gallery_title"><strong>{lang:Gallery title}</strong></label>
-      <input type="text" maxlength="255" size="50" name="gallery_title" id="gallery_title" value="{general.CONF_GALLERY_TITLE}" />
+      <span class="property">
+        <label for="gallery_title">{lang:Gallery title}</label>
+      </span>
+      <input type="text" maxlength="255" size="50" name="gallery_title" id="gallery_title" value="{general.CONF_GALLERY_TITLE}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
 
     <li>
-      <label for="page_banner"><strong>{lang:Page banner}</strong></label>
-      <textarea cols="50" rows="5" name="page_banner" id="page_banner">{general.CONF_PAGE_BANNER}</textarea>
+      <span class="property">
+        <label for="page_banner">{lang:Page banner}</label>
+      </span>
+      <textarea cols="50" rows="5" name="page_banner" id="page_banner" onfocus="this.className='focus';" onblur="this.className='nofocus';">{general.CONF_PAGE_BANNER}</textarea>
     </li>
 
     <li>
-      <label for="gallery_url"><strong>{lang:Gallery URL}</strong></label>
-      <input type="text" maxlength="255" size="50" name="gallery_url" id="gallery_url" value="{general.CONF_GALLERY_URL}" />
+      <span class="property">
+        <label for="gallery_url">{lang:Gallery URL}</label>
+      </span>
+      <input type="text" maxlength="255" size="50" name="gallery_url" id="gallery_url" value="{general.CONF_GALLERY_URL}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
 
     <li>
-      <label><strong>{lang:History}</strong></label>
-      <input type="radio" class="radio" name="log" value="true" {general.HISTORY_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="log" value="false" {general.HISTORY_NO} />{lang:No}
+      <span class="property">{lang:History}</span>
+      <label><input type="radio" class="radio" name="log" value="true" {general.HISTORY_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="log" value="false" {general.HISTORY_NO} />{lang:No}</label>
     </li>
 
     <li>
-      <label><strong>{lang:Lock gallery}</strong></label>
-      <input type="radio" class="radio" name="gallery_locked" value="true" {general.GALLERY_LOCKED_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="gallery_locked" value="false" {general.GALLERY_LOCKED_NO} />{lang:No}
+      <span class="property">{lang:Lock gallery}</span>
+      <label><input type="radio" class="radio" name="gallery_locked" value="true" {general.GALLERY_LOCKED_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="gallery_locked" value="false" {general.GALLERY_LOCKED_NO} />{lang:No}</label>
     </li>
-  </ul>
-
-  <ul>
+    
     <li>
-      <label><strong>{lang:Rating}</strong></label>
-      <input type="radio" class="radio" name="rate" value="true" {general.RATE_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="rate" value="false" {general.RATE_NO} />{lang:No}
+      <span class="property">{lang:Rating}</span>
+      <label><input type="radio" class="radio" name="rate" value="true" {general.RATE_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="rate" value="false" {general.RATE_NO} />{lang:No}</label>
     </li>
 
     <li>
-      <label><strong>{lang:Rating by guests}</strong></label>
-      <input type="radio" class="radio" name="rate_anonymous" value="true" {general.RATE_ANONYMOUS_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="rate_anonymous" value="false" {general.RATE_ANONYMOUS_NO} />{lang:No}
+      <span class="property">{lang:Rating by guests}</span>
+      <label><input type="radio" class="radio" name="rate_anonymous" value="true" {general.RATE_ANONYMOUS_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="rate_anonymous" value="false" {general.RATE_ANONYMOUS_NO} />{lang:No}</label>
     </li>
   </ul>
 <!-- END general -->
@@ -61,20 +65,22 @@
 
   <ul>
     <li>
-      <label><strong>{lang:Comments for all}</strong></label>
-      <input type="radio" class="radio" name="comments_forall" value="true" {comments.COMMENTS_ALL_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="comments_forall" value="false" {comments.COMMENTS_ALL_NO} />{lang:No}
+      <span class="property">{lang:Comments for all}</span>
+      <label><input type="radio" class="radio" name="comments_forall" value="true" {comments.COMMENTS_ALL_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="comments_forall" value="false" {comments.COMMENTS_ALL_NO} />{lang:No}</label>
     </li>
 
     <li>
-      <label for="nb_comment_page"><strong>{lang:Number of comments per page}</strong></label>
-      <input type="text" size="3" maxlength="4" name="nb_comment_page" id="nb_comment_page" value="{comments.NB_COMMENTS_PAGE}" />
+      <span class="property">
+        <label for="nb_comment_page">{lang:Number of comments per page}</label>
+      </span>
+      <input type="text" size="3" maxlength="4" name="nb_comment_page" id="nb_comment_page" value="{comments.NB_COMMENTS_PAGE}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
 
     <li>
-      <label><strong>{lang:Validation}</strong></label>
-      <input type="radio" class="radio" name="comments_validation" value="true" {comments.VALIDATE_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="comments_validation" value="false" {comments.VALIDATE_NO} />{lang:No}
+      <span class="property">{lang:Validation}</span>
+      <label><input type="radio" class="radio" name="comments_validation" value="true" {comments.VALIDATE_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="comments_validation" value="false" {comments.VALIDATE_NO} />{lang:No}</label>
     </li>
   </ul>
 <!-- END comments -->
@@ -83,8 +89,10 @@
 
   <ul>
     <li>
-      <label for="language"><strong>{lang:Language}</strong></label>
-      <select name="default_language" id="default_language">
+      <span class="property">
+        <label for="default_language">{lang:Language}</label>
+      </span>
+      <select name="default_language" id="default_language" onfocus="this.className='focus';" onblur="this.className='nofocus';">
         <!-- BEGIN language_option -->
         <option value="{default.language_option.VALUE}" {default.language_option.SELECTED}>{default.language_option.CONTENT}</option>
         <!-- END language_option -->
@@ -92,18 +100,24 @@
     </li>
 
     <li>
-      <label for="nb_image_line"><strong>{lang:Number of images per row}</strong></label>
-      <input type="text" size="3" maxlength="2" name="nb_image_line" value="{default.NB_IMAGE_LINE}" />
+      <span class="property">
+        <label for="nb_image_line">{lang:Number of images per row}</label>
+      </span>
+      <input type="text" size="3" maxlength="2" id="nb_image_line" name="nb_image_line" value="{default.NB_IMAGE_LINE}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
 
     <li>
-      <label><strong>{lang:Number of rows per page}</strong></label>
-      <input type="text" size="3" maxlength="2" name="nb_line_page" value="{default.NB_ROW_PAGE}" />
+      <span class="property">
+        <label for="nb_line_page">{lang:Number of rows per page}</label>
+      </span>
+      <input type="text" size="3" maxlength="2" id="nb_line_page" name="nb_line_page" value="{default.NB_ROW_PAGE}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
 
     <li>
-      <label><strong>{lang:Interface theme}</strong></label>
-      <select name="default_template" id="default_template">
+      <span class="property">
+        <label for="default_template">{lang:Interface theme}</label>
+      </span>
+      <select name="default_template" id="default_template" onfocus="this.className='focus';" onblur="this.className='nofocus';">
         <!-- BEGIN template_option -->
         <option value="{default.template_option.VALUE}" {default.template_option.SELECTED}>{default.template_option.CONTENT}</option>
         <!-- END template_option -->
@@ -111,30 +125,36 @@
     </li>
 
     <li>
-      <label for="recent_period"><strong>{lang:Recent period}</strong></label>
-      <input type="text" size="3" maxlength="2" name="recent_period" id="recent_period" value="{default.CONF_RECENT}" />
+      <span class="property">
+        <label for="recent_period">{lang:Recent period}</label>
+      </span>
+      <input type="text" size="3" maxlength="2" name="recent_period" id="recent_period" value="{default.CONF_RECENT}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
 
     <li>
-      <label><strong>{lang:Expand all categories}</strong></label>
-      <input type="radio" class="radio" name="auto_expand" value="true" {default.EXPAND_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="auto_expand" value="false" {default.EXPAND_NO} />{lang:No}
+      <span class="property">{lang:Expand all categories}</span>
+      <label><input type="radio" class="radio" name="auto_expand" value="true" {default.EXPAND_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="auto_expand" value="false" {default.EXPAND_NO} />{lang:No}</label>
     </li>
 
     <li>
-      <label><strong>{lang:Show number of comments}</strong></label>
-      <input type="radio" class="radio" name="show_nb_comments" value="true" {default.SHOW_COMMENTS_YES} />{lang:Yes}
-      <input type="radio" class="radio" name="show_nb_comments" value="false" {default.SHOW_COMMENTS_NO} />{lang:No}
+      <span class="property">{lang:Show number of comments}</span>
+      <label><input type="radio" class="radio" name="show_nb_comments" value="true" {default.SHOW_COMMENTS_YES} />{lang:Yes}</label>
+      <label><input type="radio" class="radio" name="show_nb_comments" value="false" {default.SHOW_COMMENTS_NO} />{lang:No}</label>
     </li>
 
     <li>
-      <label><strong>{lang:Maximum width of the pictures}</strong></label>
-      <input type="text" size="4" maxlength="4" name="default_maxwidth" value="{default.MAXWIDTH}" />
+      <span class="property">
+        <label for="default_maxwidth">{lang:Maximum width of the pictures}</label>
+      </span>
+      <input type="text" size="4" maxlength="4" id="default_maxwidth" name="default_maxwidth" value="{default.MAXWIDTH}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
 
     <li>
-      <label><strong>{lang:Maximum height of the pictures}</strong></label>
-      <input type="text" size="4" maxlength="4" name="default_maxheight" value="{default.MAXHEIGHT}" />
+      <span class="property">
+        <label for="default_maxheight">{lang:Maximum height of the pictures}</label>
+      </span>
+      <input type="text" size="4" maxlength="4" id="default_maxheight" name="default_maxheight" value="{default.MAXHEIGHT}" onfocus="this.className='focus';" onblur="this.className='nofocus';" />
     </li>
   </ul>
 <!-- END default -->