jen
5/17/2017 - 5:19 PM

Stars Widget.js

<mvt:if expr="l.settings:product:gd_ratings:total GT 0">
    <div class="gd-rating-stars-cont gd-rating-stars-style-&mvt:gd_ratings:stars_style;" data-gd-stars-style="&mvt:gd_ratings:stars_style;">
        <div class="gd-rating-stars-rating-cont">
            <div class="gd-rating-stars-disp">
                <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>

                <div class="gd-rating-stars" style="width: &mvt:product:gd_ratings:perc;">
                    <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                    <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                    <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                    <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                    <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                </div>
            </div>
            <span class="gd-rating-total-reviews">&mvt:product:gd_ratings:total;</span>
        </div>
        <mvt:if expr="l.settings:gd_ratings:stars_style EQ 'enhanced'">
            <span class="gd-rating-review-link-cont gd-stars-enhanced">
                | <a href="&mvt:gd_ratings:protocol_relative_url;Screen=GD_WREVIEW&Product_Code=&mvte:product:code;" class="gd-rating-review-link" rel="nofollow">Write a Review</a>
            </span>
        </mvt:if>
    </div>
    <div class="gd-enhanced-section" id="gd-enhanced-section">
        <div class="gd-review-snapshot">
            <div class="gd-snapshot-title">
                Ratings Snapshot
            </div>
            <div class="gd-row gd-snapshot-breakdown">
                <div class="gd-review-overall">
                    <div class="gd-review-overall-rating">&mvt:product:gd_ratings:rating;</div>
                    <div class="gd-review-overall-info">out of 5</div>
                </div>
                <div class="gd-review-stars-breakdown">
                    <mvt:foreach iterator="breakdown" array="product:gd_ratings:breakdown">
                        <div class="gd-review-star-breakdown">
                            &mvt:breakdown:overall; <i class="fa fa-&mvt:gd_ratings:config:fa_star;"></i>
                            <span class="gd-review-breakdown-indicator">
                                <span class="gd-review-breakdown-value" style="width: &mvt:breakdown:perc;;"></span>
                            </span>
                            (&mvt:breakdown:count;)
                        </div>
                    </mvt:foreach>
                </div>
            </div>
            <mvt:if expr="l.settings:product:gd_ratings:additional_breakdown">
                <div class="gd-review-additional-breakdowns-cont">
                    <mvt:foreach iterator="add_breakdown" array="product:gd_ratings:additional_breakdown">
                        <div class="gd-review-additional-breakdown">
                            <span class="gd-review-additional-breakdown-name">&mvt:add_breakdown:name;</span>
                            <span class="gd-review-breakdown-indicator">
                                <span class="gd-review-breakdown-value" style="width: &mvt:add_breakdown:perc;;"></span>
                            </span>
                            <span class="gd-review-additional-breakdown-average">&mvt:add_breakdown:average;</span>
                        </div>
                    </mvt:foreach>
                </div>
            </mvt:if>
            <div class="gd-review-would-recommend-cont">
                <span>Would recommend this product.</span>
                <div class="gd-review-would-recommend-indicator">
                        <div class="gd-review-would-recommend-value" style="width: &mvt:product:gd_ratings:recommend:perc;;"></div>
                    <div class="gd-review-would-recommend-text-value">
                        &mvt:product:gd_ratings:recommend:perc;
                    </div>
                </div>
            </div>
        </div>
    </div>
<mvt:else>
    <span class="gd-rating-review-link-cont">
        Not Yet Rated
        <mvt:if expr="g.Screen EQ 'PROD'">
            | <a href="&mvt:gd_ratings:protocol_relative_url;Screen=GD_WREVIEW&Product_Code=&mvte:product:code;" class="gd-rating-review-link" rel="nofollow">Write the First Review</a>
        </mvt:if>
    </span>
</mvt:if>