Commit 5078401a by Juan Montilla Committed by Manuel Ruiz Toribio

Recetas sincronizadas con la página y vista receta

parent 63d94844
......@@ -33,6 +33,7 @@ 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'], '/loginAjax', [User::class, 'loginAjax']);
$routes->match(['get', 'post'], '/registerAjax', [User::class, 'registerAjax']);
$routes->match(['get'], '/home', [User::class, 'user_ok']);
......@@ -44,6 +45,8 @@ $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;
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');
}
}
......@@ -40,4 +40,6 @@ public function index()
return view('pages/' . $page);
}
}
\ No newline at end of file
<?php
namespace App\Controllers;
use App\Models\RecipesModel;
use CodeIgniter\Controller;
class RecipesController extends Controller
{
public function view_recipe($recipe_id)
{
$recipesModel = new RecipesModel();
$recipe = $recipesModel->find($recipe_id);
$ingredients = $recipesModel->get_recipe_ingredients($recipe_id);
if ($recipe == null) {
// Mostrar un mensaje de error si no se encuentra la receta
return redirect()->to('/');
}
$data = [
'recipe' => $recipe,
'ingredients' => $ingredients,
];
return view('templates/header',$data)
.view('pages/recipe_view', $data)
. view('templates/footer');
}
}
......@@ -41,7 +41,10 @@ class User extends BaseController
//"rules" => "required|min_length[8]|max_length[20]"
]
];
$session = session();
$userModel = model('UserModel');
if ($this->request->getMethod() == "post") {
if ($this->validate($rules)) {
$email = $this->request->getVar('email');
......@@ -74,7 +77,12 @@ class User extends BaseController
}
public function user_ok()
{
return view('templates/header')
$session = session();
$usuario = $session->__get('user');
$data['usuario'] = $usuario;
$userModel = model('UserModel');
return view('templates/header',$data)
. view('pages/home')
. view('templates/footer');
}
......@@ -93,63 +101,67 @@ class User extends BaseController
}
public function registerAjax()
{
$validation = \Config\Services::validation();
$rules = [
"username" => [
"label" => "Username",
"rules" => "required"
],
"email" => [
"label" => "Email",
"rules" => "required|valid_email|is_unique[user.email]"
],
"password" => [
"label" => "Password",
"rules" => "required|min_length[8]|max_length[20]"
]
];
$data = [];
$session = session();
$userModel = model('UserModel');
if ($this->request->getMethod() == "post") {
if ($this->validate($rules)) {
// Código de registro y respuesta exitosa
$username = $this->request->getVar('username');
$email = $this->request->getVar('email');
$password = $this->request->getVar('password');
$user = [
'username' => $username,
'email' => $email,
'password' => password_hash($password, PASSWORD_DEFAULT),
];
$userModel->saveUser($email, $username, $password);
$session->set('logged_in', TRUE);
$session->set('user', $user);
return $this->response->setStatusCode(200)->setJSON([
'text' => 'Usuario logeado'
]);
} else {
$error_message = '';
if ($validation->getError('email')) {
$error_message = 'Email ya en uso o inválido';
} elseif ($validation->getError('password')) {
$error_message = 'La contraseña debe tener entre 8 y 20 caracteres';
{
$validation = \Config\Services::validation();
$rules = [
"username" => [
"label" => "Username",
"rules" => "required"
],
"email" => [
"label" => "Email",
"rules" => "required|valid_email|is_unique[user.email]"
],
"password" => [
"label" => "Password",
"rules" => "required|min_length[8]|max_length[20]"
]
];
$data = [];
$session = session();
$userModel = model('UserModel');
if ($this->request->getMethod() == "post") {
if ($this->validate($rules)) {
// Código de registro y respuesta exitosa
$name = $this->request->getVar('username');
$email = $this->request->getVar('email');
$password = $this->request->getVar('password');
$userData = [
'username' => $name,
'email' => $email,
'password' => password_hash($password, PASSWORD_DEFAULT),
];
$userModel->saveUser($email, $name, $password);
$newUser = $userModel->authenticate($email, $password);
$session->set('logged_in', TRUE);
$session->set('user', $newUser);
return $this->response->setStatusCode(200)->setJSON([
'text' => 'Usuario logeado'
]);
} else {
$error_message = 'Error desconocido';
}
$error_message = '';
if ($validation->getError('email')) {
$error_message = 'Email ya en uso o inválido';
} elseif ($validation->getError('password')) {
$error_message = 'La contraseña debe tener entre 8 y 20 caracteres';
} else {
$error_message = 'Error desconocido';
}
return $this->response->setStatusCode(400)->setJSON([
'text' => $error_message
]);
return $this->response->setStatusCode(400)->setJSON([
'text' => $error_message
]);
}
}
}
return $this->response->setStatusCode(400)->setJSON([
'text' => 'Solo se aceptan post request'
]);
}
return $this->response->setStatusCode(400)->setJSON([
'text' => 'Solo se aceptan post request'
]);
}
......
<?php
namespace App\Models;
use CodeIgniter\Model;
class IngredientModel extends Model
{
protected $table = 'ingredient';
protected $primaryKey = 'id';
protected $useAutoIncrement = true; # db takes care of it
protected $returnType = 'object'; # 'object' or 'array'
protected $useSoftDeletes = false; # true if you expect to recover data
# Fields that can be set during save, insert, or update methods
protected $allowedFields = ['id', 'name', 'icon'];
protected $useTimestamps = false; # no timestamps on inserts and updates
# Do not use validations rules (for the time being...)
protected $validationRules = [];
protected $validationMessages = [];
protected $skipValidation = false;
public function saveRecipe($id, $name, $icon)
{
$data = [
'id' => $id,
'name' => $name,
'icon' => $icon,
];
return $this->insert($data);
}
}
\ No newline at end of file
<?php
namespace App\Models;
use CodeIgniter\Model;
class RecipesIngredientModel extends Model
{
protected $table = 'recipes_ingredient';
protected $primaryKey = 'id';
protected $useAutoIncrement = true; # db takes care of it
protected $returnType = 'object'; # 'object' or 'array'
protected $useSoftDeletes = false; # true if you expect to recover data
# Fields that can be set during save, insert, or update methods
protected $allowedFields = ['id', 'amount', 'id_recipe','id_ingredient'];
protected $useTimestamps = false; # no timestamps on inserts and updates
# Do not use validations rules (for the time being...)
protected $validationRules = [];
protected $validationMessages = [];
protected $skipValidation = false;
public function saveRecipe($id, $amount, $id_recipe, $id_ingredient)
{
$data = [
'id' => $id,
'amount' => $amount,
'id_recipe' => $id_recipe,
'id_ingredient' => $id_ingredient,
];
return $this->insert($data);
}
}
\ No newline at end of file
<?php
namespace App\Models;
use CodeIgniter\Model;
class recipesModel extends Model
{
protected $table = 'recipes';
protected $primaryKey = 'id';
protected $useAutoIncrement = true; # db takes care of it
protected $returnType = 'object'; # 'object' or 'array'
protected $useSoftDeletes = false; # true if you expect to recover data
# Fields that can be set during save, insert, or update methods
protected $allowedFields = ['id', 'name', 'season','origin','photo','is_vegan','description','instructions','link'];
protected $useTimestamps = false; # no timestamps on inserts and updates
# Do not use validations rules (for the time being...)
protected $validationRules = [];
protected $validationMessages = [];
protected $skipValidation = false;
public function saveRecipe($id, $name, $season, $origin, $photo, $is_vegan, $description, $instructions, $link)
{
$data = [
'id' => $id,
'name' => $name,
'season' => $season,
'origin' => $origin,
'photo' => $photo,
'is_vegan' => $is_vegan,
'description' => $description,
'instructions' => $instructions,
'link' => $link,
];
return $this->insert($data);
}
public function get_recipe_ingredients($recipe_id) {
$builder = $this->db->table('recipes_ingredient');
$builder->select('ingredient.name, ingredient.icon, recipes_ingredient.amount');
$builder->join('ingredient', 'recipes_ingredient.id_ingredient = ingredient.id');
$builder->where('recipes_ingredient.id_recipe', $recipe_id);
$query = $builder->get();
return $query->getResult();
}
}
\ No newline at end of file
......@@ -36,8 +36,8 @@
</ul>
</li><!-- Fin Filtro 1 -->
<!-- Filtro 1-->
<li class="nav-item">
<!-- Filtro 1-->
<li class="nav-item">
<a class="nav-link collapsed" data-bs-target="#tables-nav2" data-bs-toggle="collapse" href="#">
<i class="bi bi-layout-text-window-reverse"></i><span>Filtro 2</span><i
class="bi bi-chevron-down ms-auto"></i>
......@@ -63,7 +63,7 @@
<li class="nav-item">
<a class="nav-link collapsed" href="users-profile.html">
<a class="nav-link collapsed" href="/insert_recipe">
<i class="bi bi-person"></i>
<span>Perfil</span>
</a>
......@@ -113,265 +113,70 @@
<section class="section dashboard">
<!-- FILA RECETA -->
<div class="card info-card sales-card" class="container">
<div class="row" style=" margin-bottom:-10px;" style="max-height: 0px;">
<div class="col-md-3 imagen-container">
<img src="imagenes/platos/tiramisuPrueba.jpeg" style="margin-left:0px;" alt=""
class="img-fluid rounded-start">
</div>
<div class="col-md-9">
<div class="filter">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-three-dots"></i></a>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<li class="dropdown-header text-start">
<h6>Opciones</h6>
</li>
<li><a class="dropdown-item" href="#">Guardar</a></li>
<li><a class="dropdown-item" href="#">Compartir</a></li>
</ul>
</div>
<div class="card-body">
<div class="row">
<h5 class="card-title">Tiramisú <span>| Postres</span></h5>
<!--ingredientes-->
<div class="chip">
<img src="imagenes/ingredientes/azucar.png">
<b style="font-size: 14px">Azucar</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/cacao.png">
<b style="font-size: 14px">Cacao</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/cafe.png">
<b style="font-size: 14px">Café</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/huevo.png">
<b style="font-size: 14px">Huevos</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/sal.png">
<b style="font-size: 14px">Sal</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/mascarpone.png">
<b style="font-size: 14px">Mascarpone</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/vino.png">
<b style="font-size: 14px">Vino</b>
<?php
$recipesModel = new \App\Models\RecipesModel();
$recipes = $recipesModel->findAll();
if (sizeof($recipes) > 0) {
foreach ($recipes as $row) {
$ingredients = $recipesModel->get_recipe_ingredients($row->id);
?>
<!-- Inicio de la tarjeta de la receta -->
<div class="recipe-card-wrapper">
<a href="<?php echo base_url('recipe/' . $row->id); ?>" class="recipe-card-link">
<div class="card info-card sales-card">
<div class="row">
<div class="col-md-3 imagen-container">
<img src="imagenes/platos/<?php echo $row->photo; ?>" alt=""
class="img-fluid rounded-start">
</div>
<div class="col-md-9">
<div class="filter">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-three-dots"></i></a>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<li class="dropdown-header text-start">
<h6>Opciones</h6>
</li>
<li><a class="dropdown-item" href="#">Guardar</a></li>
<li><a class="dropdown-item" href="#">Compartir</a></li>
</ul>
</div>
<div class="card-body">
<h5 class="card-title">
<?php echo $row->name; ?> <span>|
<?php echo $row->origin; ?>
</span>
</h5>
<!--ingredientes-->
<?php foreach ($ingredients as $ingredient) { ?>
<div class="chip" title="Cantidad: <?php echo $ingredient->amount; ?>">
<img src="imagenes/ingredientes/<?php echo $ingredient->icon; ?>">
<b style="font-size: 14px">
<?php echo $ingredient->name; ?>
</b>
</div>
<?php } ?>
<!--fin ingredientes-->
</div>
</div>
</div>
<!--fin ingredientes-->
</div>
</div>
</a>
</div>
</div>
</div>
</div>
<!-- FIN FILA RECETA -->
<!-- FILA RECETA 2-->
<div class="card info-card sales-card" class="container">
<div class="row" style=" margin-bottom:-10px;" style="max-height: 0px;">
<div class="col-md-3 imagen-container">
<img src="imagenes/platos/chickenAlfredoPrueba.jpg" style="margin-left:0px;" alt=""
class="img-fluid rounded-start">
</div>
<div class="col-md-9">
<div class="filter">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-three-dots"></i></a>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<li class="dropdown-header text-start">
<h6>Filter</h6>
</li>
<li><a class="dropdown-item" href="#">Today</a></li>
<li><a class="dropdown-item" href="#">This Month</a></li>
<li><a class="dropdown-item" href="#">This Year</a></li>
</ul>
</div>
<div class="card-body">
<div class="row">
<h5 class="card-title">Chicken Alfredo Primavera <span>| Entrantes</span></h5>
<!--ingredientes-->
<div class="chip">
<img src="imagenes/ingredientes/aceite.png">
<b style="font-size: 14px">Aceite</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/ajo.png">
<b style="font-size: 14px">Ajo</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/nata.png">
<b style="font-size: 14px">Nata</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/quesoRallado.png">
<b style="font-size: 14px">Queso Rallado</b>
</div>
<!-- Fin de la tarjeta de la receta -->
<div class="chip">
<img src="imagenes/ingredientes/nuez.png">
<b style="font-size: 14px">Nuez</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/mantequilla.png">
<b style="font-size: 14px">Mantequilla</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/pollo.png">
<b style="font-size: 14px">Pollo</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/pimienta.png">
<b style="font-size: 14px">Pimienta</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/sal.png">
<b style="font-size: 14px">Sal</b>
</div>
<!--fin ingredientes-->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- FIN FILA RECETA 2-->
<!-- FILA RECETA 3-->
<div class="card info-card sales-card" class="container">
<div class="row" style=" margin-bottom:-10px;" style="max-height: 0px;">
<div class="col-md-3 imagen-container">
<img src="imagenes/platos/patatasPrueba.png" style="margin-left:0px;" alt=""
class="img-fluid rounded-start">
</div>
<div class="col-md-9">
<div class="filter">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-three-dots"></i></a>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<li class="dropdown-header text-start">
<h6>Filter</h6>
</li>
<li><a class="dropdown-item" href="#">Today</a></li>
<li><a class="dropdown-item" href="#">This Month</a></li>
<li><a class="dropdown-item" href="#">This Year</a></li>
</ul>
</div>
<div class="card-body">
<div class="row">
<h5 class="card-title">Patatas Foster <span>| El diablo</span></h5>
<!--ingredientes-->
<div class="chip">
<img src="imagenes/ingredientes/bacon.png">
<b style="font-size: 14px">Bacon</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/patata.png">
<b style="font-size: 14px">Patatas</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/quesoRallado.png">
<b style="font-size: 14px">Queso Chedar</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/quesoRallado.png">
<b style="font-size: 14px">4 Quesos</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/quesoRallado.png">
<b style="font-size: 14px">Havarti</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/sal.png">
<b style="font-size: 14px">Sal</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/salsa.png">
<b style="font-size: 14px">Salsa Ranchera</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/salsa.png">
<b style="font-size: 14px">Salsa Cesar</b>
</div>
<div class="chip">
<img src="imagenes/ingredientes/salsa.png">
<b style="font-size: 14px">Salsa Chedar</b>
</div>
<!--fin ingredientes-->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- FIN FILA RECETA 3-->
<!-- FILA RECETA 4-->
<div class="card info-card sales-card" class="container">
<div class="row" style=" margin-bottom:-10px;" style="max-height: 0px;">
<div class="col-md-3 imagen-container">
<img src="imagenes/platos/cebolla.png" style="margin-left:0px;" alt=""
class="img-fluid rounded-start">
</div>
<div class="col-md-9">
<div class="filter">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-three-dots"></i></a>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<li class="dropdown-header text-start">
<h6>Filter</h6>
</li>
<li><a class="dropdown-item" href="#">Today</a></li>
<li><a class="dropdown-item" href="#">This Month</a></li>
<li><a class="dropdown-item" href="#">This Year</a></li>
</ul>
</div>
<div class="card-body">
<div class="row">
<h5 class="card-title">Cebolla <span>| Aperitivos</span></h5>
<div class="chip">
<img src="imagenes/ingredientes/cebolla.png">
<b style="font-size: 14px">Cebolla</b>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- FIN FILA RECETA 4-->
<?php
}
}
?>
......
</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
<?php
function getYoutubeVideoId($url) {
$pattern = '/^(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/i';
preg_match($pattern, $url, $matches);
return isset($matches[1]) ? $matches[1] : null;
}
?>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.container {
max-width: 960px;
margin: 0 auto;
padding: 20px;
}
.recipe-header {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 30px;
}
.recipe-header img {
width: 100%;
max-width: 600px;
height: auto;
object-fit: cover;
border-radius: 8px;
}
.ingredient-list {
display: flex;
flex-wrap: wrap;
list-style-type: none;
padding: 0;
margin: 0;
margin-bottom: 30px;
}
.ingredient-item {
display: flex;
align-items: center;
width: 50%;
padding: 5px 0;
}
.ingredient-item img {
width: 30px;
height: 30px;
margin-right: 10px;
}
.instructions {
white-space: pre-line;
}
.video-container {
position: relative;
padding-bottom: 56.25%; /* Relación de aspecto 16:9 */
height: 0;
overflow: hidden;
}
.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
<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>
<p><?php echo $recipe->description; ?></p>
<h2>Ingredientes</h2>
<ul class="ingredient-list">
<?php foreach ($ingredients as $ingredient) { ?>
<li class="ingredient-item">
<img src="../imagenes/ingredientes/<?php echo $ingredient->icon; ?>" alt="<?php echo $ingredient->name; ?>" />
<span><?php echo $ingredient->name; ?>: <?php echo $ingredient->amount; ?></span>
</li>
<?php } ?>
</ul>
<h2>Instrucciones</h2>
<p class="instructions"><?php echo $recipe->instructions; ?></p>
<?php if (!empty($recipe->link)): ?>
<?php $videoId = getYoutubeVideoId($recipe->link); ?>
<?php if ($videoId): ?>
<h2>Video de la receta</h2>
<div class="video-container">
<iframe width="560" height="315" src="https://www.youtube.com/embed/<?php echo $videoId; ?>" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<?php endif; ?>
<?php endif; ?>
</div>
......@@ -216,7 +216,15 @@
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow profile">
<li class="dropdown-header">
<h6>Bob Esponja</h6>
<h6>
<?php
if( isset($usuario) ){
echo $usuario->username;
}else{
echo "Usuario sin registrar";
}
?>
</h6>
</li>
<li>
<hr class="dropdown-divider">
......
......@@ -873,6 +873,17 @@ h6 {
color: #4154f1;
}
.imagen-container img {
margin-left: 0;
padding-left: 0;
}
.recipe-card-link {
display: block;
text-decoration: none;
color: inherit;
}
.dashboard .news p {
font-size: 14px;
color: #777777;
......
No preview for this file type
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