Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

incluyendo a main pruebas de distintas modalidades de juego #5

Merged
merged 12 commits into from
Nov 8, 2024
Merged

incluyendo a main pruebas de distintas modalidades de juego #5

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
86252e3
Update index.html
WhiterBy1 Nov 4, 2024
b9d1904
cambio a ruta absoluta
WhiterBy1 Nov 4, 2024
b76b175
Dejar bolas para efecto a futuro
WhiterBy1 Nov 6, 2024
46c8847
Merge branch 'betterDesign' of https://github.com/WhiterBy1/quimica-o…
WhiterBy1 Nov 6, 2024
9f882f5
Prueba de mecanica para nomenclatura
WhiterBy1 Nov 7, 2024
5978930
estructuras moleculares
WhiterBy1 Nov 8, 2024
cd3b7d6
Arcade of past
WhiterBy1 Nov 8, 2024
f73216e
Update con cambio de estilos
WhiterBy1 Nov 8, 2024
b6603d6
leccion 2 edit
WhiterBy1 Nov 8, 2024
81a22a6
Cambio de color de gruposF
WhiterBy1 Nov 8, 2024
1b89994
Buton master change
WhiterBy1 Nov 8, 2024
e663b50
Format and ajuste de velocidades y maximo 4 moleculas
WhiterBy1 Nov 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 26 additions & 20 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,31 +1,37 @@
<!DOCTYPE html>
<html lang="es">

<head>
<base href="/quimica-organica-3d/">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Química Orgánica 3D</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/index.css">
</head>

<body>
<div class="particle-background"></div> <!-- Fondo de partículas -->
<header class="header">
<h1>Identificación de Grupos Funcionales en Química Orgánica</h1>
<p>Explora los grupos funcionales con lecciones interactivas y visualización 3D.</p>
</header>
<main class="main-content">
<section class="lessons">
<h2>Lecciones</h2>
<div class="lesson-card">
<a href="lecciones/leccion1/identificacion-grupos-funcionales/preguntas.html">
Lección 1: Identificación de Grupos Funcionales
</a>
</div>
</section>
</main>
<footer class="footer">
<p>&copy; 2024 Proyecto de Química Orgánica 3D</p>
</footer>
<script src="js/particles.js"></script> <!-- Archivo JS para las partículas -->
<!-- <canvas> -->
<div class="particle-background"></div> <!-- Fondo de partículas -->
<header class="header">
<h1>Identificación de Grupos Funcionales en Química Orgánica</h1>
<p>Explora los grupos funcionales con lecciones interactivas y visualización 3D.</p>
</header>
<main class="main-content">
<section class="lessons">
<h2>Lecciones</h2>
<div class="lesson-card">
<a href="lecciones/leccion1/identificacion-grupos-funcionales/preguntas.html">
Lección 1: Identificación de Grupos Funcionales
</a>
</div>
</section>
</main>
<footer class="footer">
<p>&copy; 2024 Proyecto de Química Orgánica 3D</p>
</footer>
<script src="js/particles.js"></script> <!-- Archivo JS para las partículas -->
<!-- <script src="js/main.js"></script> Archivo JS para la interacción y visualización 3D -->
<!-- </canvas> -->
</body>
</html>
</html>
54 changes: 19 additions & 35 deletions js/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,38 +1,22 @@
// Carga de molécula 3D en teoría.html
function load3DMolecule() {
const moleculeContainer = document.getElementById("molecule-3d");
moleculeContainer.innerHTML = "<canvas id='moleculeCanvas'></canvas>";
const canvas = document.querySelector
('canvas')
const ctx = canvas.getContext('2d')
canvas.width = innerWidth
canvas.height = innerHeight

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, 1, 0.1, 1000);
camera.position.z = 5;

const renderer = new THREE.WebGLRenderer({ canvas: document.getElementById('moleculeCanvas') });
renderer.setSize(200, 200);
moleculeContainer.appendChild(renderer.domElement);

const geometry = new THREE.SphereGeometry(1, 32, 32); // Placeholder molecule
const material = new THREE.MeshBasicMaterial({ color: 0x007bff });
const sphere = new THREE.Mesh(geometry, material);
scene.add(sphere);

const animate = function () {
requestAnimationFrame(animate);
sphere.rotation.y += 0.01;
renderer.render(scene, camera);
};
animate();
}

// Lógica de preguntas en preguntas.html
let correctAnswer = "Alcohol"; // Respuesta correcta para este nivel

function checkAnswer(answer) {
const feedbackElement = document.getElementById("feedback");

if (answer === correctAnswer) {
feedbackElement.innerHTML = "<span style='color: green;'>¡Correcto!</span> Los alcoholes tienen un grupo hidroxilo (-OH) unido a un carbono.";
} else {
feedbackElement.innerHTML = "<span style='color: red;'>Incorrecto</span>. Inténtalo de nuevo.";
class Bola{
constructor(x, y,){
this.x = x
this.y = y
this.radius = 10
}
dibujar() {
ctx.beginPath()
ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2)
ctx.fill()
ctx.closePath()
}
}

let bola = new Bola(canvas.width /2 , canvas.height /2)
bola.dibujar()
4 changes: 2 additions & 2 deletions js/preguntas.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ const jsmolInfo = {
width: 300,
height: 300,
use: "HTML5",
j2sPath: "../../../js/JSmol/j2s", // Ruta a la carpeta `j2s` dentro de `JSmol`
j2sPath:"/quimica-organica-3d/js/JSmol/j2s", // Ruta a la carpeta `j2s` dentro de `JSmol`
script: "",
debug: false
};
Expand Down Expand Up @@ -183,4 +183,4 @@ function siguientePregunta() {
document.addEventListener("DOMContentLoaded", () => {
console.log("Iniciando la aplicación, cargando la primera pregunta...");
mostrarPregunta(nivelActual, subnivelActual);
});
});
3 changes: 2 additions & 1 deletion lecciones/leccion1/identificacion-grupos-funcionales/prueb.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,8 @@ <h3>Molécula objetivo: <span id="target-name">Agua (H₂O)</span></h3>
const targetMolecules = [
{ formula: ["H", "H", "O"], name: "Agua (H₂O)" },
{ formula: ["C", "O", "O"], name: "Dióxido de carbono (CO₂)" },
{ formula: ["N", "H", "H", "H"], name: "Amoníaco (NH₃)" }
{ formula: ["N", "H", "H", "H"], name: "Amoníaco (NH₃)" },
{ formula: ["C", "H", "H","H", "H"], name: "Metanol (CH4)" }
];

let currentMolecule = [];
Expand Down
Loading