<html>
<body jwcid="@Body" style="ognl:'background-color: ' + color + ';'">
   <span jwcid="@menu:JSCookMenu" source="ognl:menuModel" 
         value="ognl:menuItem" theme="Panel" contentRenderer="ognl:itemRenderer"
         >
         
         <!--   the component that renders the goodness (good/better/bestitems -->
         <a href="#" jwcid="goodnessLinkRenderer@DirectLink"
            listener="listener:onDirectLink" parameters="ognl:menuItem.value[0]" >
            <span jwcid="@Any" 
               style="ognl:'font-weight: ' + (goodness == menuItem.value[0] ? 'bold' : 'normal' ) + ';' ">
              <span jwcid="@Insert" value="ognl:menuItem.value[0]"/>
            </span>
         </a>
         
         <!--   the component that renders the non linked item (choose background color)-->
         <span jwcid="noLinkRenderer@Insert" value="ognl:menuItem.value[0]"/>
         
         <!--  the component that renders the color items -->
         <table jwcid="colorLinkRenderer@Any" width="100%" border="0">
           <tr>
              <!--  the colored square marking the selected color -->
              <td width="15" jwcid="@Any" 
                 style="ognl:'background-color: ' + (menuItem.value[0] == color ? color : 'transparent') + ';'">&nbsp;
              </td>
              <!-- the colored text in a link -->
              <td>
               <a href="#" jwcid="@DirectLink" style="ognl:'color: ' + menuItem.value[0] + ';'"
                  listener="listener:onColorChoose" parameters="ognl:menuItem.value[0]" >
                    <span jwcid="@Insert" value="ognl:menuItem.value[0]"/>
               </a>
              </td></tr>
         </table>
   </span>
</body>
</html>