Changeset 4895


Ignore:
Timestamp:
Feb 15, 2010, 11:23:02 PM (11 years ago)
Author:
plg
Message:

feature 1438: switch between uploadify and HTML form

feature 1435 related: change the order to display the "who can see these
photos?" options. It's just a test, we're discussing about usability on this
field.

graphical design: distinguish the 3 main fields (category/privacy/files), no
use of the table anymore to have a smaller width. One goal was to see the
"Upload" button when the form opens for the first time in a 1024x768 browser.

Location:
extensions/upload_form
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • extensions/upload_form/include/upload.js

    r4739 r4895  
    99  if (upload_slots <= upload_limit) {
    1010    new_slot = document.createElement("p");
    11     new_slot.innerHTML = "<input  class='file' type='file' name='image_upload[]' size='70' />";
     11    new_slot.innerHTML = "<input  class='file' type='file' name='image_upload[]' size='60' />";
    1212    document.getElementById("uploadBoxes").appendChild(new_slot);
    1313  }
  • extensions/upload_form/language/en_UK/plugin.lang.php

    r4887 r4895  
    4040$lang['Everybody'] = 'Everybody';
    4141$lang['Who can see these photos?'] = 'Who can see these photos?';
     42$lang['... or switch to the old style form'] = '... or switch to the old style form';
     43$lang['... or switch to the multiple files form'] = '... or switch to the multiple files form';
  • extensions/upload_form/language/fr_FR/plugin.lang.php

    r4887 r4895  
    4040$lang['Everybody'] = 'Tout le monde';
    4141$lang['Who can see these photos?'] = 'Qui peut voir ces photos ?';
     42$lang['... or switch to the old style form'] = '... ou passer sur le formulaire "à l\'ancienne"';
     43$lang['... or switch to the multiple files form'] = '... ou passer sur le formulaire multi-fichier';
  • extensions/upload_form/upload.php

    r4887 r4895  
    344344  );
    345345
     346$upload_modes = array('html', 'multiple');
     347
     348$upload_mode = 'multiple';
     349$upload_switch = 'html';
     350if (isset($_GET['upload_mode']) and in_array($_GET['upload_mode'], $upload_modes))
     351{
     352  $index_of_upload_mode = array_flip($upload_modes);
     353  $upload_mode_index = $index_of_upload_mode[ $_GET['upload_mode'] ];
     354
     355  $upload_mode = $_GET['upload_mode'];
     356  $upload_switch = $upload_modes[ ($upload_mode_index + 1) % 2 ];
     357}
     358
    346359$template->assign(
    347360    array(
    348       'upload_mode' => 'multiple',
     361      'upload_mode' => $upload_mode,
     362      'switch_url' => $admin_base_url.'&upload_mode='.$upload_switch,
    349363      'upload_id' => md5(rand()),
    350364      'session_id' => session_id(),
     
    394408// image level options
    395409$tpl_options = array();
    396 foreach ($conf['available_permission_levels'] as $level)
     410foreach (array_reverse($conf['available_permission_levels']) as $level)
    397411{
    398412  $label = null;
     
    423437    }
    424438   
    425     $label = implode(', ', array_reverse($labels));
     439    $label = implode(', ', $labels);
    426440  }
    427441  $tpl_options[$level] = $label;
  • extensions/upload_form/upload.tpl

    r4887 r4895  
    99    $("#category_type_"+$(this).attr("value")).show();
    1010  });
    11 
    1211});
    1312</script>
     
    2524var session_id = '{$session_id}';
    2625var pwg_token = '{$pwg_token}';
    27 var buttonText = '{"Select files"|@translate}';
     26var buttonText = 'Browse';
    2827
    2928{literal}
     
    6867  text-align:center;
    6968}
     69
     70.category_selection {
     71  min-height:65px;
     72  margin-top:5px;
     73}
     74
     75.category_selection TABLE {
     76  margin:0;
     77}
     78
     79.formField {
     80  width:650px;
     81  margin:0 auto 20px auto;
     82  padding:10px;
     83  border: 2px solid #292929;
     84}
     85
     86.formFieldTitle {
     87  font-weight:bold;
     88  margin-bottom:10px;
     89}
     90
     91.formField P {
     92  margin:0;
     93}
    7094</style>
    7195{/literal}
    7296
    73 <div class="titrePage">
     97<div class="titrePage" style="height:0">
    7498  <h2>{'Upload Form'|@translate}</h2>
    7599</div>
     
    107131    <legend>{'Upload Photos'|@translate}</legend>
    108132
    109     <table>
    110       <tr>
    111         <th>{'Drop into category'|@translate}</th>
    112         <td>
    113           <label><input type="radio" name="category_type" value="existing" checked="checked"> {'existing category'|@translate}</label>
    114           <label><input type="radio" name="category_type" value="new"> {'create a new category'|@translate}</label>
    115 
    116           <div id="category_type_existing">
    117             <select class="categoryDropDown" name="category">
    118               {html_options options=$category_options}
    119             </select>
    120           </div>
    121 
    122           <div id="category_type_new" style="display:none">
    123             <table>
    124               <tr>
    125                 <td>{'Parent category'|@translate}</td>
    126                 <td>
    127                   <select class="categoryDropDown" name="category_parent">
    128                     <option value="0">------------</option>
    129                     {html_options options=$category_options}
    130                   </select>
    131                 </td>
    132               </tr>
    133               <tr>
    134                 <td>{'Category name'|@translate}</td>
    135                 <td>
    136                   <input type="text" name="category_name" value="{$F_CATEGORY_NAME}"
    137                 </td>
    138               </tr>
    139             </table>
    140           </div>
    141 
    142         </td>
    143       </tr>
    144 
    145       <tr>
    146         <th>{'Who can see these photos?'|@translate}</th>
    147         <td>
    148           <select name="level" size="1">
    149             {html_options options=$level_options selected=$level_options_selected}
    150           </select>
    151         </td>
    152       </tr>
     133    <div class="formField">
     134      <div class="formFieldTitle">{'Drop into category'|@translate}</div>
     135     
     136      <label><input type="radio" name="category_type" value="existing"> {'existing category'|@translate}</label>
     137      <label><input type="radio" name="category_type" value="new" checked="checked"> {'create a new category'|@translate}</label>
     138
     139      <div id="category_type_existing" style="display:none" class="category_selection">
     140        <select class="categoryDropDown" name="category">
     141          {html_options options=$category_options}
     142        </select>
     143      </div>
     144
     145      <div id="category_type_new" class="category_selection">
     146        <table>
     147          <tr>
     148            <td>{'Parent category'|@translate}</td>
     149            <td>
     150              <select class="categoryDropDown" name="category_parent">
     151                <option value="0">------------</option>
     152                {html_options options=$category_options}
     153              </select>
     154            </td>
     155          </tr>
     156          <tr>
     157            <td>{'Category name'|@translate}</td>
     158            <td>
     159              <input type="text" name="category_name" value="{$F_CATEGORY_NAME}"
     160            </td>
     161          </tr>
     162        </table>
     163      </div>
     164    </div>
     165
     166    <div class="formField">
     167      <div class="formFieldTitle">{'Who can see these photos?'|@translate}</div>
     168
     169      <select name="level" size="1">
     170        {html_options options=$level_options selected=$level_options_selected}
     171      </select>
     172    </div>
     173
     174    <div class="formField">
     175      <div class="formFieldTitle">{'Select files'|@translate}</div>
    153176
    154177{if $upload_mode eq 'html'}
    155       <tr>
    156         <td colspan="2">
    157           <strong>{'Select files'|@translate}</strong>
    158           <p>{'JPEG files or ZIP archives with JPEG files inside please.'|@translate}</p>
    159           <div id="uploadBoxes">
    160             <p><input class="file" type="file" size="70" name="image_upload[]" /></p>
    161           </div>
    162           <div id="addUploadBox">
    163             <a href="javascript: UpdateUploadSlots()">{'+ Add an upload box'|@translate}</a>
    164           </div>
    165         </td>
    166       </tr>
    167      
    168     </table>
     178    <p><a href="{$switch_url}">{'... or switch to the multiple files form'|@translate}</a></p>
     179
     180      <p>{'JPEG files or ZIP archives with JPEG files inside please.'|@translate}</p>
     181
     182      <div id="uploadBoxes">
     183        <p><input class="file" type="file" size="60" name="image_upload[]" /></p>
     184      </div>
     185      <div id="addUploadBox">
     186        <a href="javascript: UpdateUploadSlots()">{'+ Add an upload box'|@translate}</a>
     187      </div>
    169188   
     189    </div> <!-- formField -->
     190
    170191    <p>
    171192      <input class="submit" type="submit" name="submit_upload" value="{'Upload'|@translate}" {$TAG_INPUT_ENABLED}/>
     
    178199    </p>
    179200
     201    <p><a href="{$switch_url}">{'... or switch to the old style form'|@translate}</a></p>
     202
    180203    <div id="fileQueue"></div>
    181204
     205    </div> <!-- formField -->
    182206    <p>
    183207      <input class="submit" type="button" value="{'Upload'|@translate}" onclick="javascript:jQuery('#uploadify').uploadifyUpload()"/>
  • extensions/upload_form/uploadify/uploadify.css

    r4875 r4895  
    2525#fileQueue {
    2626        width: 420px;
    27         height: 300px;
     27        max-height: 300px;
    2828        overflow: auto;
    2929        border: 1px solid #333;
Note: See TracChangeset for help on using the changeset viewer.