[%# views/components/fancyselect.tt

Display a fancy select dropdown with custom styling and (optional) images

Authors:
    Afuna <coder.dw@afunamatata.com>

Copyright (c) 2015 by Dreamwidth Studios, LLC.

This program is free software; you may redistribute it and/or modify it under
the same terms as Perl itself.  For a copy of the license, please reference
'perldoc perlartistic' or 'perldoc perlgpl'.
%]

[%- dw.need_res( { group => "foundation" }
    "js/components/jquery.fancy-select.js"
    "stc/css/components/fancy-select.css"
) -%]

[%- SET id = id || "fancy-select-$name" -%]
<div class="fancy-select">
<label for="[%- id -%]">[%- label -%]</label>
<select id="[%- id -%]" name="[% name %]">
    [%- FOR option IN items -%]
    <option value="[%- option.value | html -%]"
        [%- IF option.value == formdata.$name -%]
            selected="selected"
        [%- END -%]
        [%- IF option.image -%]
            data-fancyselect-img="[%- option.image.src | html -%]:[% option.image.width | html %]:[% option.image.height | html %]"
        [%- END -%]
        data-fancyselect-format="[%- ( option.format || option.label ) | html -%]"
    >[%- option.label | html -%]</option>
    [%- END -%]
</select>
</div>