Changeset 13883


Ignore:
Timestamp:
Apr 3, 2012, 11:01:40 PM (8 years ago)
Author:
plg
Message:

feature 2606: first step on multiple size configuration screen redesign.

Multiple size configuration moved to [Administration > Configuration > Photo Sizes]

Less details by default, less options also (sharpen had disappeared)

TODO : save settings on form submission. The old screen is still available.

Location:
trunk/admin
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/admin/configuration.php

    r13840 r13883  
    446446    }
    447447
     448    // derivaties = multiple size
     449    $enabled = ImageStdParams::get_defined_type_map();
     450    $disabled = @unserialize(@$conf['disabled_derivatives']);
     451    if ($disabled === false)
     452    {
     453      $disabled = array();
     454    }
     455
     456    $tpl_vars = array();
     457    foreach(ImageStdParams::get_all_types() as $type)
     458    {
     459      $tpl_var = array();
     460     
     461      $tpl_var['must_square'] = ($type==IMG_SQUARE ? true : false);
     462      $tpl_var['must_enable'] = ($type==IMG_SQUARE || $type==IMG_THUMB)? true : false;
     463     
     464      if ($params=@$enabled[$type])
     465      {
     466        $tpl_var['enabled']=true;
     467      }
     468      else
     469      {
     470        $tpl_var['enabled']=false;
     471        $params=@$disabled[$type];
     472      }
     473     
     474      if ($params)
     475      {
     476        list($tpl_var['w'],$tpl_var['h']) = $params->sizing->ideal_size;
     477        if ( ($tpl_var['crop'] = round(100*$params->sizing->max_crop)) > 0)
     478        {
     479          list($tpl_var['minw'],$tpl_var['minh']) = $params->sizing->min_size;
     480        }
     481        else
     482        {
     483          $tpl_var['minw'] = $tpl_var['minh'] = "";
     484        }
     485        $tpl_var['sharpen'] = $params->sharpen;
     486        $tpl_var['quality'] = $params->quality;
     487      }
     488      $tpl_vars[$type]=$tpl_var;
     489    }
     490    $template->assign('derivatives', $tpl_vars);
     491
    448492    break;
    449493  }
  • trunk/admin/themes/default/template/configuration.tpl

    r13838 r13883  
    269269{if isset($sizes)}
    270270
    271 {footer_script}{literal}
     271{footer_script}
     272var labelMaxWidth = "{'Maximum Width'|@translate}";
     273var labelWidth = "{'Width'|@translate}";
     274
     275var labelMaxHeight = "{'Maximum Height'|@translate}";
     276var labelHeight = "{'Height'|@translate}";
     277{literal}
    272278jQuery(document).ready(function(){
    273   function toggleResizeFields(prefix) {
    274     var checkbox = jQuery("#"+prefix+"_resize");
    275     var needToggle = jQuery("input[name^="+prefix+"_]").not(checkbox).parents('tr');
     279  function toggleResizeFields(size) {
     280    var checkbox = jQuery("#original_resize");
     281    var needToggle = jQuery("#sizeEdit-original");
    276282
    277283    if (jQuery(checkbox).is(':checked')) {
     
    285291  toggleResizeFields("original");
    286292  jQuery("#original_resize").click(function () {toggleResizeFields("original")});
     293
     294  jQuery("a[id^='sizeEditOpen-']").click(function(){
     295    var sizeName = jQuery(this).attr("id").split("-")[1];
     296    jQuery("#sizeEdit-"+sizeName).toggle();
     297    jQuery(this).hide();
     298  });
     299
     300  jQuery(".cropToggle").click(function() {
     301    var labelBoxWidth = jQuery(this).parents('table.sizeEditForm').find('td.sizeEditWidth');
     302    var labelBoxHeight = jQuery(this).parents('table.sizeEditForm').find('td.sizeEditHeight');
     303
     304    if (jQuery(this).is(':checked')) {
     305      jQuery(labelBoxWidth).html(labelWidth);
     306      jQuery(labelBoxHeight).html(labelHeight);
     307    }
     308    else {
     309      jQuery(labelBoxWidth).html(labelMaxWidth);
     310      jQuery(labelBoxHeight).html(labelMaxHeight);
     311    }
     312  });
     313
     314  jQuery("#showDetails").click(function() {
     315    jQuery(".sizeDetails").show();
     316    jQuery(this).css("visibility", "hidden");
     317  });
     318
    287319});
    288320{/literal}{/footer_script}
    289321
     322{literal}
     323<style>
     324.sizeEnable {width:50px;}
     325.sizeEditForm {margin:0 0 10px 20px;}
     326.sizeEdit {display:none;}
     327#sizesConf table {margin:0;}
     328.showDetails {padding:0;}
     329.sizeDetails {display:none;margin-left:10px;}
     330.sizeEditOpen {margin-left:10px;}
     331</style>
     332{/literal}
     333
    290334<fieldset id="sizesConf">
    291335  <legend>{'Original Size'|@translate}</legend>
    292336
    293   <table>
    294     <tr>
    295       <th><label for="original_resize">{'Resize after upload'|@translate}</label></th>
    296       <td><input type="checkbox" name="original_resize" id="original_resize" {if ($sizes.original_resize)}checked="checked"{/if}></td>
    297     </tr>
     337  <div>
     338    <label for="original_resize">
     339      <input type="checkbox" name="original_resize" id="original_resize" {if ($sizes.original_resize)}checked="checked"{/if}>
     340      {'Resize after upload'|@translate}
     341    </label>
     342  </div>
     343
     344  <table id="sizeEdit-original">
    298345    <tr>
    299346      <th>{'Maximum Width'|@translate}</th>
     
    311358
    312359</fieldset>
     360
     361<div class="warnings">Warning: the following fields are for test "user interface" test only. Any change won't be saved.<br>See screen [Administration > Configuration > Multiple Size] to configure sizes.</div>
     362
     363<fieldset id="multiSizesConf">
     364  <legend>{'Multiple Size'|@translate}</legend>
     365
     366<div class="showDetails">
     367  <a href="#" id="showDetails"{if $show_details} style="display:none"{/if}>{'show details'|@translate}</a>
     368</div>
     369
     370<table style="margin:0">
     371{foreach from=$derivatives item=d key=type}
     372  <tr>
     373    <td>
     374      <label>
     375        <span class="sizeEnable">
     376  {if $d.must_enable}
     377          &#x2714;
     378  {else}
     379          <input type="checkbox" name="d[{$type}][enabled]" {if $d.enabled}checked="checked"{/if}>
     380  {/if}
     381        </span>
     382        {$type|@translate}
     383      </label>
     384    </td>
     385
     386    <td>
     387      <span class="sizeDetails">{$d.w} x {$d.h} {'pixels'|@translate}{if $d.crop}, {'Crop'|@translate|lower}{/if}</span>
     388    </td>
     389
     390    <td>
     391      <span class="sizeDetails">
     392        <a href="#" id="sizeEditOpen-{$type}" class="sizeEditOpen">{'edit'|@translate}</a>
     393      </span>
     394    </td>
     395  </tr>
     396
     397  <tr id="sizeEdit-{$type}" class="sizeEdit">
     398    <td colspan="3">
     399      <table class="sizeEditForm">
     400  {if !$d.must_square}
     401        <tr>
     402          <td colspan="2">
     403            <label>
     404              <input type="checkbox" class="cropToggle" name="d[{$type}][crop]" {if $d.crop}checked="checked"{/if}>
     405              {'Crop'|@translate}
     406            </label>
     407          </td>
     408        </tr>
     409  {/if}
     410
     411        <tr>
     412          <td class="sizeEditWidth">{if $d.must_square or $d.crop}{'Width'|@translate}{else}{'Maximum Width'|@translate}{/if}</td>
     413          <td>
     414            <input type="text" name="d[{$type}][w]" maxlength="4" size="4" value="{$d.w}"{if isset($ferrors.$type.w)}class="dError"{/if}>
     415            {'pixels'|@translate}
     416            {if isset($ferrors.$type.w)}<span class="dErrorDesc" title="{$ferrors.$type.w}">!</span>{/if}
     417          </td>
     418        </tr>
     419
     420  {if !$d.must_square}
     421        <tr>
     422          <td class="sizeEditHeight">{if $d.crop}{'Height'|@translate}{else}{'Maximum Height'|@translate}{/if}</td>
     423          <td>
     424            <input type="text" name="d[{$type}][h]" maxlength="4" size="4"  value="{$d.h}"{if isset($ferrors.$type.h)}class="dError"{/if}>
     425            {'pixels'|@translate}
     426            {if isset($ferrors.$type.h)}<span class="dErrorDesc" title="{$ferrors.$type.h}">!</span>{/if}
     427          </td>
     428        </tr>
     429  {/if}
     430      </table> {* #sizeEdit *}
     431    </td>
     432  </tr>
     433{/foreach}
     434</table>
     435
     436<p style="margin:20px 0 0 0" class="sizeDetails">
     437  {'Image Quality'|@translate}
     438  <input type="text" name="original_resize_quality" value="{$sizes.original_resize_quality}" size="3" maxlength="3"> %
     439</p>
     440</fieldset>
    313441{/if}
    314442
Note: See TracChangeset for help on using the changeset viewer.