Changeset 23209


Ignore:
Timestamp:
06/14/13 19:02:17 (7 years ago)
Author:
mistic100
Message:

rewrite config page

Location:
extensions/CryptograPHP
Files:
1 added
2 edited

Legend:

Unmodified
Added
Removed
  • extensions/CryptograPHP/admin.php

    r22725 r23209  
    1717  $conf['cryptographp'] = array( 
    1818    'activate_on'     => array( 
    19           'picture'     => isset($_POST['activate_on']['picture']), 
    20           'category'    => isset($_POST['activate_on']['category']) || !$loaded['category'], 
    21           'register'    => isset($_POST['activate_on']['register']), 
    22           'contactform' => isset($_POST['activate_on']['contactform']) || !$loaded['contactform'], 
    23           'guestbook'   => isset($_POST['activate_on']['guestbook']) || !$loaded['guestbook'], 
     19          'picture'     => in_array('picture', $_POST['activate_on']), 
     20          'category'    => in_array('category', $_POST['activate_on']) || !$loaded['category'], 
     21          'register'    => in_array('register', $_POST['activate_on']), 
     22          'contactform' => in_array('contactform', $_POST['activate_on']) || !$loaded['contactform'], 
     23          'guestbook'   => in_array('guestbook', $_POST['activate_on']) || !$loaded['guestbook'], 
    2424          ), 
    2525    'comments_action' => $_POST['comments_action'], 
     
    6868} 
    6969 
    70 function presets_to_js($presets) 
    71 { 
    72   $out = null; 
    73    
    74   foreach ($presets as $name => $param) 
    75   { 
    76     $out.= ' 
    77 function apply_'.$name.'() { 
    78   $("input[name=perturbation]").val("'.$param['perturbation'].'"); 
    79   $("input[name=image_bg_color]").val("'.$param['image_bg_color'].'"); 
    80   $("input[name=text_color]").val("'.$param['text_color'].'"); 
    81   $("input[name=num_lines]").val("'.$param['num_lines'].'"); 
    82   $("input[name=line_color]").val("'.$param['line_color'].'"); 
    83   $("input[name=noise_level]").val("'.$param['noise_level'].'"); 
    84   $("input[name=noise_color]").val("'.$param['noise_color'].'"); 
    85   $("input[name=ttf_file]").val(["'.$param['ttf_file'].'"]); 
    86 }'; 
    87   } 
    88     
    89   return $out; 
    90 } 
    91  
    9270$template->assign(array( 
    9371  'crypto' => $conf['cryptographp'], 
    9472  'loaded' => $loaded, 
    9573  'fonts' => list_fonts(CRYPTO_PATH.'securimage/fonts'), 
    96   'presets' => array_keys($presets), 
    97   'PRESETS_FUNC' => presets_to_js($presets), 
     74  'PRESETS' => $presets, 
    9875  'CRYPTO_PATH' => CRYPTO_PATH, 
    9976  )); 
  • extensions/CryptograPHP/template/admin.tpl

    r22725 r23209  
     1{combine_css path=$CRYPTO_PATH|@cat:"template/style.css"} 
     2 
    13{combine_css path=$CRYPTO_PATH|@cat:"template/colorpicker/colorpicker.css"} 
    2 {combine_script id="jquery.colorpicker" require="jquery" path=$CRYPTO_PATH|@cat:"template/colorpicker/colorpicker.js"} 
    3  
    4 {footer_script require='jquery.colorpicker'}{literal} 
    5 jQuery(document).ready(function() { 
    6   // colorpicker 
    7   $('.colorpicker-input') 
    8     .ColorPicker({ 
    9       onSubmit: function(hsb, hex, rgb, el) {  
    10         $(el).val(hex);  
    11         $(el).ColorPickerHide();  
    12       }, 
    13       onChange: function(hsb, hex, rgb, el) {  
    14         $(el).val(hex);  
    15         changeColor(el, hex); 
    16         changePreview(); 
    17         setThemeCutom(); 
    18       }, 
    19       onBeforeShow: function () {  
    20         $(this).ColorPickerSetColor(this.value);  
    21       } 
    22     }) 
    23     .bind('keyup', function(){  
    24       $(this).ColorPickerSetColor(this.value); 
    25       changeColor(this, $(this).val()); 
    26     }) 
    27     .each(function() { 
    28       changeColor(this, $(this).val()); 
    29     }); 
    30    
    31   // change button 
    32   $('.button').click(function() { 
    33     $('.button').removeClass('selected'); 
    34     $(this).addClass('selected'); 
    35     $('input[name=button_color]').val($(this).attr('title')); 
    36     $('#reload').attr('src', '{/literal}{$CRYPTO_PATH}{literal}template/refresh_'+ $(this).attr('title') +'.png'); 
     4{combine_script id="jquery.colorpicker" load="footer" path=$CRYPTO_PATH|@cat:"template/colorpicker/colorpicker.js"} 
     5 
     6{combine_css path="themes/default/js/plugins/chosen.css"} 
     7{combine_script id='jquery.chosen' load='footer' path='themes/default/js/plugins/chosen.jquery.min.js'} 
     8 
     9 
     10{footer_script}{literal} 
     11// colorpicker 
     12$('.colorpicker-input') 
     13  .ColorPicker({ 
     14    onSubmit: function(hsb, hex, rgb, el) {  
     15      $(el).val(hex);  
     16      $(el).ColorPickerHide();  
     17    }, 
     18    onChange: function(hsb, hex, rgb, el) {  
     19      $(el).val(hex);  
     20      changeColor(el, hex); 
     21      changePreview(); 
     22      setThemeCutom(); 
     23    }, 
     24    onBeforeShow: function () {  
     25      $(this).ColorPickerSetColor(this.value);  
     26    } 
     27  }) 
     28  .bind('keyup', function(){  
     29    $(this).ColorPickerSetColor(this.value); 
     30    changeColor(this, $(this).val()); 
     31  }) 
     32  .each(function() { 
     33    changeColor(this, $(this).val()); 
    3734  }); 
    38    
    39   // apply a preset 
    40   $('.preset').click(function() { 
    41     $('.preset').removeClass('selected'); 
    42     $(this).addClass('selected'); 
    43     eval('apply_'+ $(this).attr('title') +'();'); 
    44     $('.colorpicker-input').each(function() { changeColor(this, $(this).val()); }); 
    45     $('input[name=theme]').val($(this).attr('title')); 
    46     changePreview(); 
    47   }); 
    48    
    49   // display customization panel 
    50   $('.customize').click(function() { 
    51     $('#theming').toggle(); 
    52   }); 
    53    
    54   // change theme to 'custom' if a parameter is changed 
    55   $('input.istheme').change(function() { 
    56     setThemeCutom(); 
    57   }); 
    58    
    59   // update the preview 
    60   $('input.istheme, input.preview').change(function() { 
    61     changePreview(); 
    62   }); 
    63   $('#reload').click(function() { 
    64     changePreview(); 
    65   }); 
    66    
    67   // links for random color 
    68   $('a.random').click(function() { 
    69     $(this).prev('label').children('input').val('random'); 
    70     changeColor($(this).prev('label').children('input'), 'random'); 
    71     changePreview(); 
    72     setThemeCutom(); 
    73   }); 
     35 
     36// change button 
     37$('.button').click(function() { 
     38  $('.button').removeClass('selected'); 
     39  $(this).addClass('selected'); 
     40  $('input[name=button_color]').val($(this).attr('title')); 
     41  $('#reload').attr('src', '{/literal}{$CRYPTO_PATH}{literal}template/refresh_'+ $(this).attr('title') +'.png'); 
     42}); 
     43 
     44// apply a preset 
     45$('.preset').click(function() { 
     46  $('.preset').removeClass('selected'); 
     47  $(this).addClass('selected'); 
     48   
     49  var id = $(this).attr("title"); 
     50   
     51  for (key in presets[id]) { 
     52    $('input[name="'+ key +'"]').val([presets[id][key]]); 
     53  } 
     54   
     55  $('.colorpicker-input').each(function() { changeColor(this, $(this).val()); }); 
     56  $('input[name="theme"]').val($(this).attr('title')); 
     57  changePreview(); 
     58}); 
     59 
     60// display customization panel 
     61$('.customize').click(function() { 
     62  $('#theming').toggle(); 
     63}); 
     64 
     65// change theme to 'custom' if a parameter is changed 
     66$('input.istheme').change(function() { 
     67  setThemeCutom(); 
     68}); 
     69 
     70// update the preview 
     71$('input.istheme, input.preview').change(function() { 
     72  changePreview(); 
     73}); 
     74$('#reload').click(function() { 
     75  changePreview(); 
     76}); 
     77 
     78// links for random color 
     79$('a.random').click(function() { 
     80  $(this).prev('label').children('input').val('random'); 
     81  changeColor($(this).prev('label').children('input'), 'random'); 
     82  changePreview(); 
     83  setThemeCutom(); 
     84}); 
     85 
     86// multiselect 
     87$("select").css({ 
     88  "width":"700px" 
     89}).chosen({ 
     90  disable_search:true, 
    7491}); 
    7592 
     
    105122{/literal} 
    106123 
    107 {$PRESETS_FUNC} 
     124var presets = {ldelim} 
     125{foreach from=$PRESETS key=name item=params} 
     126  "{$name}" : {ldelim} 
     127  {foreach from=$params key=key item=value} 
     128    "{$key}" : "{$value}", 
     129  {/foreach} 
     130  }, 
     131{/foreach} 
     132}; 
    108133{/footer_script} 
     134 
    109135 
    110136{html_head} 
     
    116142} 
    117143{/foreach} 
    118  
    119 .preset img, .button img {ldelim} 
    120   margin:1px; 
    121   padding:3px; 
    122   border:1px solid #999; 
    123 } 
    124 .preset.selected img, .button.selected img {ldelim} 
    125   border-color:#f70; 
    126 } 
    127  
    128 .big-list {ldelim} 
    129   display:relative; 
    130   margin-left:51%; 
    131 } 
    132 .big-list label {ldelim} 
    133   display:inline-block; 
    134   margin-right:10px; 
    135 } 
    136144</style> 
    137145{/html_head} 
     146 
    138147 
    139148<div class="titrePage"> 
     
    147156  <ul> 
    148157    <li> 
    149       <span class="property">{'Activate on'|@translate}</span> 
    150       <div class="big-list"> 
    151         <label><input type="checkbox" name="activate_on[picture]" value="1" {if $crypto.activate_on.picture}checked="checked"{/if}> {'Picture comments'|@translate}</label> 
    152         {if $loaded.category}<label><input type="checkbox" name="activate_on[category]" value="1" {if $crypto.activate_on.category}checked="checked"{/if}> {'Album comments'|@translate}</label>{/if} 
    153         <label><input type="checkbox" name="activate_on[register]" value="1" {if $crypto.activate_on.register}checked="checked"{/if}> {'Register form'|@translate}</label> 
    154         {if $loaded.contactform}<label><input type="checkbox" name="activate_on[contactform]" value="1" {if $crypto.activate_on.contactform}checked="checked"{/if}> {'Contact form'|@translate}</label>{/if} 
    155         {if $loaded.guestbook}<label><input type="checkbox" name="activate_on[guestbook]" value="1" {if $crypto.activate_on.guestbook}checked="checked"{/if}> {'Guestbook'|@translate}</label>{/if} 
    156         </div> 
    157     </li> 
    158     <li> 
    159       <span class="property">{'Comments action'|@translate}</span> 
     158      <b>{'Activate on'|@translate}</b> 
     159      <select name="activate_on[]" multiple> 
     160        <option value="picture" {if $crypto.activate_on.picture}selected{/if}>{'Picture comments'|@translate}</option> 
     161        {if $loaded.category}<option value="category" {if $crypto.activate_on.category}selected{/if}>{'Album comments'|@translate}</option>{/if} 
     162        <option value="register" {if $crypto.activate_on.register}selected{/if}>{'Register form'|@translate}</option> 
     163        {if $loaded.contactform}<option value="contactform" {if $crypto.activate_on.contactform}selected{/if}>{'Contact form'|@translate}</option>{/if} 
     164        {if $loaded.guestbook}<option value="guestbook" {if $crypto.activate_on.guestbook}selected{/if}>{'Guestbook'|@translate}</option>{/if} 
     165      </select> 
     166    </li> 
     167    <li> 
     168      <b>{'Comments action'|@translate}</b> 
    160169      <label><input type="radio" name="comments_action" value="reject" {if $crypto.comments_action == 'reject'}checked="checked"{/if}> {'Reject'|@translate}</label> 
    161170      <label><input type="radio" name="comments_action" value="moderate" {if $crypto.comments_action == 'moderate'}checked="checked"{/if}> {'Moderate'|@translate}</label> 
    162171    </li> 
    163172    <li> 
    164       <span class="property">{'Captcha type'|@translate}</span> 
     173      <b>{'Captcha type'|@translate}</b> 
    165174      <label><input type="radio" name="captcha_type" class="preview" value="string" {if $crypto.captcha_type == 'string'}checked="checked"{/if}> {'Random string'|@translate}</label> 
    166175      <label><input type="radio" name="captcha_type" class="preview" value="math" {if $crypto.captcha_type == 'math'}checked="checked"{/if}> {'Simple equation'|@translate}</label> 
    167176    </li> 
    168177    <!--<li> 
    169       <span class="property">{'Case sensitive'|@translate}</span> 
     178      <b>{'Case sensitive'|@translate}</b> 
    170179      <label><input type="radio" name="case_sensitive" value="false" {if $crypto.case_sensitive == 'false'}checked="checked"{/if}> {'No'|@translate}</label> 
    171180      <label><input type="radio" name="case_sensitive" value="true" {if $crypto.case_sensitive == 'true'}checked="checked"{/if}> {'Yes'|@translate}</label> 
    172181    </li>--> 
    173182    <li> 
    174       <span class="property">{'Code lenght'|@translate}</span> 
     183      <b>{'Code lenght'|@translate}</b> 
    175184      <label><input type="text" name="code_length" class="preview" value="{$crypto.code_length}" size="6" maxlength="2"></label> 
    176185    </li> 
    177186    <li> 
    178       <span class="property">{'Width'|@translate}</span> 
     187      <b>{'Width'|@translate}</b> 
    179188      <label><input type="text" name="width" class="preview" value="{$crypto.width}" size="6" maxlength="3"> {'good value:'|@translate} lenght&times;30</label> 
    180189    </li> 
    181190    <li> 
    182       <span class="property">{'Height'|@translate}</span> 
     191      <b>{'Height'|@translate}</b> 
    183192      <label><input type="text" name="height" class="preview" value="{$crypto.height}" size="6" maxlength="3"> {'good value:'|@translate} lenght&times;12</label> 
    184193    </li> 
    185194    <li> 
    186       <span class="property">{'Button color'|@translate}</span> 
    187       <div style="display:relative;margin-left:51%;"> 
    188         <a class="button {if $crypto.button_color == 'dark'}selected{/if}" title="dark"><img src="{$CRYPTO_PATH}template/refresh_dark.png" alt="dark"></a> 
    189         <a class="button {if $crypto.button_color == 'light'}selected{/if}" title="light"><img src="{$CRYPTO_PATH}template/refresh_light.png" alt="light"></a> 
    190         <input type="hidden" name="button_color" value="{$crypto.button_color}"> 
    191       </div> 
    192     </li> 
    193     <li> 
    194       <span class="property">{'Captcha theme'|@translate}</span> 
    195       <div style="display:relative;margin-left:51%;"> 
    196         {foreach from=$presets item=preset} 
    197         <a class="preset {if $crypto.theme == $preset}selected{/if}" title="{$preset}"><img src="{$CRYPTO_PATH}template/presets/{$preset}.png" alt="{$preset}"></a> 
    198         {/foreach} 
    199         <br><a class="customize">{'Customize'|@translate}</a><input type="hidden" name="theme" value="{$crypto.theme}"> 
    200       </div> 
     195      <b>{'Button color'|@translate}</b> 
     196      <a class="button {if $crypto.button_color == 'dark'}selected{/if}" title="dark"><img src="{$CRYPTO_PATH}template/refresh_dark.png" alt="dark"></a> 
     197      <a class="button {if $crypto.button_color == 'light'}selected{/if}" title="light"><img src="{$CRYPTO_PATH}template/refresh_light.png" alt="light"></a> 
     198      <input type="hidden" name="button_color" value="{$crypto.button_color}"> 
     199    </li> 
     200    <li> 
     201      <b>{'Captcha theme'|@translate}</b> 
     202      {foreach from=$PRESETS key=preset item=params} 
     203      <a class="preset {if $crypto.theme == $preset}selected{/if}" title="{$preset}"><img src="{$CRYPTO_PATH}template/presets/{$preset}.png" alt="{$preset}"></a> 
     204      {/foreach} 
     205      <input type="hidden" name="theme" value="{$crypto.theme}"> 
     206      <a class="customize">{'Customize'|@translate}</a> 
    201207    </li> 
    202208  </ul> 
     
    207213    <ul> 
    208214      <li> 
    209         <span class="property">{'Perturbation'|@translate}</span> 
     215        <b>{'Perturbation'|@translate}</b> 
    210216        <label><input type="text" name="perturbation" value="{$crypto.perturbation}" class="istheme" size="6" maxlength="4"> {'range:'|@translate} 0 - 1</label> 
    211217      </li> 
    212218      <li> 
    213         <span class="property">{'Background color'|@translate}</span> 
     219        <b>{'Background color'|@translate}</b> 
    214220        <label><input type="text" name="image_bg_color" value="{$crypto.image_bg_color}" class="colorpicker-input istheme" size="6" maxlength="6"></label>  
    215221        <a class="random" title="{'random'|@translate}"><img src="{$CRYPTO_PATH}/template/arrow_switch.png"></a> 
    216222      </li> 
    217223      <li> 
    218         <span class="property">{'Text color'|@translate}</span> 
     224        <b>{'Text color'|@translate}</b> 
    219225        <label><input type="text" name="text_color" value="{$crypto.text_color}" class="colorpicker-input istheme" size="6" maxlength="6"></label>  
    220226        <a class="random" title="{'random'|@translate}"><img src="{$CRYPTO_PATH}/template/arrow_switch.png"></a> 
    221227      </li> 
    222228      <li> 
    223         <span class="property">{'Lines density'|@translate}</span> 
     229        <b>{'Lines density'|@translate}</b> 
    224230        <label><input type="text" name="num_lines" value="{$crypto.num_lines}" class="istheme" size="6" maxlength="4"> {'range:'|@translate} 0 - 10</label> 
    225231      </li> 
    226232      <li> 
    227         <span class="property">{'Lines color'|@translate}</span> 
     233        <b>{'Lines color'|@translate}</b> 
    228234        <label><input type="text" name="line_color" value="{$crypto.line_color}" class="colorpicker-input istheme" size="6" maxlength="6"></label>  
    229235        <a class="random" title="{'random'|@translate}"><img src="{$CRYPTO_PATH}/template/arrow_switch.png"></a> 
    230236      </li> 
    231237      <li> 
    232         <span class="property">{'Noise level'|@translate}</span> 
     238        <b>{'Noise level'|@translate}</b> 
    233239        <label><input type="text" name="noise_level" value="{$crypto.noise_level}" class="istheme" size="6" maxlength="4"> {'range:'|@translate} 0 - 10</label> 
    234240      </li> 
    235241      <li> 
    236         <span class="property">{'Noise color'|@translate}</span> 
     242        <b>{'Noise color'|@translate}</b> 
    237243        <label><input type="text" name="noise_color" value="{$crypto.noise_color}" class="colorpicker-input istheme" size="6" maxlength="6"></label>  
    238244        <a class="random" title="{'random'|@translate}"><img src="{$CRYPTO_PATH}/template/arrow_switch.png"></a> 
    239245      </li> 
    240246      <li> 
    241         <span class="property">{'Font'|@translate}</span> 
    242         <div class="big-list"> 
    243           {foreach from=$fonts item=font} 
    244           <label style="font-family:{$font};" title="{$font}"><input type="radio" name="ttf_file" value="{$font}" {if $crypto.ttf_file == $font}checked="checked"{/if} class="istheme"> {$font}</label> 
    245           {/foreach} 
    246         </div> 
     247        <b>{'Font'|@translate}</b> 
     248        {foreach from=$fonts item=font} 
     249        <label style="font-family:{$font};" title="{$font}"><input type="radio" name="ttf_file" value="{$font}" {if $crypto.ttf_file == $font}checked="checked"{/if} class="istheme"> {$font}</label> 
     250        {/foreach} 
    247251      </li> 
    248252    </ul> 
     
    253257  <ul style="margin-top:30px;"> 
    254258    <li> 
    255       <span class="property">{'Preview'|@translate}</span> 
     259      <b>{'Preview'|@translate}</b> 
    256260      <img id="captcha" src="{$CRYPTO_PATH}securimage/securimage_show.php" alt="CAPTCHA Image"> 
    257261      <a href="#" onClick="return false;"><img id="reload" src="{$CRYPTO_PATH}template/refresh_{$crypto.button_color}.png"></a> 
     
    260264   
    261265</fieldset> 
    262 <p><input class="submit" type="submit" value="{'Submit'|@translate}" name="submit"></p> 
     266 
     267<p class="formButtons"><input class="submit" type="submit" value="{'Submit'|@translate}" name="submit"></p> 
    263268</form> 
    264269 
Note: See TracChangeset for help on using the changeset viewer.