-
Notifications
You must be signed in to change notification settings - Fork 12
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #118 from Elliot-Hernandez/main
Corrección de la sección Acerca
- Loading branch information
Showing
1 changed file
with
104 additions
and
99 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,15 +1,16 @@ | ||
<!DOCTYPE html> | ||
<html lang="es"> | ||
<!-- Aprl 6 4:28 --> | ||
|
||
<head> | ||
<meta charset="UTF-8"> | ||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
<meta name="description" content="Aplicación web desarrollada en el marco del Seminario Permanente de Tecnología Musical del Posgrado en Música UNAM."> | ||
<meta name="description" | ||
content="Aplicación web desarrollada en el marco del Seminario Permanente de Tecnología Musical del Posgrado en Música UNAM."> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="stylesheet" href="css/style.css" /> | ||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> | ||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" | ||
type="text/javascript"></script> | ||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" type="text/javascript"></script> | ||
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png"> | ||
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png"> | ||
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png"> | ||
|
@@ -37,10 +38,10 @@ <h1>SPTM</h1> | |
</div> | ||
<ul class="nav"> | ||
|
||
<li for="link_inicio"class="nav-item"><a href="#inicio">inicio</a></li> | ||
<li for="link_sonido"class="nav-item"><a href="#sonido">sonido</a></li> | ||
<li for="link_acerca"class="nav-item"><a href="#acerca">acerca</a></li> | ||
<li for="link_contacto"class="nav-item"><a href="#contacto">contacto</a></li> | ||
<li for="link_inicio" class="nav-item"><a href="#inicio">inicio</a></li> | ||
<li for="link_sonido" class="nav-item"><a href="#sonido">sonido</a></li> | ||
<li for="link_acerca" class="nav-item"><a href="#acerca">acerca</a></li> | ||
<li for="link_contacto" class="nav-item"><a href="#contacto">contacto</a></li> | ||
</ul> | ||
</nav> | ||
</div> | ||
|
@@ -62,30 +63,34 @@ <h2 for="h2_sonido">Sonido</h2> | |
En algunos navegadores como chorme/chromium es necesario iniciar el audio con un gesto del usuario. Para este | ||
fin se puede usar un botón. | ||
</p> | ||
<button for="boton_activar_sonido"type="button" id="activar" class="botones-sonido">Activar sonido</button> | ||
<button for="boton_desactivar_sonido"type="button" id="desactivar" class="botones-sonido">Desactivar sonido</button> | ||
<button for="boton_activar_sonido" type="button" id="activar" class="botones-sonido">Activar sonido</button> | ||
<button for="boton_desactivar_sonido" type="button" id="desactivar" class="botones-sonido">Desactivar | ||
sonido</button> | ||
</div> | ||
<div class="separador"> | ||
<h2 for="header_ruido_blanco">Ruido blanco</h2> | ||
<p>Agregué un botón para iniciar la variable, esto pensando en el livecodeo. El primer botón inicializa</p> | ||
<button for="boton_variable" type="button" id="variableRuido" class="botones-sonido">Variable</button> | ||
<p>Agregué un botón para iniciar la variable, esto pensando en el livecodeo. El primer botón inicializa</p> | ||
<button for="boton_variable" type="button" id="variableRuido" class="botones-sonido">Variable</button> | ||
<button for="boton_reproducir" type="button" id="reproducirRuido" class="botones-sonido">Reproducir</button> | ||
<button for="boton_detener" type="button" id="detenerRuido" class="botones-sonido">Detener</button> | ||
<input for="slider_ruido" id="sliderRuidoBlanco" type="range" min="0" max="1" step="0.01" value="0" title="Slider de volumen de ruido blanco"> | ||
<input for="slider_ruido" id="sliderRuidoBlanco" type="range" min="0" max="1" step="0.01" value="0" | ||
title="Slider de volumen de ruido blanco"> | ||
</div> | ||
<div class="separador"> | ||
<h2 for="h2_sinusoidal">Sinusoidal</h2> | ||
<p>También agregué una variable y un slider más para controlar la frecuencia.</p> | ||
<button for="boton_variable" type="button" id="variableSine" class="botones-sonido">Variable</button> | ||
<button for="boton_reproducir" type="button" id="reproducirSine" class="botones-sonido">Reproducir</button> | ||
<p>También agregué una variable y un slider más para controlar la frecuencia.</p> | ||
<button for="boton_variable" type="button" id="variableSine" class="botones-sonido">Variable</button> | ||
<button for="boton_reproducir" type="button" id="reproducirSine" class="botones-sonido">Reproducir</button> | ||
<button for="boton_detener" type="button" id="detenerSine" class="botones-sonido">Detener</button> | ||
<input id="sliderSine" type="range" min="0" max="1" step="0.01" value="0" title="Slider de volumen de onda sinusoidal"> | ||
<input id="sliderFreq" type="range" min="1" max="2000" step="1" value="440" title="Slider de frecuencia de onda sinusoidal"> | ||
<input id="sliderSine" type="range" min="0" max="1" step="0.01" value="0" | ||
title="Slider de volumen de onda sinusoidal"> | ||
<input id="sliderFreq" type="range" min="1" max="2000" step="1" value="440" | ||
title="Slider de frecuencia de onda sinusoidal"> | ||
</div> | ||
<div class="separador"> | ||
<h2 for="header_mic">Acceder micrófono</h2> | ||
<p for="desc_mic">La señal del mic sale por los parlantes de la computadora. Por favor, usa audífonos.</p> | ||
<button for="boton_reproducir"type="button" id="reproducirMic" class="botones-sonido">Reproducir</button> | ||
<button for="boton_reproducir" type="button" id="reproducirMic" class="botones-sonido">Reproducir</button> | ||
<button for="boton_detener" type="button" id="detenerMic" class="botones-sonido">Detener</button> | ||
</div> | ||
<div class="separador"> | ||
|
@@ -103,10 +108,10 @@ <h2 for="header_camara">Acceder cámara</h2> | |
<h2 for="header_muestras">Múltiples muestras en un arreglo</h2> | ||
<p for="desc_muestras">Ejemplo para relacionar carga y reproducción de archivos locales.</p> | ||
<div> | ||
<input id="audio_file1" type="file" accept="audio/*" title="Cargar archivo"/> | ||
<input id="audio_file1" type="file" accept="audio/*" title="Cargar archivo" /> | ||
</div> | ||
<div> | ||
<input id="audio_file2" type="file" accept="audio/*" title="Cargar archivo"/> | ||
<input id="audio_file2" type="file" accept="audio/*" title="Cargar archivo" /> | ||
</div> | ||
<!--Necesitamos poner por aquí una caja de texto para escribir el código para live codear--> | ||
</div> | ||
|
@@ -118,97 +123,97 @@ <h2 for="header_editor">Editor sencillo</h2> | |
</section> | ||
<section id="acerca" class="acerca"> | ||
<h2 for="header_acerca">acerca de nosotros</h2> | ||
<p for="desc_acerca">El equipo de desarrollo e investigación de esta app forma parte del Seminario Permanente de Tecnología Musical | ||
<p for="desc_acerca">El equipo de desarrollo e investigación de esta app forma parte del Seminario Permanente de | ||
Tecnología Musical | ||
del Posgrado en Música UNAM. Sus integrantes tienen diferentes perfiles e intereses alrededor de la tecnología | ||
musical lo que hace de este desarrollo un campo interdisciplinario para construir una tecnología de sonido | ||
aplicada a la web.<br> | ||
La idea surge como respuesta a llevar un semestre dedicado al desrrollo de tecnologías basadas en la programación | ||
de manera colectiva y guiada bajo un flujo de trabajo propio del desarrollo web. | ||
De esta manera el quehacer artístico de sus integrantes encuentra una metodología de desarrollo que integra | ||
preguntas que vienen de la práctica musical. | ||
|
||
|
||
<h2 class="integrantes">Integrantes</h2> | ||
<div class="row"> | ||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Cristian <br>Bañuelos</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
preguntas que vienen de la práctica musical.</p> | ||
|
||
|
||
<h2 class="integrantes">Integrantes</h2> | ||
<div class="row"> | ||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Cristian <br>Bañuelos</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Xavier <br>Góngora</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Xavier <br>Góngora</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Emilio <br>Ocelotl</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Emilio <br>Ocelotl</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Elliot <br>Hernández</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Estudiante de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Elliot <br>Hernández</h2> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Estudiante de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Marianne <br>Teixido</h2> | ||
<p class="type">Desarrolladora</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Marianne <br>Teixido</h2> | ||
<p class="type">Desarrolladora</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Hernani <br>Villaseñor</h3> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
|
||
<div class="column"> | ||
<div class="card"> | ||
<img src="imgs/bg.jpeg" alt="Mike"> | ||
<div class="container"> | ||
<h3 class="name">Hernani <br>Villaseñor</h3> | ||
<p class="type">Desarrollador</p> | ||
<!-- <p class="description">Egresado de maestría/Doctorado en Tecnología musical en la UNAM enfocado en ...</p> --> | ||
<p class="mail"><a href="#" target="_blank">Web personal</a></p> | ||
<p class="mail"><a href="mailto:[email protected]">[email protected]</a></p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</p> | ||
</section> | ||
<section id="contacto" class="contacto"> | ||
</section> | ||
|
@@ -249,4 +254,4 @@ <h3 class="name">Hernani <br>Villaseñor</h3> | |
</script> | ||
</body> | ||
|
||
</html> | ||
</html> |