Ignore:
Timestamp:
02/10/12 11:52:07 (8 years ago)
Author:
plg
Message:

feature 2564: redesign on photo administration screen.

  • one screen with several tabs (for now: properties + coi)
  • double select boxes for album associations and representation have been converted to simple multiple select boxes with jQuery Chosen
  • more details about the photo in an introduction text
File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/admin/themes/default/template/picture_modify.tpl

    r13038 r13077  
    22{include file='include/dbselect.inc.tpl'} 
    33{include file='include/datepicker.inc.tpl'} 
     4 
     5{combine_script id='jquery.chosen' load='footer' path='themes/default/js/plugins/chosen.jquery.min.js'} 
     6{combine_css path="themes/default/js/plugins/chosen.css"} 
     7 
     8{footer_script}{literal} 
     9jQuery(document).ready(function() { 
     10  jQuery(".chzn-select").chosen(); 
     11}); 
     12{/literal}{/footer_script} 
    413 
    514{combine_script id='jquery.tokeninput' load='async' require='jquery' path='themes/default/js/plugins/jquery.tokeninput.js'} 
     
    2534{/footer_script} 
    2635 
    27 <h2>{'Edit photo information'|@translate}</h2> 
     36<h2>{$TITLE} &#8250; {'Edit photo'|@translate} {$TABSHEET_TITLE}</h2> 
    2837 
    29 <img src="{$TN_SRC}" alt="{'Thumbnail'|@translate}" class="Thumbnail"> 
    30  
    31 <ul class="categoryActions"> 
    32   {if isset($U_JUMPTO) } 
    33   <li><a href="{$U_JUMPTO}" title="{'jump to photo'|@translate}"><img src="{$themeconf.admin_icon_dir}/category_jump-to.png" alt="{'jump to photo'|@translate}"></a></li> 
    34   {/if} 
    35   {if !url_is_remote($PATH)} 
    36   <li><a href="{$U_SYNC}" title="{'Synchronize'|@translate}"><img src="{$themeconf.admin_icon_dir}/sync_metadata.png" alt="{'Synchronize'|@translate}"></a></li> 
    37  
    38   <li><a href="{$U_DELETE}" title="{'delete photo'|@translate}"><img src="{$ROOT_URL}{$themeconf.admin_icon_dir}/category_delete.png" alt="{'delete photo'|@translate}" onclick="return confirm('{'Are you sure?'|@translate|@escape:javascript}');"></a></li> 
    39   {/if} 
    40 </ul> 
    41  
    42 <form action="{$F_ACTION}" method="post" id="properties"> 
     38<form action="{$F_ACTION}" method="post" id="catModify"> 
    4339 
    4440  <fieldset> 
     
    4844 
    4945      <tr> 
    50         <td><strong>{'Path'|@translate}</strong></td> 
    51         <td>{$PATH}</td> 
    52       </tr> 
     46        <td id="albumThumbnail"> 
     47<img src="{$TN_SRC}" alt="{'Thumbnail'|@translate}" class="Thumbnail"> 
     48        </td> 
    5349 
    54       <tr> 
    55         <td><strong>{'Post date'|@translate}</strong></td> 
    56         <td>{$REGISTRATION_DATE}</td> 
    57       </tr> 
     50        <td id="albumLinks"> 
     51<p style="text-align:left">{$INTRO}</p> 
    5852 
    59       <tr> 
    60         <td><strong>{'Dimensions'|@translate}</strong></td> 
    61         <td>{$DIMENSIONS}</td> 
    62       </tr> 
     53<ul style="padding-left:15px;"> 
     54{if isset($U_JUMPTO) } 
     55  <li><a href="{$U_JUMPTO}">{'jump to photo'|@translate} →</a></li> 
     56{/if} 
    6357 
    64       <tr> 
    65         <td><strong>{'Filesize'|@translate}</strong></td> 
    66         <td>{$FILESIZE}</td> 
    67       </tr> 
     58{if !url_is_remote($PATH)} 
     59  <li><a href="{$U_SYNC}">{'Synchronize metadata'|@translate}</a></li> 
    6860 
    69       <tr> 
    70         <td><strong>{'Storage album'|@translate}</strong></td> 
    71         <td>{$STORAGE_CATEGORY}</td> 
    72       </tr> 
     61  <li><a href="{$U_DELETE}" onclick="return confirm('{'Are you sure?'|@translate|@escape:javascript}');">{'delete photo'|@translate}</a></li> 
     62  {/if} 
    7363 
    74       {if isset($related_categories) } 
    75       <tr> 
    76         <td><strong>{'Linked albums'|@translate}</strong></td> 
    77         <td> 
    78           <ul> 
    79             {foreach from=$related_categories item=name} 
    80             <li>{$name}</li> 
    81             {/foreach} 
    82           </ul> 
     64</ul> 
    8365        </td> 
    8466      </tr> 
    85       {/if} 
    86 {if isset($U_COI)} 
    87       <tr> 
    88         <td></td> 
    89         <td><a href="{$U_COI}">{'Not cropped correctly?'|@translate}</a></td> 
    90       </tr> 
    91 {/if} 
    9267    </table> 
    9368 
     
    9772    <legend>{'Properties'|@translate}</legend> 
    9873 
    99     <table> 
     74    <p> 
     75      <strong>{'Title'|@translate}</strong> 
     76      <br> 
     77      <input type="text" class="large" name="name" value="{$NAME}"> 
     78    </p> 
    10079 
    101       <tr> 
    102         <td><strong>{'Name'|@translate}</strong></td> 
    103         <td><input type="text" class="large" name="name" value="{$NAME}"></td> 
    104       </tr> 
     80    <p> 
     81      <strong>{'Author'|@translate}</strong> 
     82      <br> 
     83      <input type="text" class="large" name="author" value="{$AUTHOR}"> 
     84    </p> 
    10585 
    106       <tr> 
    107         <td><strong>{'Author'|@translate}</strong></td> 
    108         <td><input type="text" class="large" name="author" value="{$AUTHOR}"></td> 
    109       </tr> 
     86    <p> 
     87      <strong>{'Creation date'|@translate}</strong> 
     88      <br> 
     89      <select id="date_creation_day" name="date_creation_day"> 
     90        <option value="0">--</option> 
     91{section name=day start=1 loop=32} 
     92        <option value="{$smarty.section.day.index}" {if $smarty.section.day.index==$DATE_CREATION_DAY_VALUE}selected="selected"{/if}>{$smarty.section.day.index}</option> 
     93{/section} 
     94      </select> 
    11095 
    111       <tr> 
    112         <td><strong>{'Creation date'|@translate}</strong></td> 
    113         <td> 
    114           <label><input type="radio" name="date_creation_action" value="unset"> {'unset'|@translate}</label> 
    115           <input type="radio" name="date_creation_action" value="set" id="date_creation_action_set"> {'set to'|@translate} 
    116           <select id="date_creation_day" name="date_creation_day"> 
    117             <option value="0">--</option> 
    118             {section name=day start=1 loop=32} 
    119               <option value="{$smarty.section.day.index}" {if $smarty.section.day.index==$DATE_CREATION_DAY_VALUE}selected="selected"{/if}>{$smarty.section.day.index}</option> 
    120             {/section} 
    121           </select> 
    122           <select id="date_creation_month" name="date_creation_month"> 
    123             {html_options options=$month_list selected=$DATE_CREATION_MONTH_VALUE} 
    124           </select> 
    125           <input id="date_creation_year" 
    126                  name="date_creation_year" 
    127                  type="text" 
    128                  size="4" 
    129                  maxlength="4" 
    130                  value="{$DATE_CREATION_YEAR_VALUE}"> 
    131           <input id="date_creation_linked_date" name="date_creation_linked_date" type="hidden" size="10" disabled="disabled"> 
    132         </td> 
    133       </tr> 
     96      <select id="date_creation_month" name="date_creation_month"> 
     97        {html_options options=$month_list selected=$DATE_CREATION_MONTH_VALUE} 
     98      </select> 
    13499 
    135       <tr> 
    136         <td><strong>{'Tags'|@translate}</strong></td> 
    137         <td> 
     100      <input id="date_creation_year" name="date_creation_year" type="text" size="4" maxlength="4" value="{$DATE_CREATION_YEAR_VALUE}"> 
     101      <input id="date_creation_linked_date" name="date_creation_linked_date" type="hidden" size="10" disabled="disabled"> 
     102    <a href="#" id="unset_date_creation" style="display:none">unset</a> 
     103    </p> 
     104 
     105    <p> 
     106      <strong>{'Linked albums'|@translate}</strong> 
     107      <br> 
     108      <select data-placeholder="Select albums..." class="chzn-select" multiple style="width:700px;" name="associate[]"> 
     109        {html_options options=$associate_options selected=$associate_options_selected} 
     110      </select> 
     111    </p> 
     112 
     113    <p> 
     114      <strong>{'Representation of albums'|@translate}</strong> 
     115      <br> 
     116      <select data-placeholder="Select albums..." class="chzn-select" multiple style="width:700px;" name="represent[]"> 
     117        {html_options options=$represent_options selected=$represent_options_selected} 
     118      </select> 
     119    </p> 
     120 
     121    <p> 
     122      <strong>{'Tags'|@translate}</strong> 
     123      <br> 
    138124<select id="tags" name="tags"> 
    139125{foreach from=$tag_selection item=tag} 
     
    141127{/foreach} 
    142128</select> 
    143         </td> 
    144       </tr> 
     129    </p> 
    145130 
     131    <p> 
     132      <strong>{'Description'|@translate}</strong> 
     133      <br> 
     134      <textarea name="description" id="description" class="description">{$DESCRIPTION}</textarea> 
     135    </p> 
    146136 
    147       <tr> 
    148         <td><strong>{'Description'|@translate}</strong></td> 
    149         <td><textarea name="description" id="description" class="description">{$DESCRIPTION}</textarea></td> 
    150       </tr> 
    151  
    152   <tr> 
    153     <td><strong>{'Who can see this photo?'|@translate}</strong></td> 
    154     <td> 
     137    <p> 
     138      <strong>{'Who can see this photo?'|@translate}</strong> 
     139      <br> 
    155140      <select name="level" size="1"> 
    156141        {html_options options=$level_options selected=$level_options_selected} 
    157142      </select> 
    158     </td> 
    159   </tr> 
     143   </p> 
    160144 
    161     </table> 
    162  
    163     <p style="text-align:center;"> 
    164       <input class="submit" type="submit" value="{'Submit'|@translate}" name="submit"> 
    165       <input class="submit" type="reset" value="{'Reset'|@translate}" name="reset"> 
    166     </p> 
    167  
    168   </fieldset> 
     145  <p style="margin:40px 0 0 0"> 
     146    <input class="submit" type="submit" value="{'Save Settings'|@translate}" name="submit"> 
     147  </p> 
     148</fieldset> 
    169149 
    170150</form> 
    171  
    172 <form id="associations" method="post" action="{$F_ACTION}#associations"> 
    173   <fieldset> 
    174     <legend>{'Linked albums'|@translate}</legend> 
    175  
    176     <table class="doubleSelect"> 
    177       <tr> 
    178         <td> 
    179           <h3>{'Associated'|@translate}</h3> 
    180           <select class="categoryList" name="cat_associated[]" multiple="multiple" size="30"> 
    181             {html_options options=$associated_options} 
    182           </select> 
    183           <p><input class="submit" type="submit" value="&raquo;" name="dissociate" style="font-size:15px;"></p> 
    184         </td> 
    185  
    186         <td> 
    187           <h3>{'Dissociated'|@translate}</h3> 
    188           <select class="categoryList" name="cat_dissociated[]" multiple="multiple" size="30"> 
    189             {html_options options=$dissociated_options} 
    190           </select> 
    191           <p><input class="submit" type="submit" value="&laquo;" name="associate" style="font-size:15px;"></p> 
    192         </td> 
    193       </tr> 
    194     </table> 
    195  
    196   </fieldset> 
    197 </form> 
    198  
    199 <form id="representation" method="post" action="{$F_ACTION}#representation"> 
    200   <fieldset> 
    201     <legend>{'Representation of albums'|@translate}</legend> 
    202  
    203     <table class="doubleSelect"> 
    204       <tr> 
    205         <td> 
    206           <h3>{'Represents'|@translate}</h3> 
    207           <select class="categoryList" name="cat_elected[]" multiple="multiple" size="30"> 
    208             {html_options options=$elected_options} 
    209           </select> 
    210           <p><input class="submit" type="submit" value="&raquo;" name="dismiss" style="font-size:15px;"></p> 
    211         </td> 
    212  
    213         <td> 
    214           <h3>{'Does not represent'|@translate}</h3> 
    215           <select class="categoryList" name="cat_dismissed[]" multiple="multiple" size="30"> 
    216             {html_options options=$dismissed_options} 
    217           </select> 
    218           <p><input class="submit" type="submit" value="&laquo;" name="elect" style="font-size:15px;"></p> 
    219         </td> 
    220       </tr> 
    221     </table> 
    222  
    223   </fieldset> 
    224 </form> 
Note: See TracChangeset for help on using the changeset viewer.