I was in need of styling thumbnail div after option translation (had new images in my library and wanted to style the resulting thumbnail with a "new" overlay tag). Ended up enhancing library code:
Above goes at the very beginning of:
ImagePickerOption.prototype.create_node = function() {
Then, including thumbclasses when building the div:
thumbnail = jQuery("<div class='thumbnail" + thumbclasses + "'>");
Complete enhanced function:
With this, I can now define options like this:
<optgroup label="Beer"> <option data-img-src='../images/promos/beer/beer-128.png' value='beer/beer'>Generic</option> <option class='new' data-img-src='../images/promos/beer/beer_miller-128.png' value='beer/beer_miller'>Miller Lite</option> </optgroup>
And the library will render div thumbs with option class, so a div can be styled:
<div class="thumbnail"><img class="image_picker_image" src="../images/promos/beer/beer-128.png"><p>Generic</p></div> <div class="thumbnail new selected"><img class="image_picker_image" src="../images/promos/beer/beer_miller-128.png"><p>Miller Lite</p></div>
Figured I'd share since it maybe useful to others. Feel free to merge.
I was in need of styling thumbnail div after option translation (had new images in my library and wanted to style the resulting thumbnail with a "new" overlay tag). Ended up enhancing library code:
Above goes at the very beginning of:
ImagePickerOption.prototype.create_node = function() {
Then, includingthumbclasses
when building the div:thumbnail = jQuery("<div class='thumbnail" + thumbclasses + "'>");
Complete enhanced function:})
With this, I can now define options like this:
<optgroup label="Beer">
And the library will render div thumbs with option class, so a div can be styled:<option data-img-src='../images/promos/beer/beer-128.png' value='beer/beer'>Generic</option>
<option class='new' data-img-src='../images/promos/beer/beer_miller-128.png' value='beer/beer_miller'>Miller Lite</option>
</optgroup>
<div class="thumbnail"><img class="image_picker_image" src="../images/promos/beer/beer-128.png"><p>Generic</p></div>
Figured I'd share since it maybe useful to others. Feel free to merge.<div class="thumbnail new selected"><img class="image_picker_image" src="../images/promos/beer/beer_miller-128.png"><p>Miller Lite</p></div>