FOSUserBundle - Parte VIII - Overriding Translations

De igual modo se pueden sustituir las traducciones:

mkdir src/Petramas/MyFOSUserBundle/Resources/translations/

FOSUserBundle - Parte VII - Overriding Login

Como nuestro formulario de login lo renderizaremos dentro de nuestro menú superior, en el caso de que no este logueado el usuario, entonces no va a tener que heredar de PetramasMainBundle:layout.html.twig porque si no tendríamos la página dentro de la misma página ocasionando un conflicto.

por lo tanto copiamos el archivo login.html.twig:

mkdir src/Peteramas/MyFOSUserBundle/Resources/views/Security/

FOSUserBundle - Parte VI - Overriding Resetting

Aquí son 4 archivos a sustituir:

checkEmail.html.twig
passwordAlreadyRequested.html.twig
request_content.html.twig
reset_content.html.twig

mkdir src/Peteramas/MyFOSUserBundle/Resources/views/Resetting/

FOSUserBundle - Parte V - Overriding Profile y Change Password

Ahora vamos a sustituir las plantillas del perfil y de cambiar la contraseña:

mkdir src/Peteramas/MyFOSUserBundle/Resources/views/Profile/

cp vendor/friendsofsymfony/user-bundle/FOS/UserBundle/Resources/views/Profile/show_content.html.twig src/Peteramas/MyFOSUserBundle/Resources/views/Profile/

FOSUserBundle - Parte IV - Overriding Registration

Si empezamos a usar las rutas del FOSUserBundle nos daremos cuenta que todas funcionan. Las rutas pueden ser tomadas usando el comando de Symfony router debug:

php app/console router:debug

fos_user_security_login           ANY      ANY    ANY  /login
fos_user_security_check           POST     ANY    ANY  /login_check
fos_user_security_logout          ANY      ANY    ANY  /logout
fos_user_profile_show             GET      ANY    ANY  /profile/
fos_user_profile_edit             ANY      ANY    ANY  /profile/edit
fos_user_registration_register    ANY      ANY    ANY  /register/
fos_user_registration_check_email GET      ANY    ANY  /register/check-email
fos_user_registration_confirm     GET      ANY    ANY  /register/confirm/{token}
fos_user_registration_confirmed   GET      ANY    ANY  /register/confirmed
fos_user_resetting_request        GET      ANY    ANY  /resetting/request
fos_user_resetting_send_email     POST     ANY    ANY  /resetting/send-email
fos_user_resetting_check_email    GET      ANY    ANY  /resetting/check-email
fos_user_resetting_reset          GET|POST ANY    ANY  /resetting/reset/{token}
fos_user_change_password          GET|POST ANY    ANY  /profile/change-password

FOSUserBundle - Parte III - Sustitución de plantillas (Overriding Templates) - layout.html.twig

El modo de sustituir plantillas hechas en FOSUserBundle es muy sencillo, teniendo nuestro bundle hijo de éste.

Tenemos que fijarnos dentro de la carpeta:

"vendor/friendsofsymfony/user-bundle/FOS/UserBundle/Resources/views"

FOSUserBundle - Parte II - Creación del Child Bundle

Para poder modificar las plantillas que vienen por defecto en FOSUserBundle, es necesario crear un bundle que sólo se encargará de recoger todas las modificaciones hechas, dejando nuestro MainBundle tal como está.

php app/console generate:bundle

el cuál ejecuta una consola interactiva para la creación de bundles e iremos respondiendo una a una las preguntas:

Bundle namespace: Petramas/MyFOSUserBundle
Bundle name [PetramasMyFOSUserBundle]:
Target directory [/home/joerobles/NetBeansProjects/petramas/src]:
Configuration format (yml, xml, php, or annotation): annotation
Do you want to generate the whole directory structure [no]? yes
Do you confirm generation [yes]?
Confirm automatic update of your Kernel [yes]? 
Confirm automatic update of the Routing [yes]?

luego se debe indicar a éste bundle creado que heredará de FOSUserBundle, editando el archivoPetramasMyFOSUserBundle.php

nano src/Petramas/MyFOSUserBundle/PetramasMyFOSUserBundle.php

y agregando return 'FOSUserBundle'; dentro de la función getParent:

public function getParent()
{
    return 'FOSUserBundle';
}

Friends Of Symfony User Bundle - FOSUserBundle - Parte I - Instalación

Friends Of Symfony User Bundle

1.- Instalación:

En el archivo composer.json

nano composer.json

Mensajes de confirmación (Flash messages) Bootstrap 3 en Symfony2

Nuestros formularios funcionan, lo que le falta es el retorno o mensajes de confirmación de las acciones: Crear, Editar, Eliminar; para que el usuario tenga la certeza de que su acción ha sido ejecutada satisfactoriamente.

Para esto Symfony tiene "Flash bag" (antes "Flash message"), y Bootstrap tiene alerts, lo implementaremos en 2 pasos

1.- Agregar el flashbag a los controladores createAction, updateAction y deleteAction siempre después de:

$em->flush();

createAction:

$this->get('session')->getFlashBag()->set(
    'success',
    array(
        'title' => 'Nuevo!',
        'message' => 'Cliente creado con éxito.'
    )
);

updateAction

$this->get('session')->getFlashBag()->set(
    'success',
    array(
        'title' => 'Editado!',
        'message' => 'Cliente actualizado satisfactoriamente.'
    )
);

deleteAction

$this->get('session')->getFlashBag()->set(
    'success',
    array(
        'title' => 'Eliminado!',
        'message' => 'Cliente removido.'
    )
);

2.- Agregar en el layout al comienzo del body:

{% block body -%}
{# aquí va el siguiente código #}

Si hay flash entonces lo itera y muestra:

nano src/Petramas/MainBundle/Resources/views/layout.html.twig

{% for type, flashMessage in app.session.flashbag.all() %}
    <div class="alert alert-{{ type }} fade in">
        <button class="close" data-dismiss="alert" type="button">×</button>
        {% if flashMessage.title is defined %}
        <strong>{{ flashMessage.title }}</strong>
        {{ flashMessage.message }}
        {% else %}
        {{ type }}
        {% endif %}
    </div>
{% endfor %}

Estilos en botones submit de CRUD

Si han seguido todos los pasos, entonces se darán cuenta que los botones para crear editar y eliminar se encuentran sin estilos. Ésto es debido a que el botón se crea en el controlador con todo el formulario (métodos: createCreateForm, createEditForm, createDeleteForm). Ésto es nuevo desde Symfony 2.3.

nano src/Petramas/MainBundle/Controller/ClienteController.php

Confirmación en Bootstrap 3

Para eliminar un registro sólo hace falta hacer click sobre el botón eliminar, pero, mejor si le preguntamos al usuario si esta seguro de eliminar ese registro, para ello vamos a hacer una modal con un botón para confirmar la eliminación del registro.

Para ello agregamos en nuestro archivo scripts.js:

nano src/Petramas/MainBundle/Resources/js/scripts.js

Maquetación con Bootstrap 3 - show.html.twig - Parte V

Ésta es la última plantilla por defecto creada cuando generamos el CRUD automáticamente:

Maquetación con Bootstrap 3 - edit.html.twig - Parte IV

Esta plantilla es exáctamente igual que new.html.twig, sólo que en lugar de "form." es "edit_form." y en lugar de "(form" es "(edit_form"

Maquetación con Bootstrap 3 - new.html.twig - Parte III

Nuestra plantilla para editar registros se ve así:

{% extends '::base.html.twig' %}

{% block body -%}
    <h1>Cliente creation</h1>

    {{ form(form) }}

        <ul class="record_actions">
    <li>
        <a href="{{ path('cliente') }}">
            Back to the list
        </a>
    </li>
</ul>
{% endblock %}

Maquetación con Bootstrap 3 - index.html.twig - Parte II

Para que la ruta a la que se hace click este siempre debajo del menú superior, se debe modificar la plantilla destino del siguiente modo:

nano src/Petramas/MainBundle/Resources/views/cliente/index.html.twig

Maquetación con Bootstrap 3 - layout.html.twig - Parte I

Editamos el layout

nano src/Petramas/MainBundle/Resources/views/layout.html.twig

Implementar Twitter Bootstrap 3 Estable en Symfony

Editar el archivo base.html.twig

nano app/Resources/views/base.html.twig

este archivo se ve así:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>{% block title %}Welcome!{% endblock %}</title>
        {% block stylesheets %}{% endblock %}
        <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
    </head>
    <body>
        {% block body %}{% endblock %}
        {% block javascripts %}{% endblock %}
    </body>
</html>

lo que necesitamos es que se vea así:

Twitter Bootstrap 3 Estable - Instalación

1.- Clonar el nuevo repositorio de github

git clone https://github.com/twbs/bootstrap.git
cd bootstrap

Comandos de consola personalizados

Hay 3 acciones muy empleadas a la hora de desarrollar en Symfony.

1.- Actualizar la base de datos
2.- Actualizar el código en Desarrollo (local)
3.- Actualizar el código en Producción

Para que estas tareas sean mucho más sencillas Symfony viene con comandos de consola muy prácticos, que ejecutan procesos y nos facilitan la tarea. Pero siempre se tienen que ejecuta en forma secuencial, demandando memorizar el flujo y ejecutarlo cada vez que lo necesitemos.

Para esto vamos a crear 3 comandos de consola personalizados que ejecuten en forma secuencial las tareas a realizar.

DoctrineFixturesBundle

En el archivo composer.json:

nano composer.json

agregar debajo de "require":

"doctrine/doctrine-fixtures-bundle": "dev-master"

Generar CRUD de las entidades

joebuntu@casa-desktop:~/NetBeansProjects/petramas$ php app/console doctrine:generate:crud<ENTER>

                                          
  Welcome to the Doctrine2 crud generator 
                                          

This command helps you generate CRUD controllers and templates.

Relación OneToMany (Uno a muchos) en Doctrine2 usando anotaciones

Digamos que tenemos un cliente que hará muchos pedidos, entonces en nuestra entidad Cliente:

// src/Petramas/MainBundle/Entity/Cliente.php

// ...
use Doctrine\Common\Collections\ArrayCollection;

class Cliente
{
    // ...

    /**
     * @ORM\OneToMany(targetEntity="Pedido", mappedBy="cliente")
     */
    protected $pedidos;

    public function __construct()
    {
        $this->pedidos = new ArrayCollection();
    }
}

Creación de Entidades

joebuntu@casa-desktop:~/NetBeansProjects/petramas$ php app/console doctrine:generate:entity<ENTER>

                                            
  Welcome to the Doctrine2 entity generator 
                                            

This command helps you generate Doctrine2 entities.

MustacheJS

1.- Clonar repositorio

git clone https://github.com/janl/mustache.js.git
cd mustache.js

Twitter Bootstrap 3 WIP - Glyphicons

1.- Clonar el repositorio Glyphicons, separado de Bootstrap 3

git clone https://github.com/twbs/bootstrap-glyphicons
cd bootstrap-glyphicons

Twitter Bootstrap 3 Estable - Documentación

1.- Instalar Ruby

sudo apt-get install ruby1.9.1-dev

Twitter Bootstrap 3 WIP - Instalación

Para instalar la última versión estable de Bootstrap 3 sigue este tutorial:

Twitter Bootstrap 3 Estable Instalación

Primer bundle

Se creará un bundle para cada función desacoplada del sistema para esto se comenzará con un bundle llamado MainBundle en el que irán todos los atributos comunes el sistema, luego se agregarán BlogBundle, ShoppingBundle, etc. que le darán funciones extendidas al sistema.

Para crear el primer bundle se ejecuta el comando:

php app/console generate:bundle

Configurando Symfony

Configurando el entorno de desarrollo

Al acceder a la página:

http://local.petramas.com/config.php

Git

Configurando git:

git config --global user.name "Joe Robles" 

GitHub

Generando la llave ssh:

ssh-keygen -t rsa -C "joe.robles.pdj@gmail.com"

Virtual host

Agregando host:

nano /etc/hosts

agregar línea:

127.0.0.1    local.petramas.com

Instalación

Instalando composer usando la línea de comandos en Ubuntu:

cd NetBeansProjects
curl -sS https://getcomposer.org/installer | php

Bienvenidos

Ésta es una breve introducción a Symfony