{% extends "django_msp_sms\base.html" %}
{% block title %}SMS Masivo{% endblock %}

<!-- CSS Code -->
{% block style_css %}{% endblock %}

<!-- JavaScript Code -->
{% block js_code %}

{% endblock %}

{% block breadcrumb %}{{ block.super }}  <li class='active'> Mensaje Abierto</li> {% endblock %}
{% block content %}


{% if mensaje %}
{% if multi %}
<div class="alert alert-info fade in">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
{% for m in mensaje %}
<strong>{{m.numcelular}} - {{ m.mensaje }}</strong><br>
{% endfor %}
<a href="/sms/personalizados/por_telefono"> Enviar Otro Mensaje </a>
</div>
{% else %}
<div class="alert alert-{% if estatus == 'true' %}success{% else %}danger{% endif %} fade in">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<strong>{{ mensaje }}</strong>
<a href="/sms/personalizados/por_telefono"> Enviar Otro Mensaje {{estatus}}</a>
</div>
{% endif %}
{% else %}

<div>
	<h3><b>Envío de Mensaje Abierto </b></h3>
	
	<p class="text-info col-md-6 col-xs-12 cl-sm-12">Para enviar un mensaje a varios teléfonos escribe los numeros de teléfono <small>(sin espacios ni guiones entre ellos y con la clave de larga distancia)</small> separados por coma. <br> <samp>Ejemplo. 6251234567,6257654321,6251111111</samp></p><br>
	<br style="clear:both;">
	<p class="text-info col-md-6 col-xs-12 cl-sm-12">Para enviar un mensaje a un solo teléfono escribe el número sin espacios ni guiones<br> <samp>Ejemplo. 6251234567</samp></p><br>
		
</div>
<div align ="center">
	<form method="POST" action="" class="form-inline" enctype='multipart/form-data'>{% csrf_token %}
        {{ form.errors }}
		<div class="col-md-offset-4 col-md-4 col-xs-12 cl-sm-12">
			<div class="input-group">
			  <span class="input-group-addon">+52</span>
			  {{form.telefono}}<br>	
			</div>
		</div>
		<br style="clear:both">
		<br style="clear:both">
		<div class="col-md-offset-4 col-md-4 col-xs-12 cl-sm-12">
			{{form.mensaje}}
		</div>
		<br style="clear:both">
		<br style="clear:both">
		<a href="#" class="btn btn-default" data-toggle="modal" data-target=".bs-example-modal-sm">
  		Enviar
		</a>
		<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
		  <div class="modal-dialog modal-sm">
		    <div class="modal-content">
		      <div class="modal-header">
          		<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
          		<h4 class="modal-title" id="mySmallModalLabel">Seguro que quieres enviar los mensajes?</h4>
        	  </div>
        	  <div class="modal-body">
        	  	<button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
				<button type="submit" class="btn btn-default" id="btn-enviar" onclick="this.form.submit();$(this).text('Enviando...');this.disabled=true;">Si, estoy seguro</button>
        	  </div>
		    </div>
		  </div>
		</div>
	</form>
</div>
{% endif %}
{% endblock %}