Commit 5a5fba1c by Manuel Ruiz Toribio

Merge remote-tracking branch 'origin/developJC' into developmanu

parents 5078401a 0188e08a
......@@ -33,20 +33,21 @@ use App\Controllers\User;
$routes->match(['get'], '/', [User::class, 'login']);
$routes->match(['get', 'post'], '/login', [User::class, 'login']);
//$routes->match(['get', 'post'], '/insert_recipe', [User::class,'insert_recipe']);
$routes->match(['get', 'post'], '/insertRecipe', [InsertRecipeController::class,'insertAjax']);
$routes->match(['get', 'post'], '/loginAjax', [User::class, 'loginAjax']);
$routes->match(['get', 'post'], '/registerAjax', [User::class, 'registerAjax']);
$routes->match(['get'], '/home', [User::class, 'user_ok']);
$routes->get('insertRecipe', 'InsertRecipeController::insertRecipe');
$routes->get('login','Pages::viewLogin');
$routes->get('users','User::list');
$routes->get('home','Pages::prueba');
$routes->get('(:segment)', 'Home::index');
$routes->get('/recipe/(:num)', 'RecipesController::view_recipe/$1');
$routes->get('insert_recipe', 'InsertController::insert_recipe');
/*
......
<?php
namespace App\Controllers;
class Insert extends BaseController
{
public function insertAjax()
{
$validation = \Config\Services::validation();
$rules = [
"recipe_name" => [
"label" => "Name",
"rules" => "required"
],
"recipe_description" => [
"label" => "description",
"rules" => "required"
],
"is_vegan" => [
"label" => "is_vegan"
],
"origin" => [
"label" => "origin"
],
"season" => [
"label" => "season"
],
"instructions" => [
"label" => "instructions"
],
"recipe_photo" => [
"label" => "photo"
],
"recipe_video" => [
"label" => "link"
],
];
$data = [];
$session = session();
$recipes_model = model('RecipesModel');
if ($this->request->getMethod() == "post") {
if ($this->validate($rules)) {
// Código de registro y respuesta exitosa
$recipe_name = $this->request->getVar('recipe_name');
$recipe_description = $this->request->getVar('recipe_description');
$is_vegan = $this->request->getVar('is_vegan');
$origin = $this->request->getVar('origin');
$season = $this->request->getVar('season');
$instructions = $this->request->getVar('instructions');
$recipe_photo = $this->request->getVar('recipe_photo');
$recipe_video = $this->request->getVar('recipe_video');
$recipeData = [
'recipe_name' => $recipe_name,
'recipe_description' => $recipe_description,
'is_vegan' => $is_vegan,
'origin' => $origin,
'season' => $season,
'instructions' => $instructions,
'recipe_photo' => $recipe_photo,
'recipe_video' => $recipe_video,
];
$recipes_model->saveRecipe($recipe_name,$season,$origin,$recipe_photo,$is_vegan,$recipe_description,$instructions,$recipe_video);
return $this->response->setStatusCode(200)->setJSON([
'text' => 'Receta añadida'
]);
} else {
$error_message = '';
if ($validation->getError('recipe_name')) {
$error_message = 'Hay que añadir nombre a la receta';
} elseif ($validation->getError('recipe_description')) {
$error_message = 'Se necesita una descripcion';
} else {
$error_message = 'Error desconocido';
}
return $this->response->setStatusCode(400)->setJSON([
'text' => $error_message
]);
}
}
return $this->response->setStatusCode(400)->setJSON([
'text' => 'Solo se aceptan post request'
]);
}
}
\ No newline at end of file
<?php
namespace App\Controllers;
use App\Models\RecipesModel;
use CodeIgniter\Controller;
use CodeIgniter\Exceptions\PageNotFoundException;
class InsertController extends Controller
{
public function insert_recipe($page = 'insert_recipe')
{
if (! is_file(APPPATH . 'Views/pages/' . $page . '.php')) {
// Whoops, we don't have a page for that!
throw new PageNotFoundException($page);
}
$data['title'] = ucfirst($page); // Capitalize the first letter
return view('templates/header', $data)
.view('pages/' . $page)
.view('templates/footer');
}
}
<?php
namespace App\Controllers;
use CodeIgniter\Controller;
class InsertRecipeController extends Controller
{
public function insertRecipe()
{
return view('templates/header')
.view('pages/insertRecipe')
. view('templates/footer');
}
}
......@@ -63,7 +63,7 @@
<li class="nav-item">
<a class="nav-link collapsed" href="/insert_recipe">
<a class="nav-link collapsed" href="/insertRecipe">
<i class="bi bi-person"></i>
<span>Perfil</span>
</a>
......
<link rel="stylesheet" href="<?= base_url("css/insert.css") ?>">
<main id="main" class="main">
<section class="section dashboard">
<h1>Upload a Recipe</h1>
<form action=<?= base_url('/insert_recipe'); ?> method="post" enctype="multipart/form-data" class="my-form">
<div class="form-group">
<label for="recipe_name">Recipe Name:</label>
<input type="text" id="recipe_name" name="recipe_name" required class="form-control">
</div>
<div class="form-group">
<label for="recipe_description">Recipe Description:</label>
<textarea id="recipe_description" name="recipe_description" rows="4" cols="50" required class="form-control"></textarea>
</div>
<div class="form-group form-check">
<input type="checkbox" id="is_vegan" name="is_vegan" class="form-check-input">
<label class="form-check-label" for="is_vegan">Vegan</label>
</div>
<div class="form-group">
<label for="origin">Origin:</label>
<select id="origin" name="origin" class="form-control">
<option value="american">American</option>
<option value="chinese">Chinese</option>
<option value="indian">Indian</option>
<option value="italian">Italian</option>
<option value="mexican">Mexican</option>
</select>
</div>
<div class="form-group">
<label for="season">Season:</label>
<select id="season" name="season" class="form-control">
<option value="invierno">Invierno</option>
<option value="primavera">Primavera</option>
<option value="verano">Verano</option>
<option value="otoño">Otoño</option>
<option value="4estaciones">4 estaciones</option>
</select>
</div>
<div class="form-group">
<label for="instructions">Instructions:</label>
<textarea id="instructions" name="instructions" rows="6" cols="50" required class="form-control"></textarea>
</div>
<div class="form-group">
<label for="ingredient_search">Search Ingredients:</label>
<div class="input-group">
<input type="search" id="ingredient_search" name="ingredient_search" placeholder="Search ingredients..." class="form-control">
<div class="input-group-append">
<button class="btn btn-primary" type="button" id="add_ingredient_btn">Add</button>
</div>
</div>
</div>
<div class="form-group">
<label for="selected_ingredients">Selected Ingredients:</label>
<div id="selected_ingredients" class="form-control"></div>
</div>
<div class="form-group">
<label for="recipe_photo">Upload a Photo:</label>
<input type="file" id="recipe_photo" name="recipe_photo" accept="image/*" class="form-control-file">
</div>
<div class="form-group">
<label for="recipe_video">Ingrese el enlace del video:</label>
<input type="text" id="recipe_video" name="recipe_video" class="form-control">
</div>
<input type="submit" value="Upload Recipe" class="btn btn-primary">
</form>
<script>
// Seleccionar elementos DOM
const ingredientSearch = document.querySelector('#ingredient_search');
const addIngredientBtn = document.querySelector('#add_ingredient_btn');
const selectedIngredients = document.querySelector('#selected_ingredients');
// Array para almacenar palabras clave seleccionadas
let ingredients = [];
// Función para agregar una palabra clave
function addIngredient() {
const ingredient = ingredientSearch.value.trim();
// Agregar la palabra clave al array y actualizar el campo de selección
if (ingredient && !ingredients.includes(ingredient)) {
ingredients.push(ingredient);
updateSelectedIngredients();
ingredientSearch.value = '';
}
}
// Función para eliminar una palabra clave
function removeIngredient(ingredient) {
// Eliminar la palabra clave del array y actualizar el campo de selección
ingredients = ingredients.filter(function(value) {
return value != ingredient;
});
updateSelectedIngredients();
}
// Función para actualizar el campo de selección de palabras clave
function updateSelectedIngredients() {
// Limpiar el campo de selección
selectedIngredients.innerHTML = '';
// Agregar cada palabra clave seleccionada al campo de selección
ingredients.forEach(function(ingredient) {
const ingredientElement = document.createElement('div');
ingredientElement.classList.add('selected-ingredient');
ingredientElement.textContent = ingredient;
const removeBtn = document.createElement('button');
removeBtn.classList.add('btn', 'btn-danger', 'btn-sm');
removeBtn.textContent = 'x';
removeBtn.addEventListener('click', function() {
removeIngredient(ingredient);
});
ingredientElement.appendChild(removeBtn);
selectedIngredients.appendChild(ingredientElement);
});
}
// Agregar evento para agregar ingredientes cuando se hace clic en el botón "Add"
addIngredientBtn.addEventListener('click', function() {
addIngredient();
});
// Agregar evento para agregar ingredientes cuando se presiona Enter en el campo de búsqueda
ingredientSearch.addEventListener('keydown', function(event) {
// Verificar si la tecla presionada es "Enter"
if (event.key === 'Enter') {
event.preventDefault(); // Prevenir el envío del formulario
addIngredient();
}
});
</script>
</section>
</main><!-- End #main -->
</body>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Iniciar Sesión</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
integrity="sha512-Wq3znUOIZtqZkpWpkTVRtRwQ2YyPCvT03zWlj+iS9dH1eNTjiOVlG2xgC4np4FXwL+Hgx1pjcTXy09pgH5u5HA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="<?= base_url("css/login.css") ?>">
<style>
body {
background-image: url("imagenes/fondoLogin.jpg");
background-size: 100% auto;
}
</style>
<script src="https://code.jquery.com/jquery-3.6.4.min.js" integrity="sha256-oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl+cbzUq8=" crossorigin="anonymous"></script>
</head>
<body>
<a href="/home">
<img src="iconos/logoCompleto.png" alt="Página Principal" width="300" height="70"
style="margin-bottom: 20px; margin-top: 0px;">
</a>
<div class="col-md-8">
<div class="container" id="container">
<div class="form-container sign-up-container">
<!-- FORMULARIO REGISTER -->
<form action=<?= base_url('/register'); ?> method="post" style="flex-direction: column; padding: 0 30px;">
<h1>Crear cuenta</h1>
<div class="social-container">
<a href="https://accounts.google.com/" class="social"><img
src="<?= base_url("iconos/google.ico") ?>" width="53" height="53"></a>
<a href="https://www.facebook.com/" class="social"><img
src="<?= base_url("iconos/facebook.ico") ?>" width="52" height="52"></a>
<a href="https://appleid.apple.com/" class="social"><img
src="<?= base_url("iconos/apple.ico") ?>" width="52" height="52"></a>
</div>
<span>o usa tu correo</span>
<input style="background-color: #eee;" id="username-register-form" class="form-control" name="username" type="text" placeholder="Nombre" />
<input style="background-color: #eee;" id="email-register-form" class="form-control" name="email" type="email" placeholder="Email" />
<input style="background-color: #eee;" id="password-register-form" class="form-control" name="password" type="password" id="password" placeholder="Contraseña" />
<span class="error">
<?= \Config\Services::validation()->listErrors(); ?>
</span>
<span class="error">
<?php if (session()->getFlashdata('register_error')): ?>
<div class="alert alert-danger">
<?= session()->getFlashdata('msg') ?>
</div>
<?php endif; ?>
</span>
<span class="register-error">Error</span>
<button id="signup-button" type="submit">Registrarse</button>
</form>
</div>
<div class="form-container sign-in-container">
<!-- FORMULARIO LOGIN -->
<form action=<?= base_url('/login'); ?> method="post" style="flex-direction: column; padding: 0 30px;">
<h1>Iniciar Sesión</h1>
<div class="social-container">
<a href="https://accounts.google.com/" class="social"><img
src="<?= base_url("iconos/google.ico") ?>" width="53" height="53"></a>
<a href="https://www.facebook.com/" class="social"><img
src="<?= base_url("iconos/facebook.ico") ?>" width="52" height="52"></a>
<a href="https://appleid.apple.com/" class="social"><img
src="<?= base_url("iconos/apple.ico") ?>" width="52" height="52"></a>
</div>
<span>o usa tu correo</span>
<input style="background-color: #eee;" id="email-form" class="form-control" name="email" type="email" placeholder="Email" />
<input style="background-color: #eee;" id="password-form" class="form-control" name="password" type="password"
placeholder="Contraseña" />
<a href="#">¿Olvidaste tu contraseña?</a>
<span class="login-error">Credenciales incorrectas</span>
<button id="signin-button" type="submit">Iniciar Sesión</button>
</form>
</div>
<div class="overlay-container">
<div class="overlay">
<div class="overlay-panel overlay-left">
<h1>¡Bienvenido a Wa2Eat!</h1>
<h8>Únete a la mayor comunidad de recetas en línea</h8>
<button class="ghost" id="signIn" style="margin-top: 10px;">Iniciar Sesión</button>
</div>
<div class="overlay-panel overlay-right">
<h1>¡Bienvenido de nuevo!</h1>
<h8>Introduce tus credenciales y comienza a navegar</h8>
<button class="ghost" id="signUp" style="margin-top: 10px;">Registrarse</button>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="<?= base_url("js/login.js") ?>"></script>
\ No newline at end of file
......@@ -76,11 +76,14 @@ function getYoutubeVideoId($url) {
}
</style>
<main id="main" class="main">
<section class="section dashboard">
<div class="container">
<div class="recipe-header">
<h1> a</h1>
<h1><?php echo $recipe->name; ?></h1>
<img src="../imagenes/platos/<?php echo $recipe->photo; ?>" alt="<?php echo $recipe->name; ?>" />
</div>
......@@ -110,3 +113,6 @@ function getYoutubeVideoId($url) {
<?php endif; ?>
<?php endif; ?>
</div>
</section>
</main><!-- End #main -->
\ No newline at end of file
<!-- End page content -->
</div>
</main>
<!-- Vendor JS Files -->
<script src="js/apexcharts.min.js"></script>
......
/* Estilos generales */
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
.my-form label {
font-weight: bold;
color: #7d7d7d;
}
.my-form input[type="text"],
.my-form input[type="search"],
.my-form textarea {
background-color: #f5f5f5;
border: none;
border-radius: 5px;
padding: 10px;
margin-bottom: 10px;
box-shadow: none;
color: #333;
}
.my-form input[type="text"]:focus,
.my-form input[type="search"]:focus,
.my-form textarea:focus {
outline: none;
box-shadow: none;
background-color: #f2f2f2;
}
.my-form input[type="checkbox"],
.my-form input[type="radio"] {
margin-right: 5px;
}
.my-form .form-check-label {
color: #7d7d7d;
}
.my-form select {
background-color: #f5f5f5;
border: none;
border-radius: 5px;
padding: 10px;
margin-bottom: 10px;
box-shadow: none;
color: #333;
}
.my-form select:focus {
outline: none;
box-shadow: none;
background-color: #f2f2f2;
}
.my-form input[type="file"] {
margin-bottom: 10px;
}
.my-form .btn-primary {
background-color: #8cb6e8;
border: none;
border-radius: 5px;
padding: 10px 20px;
font-size: 16px;
font-weight: bold;
color: #fff;
}
.my-form .btn-primary:hover {
background-color: #76a9d4;
color: #fff;
}
/* Media queries */
@media (max-width: 576px) {
.container {
padding: 10px;
}
.my-form input[type="text"],
.my-form input[type="search"],
.my-form textarea,
.my-form select {
font-size: 14px;
padding: 8px;
}
.my-form .btn-primary {
font-size: 14px;
padding: 8px 16px;
}
}
/* Estilos para el botón "x" en el campo de selección de ingredientes */
.selected-ingredient button {
background-color: #f8d7da;
border: none;
border-radius: 50%;
color: #721c24;
cursor: pointer;
font-size: 0.8rem;
height: 1.5rem;
line-height: 0.8rem;
margin-left: 0.5rem;
padding: 0;
transition: background-color 0.3s ease;
width: 1.5rem;
}
.selected-ingredient button:hover {
background-color: #721c24;
color: #fff;
}
\ No newline at end of file
//jQuery time
var current_fs, next_fs, previous_fs; //fieldsets
var left, opacity, scale; //fieldset properties which we will animate
var animating; //flag to prevent quick multi-click glitches
$(".next").click(function(){
if(animating) return false;
animating = true;
current_fs = $(this).parent();
next_fs = $(this).parent().next();
//activate next step on progressbar using the index of next_fs
$("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active");
//show the next fieldset
next_fs.show();
//hide the current fieldset with style
current_fs.animate({opacity: 0}, {
step: function(now, mx) {
//as the opacity of current_fs reduces to 0 - stored in "now"
//1. scale current_fs down to 80%
scale = 1 - (1 - now) * 0.2;
//2. bring next_fs from the right(50%)
left = (now * 50)+"%";
//3. increase opacity of next_fs to 1 as it moves in
opacity = 1 - now;
current_fs.css({
'transform': 'scale('+scale+')',
'position': 'absolute'
});
next_fs.css({'left': left, 'opacity': opacity});
},
duration: 800,
complete: function(){
current_fs.hide();
animating = false;
},
//this comes from the custom easing plugin
easing: 'easeInOutBack'
});
});
$(".previous").click(function(){
if(animating) return false;
animating = true;
current_fs = $(this).parent();
previous_fs = $(this).parent().prev();
//de-activate current step on progressbar
$("#progressbar li").eq($("fieldset").index(current_fs)).removeClass("active");
//show the previous fieldset
previous_fs.show();
//hide the current fieldset with style
current_fs.animate({opacity: 0}, {
step: function(now, mx) {
//as the opacity of current_fs reduces to 0 - stored in "now"
//1. scale previous_fs from 80% to 100%
scale = 0.8 + (1 - now) * 0.2;
//2. take current_fs to the right(50%) - from 0%
left = ((1-now) * 50)+"%";
//3. increase opacity of previous_fs to 1 as it moves in
opacity = 1 - now;
current_fs.css({'left': left});
previous_fs.css({'transform': 'scale('+scale+')', 'opacity': opacity});
},
duration: 800,
complete: function(){
current_fs.hide();
animating = false;
},
//this comes from the custom easing plugin
easing: 'easeInOutBack'
});
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment