title: Magento - how to retrieve bundled option images
body: <p>I've been working on my first magento deploy. Got a pretty customized theme built up... tackling some of the non-standard customizations now: </p>
  
  <p>One of my primary product types is an office chair which I have set up as a bundled product. There are many options available for this product type (about 100 fabric options, arm style, lumbar, headrest etc) and I need to be able to show an image for each of these on the catalog/product/view page. </p>
  
  <p>Being a bundled product (and I'll refrain from any discussion about whether this was the right product type - we went around in circles debating between a configurable and a bundled) - each product is assembled from a number of simple products (as options). These simple products can have images uploaded to them, and I've done so. <strong>I now want to retrieve the urls to those from the media folder...</strong></p>
  
  <p>After some hunting - these seem to be the essential elements:</p>
  
  <p><strong>theme/../template/catalog/product/view/options.phtml</strong></p>
  
  <pre><code>&lt;?php $_options = Mage::helper('core')-&gt;decorateArray($this-&gt;getOptions()) ?&gt;
  &lt;dl&gt;
      &lt;?php foreach($_options as $_option): ?&gt;
          &lt;?php echo $this-&gt;getOptionHtml($_option) ?&gt;
      &lt;?php endforeach; ?&gt;
  &lt;/dl&gt;
  </code></pre>
  
  <p><strong>theme/../template/bundle/catalog/product/view/type/bundle/option/select.phtml</strong></p>
  
  <pre><code>&lt;?php /* @var $this Mage_Bundle_Block_Catalog_Product_View_Type_Bundle_Option_Select */ ?&gt;
  &lt;?php $_option      = $this-&gt;getOption(); ?&gt;
  &lt;?php $_selections  = $_option-&gt;getSelections(); ?&gt;
  </code></pre>
  
  <p>I found finally found <strong><code>getSelections()</code></strong> in:</p>
  
  <pre><code>class Mage_Bundle_Model_Resource_Price_Index extends Mage_Core_Model_Resource_Db_Abstract
  { ...
  
  
      /**
          * Retrieve bundle options with selections and prices by product
         *
          * @param int $productId
          * @return array
          */
         public function getSelections($productId)
         {
             $options = array();
             $read = $this-&gt;_getReadAdapter();
             $select = $read-&gt;select()
                 -&gt;from(
                     array('option_table' =&gt; $this-&gt;getTable('bundle/option')),
                     array('option_id', 'required', 'type')
                 )
                 -&gt;join(
                     array('selection_table' =&gt; $this-&gt;getTable('bundle/selection')),
                     'selection_table.option_id=option_table.option_id',
                     array('selection_id', 'product_id', 'selection_price_type',
                         'selection_price_value', 'selection_qty', 'selection_can_change_qty')
                 )
                 -&gt;join(
                     array('e' =&gt; $this-&gt;getTable('catalog/product')),
                     'e.entity_id=selection_table.product_id AND e.required_options=0',
                     array()
                 )
                 -&gt;where('option_table.parent_id=:product_id');
  
             $query = $read-&gt;query($select, array('product_id' =&gt; $productId));
             while ($row = $query-&gt;fetch()) {
                 if (!isset($options[$row['option_id']])) {
                     $options[$row['option_id']] = array(
                         'option_id'     =&gt; $row['option_id'],
                         'required'      =&gt; $row['required'],
                         'type'          =&gt; $row['type'],
                         'selections'    =&gt; array()
                     );
                 }
                 $options[$row['option_id']]['selections'][$row['selection_id']] = array(
                     'selection_id'      =&gt; $row['selection_id'],
                     'product_id'        =&gt; $row['product_id'],
                     'price_type'        =&gt; $row['selection_price_type'],
                     'price_value'       =&gt; $row['selection_price_value'],
                     'qty'               =&gt; $row['selection_qty'],
                     'can_change_qty'    =&gt; $row['selection_can_change_qty']
                 );
             }
  
             return $options;
         }
  </code></pre>
  
  <p>so we get back an array with <code>selection_id</code>, <code>product_id</code>, <code>price_type</code> etc... but nothing referring to the image url for that selection... </p>
  
  <p>Given that:</p>
  
  <pre><code>class Mage_Catalog_Helper_Product extends Mage_Core_Helper_Url
  { ...
  public function getImageUrl($product)
          {
              $url = false;
              if (!$product-&gt;getImage()) {
                  $url = Mage::getDesign()-&gt;getSkinUrl('images/no_image.jpg');
              }
              elseif ($attribute = $product-&gt;getResource()-&gt;getAttribute('image')) {
                 $url = $attribute-&gt;getFrontend()-&gt;getUrl($product);
             }
             return $url;
         }
  </code></pre>
  
  <p>I'm trying to build a js object with refs to each selection's image url kind of like so in <strong>theme/../template/bundle/catalog/product/view/type/bundle/option/select.phtml</strong></p>
  
  <pre><code>var option_set_&lt;?php echo $_option-&gt;getId() ?&gt; = {};
  &lt;?php foreach ($_selections as $_selection): ?&gt;
      option_set_&lt;?php echo $_option-&gt;getId() ?&gt;._&lt;?php echo $_selection-&gt;getSelectionId() ?&gt; = '&lt;?php echo $_selection-&gt;getImageUrl(); ?&gt;';
  &lt;?php endforeach; ?&gt;
  </code></pre>
  
  <p>But <code>$_selection</code> obviously isn't typed correctly  because it just bounces me to the placeholder graphic. </p>
  
  <p>Assuming these options can be typed as a Product (or somehow obtain the simple product from the <strong>selection_id</strong>, it seems like something like that can work. I'm not sure if that's exactly how I want to manage this feature, but if I can just get a stack of urls - then I'll be in business</p>
  
  <p>Weirdly, the interwebs is basically silent on this subject. Apparently nobody needs to show images for their product options (or, rather, the only solutions are paid extensions - which will be a last resort). </p>
  
  <p>How I can go about figuring this out?</p>
  
  <p>Jesus tapdancing christ. Could Mage be any more complicated?</p>
  
  <hr>
  
  <p><strong>Update</strong></p>
  
  <p>Got this to work as such:</p>
  
  <pre><code>&lt;?php echo $this-&gt;helper('catalog/image')-&gt;init($_selection, 'small_image')-&gt;resize(40,40); ?&gt;
  </code></pre>
  
  <p>The answer I selected will also work fine, if anybody needs this fix. </p>