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 git-svn-id: http://piwigo.org/svn/trunk@13077 68402e56-0260-453c-a942-63ccdbb3a9ee
2025-04-27 19:59:56 +03:00 · 2012-02-10 10:52:07 +00:00 · 2012-02-10 10:52:07 +00:00 · bea45c89b6
commit bea45c89b6
parent 62bfdd3f97
17 changed files with 741 additions and 300 deletions
--- a/admin.php
+++ b/admin.php
@ -132,6 +132,18 @@ if (isset($_GET['page']) and preg_match('/^album-(\d+)(?:-(.*))?$/', $_GET['page
  }
 }

+// ?page=photo-1234-properties is an clean alias of
+// ?page=photo&image_id=1234&tab=properties
+if (isset($_GET['page']) and preg_match('/^photo-(\d+)(?:-(.*))?$/', $_GET['page'], $matches))
+{
+  $_GET['page'] = 'photo';
+  $_GET['image_id'] = $matches[1];
+  if (isset($matches[2]))
+  {
+    $_GET['tab'] = $matches[2];
+  }
+}
+
 if (isset($_GET['page'])
    and preg_match('/^[a-z_]*$/', $_GET['page'])
    and is_file(PHPWG_ROOT_PATH.'admin/'.$_GET['page'].'.php'))
@ -236,6 +248,7 @@ if (
        'album',        // delete cat; public/private; lock/unlock, permissions
        'cat_move',     // ?only POST
        'cat_options',  // ?only POST; public/private; lock/unlock
+        'photo',
        'picture_modify', // ?only POST; associate/dissociate
        'user_perm',
        'group_perm',
--- a/admin/batch_manager_global.php
+++ b/admin/batch_manager_global.php
@ -179,20 +179,7 @@ DELETE

  if ('move' == $action)
  {
-    // let's first break links with all albums but their "storage album"
-    $query = '
-DELETE '.IMAGE_CATEGORY_TABLE.'.*
-  FROM '.IMAGE_CATEGORY_TABLE.'
-    JOIN '.IMAGES_TABLE.' ON image_id=id
-  WHERE id IN ('.implode(',', $collection).')
-    AND (storage_category_id IS NULL OR storage_category_id != category_id)
-;';
-    pwg_query($query);
-    
-    associate_images_to_categories(
-      $collection,
-      array($_POST['move'])
-      );
+    move_images_to_categories($collection, array($_POST['move']));

    $_SESSION['page_infos'] = array(
      l10n('Information data registered in database')
@ -786,9 +773,7 @@ SELECT id,path,representative_ext,file,filesize,level,name
        'TITLE' => $title,
        'LEVEL' => $row['level'],
        'FILE_SRC' => $row['path'],
-        'U_EDIT' =>
-            PHPWG_ROOT_PATH.'admin.php?page=picture_modify'.
-            '&amp;image_id='.$row['id'],
+        'U_EDIT' => get_root_url().'admin.php?page=photo-'.$row['id'],
        )
      );
  }
--- a/admin/batch_manager_unit.php
+++ b/admin/batch_manager_unit.php
@ -265,11 +265,8 @@ SELECT
        'ID' => $row['id'],
        'TN_SRC' => $src,
        'FILE_SRC' => $row['path'],
-        'LEGEND' => !empty($row['name']) ?
-            $row['name'] : get_name_from_file($row['file']),
-        'U_EDIT' =>
-            PHPWG_ROOT_PATH.'admin.php?page=picture_modify'.
-            '&amp;image_id='.$row['id'],
+        'LEGEND' => render_element_name($row),
+        'U_EDIT' => get_root_url().'admin.php?page=photo-'.$row['id'],
        'NAME' => !empty($row['name'])?$row['name']:'',
        'AUTHOR' => !empty($row['author'])?htmlspecialchars($row['author']):'',
        'LEVEL' => !empty($row['level'])?$row['level']:'0',
--- a/admin/cat_modify.php
+++ b/admin/cat_modify.php
@ -343,8 +343,7 @@ SELECT id,representative_ext,path
 ;';
    $row = pwg_db_fetch_assoc(pwg_query($query));
    $src = DerivativeImage::thumb_url($row);
-    $url = get_root_url().'admin.php?page=picture_modify';
-    $url.= '&amp;image_id='.$category['representative_picture_id'];
+    $url = get_root_url().'admin.php?page=photo-'.$category['representative_picture_id'];

    $tpl_representant['picture'] =
      array(
--- a/admin/comments.php
+++ b/admin/comments.php
@ -129,9 +129,7 @@ while ($row = pwg_db_fetch_assoc($result))
  $template->append(
    'comments',
    array(
-      'U_PICTURE' =>
-          PHPWG_ROOT_PATH.'admin.php?page=picture_modify'.
-          '&amp;image_id='.$row['image_id'],
+      'U_PICTURE' => get_root_url().'admin.php?page=photo-'.$row['image_id'],
      'ID' => $row['id'],
      'TN_SRC' => $thumb,
      'AUTHOR' => trigger_event('render_comment_author', $author_name),
--- a/admin/include/functions.php
+++ b/admin/include/functions.php
@ -1530,6 +1530,37 @@ DELETE
  update_category($categories);
 }

+/**
+ * Disssociate images from all categories except their storage category and
+ * associate to new categories.
+ *
+ * @param array images
+ * @param array categories
+ * @return void
+ */
+function move_images_to_categories($images, $categories)
+{
+  if (count($images) == 0)
+  {
+    return false;
+  }
+  
+  // let's first break links with all albums but their "storage album"
+  $query = '
+DELETE '.IMAGE_CATEGORY_TABLE.'.*
+  FROM '.IMAGE_CATEGORY_TABLE.'
+    JOIN '.IMAGES_TABLE.' ON image_id=id
+  WHERE id IN ('.implode(',', $images).')
+    AND (storage_category_id IS NULL OR storage_category_id != category_id)
+;';
+  pwg_query($query);
+    
+  if (is_array($categories) and count($categories) > 0)
+  {
+    associate_images_to_categories($images, $categories);
+  }
+}
+
 /**
 * Associate images associated to a list of source categories to a list of
 * destination categories.
@ -1987,6 +2018,7 @@ function get_active_menu($menu_page)

  switch ($menu_page)
  {
+    case 'photo':
    case 'photos_add':
    case 'rating':
    case 'tags':
--- a/admin/include/photos_add_direct_process.inc.php
+++ b/admin/include/photos_add_direct_process.inc.php
@ -215,10 +215,7 @@ SELECT
    // function get_image_name($name, $file) would be better
    $thumbnail['title'] = get_name_from_file($image_infos['file']);

-    $thumbnail['link'] = PHPWG_ROOT_PATH.'admin.php?page=picture_modify'
-      .'&amp;image_id='.$image_id
-      .'&amp;cat_id='.$category_id
-      ;
+    $thumbnail['link'] = get_root_url().'admin.php?page=photo-'.$image_id.'&amp;cat_id='.$category_id;

    array_push($page['thumbnails'], $thumbnail);
  }
--- a/admin/photo.php
+++ b/admin/photo.php
@ -0,0 +1,86 @@
+<?php
+// +-----------------------------------------------------------------------+
+// | Piwigo - a PHP based photo gallery                                    |
+// +-----------------------------------------------------------------------+
+// | Copyright(C) 2008-2012 Piwigo Team                  http://piwigo.org |
+// | Copyright(C) 2003-2008 PhpWebGallery Team    http://phpwebgallery.net |
+// | Copyright(C) 2002-2003 Pierrick LE GALL   http://le-gall.net/pierrick |
+// +-----------------------------------------------------------------------+
+// | This program is free software; you can redistribute it and/or modify  |
+// | it under the terms of the GNU General Public License as published by  |
+// | the Free Software Foundation                                          |
+// |                                                                       |
+// | This program is distributed in the hope that it will be useful, but   |
+// | WITHOUT ANY WARRANTY; without even the implied warranty of            |
+// | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU      |
+// | General Public License for more details.                              |
+// |                                                                       |
+// | You should have received a copy of the GNU General Public License     |
+// | along with this program; if not, write to the Free Software           |
+// | Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, |
+// | USA.                                                                  |
+// +-----------------------------------------------------------------------+
+
+if( !defined("PHPWG_ROOT_PATH") )
+{
+  die ("Hacking attempt!");
+}
+
+// +-----------------------------------------------------------------------+
+// | Basic checks                                                          |
+// +-----------------------------------------------------------------------+
+
+check_status(ACCESS_ADMINISTRATOR);
+
+check_input_parameter('cat_id', $_GET, false, PATTERN_ID);
+check_input_parameter('image_id', $_GET, false, PATTERN_ID);
+
+$admin_photo_base_url = get_root_url().'admin.php?page=photo-'.$_GET['image_id'];
+
+if (isset($_GET['cat_id']))
+{
+  $query = '
+SELECT *
+  FROM '.CATEGORIES_TABLE.'
+  WHERE id = '.$_GET['cat_id'].'
+;';
+  $category = pwg_db_fetch_assoc(pwg_query($query));
+}
+
+// +-----------------------------------------------------------------------+
+// | Tabs                                                                  |
+// +-----------------------------------------------------------------------+
+
+include_once(PHPWG_ROOT_PATH.'admin/include/tabsheet.class.php');
+
+$page['tab'] = 'properties';
+
+if (isset($_GET['tab']))
+{
+  $page['tab'] = $_GET['tab'];
+}
+
+$tabsheet = new tabsheet();
+$tabsheet->add('properties', l10n('Properties'), $admin_photo_base_url.'-properties');
+$tabsheet->add('coi', l10n('Center of interest'), $admin_photo_base_url.'-coi');
+
+$tabsheet->select($page['tab']);
+$tabsheet->assign();
+
+// +-----------------------------------------------------------------------+
+// | Load the tab                                                          |
+// +-----------------------------------------------------------------------+
+
+if ('properties' == $page['tab'])
+{
+  include(PHPWG_ROOT_PATH.'admin/picture_modify.php');
+}
+elseif ('coi' == $page['tab'])
+{
+  include(PHPWG_ROOT_PATH.'admin/picture_coi.php');
+}
+else
+{
+  include(PHPWG_ROOT_PATH.'admin/photo_'.$page['tab'].'.php');
+}
+?>
--- a/admin/picture_coi.php
+++ b/admin/picture_coi.php
@ -78,9 +78,9 @@ else
 }

 $tpl_var = array(
+  'TITLE' => render_element_name($row),
  'ALT' => $row['file'],
  'U_IMG' => DerivativeImage::url(IMG_LARGE, $row),
-  'U_EDIT' => get_root_url().'admin.php?page=picture_modify&amp;image_id='.$_GET['image_id'],
  );

 if (!empty($row['coi']))
--- a/admin/picture_modify.php
+++ b/admin/picture_modify.php
@ -36,6 +36,14 @@ check_status(ACCESS_ADMINISTRATOR);
 check_input_parameter('image_id', $_GET, false, PATTERN_ID);
 check_input_parameter('cat_id', $_GET, false, PATTERN_ID);

+// represent
+$query = '
+SELECT id
+  FROM '.CATEGORIES_TABLE.'
+  WHERE representative_picture_id = '.$_GET['image_id'].'
+;';
+$represent_options_selected = array_from_query($query, 'id');
+
 // +-----------------------------------------------------------------------+
 // |                             delete photo                              |
 // +-----------------------------------------------------------------------+
@ -132,18 +140,16 @@ if (isset($_POST['submit']) and count($page['errors']) == 0)
    $data{'comment'} = strip_tags(@$_POST['description']);
  }

-  if (isset($_POST['date_creation_action']))
+  if (!empty($_POST['date_creation_year']))
  {
-    if ('set' == $_POST['date_creation_action'])
-    {
-      $data{'date_creation'} = $_POST['date_creation_year']
-                                 .'-'.$_POST['date_creation_month']
-                                 .'-'.$_POST['date_creation_day'];
-    }
-    else if ('unset' == $_POST['date_creation_action'])
-    {
-      $data{'date_creation'} = '';
-    }
+    $data{'date_creation'} =
+      $_POST['date_creation_year']
+      .'-'.$_POST['date_creation_month']
+      .'-'.$_POST['date_creation_day'];
+  }
+  else
+  {
+    $data{'date_creation'} = null;
  }

  mass_updates(
@ -163,58 +169,35 @@ if (isset($_POST['submit']) and count($page['errors']) == 0)
  }
  set_tags($tag_ids, $_GET['image_id']);

-  array_push($page['infos'], l10n('Photo informations updated'));
-}
-// associate the element to other categories than its storage category
-if (isset($_POST['associate'])
-    and isset($_POST['cat_dissociated'])
-    and count($_POST['cat_dissociated']) > 0
-  )
-{
-  associate_images_to_categories(
-    array($_GET['image_id']),
-    $_POST['cat_dissociated']
-    );
-}
-// dissociate the element from categories (but not from its storage category)
-if (isset($_POST['dissociate'])
-    and isset($_POST['cat_associated'])
-    and count($_POST['cat_associated']) > 0
-  )
-{
-  $query = '
-DELETE FROM '.IMAGE_CATEGORY_TABLE.'
-  WHERE image_id = '.$_GET['image_id'].'
-    AND category_id IN ('.implode(',', $_POST['cat_associated']).')
-';
-  pwg_query($query);
+  // association to albums
+  move_images_to_categories(array($_GET['image_id']), $_POST['associate']);

-  update_category($_POST['cat_associated']);
-}
-// elect the element to represent the given categories
-if (isset($_POST['elect'])
-    and isset($_POST['cat_dismissed'])
-    and count($_POST['cat_dismissed']) > 0
-  )
-{
-  $datas = array();
-  foreach ($_POST['cat_dismissed'] as $category_id)
+  // thumbnail for albums
+  if (!isset($_POST['represent']))
  {
-    array_push($datas,
-               array('id' => $category_id,
-                     'representative_picture_id' => $_GET['image_id']));
+    $_POST['represent'] = array();
  }
-  $fields = array('primary' => array('id'),
-                  'update' => array('representative_picture_id'));
-  mass_updates(CATEGORIES_TABLE, $fields, $datas);
-}
-// dismiss the element as representant of the given categories
-if (isset($_POST['dismiss'])
-    and isset($_POST['cat_elected'])
-    and count($_POST['cat_elected']) > 0
-  )
-{
-  set_random_representant($_POST['cat_elected']);
+  
+  $no_longer_thumbnail_for = array_diff($represent_options_selected, $_POST['represent']);
+  if (count($no_longer_thumbnail_for) > 0)
+  {
+    set_random_representant($no_longer_thumbnail_for);
+  }
+
+  $new_thumbnail_for = array_diff($_POST['represent'], $represent_options_selected);
+  if (count($new_thumbnail_for) > 0)
+  {
+    $query = '
+UPDATE '.CATEGORIES_TABLE.'
+  SET representative_picture_id = '.$_GET['image_id'].'
+  WHERE id IN ('.implode(',', $new_thumbnail_for).')
+;';
+    pwg_query($query);
+  }
+
+  $represent_options_selected = $_POST['represent'];
+  
+  array_push($page['infos'], l10n('Photo informations updated'));
 }

 // tags
@ -262,8 +245,7 @@ $template->set_filenames(
    )
  );

-$admin_url_start = get_root_url().'admin.php?page=picture_modify';
-$admin_url_start.= '&amp;image_id='.$_GET['image_id'];
+$admin_url_start = $admin_photo_base_url.'-properties';
 $admin_url_start.= isset($_GET['cat_id']) ? '&amp;cat_id='.$_GET['cat_id'] : '';

 $template->assign(
@ -281,6 +263,8 @@ $template->assign(
      isset($_POST['name']) ?
        stripslashes($_POST['name']) : @$row['name'],

+    'TITLE' => render_element_name($row),
+
    'DIMENSIONS' => @$row['width'].' * '.@$row['height'],

    'FILESIZE' => @$row['filesize'].' KB',
@ -303,6 +287,67 @@ $template->assign(
    )
  );

+$added_by = 'N/A';
+$query = '
+SELECT '.$conf['user_fields']['username'].' AS username
+  FROM '.USERS_TABLE.'
+  WHERE '.$conf['user_fields']['id'].' = '.$row['added_by'].'
+;';
+$result = pwg_query($query);
+while ($user_row = pwg_db_fetch_assoc($result))
+{
+  $added_by = $user_row['username'];
+}
+
+$intro = sprintf(
+  l10n('This photo was posted on %s by %s.'),
+  format_date($row['date_available']),
+  $added_by
+  );
+
+$intro.= ' ';
+
+$intro.= sprintf(
+  l10n('Original file is %s, %ux%u pixels, %.2fMB.'),
+  $row['file'],
+  $row['width'],
+  $row['height'],
+  $row['filesize']/1024
+  );
+
+$intro.= ' ';
+
+$intro.= sprintf(
+  l10n('%u visits'),
+  $row['hit']
+  );
+
+if ($conf['rate'] and !empty($row['rating_score']))
+{
+  $query = '
+SELECT
+    COUNT(*)
+  FROM '.RATE_TABLE.'
+  WHERE element_id = '.$_GET['image_id'].'
+;';
+  list($nb_rates) = pwg_db_fetch_row(pwg_query($query));
+  
+  $intro.= sprintf(
+    l10n(', %u rates, rating score %s'),
+    $nb_rates,
+    $row['rating_score']
+    );
+}
+
+$intro.= '. ';
+
+$intro.= sprintf(
+  l10n('Numeric identifier is %u.'),
+  $row['id']
+  );
+
+$template->assign('INTRO', $intro);
+
 if (in_array(get_extension($row['path']),$conf['picture_ext']))
 {
  $template->assign('U_COI', get_root_url().'admin.php?page=picture_coi&amp;image_id='.$_GET['image_id']);
@ -432,53 +477,21 @@ if (isset($url_img))
  $template->assign( 'U_JUMPTO', $url_img );
 }

-// associate to another category ?
+// associate to albums
 $query = '
-SELECT id,name,uppercats,global_rank
+SELECT id
  FROM '.CATEGORIES_TABLE.'
    INNER JOIN '.IMAGE_CATEGORY_TABLE.' ON id = category_id
-  WHERE image_id = '.$_GET['image_id'];
-if (isset($storage_category_id))
-{
-  $query.= '
-    AND id != '.$storage_category_id;
-}
-$query.= '
+  WHERE image_id = '.$_GET['image_id'].'
 ;';
-display_select_cat_wrapper($query, array(), 'associated_options');
-
-$result = pwg_query($query);
-$associateds = array(-1);
-if (isset($storage_category_id))
-{
-  array_push($associateds, $storage_category_id);
-}
-while ($row = pwg_db_fetch_assoc($result))
-{
-  array_push($associateds, $row['id']);
-}
-$query = '
-SELECT id,name,uppercats,global_rank
-  FROM '.CATEGORIES_TABLE.'
-  WHERE id NOT IN ('.implode(',', $associateds).')
-;';
-display_select_cat_wrapper($query, array(), 'dissociated_options');
-
-// representing
-$query = '
-SELECT id,name,uppercats,global_rank
-  FROM '.CATEGORIES_TABLE.'
-  WHERE representative_picture_id = '.$_GET['image_id'].'
-;';
-display_select_cat_wrapper($query, array(), 'elected_options');
+$associate_options_selected = array_from_query($query, 'id');

 $query = '
 SELECT id,name,uppercats,global_rank
  FROM '.CATEGORIES_TABLE.'
-  WHERE representative_picture_id != '.$_GET['image_id'].'
-    OR representative_picture_id IS NULL
 ;';
-display_select_cat_wrapper($query, array(), 'dismissed_options');
+display_select_cat_wrapper($query, $associate_options_selected, 'associate_options');
+display_select_cat_wrapper($query, $represent_options_selected, 'represent_options');

 //----------------------------------------------------------- sending html code

--- a/admin/rating.php
+++ b/admin/rating.php
@ -203,8 +203,7 @@ foreach ($images as $image)
 {
  $thumbnail_src = DerivativeImage::thumb_url($image);

-  $image_url = PHPWG_ROOT_PATH.'admin.php?page=picture_modify'.
-            '&amp;image_id='.$image['id'];
+  $image_url = get_root_url().'admin.php?page=photo-'.$image['id'];

  $query = 'SELECT *
 FROM '.RATE_TABLE.' AS r
--- a/admin/themes/default/template/picture_coi.tpl
+++ b/admin/themes/default/template/picture_coi.tpl
@ -3,10 +3,7 @@
 {/html_head}
 {combine_script id='jquery.jcrop' load='footer' require='jquery' path='themes/default/js/plugins/jquery.Jcrop.min.js'}

-<h2>{'Center of interest'|@translate}</h2>
-<div>
-<a href="{$U_EDIT}">{'Edit photo information'|@translate}</a>
-</div>
+<h2>{$TITLE} &#8250; {'Edit photo'|@translate} {$TABSHEET_TITLE}</h2>

 <form method="post">

--- a/admin/themes/default/template/picture_modify.tpl
+++ b/admin/themes/default/template/picture_modify.tpl
@ -2,6 +2,15 @@
 {include file='include/dbselect.inc.tpl'}
 {include file='include/datepicker.inc.tpl'}

+{combine_script id='jquery.chosen' load='footer' path='themes/default/js/plugins/chosen.jquery.min.js'}
+{combine_css path="themes/default/js/plugins/chosen.css"}
+
+{footer_script}{literal}
+jQuery(document).ready(function() {
+  jQuery(".chzn-select").chosen();
+});
+{/literal}{/footer_script}
+
 {combine_script id='jquery.tokeninput' load='async' require='jquery' path='themes/default/js/plugins/jquery.tokeninput.js'}
 {footer_script require='jquery.tokeninput'}
 jQuery(document).ready(function() {ldelim}
@ -24,22 +33,9 @@ jQuery(document).ready(function() {ldelim}
 pwg_initialization_datepicker("#date_creation_day", "#date_creation_month", "#date_creation_year", "#date_creation_linked_date", "#date_creation_action_set");
 {/footer_script}

-<h2>{'Edit photo information'|@translate}</h2>
+<h2>{$TITLE} &#8250; {'Edit photo'|@translate} {$TABSHEET_TITLE}</h2>

-<img src="{$TN_SRC}" alt="{'Thumbnail'|@translate}" class="Thumbnail">
-
-<ul class="categoryActions">
-  {if isset($U_JUMPTO) }
-  <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>
-  {/if}
-  {if !url_is_remote($PATH)}
-  <li><a href="{$U_SYNC}" title="{'Synchronize'|@translate}"><img src="{$themeconf.admin_icon_dir}/sync_metadata.png" alt="{'Synchronize'|@translate}"></a></li>
-
-  <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>
-  {/if}
-</ul>
-
-<form action="{$F_ACTION}" method="post" id="properties">
+<form action="{$F_ACTION}" method="post" id="catModify">

  <fieldset>
    <legend>{'Informations'|@translate}</legend>
@ -47,48 +43,27 @@ pwg_initialization_datepicker("#date_creation_day", "#date_creation_month", "#da
    <table>

      <tr>
-        <td><strong>{'Path'|@translate}</strong></td>
-        <td>{$PATH}</td>
-      </tr>
+        <td id="albumThumbnail">
+<img src="{$TN_SRC}" alt="{'Thumbnail'|@translate}" class="Thumbnail">
+        </td>

-      <tr>
-        <td><strong>{'Post date'|@translate}</strong></td>
-        <td>{$REGISTRATION_DATE}</td>
-      </tr>
+        <td id="albumLinks">
+<p style="text-align:left">{$INTRO}</p>

-      <tr>
-        <td><strong>{'Dimensions'|@translate}</strong></td>
-        <td>{$DIMENSIONS}</td>
-      </tr>
+<ul style="padding-left:15px;">
+{if isset($U_JUMPTO) }
+  <li><a href="{$U_JUMPTO}">{'jump to photo'|@translate} →</a></li>
+{/if}

-      <tr>
-        <td><strong>{'Filesize'|@translate}</strong></td>
-        <td>{$FILESIZE}</td>
-      </tr>
+{if !url_is_remote($PATH)}
+  <li><a href="{$U_SYNC}">{'Synchronize metadata'|@translate}</a></li>

-      <tr>
-        <td><strong>{'Storage album'|@translate}</strong></td>
-        <td>{$STORAGE_CATEGORY}</td>
-      </tr>
+  <li><a href="{$U_DELETE}" onclick="return confirm('{'Are you sure?'|@translate|@escape:javascript}');">{'delete photo'|@translate}</a></li>
+  {/if}

-      {if isset($related_categories) }
-      <tr>
-        <td><strong>{'Linked albums'|@translate}</strong></td>
-        <td>
-          <ul>
-            {foreach from=$related_categories item=name}
-            <li>{$name}</li>
-            {/foreach}
-          </ul>
+</ul>
        </td>
      </tr>
-      {/if}
-{if isset($U_COI)}
-      <tr>
-        <td></td>
-        <td><a href="{$U_COI}">{'Not cropped correctly?'|@translate}</a></td>
-      </tr>
-{/if}
    </table>

  </fieldset>
@ -96,129 +71,80 @@ pwg_initialization_datepicker("#date_creation_day", "#date_creation_month", "#da
  <fieldset>
    <legend>{'Properties'|@translate}</legend>

-    <table>
+    <p>
+      <strong>{'Title'|@translate}</strong>
+      <br>
+      <input type="text" class="large" name="name" value="{$NAME}">
+    </p>

-      <tr>
-        <td><strong>{'Name'|@translate}</strong></td>
-        <td><input type="text" class="large" name="name" value="{$NAME}"></td>
-      </tr>
+    <p>
+      <strong>{'Author'|@translate}</strong>
+      <br>
+      <input type="text" class="large" name="author" value="{$AUTHOR}">
+    </p>

-      <tr>
-        <td><strong>{'Author'|@translate}</strong></td>
-        <td><input type="text" class="large" name="author" value="{$AUTHOR}"></td>
-      </tr>
+    <p>
+      <strong>{'Creation date'|@translate}</strong>
+      <br>
+      <select id="date_creation_day" name="date_creation_day">
+        <option value="0">--</option>
+{section name=day start=1 loop=32}
+        <option value="{$smarty.section.day.index}" {if $smarty.section.day.index==$DATE_CREATION_DAY_VALUE}selected="selected"{/if}>{$smarty.section.day.index}</option>
+{/section}
+      </select>

-      <tr>
-        <td><strong>{'Creation date'|@translate}</strong></td>
-        <td>
-          <label><input type="radio" name="date_creation_action" value="unset"> {'unset'|@translate}</label>
-          <input type="radio" name="date_creation_action" value="set" id="date_creation_action_set"> {'set to'|@translate}
-          <select id="date_creation_day" name="date_creation_day">
-            <option value="0">--</option>
-            {section name=day start=1 loop=32}
-              <option value="{$smarty.section.day.index}" {if $smarty.section.day.index==$DATE_CREATION_DAY_VALUE}selected="selected"{/if}>{$smarty.section.day.index}</option>
-            {/section}
-          </select>
-          <select id="date_creation_month" name="date_creation_month">
-            {html_options options=$month_list selected=$DATE_CREATION_MONTH_VALUE}
-          </select>
-          <input id="date_creation_year"
-                 name="date_creation_year"
-                 type="text"
-                 size="4"
-                 maxlength="4"
-                 value="{$DATE_CREATION_YEAR_VALUE}">
-          <input id="date_creation_linked_date" name="date_creation_linked_date" type="hidden" size="10" disabled="disabled">
-        </td>
-      </tr>
+      <select id="date_creation_month" name="date_creation_month">
+        {html_options options=$month_list selected=$DATE_CREATION_MONTH_VALUE}
+      </select>

-      <tr>
-        <td><strong>{'Tags'|@translate}</strong></td>
-        <td>
+      <input id="date_creation_year" name="date_creation_year" type="text" size="4" maxlength="4" value="{$DATE_CREATION_YEAR_VALUE}">
+      <input id="date_creation_linked_date" name="date_creation_linked_date" type="hidden" size="10" disabled="disabled">
+    <a href="#" id="unset_date_creation" style="display:none">unset</a>
+    </p>
+
+    <p>
+      <strong>{'Linked albums'|@translate}</strong>
+      <br>
+      <select data-placeholder="Select albums..." class="chzn-select" multiple style="width:700px;" name="associate[]">
+        {html_options options=$associate_options selected=$associate_options_selected}
+      </select>
+    </p>
+
+    <p>
+      <strong>{'Representation of albums'|@translate}</strong>
+      <br>
+      <select data-placeholder="Select albums..." class="chzn-select" multiple style="width:700px;" name="represent[]">
+        {html_options options=$represent_options selected=$represent_options_selected}
+      </select>
+    </p>
+
+    <p>
+      <strong>{'Tags'|@translate}</strong>
+      <br>
 <select id="tags" name="tags">
 {foreach from=$tag_selection item=tag}
  <option value="{$tag.id}" class="selected">{$tag.name}</option>
 {/foreach}
 </select>
-        </td>
-      </tr>
+    </p>

+    <p>
+      <strong>{'Description'|@translate}</strong>
+      <br>
+      <textarea name="description" id="description" class="description">{$DESCRIPTION}</textarea>
+    </p>

-      <tr>
-        <td><strong>{'Description'|@translate}</strong></td>
-        <td><textarea name="description" id="description" class="description">{$DESCRIPTION}</textarea></td>
-      </tr>
-
-  <tr>
-    <td><strong>{'Who can see this photo?'|@translate}</strong></td>
-    <td>
+    <p>
+      <strong>{'Who can see this photo?'|@translate}</strong>
+      <br>
      <select name="level" size="1">
        {html_options options=$level_options selected=$level_options_selected}
      </select>
-    </td>
-  </tr>
+   </p>

-    </table>
-
-    <p style="text-align:center;">
-      <input class="submit" type="submit" value="{'Submit'|@translate}" name="submit">
-      <input class="submit" type="reset" value="{'Reset'|@translate}" name="reset">
-    </p>
-
-  </fieldset>
+  <p style="margin:40px 0 0 0">
+    <input class="submit" type="submit" value="{'Save Settings'|@translate}" name="submit">
+  </p>
+</fieldset>

 </form>
-
-<form id="associations" method="post" action="{$F_ACTION}#associations">
-  <fieldset>
-    <legend>{'Linked albums'|@translate}</legend>
-
-    <table class="doubleSelect">
-      <tr>
-        <td>
-          <h3>{'Associated'|@translate}</h3>
-          <select class="categoryList" name="cat_associated[]" multiple="multiple" size="30">
-            {html_options options=$associated_options}
-          </select>
-          <p><input class="submit" type="submit" value="&raquo;" name="dissociate" style="font-size:15px;"></p>
-        </td>
-
-        <td>
-          <h3>{'Dissociated'|@translate}</h3>
-          <select class="categoryList" name="cat_dissociated[]" multiple="multiple" size="30">
-            {html_options options=$dissociated_options}
-          </select>
-          <p><input class="submit" type="submit" value="&laquo;" name="associate" style="font-size:15px;"></p>
-        </td>
-      </tr>
-    </table>
-
-  </fieldset>
-</form>
-
-<form id="representation" method="post" action="{$F_ACTION}#representation">
-  <fieldset>
-    <legend>{'Representation of albums'|@translate}</legend>
-
-    <table class="doubleSelect">
-      <tr>
-        <td>
-          <h3>{'Represents'|@translate}</h3>
-          <select class="categoryList" name="cat_elected[]" multiple="multiple" size="30">
-            {html_options options=$elected_options}
-          </select>
-          <p><input class="submit" type="submit" value="&raquo;" name="dismiss" style="font-size:15px;"></p>
-        </td>
-
-        <td>
-          <h3>{'Does not represent'|@translate}</h3>
-          <select class="categoryList" name="cat_dismissed[]" multiple="multiple" size="30">
-            {html_options options=$dismissed_options}
-          </select>
-          <p><input class="submit" type="submit" value="&laquo;" name="elect" style="font-size:15px;"></p>
-        </td>
-      </tr>
-    </table>
-
-  </fieldset>
-</form>
--- a/picture.php
+++ b/picture.php
@ -751,9 +751,9 @@ if (is_admin())
  }

  $url_admin =
-    get_root_url().'admin.php?page=picture_modify'
-    .'&amp;cat_id='.(isset($page['category']) ? $page['category']['id'] : '')
-    .'&amp;image_id='.$page['image_id'];
+    get_root_url().'admin.php?page=photo-'.$page['image_id']
+    .(isset($page['category']) ? '&amp;cat_id='.$page['category']['id'] : '')
+    ;

  $template->assign(
    array(
--- a/themes/default/js/plugins/chosen-sprite.png
+++ b/themes/default/js/plugins/chosen-sprite.png
--- a/themes/default/js/plugins/chosen.css
+++ b/themes/default/js/plugins/chosen.css
@ -0,0 +1,389 @@
+/* @group Base */
+.chzn-container {
+  font-size: 13px;
+  position: relative;
+  display: inline-block;
+  zoom: 1;
+  *display: inline;
+}
+.chzn-container .chzn-drop {
+  background: #fff;
+  border: 1px solid #aaa;
+  border-top: 0;
+  position: absolute;
+  top: 29px;
+  left: 0;
+  -webkit-box-shadow: 0 4px 5px rgba(0,0,0,.15);
+  -moz-box-shadow   : 0 4px 5px rgba(0,0,0,.15);
+  -o-box-shadow     : 0 4px 5px rgba(0,0,0,.15);
+  box-shadow        : 0 4px 5px rgba(0,0,0,.15);
+  z-index: 999;
+}
+/* @end */
+
+/* @group Single Chosen */
+.chzn-container-single .chzn-single {
+  background-color: #ffffff;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0 );   
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #ffffff), color-stop(50%, #f6f6f6), color-stop(52%, #eeeeee), color-stop(100%, #f4f4f4));
+  background-image: -webkit-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: -moz-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: -o-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: -ms-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); 
+  -webkit-border-radius: 5px;
+  -moz-border-radius   : 5px;
+  border-radius        : 5px;
+  -moz-background-clip   : padding;
+  -webkit-background-clip: padding-box;
+  background-clip        : padding-box;
+  border: 1px solid #aaaaaa;
+  -webkit-box-shadow: 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
+  -moz-box-shadow   : 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
+  box-shadow        : 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
+  display: block;
+  overflow: hidden;
+  white-space: nowrap;
+  position: relative;
+  height: 23px;
+  line-height: 24px;
+  padding: 0 0 0 8px;
+  color: #444444;
+  text-decoration: none;
+}
+.chzn-container-single .chzn-single span {
+  margin-right: 26px;
+  display: block;
+  overflow: hidden;
+  white-space: nowrap;
+  -o-text-overflow: ellipsis;
+  -ms-text-overflow: ellipsis;
+  text-overflow: ellipsis;
+}
+.chzn-container-single .chzn-single abbr {
+  display: block;
+  position: absolute;
+  right: 26px;
+  top: 6px;
+  width: 12px;
+  height: 13px;
+  font-size: 1px;
+  background: url(chosen-sprite.png) right top no-repeat;
+}
+.chzn-container-single .chzn-single abbr:hover {
+  background-position: right -11px;
+}
+.chzn-container-single .chzn-single div {
+  position: absolute;
+  right: 0;
+  top: 0;
+  display: block;
+  height: 100%;
+  width: 18px;
+}
+.chzn-container-single .chzn-single div b {
+  background: url('chosen-sprite.png') no-repeat 0 0;
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+.chzn-container-single .chzn-search {
+  padding: 3px 4px;
+  position: relative;
+  margin: 0;
+  white-space: nowrap;
+  z-index: 1010;
+}
+.chzn-container-single .chzn-search input {
+  background: #fff url('chosen-sprite.png') no-repeat 100% -22px;
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  margin: 1px 0;
+  padding: 4px 20px 4px 5px;
+  outline: 0;
+  border: 1px solid #aaa;
+  font-family: sans-serif;
+  font-size: 1em;
+}
+.chzn-container-single .chzn-drop {
+  -webkit-border-radius: 0 0 4px 4px;
+  -moz-border-radius   : 0 0 4px 4px;
+  border-radius        : 0 0 4px 4px;
+  -moz-background-clip   : padding;
+  -webkit-background-clip: padding-box;
+  background-clip        : padding-box;
+}
+/* @end */
+
+.chzn-container-single-nosearch .chzn-search input {
+  position: absolute;
+  left: -9000px;
+}
+
+/* @group Multi Chosen */
+.chzn-container-multi .chzn-choices {
+  background-color: #fff;
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
+  background-image: -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  border: 1px solid #aaa;
+  margin: 0;
+  padding: 0;
+  cursor: text;
+  overflow: hidden;
+  height: auto !important;
+  height: 1%;
+  position: relative;
+}
+.chzn-container-multi .chzn-choices li {
+  float: left;
+  list-style: none;
+}
+.chzn-container-multi .chzn-choices .search-field {
+  white-space: nowrap;
+  margin: 0;
+  padding: 0;
+}
+.chzn-container-multi .chzn-choices .search-field input {
+  color: #666;
+  background: transparent !important;
+  border: 0 !important;
+  font-family: sans-serif;
+  font-size: 100%;
+  height: 15px;
+  padding: 5px;
+  margin: 1px 0;
+  outline: 0;
+  -webkit-box-shadow: none;
+  -moz-box-shadow   : none;
+  -o-box-shadow     : none;
+  box-shadow        : none;
+}
+.chzn-container-multi .chzn-choices .search-field .default {
+  color: #999;
+}
+.chzn-container-multi .chzn-choices .search-choice {
+  -webkit-border-radius: 3px;
+  -moz-border-radius   : 3px;
+  border-radius        : 3px;
+  -moz-background-clip   : padding;
+  -webkit-background-clip: padding-box;
+  background-clip        : padding-box;
+  background-color: #e4e4e4;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#eeeeee', GradientType=0 ); 
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
+  background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: -ms-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); 
+  -webkit-box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+  -moz-box-shadow   : 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+  box-shadow        : 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+  color: #333;
+  border: 1px solid #aaaaaa;
+  line-height: 13px;
+  padding: 3px 20px 3px 5px;
+  margin: 3px 0 3px 5px;
+  position: relative;
+  cursor: default;
+}
+.chzn-container-multi .chzn-choices .search-choice-focus {
+  background: #d4d4d4;
+}
+.chzn-container-multi .chzn-choices .search-choice .search-choice-close {
+  display: block;
+  position: absolute;
+  right: 3px;
+  top: 4px;
+  width: 12px;
+  height: 13px;
+  font-size: 1px;
+  background: url(chosen-sprite.png) right top no-repeat;
+}
+.chzn-container-multi .chzn-choices .search-choice .search-choice-close:hover {
+  background-position: right -11px;
+}
+.chzn-container-multi .chzn-choices .search-choice-focus .search-choice-close {
+  background-position: right -11px;
+}
+/* @end */
+
+/* @group Results */
+.chzn-container .chzn-results {
+  margin: 0 4px 4px 0;
+  max-height: 240px;
+  padding: 0 0 0 4px;
+  position: relative;
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+.chzn-container-multi .chzn-results {
+  margin: -1px 0 0;
+  padding: 0;
+}
+.chzn-container .chzn-results li {
+  display: none;
+  line-height: 15px;
+  padding: 5px 6px;
+  margin: 0;
+  list-style: none;
+}
+.chzn-container .chzn-results .active-result {
+  cursor: pointer;
+  display: list-item;
+}
+.chzn-container .chzn-results .highlighted {
+  background-color: #3875d7;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3875d7', endColorstr='#2a62bc', GradientType=0 );  
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc));
+  background-image: -webkit-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: -moz-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: -o-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: -ms-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  color: #fff;
+}
+.chzn-container .chzn-results li em {
+  background: #feffde;
+  font-style: normal;
+}
+.chzn-container .chzn-results .highlighted em {
+  background: transparent;
+}
+.chzn-container .chzn-results .no-results {
+  background: #f4f4f4;
+  display: list-item;
+}
+.chzn-container .chzn-results .group-result {
+  cursor: default;
+  color: #999;
+  font-weight: bold;
+}
+.chzn-container .chzn-results .group-option {
+  padding-left: 15px;
+}
+.chzn-container-multi .chzn-drop .result-selected {
+  display: none;
+}
+.chzn-container .chzn-results-scroll {
+  background: white;
+  margin: 0 4px;
+  position: absolute;
+  text-align: center;
+  width: 321px; /* This should by dynamic with js */
+  z-index: 1;
+}
+.chzn-container .chzn-results-scroll span {
+  display: inline-block;
+  height: 17px;
+  text-indent: -5000px;
+  width: 9px;
+}
+.chzn-container .chzn-results-scroll-down {
+  bottom: 0;
+}
+.chzn-container .chzn-results-scroll-down span {
+  background: url('chosen-sprite.png') no-repeat -4px -3px;
+}
+.chzn-container .chzn-results-scroll-up span {
+  background: url('chosen-sprite.png') no-repeat -22px -3px;
+}
+/* @end */
+
+/* @group Active  */
+.chzn-container-active .chzn-single {
+  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
+  -moz-box-shadow   : 0 0 5px rgba(0,0,0,.3);
+  -o-box-shadow     : 0 0 5px rgba(0,0,0,.3);
+  box-shadow        : 0 0 5px rgba(0,0,0,.3);
+  border: 1px solid #5897fb;
+}
+.chzn-container-active .chzn-single-with-drop {
+  border: 1px solid #aaa;
+  -webkit-box-shadow: 0 1px 0 #fff inset;
+  -moz-box-shadow   : 0 1px 0 #fff inset;
+  -o-box-shadow     : 0 1px 0 #fff inset;
+  box-shadow        : 0 1px 0 #fff inset;
+  background-color: #eee;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0 );
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff));
+  background-image: -webkit-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: -moz-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: -o-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: -ms-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  -webkit-border-bottom-left-radius : 0;
+  -webkit-border-bottom-right-radius: 0;
+  -moz-border-radius-bottomleft : 0;
+  -moz-border-radius-bottomright: 0;
+  border-bottom-left-radius : 0;
+  border-bottom-right-radius: 0;
+}
+.chzn-container-active .chzn-single-with-drop div {
+  background: transparent;
+  border-left: none;
+}
+.chzn-container-active .chzn-single-with-drop div b {
+  background-position: -18px 1px;
+}
+.chzn-container-active .chzn-choices {
+  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
+  -moz-box-shadow   : 0 0 5px rgba(0,0,0,.3);
+  -o-box-shadow     : 0 0 5px rgba(0,0,0,.3);
+  box-shadow        : 0 0 5px rgba(0,0,0,.3);
+  border: 1px solid #5897fb;
+}
+.chzn-container-active .chzn-choices .search-field input {
+  color: #111 !important;
+}
+/* @end */
+
+/* @group Disabled Support */
+.chzn-disabled {
+  cursor: default;
+  opacity:0.5 !important;
+}
+.chzn-disabled .chzn-single {
+  cursor: default;
+}
+.chzn-disabled .chzn-choices .search-choice .search-choice-close {
+  cursor: default;
+}
+
+/* @group Right to Left */
+.chzn-rtl { text-align: right; }
+.chzn-rtl .chzn-single { padding: 0 8px 0 0; overflow: visible; }
+.chzn-rtl .chzn-single span { margin-left: 26px; margin-right: 0; direction: rtl; }
+
+.chzn-rtl .chzn-single div { left: 3px; right: auto; }
+.chzn-rtl .chzn-single abbr {
+  left: 26px;
+  right: auto;
+}
+.chzn-rtl .chzn-choices .search-field input { direction: rtl; }
+.chzn-rtl .chzn-choices li { float: right; }
+.chzn-rtl .chzn-choices .search-choice { padding: 3px 5px 3px 19px; margin: 3px 5px 3px 0; }
+.chzn-rtl .chzn-choices .search-choice .search-choice-close { left: 4px; right: auto; background-position: right top;}
+.chzn-rtl.chzn-container-single .chzn-results { margin: 0 0 4px 4px; padding: 0 4px 0 0; }
+.chzn-rtl .chzn-results .group-option { padding-left: 0; padding-right: 15px; }
+.chzn-rtl.chzn-container-active .chzn-single-with-drop div { border-right: none; }
+.chzn-rtl .chzn-search input {
+  background: #fff url('chosen-sprite.png') no-repeat -38px -22px;
+  background: url('chosen-sprite.png') no-repeat -38px -22px, -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
+  background: url('chosen-sprite.png') no-repeat -38px -22px, -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%);  
+  background: url('chosen-sprite.png') no-repeat -38px -22px, -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat -38px -22px, -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat -38px -22px, -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat -38px -22px, linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  padding: 4px 5px 4px 20px;
+  direction: rtl;
+}
+/* @end */
--- a/themes/default/js/plugins/chosen.jquery.min.js
+++ b/themes/default/js/plugins/chosen.jquery.min.js