{% load static %} <!-- Load static files -->
{% load i18n %}
{% block content %}

<div class="modal fade" id="sensorUSPillModal" tabindex="-1" role="dialog" aria-labelledby="sensorUSPillLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <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>
				<h3 class="modal-title" id="sensorUSPillLabel">{% trans "Sensor ultrasonidos (US) en Scratch" %}</h3>
			</div>
			<div class="modal-body" style="padding: 0px">
				<div id="loading_page" class="col-xs-12 loading-page">
					<div id="presentation_column" width="100%" height="100%" frameBorder="0" style="padding: 20px; max-height: 100%;">
						<div class="row" id="theory-title"  style="text-align: justify; font-size:20px;">
							<div class="col-md-12">
								<h2>{% trans "Uso del bloque:" %}<img src="{% static 'scratch/SSGop007/img/us.png' %}" width=400px></h2>
								<p>{% trans "Vamos a usar el sensor de Ultrasonidos que poseen los robots en su parte frontal. Este sensor es capaz de detectar la presencia de un obstáculo que se encuentre enfrente del robot por medio de la emisión/detección de ondas de ultrasonidos. Para acceder a los datos de este sensor, dirígete en el menú de trabajo al apartado <strong><span style='color:grey'>RobotAPI</span></strong>, y dentro de este haz click sobre el subapartado <strong><span style='color:purple'>Sensors</span></strong>, donde encontrarás bloques funcionales que te permitirán determinar la distancia a los obstáculos situados delante del robot." %}</p>
								<br>
								<br><p>{% trans "Este sensor nos proporcionará valores del 0 al 10. El valor 10 indica que no hay presencia de ningún obstáculo delante del robot. Valores entre 0-10 indicarán que estamos cerca de un obstáculo. Si los valores que nos devuelve el sensor son más cercanos a 0,  el obstáculo esta muy muy cerca y podremos chocar con él." %}</p>
								<div class="col-md-12 " id="theory-container">
									<br><h2>{% trans "En este video puedes ver un ejemplo de su funcionamiento" %}</h2><br>
									<div class="unit-video-container">
										<iframe class="unit-video" allowfullscreen src="https://www.youtube.com/embed/Sdkwq9SI3FY"></iframe>
									</div>
									<br>
									<br>
									<p style="text-align:center">{% trans "¿Tienes alguna duda? Pregunta en nuestro" %}<a href="https://foro.kibotics.org/"><strong>{% trans "Foro" %}</strong></a><br></p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="modal-footer">
			</div>
        </div>
    </div>
</div>

{% endblock %}