<div class="modal fade" id="inpostCreateNewShipmentModal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="inpostCreateNewShipmentTitle">{{ title_create_shipment }}</h4>
            </div>
            <div class="modal-body">
                <form action="#" method="post" enctype="multipart/form-data" id="form-new-shipment" class="form-horizontal">
                    <div class="form-group">
                        <label for="inpostEmail" class="col-sm-2 control-label">{{ entry_shipping_email }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="inpostEmail" name="email" value="{{ email }}" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inpostPhone" class="col-sm-2 control-label">{{ entry_shipping_phone }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="phone" id="inpostPhone" value="{{ phone }}" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inpostDeliveryService" class="col-sm-2 control-label">{{ text_delivery_service }}</label>
                        <div class="col-sm-10">
                            <select name="delivery_service" class="form-control" id="inpostDeliveryService">
                            {% for service in services %}
                                <option value="{{ service.id }}" {% if service.id == deliveryService.deliveryService %} selected="selected" {% endif %}>{{ service.description }}</option>
                            {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inpostShippingMethod" class="col-sm-2 control-label">{{ text_shipping_method }}</label>
                        <div class="col-sm-10">
                            <select name="shipping_method" class="form-control" id="inpostShippingMethod" data-offer="{{ deliveryService.shippingMethod }}">
                                {% for shippingMethod, value in services[deliveryService.deliveryService].shippingMethods %}
                                    <option value="{{ shippingMethod }}" {% if not value %} disabled {% endif %}>{{ apiShippingMethods[shippingMethod].name }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="form-group" {% if not showLocker %} style="display: none;" {% endif %}>
                        <label for="inpostParcelLocker" class="col-sm-2 control-label">{{ text_parcel_locker }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="parcelLocker" id="inpostParcelLocker" value="{{ parcelLocker ? parcelLocker }}" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inpostWeekendDelivery" class="col-sm-2 control-label">{{ text_weekend_delivery }}</label>
                        <div class="col-sm-10">
                            <input type="checkbox" class="js-switch" name="weekendDelivery" id="inpostWeekendDelivery" value="1" {% if deliveryService.weekendDelivery %} checked="checked" {% endif %} />
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inpostOrderReference" class="col-sm-2 control-label">{{ entry_reference_order }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="orderReference" id="inpostOrderReference" value="{{ orderReference }}" />
                        </div>
                    </div>
                    <div class="form-group predefined-dimensions">
                        <label for="inpostPredefinedDimensions" class="col-sm-2 control-label">{{ text_use_predefined_template }}</label>
                        <div class="col-sm-10">
                            <input type="checkbox" class="js-switch" name="predefinedTemplate" id="inpostPredefinedDimensions" checked="checked" />
                        </div>
                    </div>
                    <div class="form-group sizeTemplateWrapper">
                        <label for="inpostTemplate" class="col-sm-2 control-label">{{ text_template }}</label>
                        <div class="col-sm-10">
                            <select name="template" class="form-control" id="inpostTemplate">
                                <option value="size_a" {% if sizeTemplate == 'size_a' %} selected="selected" {% endif %}>Size A</option>
                                <option value="size_b" {% if sizeTemplate == 'size_b' %} selected="selected" {% endif %}>Size B</option>
                                <option value="size_c" {% if sizeTemplate == 'size_c' %} selected="selected" {% endif %}>Size C</option>
                                <option value="size_d" {% if sizeTemplate == 'size_d' %} selected="selected" {% endif %}>Size D</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group dimensions">
                        <label for="inpostLength" class="col-sm-2 control-label">{{ entry_length }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="length" id="inpostLength" value="{{ dimensions.length }}" />
                        </div>
                    </div>
                    <div class="form-group dimensions">
                        <label for="inpostLength" class="col-sm-2 control-label">{{ entry_width }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="width" id="inpostWidth" value="{{ dimensions.width }}" />
                        </div>
                    </div>
                    <div class="form-group dimensions">
                        <label for="inpostLength" class="col-sm-2 control-label">{{ entry_height }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="height" id="inpostHeight" value="{{ dimensions.height }}" />
                        </div>
                    </div>
                    <div class="form-group dimensions">
                        <label for="inpostLength" class="col-sm-2 control-label">{{ entry_weight }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="weight" id="inpostWeight" value="{{ weight }}" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inpostCod" class="col-sm-2 control-label">{{ entry_inpost_cod }}</label>
                        <div class="col-sm-10">
                            <input type="checkbox" class="js-switch" name="cod" id="inpostCod" {% if deliveryService.cod %} checked="checked" {% endif %} />
                        </div>
                    </div>
                    <div class="form-group cod-total">
                        <label for="inpostCod" class="col-sm-2 control-label">{{ text_cod_amount }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="total" id="inpostTotal" value="{{ total }}" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inpostInsurance" class="col-sm-2 control-label">{{ text_insurance }}</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="insurance" id="inpostInsurance" value="{{ insurance }}" />
                        </div>
                    </div>
                    <input type="hidden" name="orderInfo" id="orderInfo" value='{{ orderInfo }}'>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" id="button-close-create-shipment-modal">{{ text_button_modal_close }}</button>
                <button type="button" class="btn btn-primary" id="button-submit-create-shipment-form">{{ text_button_create_shipment }}</button>
            </div>
        </div>
    </div>
    <input type="hidden" id="userToken" value="{{ user_token }}" />
    <input type="hidden" id="input-api-services" value='{{ servicesJson }}' />
    <input type="hidden" id="input-api-shipping-methods" value='{{ apiShippingMethodsJson }}' />
</div>
<script>
    $(document).ready(function() {
        $('#inpostCreateNewShipmentModal').on('shown.bs.modal', function(e) {
            renderSwitchers();
            setDefaultSizeTemplate();
            showCodValue();
            setShippingOptions();
        });
    });
</script>