{% load sekizai_tags static addcss %}

{% if object.title or object.introduzione_app %}
    <div class="row">
        <div class="col-sm-12">
            {% if object.title %}<h2>{{ object.title }}</h2>{% endif %}
            {% if object.introduzione_app %}{{ object.introduzione_app|safe }}{% endif %}
            <br/>
        </div>
    </div>
    <br/>
{% endif %}

<div class="visible-xs visible-sm">
    <br>
    {% if err %}
        <div class="alert alert-danger alert-dismissible" role="alert">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
                    aria-hidden="true">&times;</span></button>
            {{ err }}
        </div>
    {% endif %}
    <div class="row">
        <div class="col-md-12">
            <div class="alert alert-warning" role="alert">
                <span class="glyphicon glyphicon-warning-sign"></span>
                <span> Il Simulatore di portafogli non può essere visualizzato su schermi con dimensioni ridotte.</span>

                <div class="row visible-sm">
                    <hr>
                    <div class="col-xs-2 col-xs-offset-2">
                        <img class="img-flex" src="{% static 'img/rotatetablet.png' %}" alt="">
                    </div>
                    <div class="col-xs-8">
                        <span><h6 class="black">Se stai visualizzando il simulatore da Tablet puoi provare a ruotare il
                            dispositivo</h6></span>
                    </div>
                </div>
                <hr>
                <p>
                    Per visualizzare il simulatore in un secondo momento (ad esempio da un PC o Laptop), puoi inviarti
                    questo portafoglio al tuo indirizzo email e continuare a utilizzarlo quando ti sarà più comodo.
                </p>
                <br>

                <form action="{{ request.path }}" id="send_mail" method="POST">
                    {% csrf_token %}
                    <div class="form-group {% if form.capcha.errors %}has-error{% endif %}">
                        {{ form.capcha }}
                        {% if form.capcha.errors %}
                            <span id="helpBlock" class="help-block has-error"><small>{{ form.capcha.errors|striptags }}</small></span>
                        {% endif %}
                    </div>
                    <div class="input-group">
                        {{ form.email|addcss:'form-control' }}
                        <span class="input-group-btn">
                            <button style="height: auto;" class="btn btn-default" type="submit">invia</button>
                        </span>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <br>
</div>

<div class="visible-md visible-lg">
    <br>

    <div class="row">
        <div class="col-sm-12">
            <div>
                <iframe id="simulatoreptf" src="{{ simulazione.get_url }}" scrolling="no" width="100%" frameborder="0">
                    Contenuto alternativo per i browser che non leggono gli iframe.
                </iframe>
            </div>
        </div>
    </div>
</div>

{% addtoblock "js" %}
    <!-- iframeresizer -->
    <script type="application/javascript" src="{% static 'simulatoreptf/js/iframeResizer.min.js' %}"></script>
    <script type="application/javascript">
        $(document).ready(function () {
            $('#simulatoreptf').iFrameResize({
                log: true,
                inPageLinks: true,
                heightCalculationMethod: "lowestElement"
            });
        });
    </script>
{% endaddtoblock %}