Preview selected avatar in user account settings

There has been quite a few requests lately for the ability to allow users to
preview their selected avatar when updating their user account settings.

The dynamicdata imagelist property type has been updated to enable this but
you will still need to customize the relevant template.

Copy:    dynamicdata/xartemplates/admin-showinput-imagelist.xd

    to your theme dir  remembering to rename the extenstion to .xt

            themes/<yourtheme>/modules/roles/admin-showinput-imagelist.xt

Update the template as follows:
Thanks to rogerk  for the javascript code as detailed in his patch in bug
#1180.

<!--- License: GPL http://www.gnu.org/copyleft/gpl.html --->
<img id="#$id#image" src="#$basedir#/#$value#" /><br/>

 <!--- added javascript to update the image preview --->
 <select name="#$name#" id="#$id#" #$tabindex#
       onChange='document.getElementById("#$id#image").src = "/#$basedir#/"
+
           document.getElementById("#$id#").options[document.
           getElementById("#$id#").selectedIndex].value'>

    <xar:foreach in="$options" value="$option" >
        <xar:if condition="empty($option['id']) or $option['id'] ne
$option['name']">
            <xar:if condition="$option['id'] eq $value" >
                <option value="#$option['id']#"
selected="selected">#$option['name']#</option>
            <xar:else />
                <option value="#$option['id']#">#$option['name']#</option>
            </xar:if>
        <xar:elseif condition="$option['id'] eq $value" />
            <option selected="selected">#$option['name']#</option>
        <xar:else />
            <option>#$option['name']#</option>
        </xar:if>
    </xar:foreach>
</select>

<xar:if condition="!empty($invalid)">
    <span class="xar-error">#$invalid#</span>
</xar:if>
---------------------------------

Note these changes will affect imagelist input wherever you have used that
in templtes on a site
- not just in roles user account for avatar selection.