feature 2626: add watermark preview (copied from original configuration screen)

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

admin/themes/default/template/configuration.tpl

@@ -453,6 +453,20 @@ jQuery(document).ready(function(){
 {footer_script}{literal}
 jQuery(document).ready(function() {
 
+  function onWatermarkChange() {
+    var val = jQuery("#wSelect").val();
+    if (val.length) {
+      jQuery("#wImg").attr('src', {/literal}'{$ROOT_URL}'{literal}+val).show();
+    }
+    else {
+      jQuery("#wImg").hide();
+    }
+  }
+
+  onWatermarkChange();
+
+  jQuery("#wSelect").bind("change", onWatermarkChange);
+
   if (jQuery("input[name='w[position]']:checked").val() == 'custom') {
     jQuery("#positionCustomDetails").show();
   }
@@ -478,12 +492,9 @@ jQuery(document).ready(function() {
 	{html_options options=$watermark_files selected=$watermark.file}
       </select>
       <br>{'... or '|@translate}<a href="#" class="addWatermarkOpen" title="{'add a new watermark'|@translate}">{'add a new watermark'|@translate}</a>
+      <br><img id="wImg"></img>
     </li>
 
-{*
-<p><img id="wImg"></img></p>
-*}
-
     <li>
       <label>
         {'Apply watermark if width is bigger than'|@translate}

admin/themes/default/theme.css

@@ -1111,3 +1111,5 @@ FORM#categoryOrdering .categoryLi:hover p.albumActions {visibility:visible;}
 
 input[type="text"].dError {border-color:#ff7070; background-color:#FFe5e5;}
 .dErrorDesc {background-color:red; color:white; padding:0 5px;border-radius:10px; font-weight:bold;cursor:help;}
+
+#wImg {max-height:100px;border:2px solid #ccc;}