{% load i18n sekizai_tags thumbnail  %}


<div class="slider-wrapper theme-{{object.theme}}">
    {% if object.show_ribbon %}<div class="ribbon"></div>{% endif %}
    <div id="nivoslider" class="nivoSlider"
        style="{% if object.image_witdth %}width:{{object.image_width}}px;{% endif %}
        {% if object.image_height %}height:{{object.image_height}}px;{% endif %}">
        {% for img in images %}
            {% if size %}
                <img src="{% thumbnail img.image size crop %}" alt="{{img.name}}" title="{{img.description}}" />
            {% else %}
                <img src="{{img.image.url}}" alt="{{img.name}}" title="{{img.description}}" />
            {% endif %}
        {% endfor %}
    </div>
</div> <!-- end slider-wrapper -->



{% addtoblock "css" %}
<link rel="stylesheet" href="{{STATIC_URL}}nivo/nivo-slider.css" type="text/css" media="screen" />
{% endaddtoblock %}

{% addtoblock "css" %}
<link rel="stylesheet" href="{{STATIC_URL}}nivo/themes/{{object.theme}}/{{object.theme}}.css" type="text/css" media="screen" />
{% endaddtoblock %}

{% addtoblock "js" %}
    <script type="text/javascript" src="{{STATIC_URL}}nivo/js/jquery.nivo.slider.pack.js"></script>
{% endaddtoblock %}

{% addtoblock "js" %}
<script type="text/javascript">
    $(function() {
        $('#nivoslider').nivoSlider({
            effect: '{{object.effect}}',
            animSpeed: {{object.anim_speed}},
            pauseTime: {{object.pause_time}}
        });
    });
</script>
{% endaddtoblock %}
