manual desarrollo extensiones typo3

“Desarrollo de Extensiones Typo3”

Víctor Aravena

Centro de Estudio de Ingeniería de Software, Laboratorio OpenSystem. - Distribución Licencia Creative Common2

Víctor Aravena Díaz, [email protected];

Jorge Colipe, [email protected]

Ronald Morales, [email protected]

Tabla de Contenidos.

1. DESARROLLO DE EXTENSIONES. ................................................................... 3

1.1 KICKSTARTER. ....................................................................................... 3

1.2 DESARROLLO DE EXTENSIÓN BÁSICA. ........................................................... 4

2. ESTANDAR DE DESARROLLO EXTENSIONES. ....................................................12

2.1 MODELO VISTA CONTROLADOR (MVC). ........................................................12

3. ESTÁNDAR DE DESARROLLO DE EXTENSIONES HECHAS EN TYPO3. ........................13

4. IMPLEMENTACION FORMULARIO APLICANDO MVC. ............................................20

4.1 CONTROLADOR.....................................................................................20

4.2 MODELO. ............................................................................................24

4.3 VISTA. ................................................................................................25

4.4 IMPLEMENTACIÓN. .................................................................................26

5. CONSIDERACIONES GENERALES. ..................................................................26

6. ANEXO A. .............................................................................................28

6.1 MODIFICANDO EL EJEMPLO. .....................................................................28

7. ANEXO B. .............................................................................................45

7.1. MOSTRAR DATOS. .................................................................................45




Ronald Morales, [email protected] www.lazos.cl

1. DESARROLLO DE EXTENSIONES.

1.1 Kickstarter.

Typo3 posee la extensión KickStarter que nos permite crear nuevas extensiones y editarlas una vez que éstas fueron creadas. A partir de la versión 4.6 de Typo3, dicha extensión debe ser instalada (revisar manual básico de typo3, instalación de extensiones). Una vez que tenemos instalada la extensión, nos vamos al módulo Tools>Ext Manager>Menu y seleccionamos “Make new extensión”.

En la pantalla desplegada tenemos el marco de trabajo para el desarrollo de extensiones. Si hacemos click en el signo más podremos ir viendo las distintas opciones de configuración que tenemos para la nueva extensión. En “Enter extensión key”, debemos poner un identificador, el cual será único para cada extensión.





1.2 Desarrollo de extensión básica.

Debemos ir al módulo Tools>Ext Manager>Menu y seleccionamos “Make new extensión”. Lo primero que haremos será darle el key identificador de nuestra extensión, que será “lz_extensionejemplo”, en el nombre de nuestra extensión, el prefijo “lz” corresponde al estándar de desarrollo de la empresa Lazos. Importante recordar que dos extensiones no podrán tener el mismo nombre.

En información general tendremos la siguiente configuración. Hacemos click en Update y los cambios son guardados.





En “New Database Tables” damos el nombre a la tabla que será creada en nuestra base de datos y además crearemos dos campos: nombre y apellido, que serán de tipo “text area”.

Para crear los campos tenemos que ir al final de la pantalla, darle el nombre al campo, el tipo y hacemos click en “Update”, automáticamente Typo3 nos dará la opción de crear otro campo, nuevamente le damos el nombre del campo, el tipo y hacemos click en “Update”. Por cada campo que se quiera crear se deben seguir los pasos anteriores.





En “Frontend Plugins”, asignamos el nombre que se mostrará en la lista de Plugins cuando se inserte nuestra extensión como Plugins de una página. Hacemos click en “Update” y los cambios son guardados.

En “Services” le damos el título “mvc” (que corresponde a nuestro Modelo Vista Controlador). Con ello se crea la carpeta “sv1” de la extensión. Con los servicios, podemos extender las funcionalidades de las extensiones, permitiendo desarrollar un código más robusto implementando el patrón de diseño MVC. Guardamos los cambios haciendo click en “Update”.

Una vez que tenemos todos los parámetros de configuración listos, hacemos click en “View result” y finalmente hacemos click en “WRITE”.





Aceptamos el mensaje y nuestra extensión ha sido creada con éxito.





Para instalar la extensión, hacemos click en “Install extensión”. La pantalla desplegada nos muestra los cambios que se harán en la base de datos. Hacemos click en “Make updates” y la extensión ha sido instalada.





Si vamos a Tool>Ext Manager>Menu>Loaded extensions, veremos la extensión.





2. ESTANDAR DE DESARROLLO EXTENSIONES.

2.1 Modelo vista controlador (MVC).

Modelo Vista Controlador (MVC) es un patrón de arquitectura de software que separa los datos de una aplicación, la interfaz de usuario, y la lógica de control en tres componentes distintos. El patrón MVC se ve frecuentemente en aplicaciones web, donde la vista es la página HTML y el código que provee de datos dinámicos a la página; el modelo es el Sistema de Gestión de Base de Datos y la Lógica de negocio; y el controlador es el responsable de recibir los eventos de entrada desde la vista.

Modelo: Esta es la representación específica de la información con la cual el sistema opera. La lógica de datos asegura la integridad de éstos y permite derivar nuevos datos; por ejemplo, no permitiendo comprar un número de unidades negativo, calculando si hoy es el cumpleaños del usuario o los totales, impuestos o importes en un carrito de la compra.

Vista: Este presenta el modelo en un formato adecuado para interactuar, usualmente con la interfaz de usuario.

Controlador: Este responde a eventos, usualmente acciones del usuario e invoca cambios en el modelo y probablemente en la vista.

Muchos sistemas informáticos utilizan un Sistema de Gestión de Base de Datos para gestionar los datos. En MVC corresponde al modelo.

Aunque se pueden encontrar diferentes implementaciones de MVC, el flujo que sigue el control generalmente es el siguiente:

1. El usuario interactúa con la interfaz de usuario de alguna forma (por ejemplo, el usuario pulsa un botón, enlace, etc.)

2. El controlador recibe (por parte de los objetos de la interfaz-vista) la notificación de la acción solicitada por el usuario. El controlador gestiona el evento que llega, frecuentemente a través de un gestor de eventos (handler) o callback.

3. El controlador accede al modelo, actualizándolo, posiblemente modificándolo de forma adecuada a la acción solicitada por el usuario (por ejemplo, el controlador actualiza el carro de la compra del usuario). Los controladores complejos están a menudo estructurados usando un patrón de comando que encapsula las acciones y simplifica su extensión.

4. El controlador delega a los objetos de la vista la tarea de desplegar la interfaz de usuario. La vista obtiene sus datos del modelo para generar la interfaz apropiada para el usuario donde se refleja los cambios en el modelo (por ejemplo, produce un listado del contenido del carro de la compra). El modelo no debe tener conocimiento directo sobre la vista. Sin embargo, el patrón de observador puede ser utilizado para proveer cierta dirección entre el modelo y la vista, permitiendo al modelo notificar a los interesados de cualquier cambio. Un objeto vista puede registrarse con el modelo y esperar a los cambios, pero aun así el modelo en sí mismo sigue sin saber nada de la vista. El controlador no pasa objetos de dominio (el modelo) a la vista aunque puede dar la orden a la vista para que se actualice. Nota: En algunas implementaciones la vista no tiene acceso directo al modelo, dejando que el controlador envíe los datos del modelo a la vista.

5. La interfaz de usuario espera nuevas interacciones del usuario, comenzando el ciclo nuevamente.

Fuente: http://es.wikipedia.org/wiki/Modelo_Vista_Controlador.

http://es.wikipedia.org/wiki/Modelo_Vista_Controlador





3. ESTÁNDAR DE DESARROLLO DE EXTENSIONES HECHAS EN TYPO3.

Para el desarrollo de las extensiones se recomienda trabajar con la herramienta “EasyEclpipse for PHP”, la cual se puede descargar de la página oficial del proyecto, http://www.easyeclipse.org. El Workspace del “EasyEcplise for PHP” debe ser la carpeta “typo3conf” que está dentro de la carpeta de “Typo3” (en mi caso “C:\TYPO3_xx\htdocs\Dummy\typo3conf\”). Creamos un proyecto PHP de nombre “ext”. Automáticamente se cargaran todos las extensiones instalas.

http://www.easyeclipse.org/





Según el patrón MVC se deben crear cuatro carpetas dentro de la carpeta “sv1” (que se crea por defecto al crear una extensión). Las carpetas son: “Modelo”, “Vista”, “Controlador” y “Otros”.

Al momento de crear la extensión se añadió un Plugins a ésta, el método main de la clase “class.tx_lzextensionejemplo_pi1.php” que se encuentra dentro de la carpeta “pi1” (plugins 1). El código del archivo correspondiente a la función debe ser reemplazado por el que se muestra a continuación. El código está en la siguiente página.





function main($content,$conf) { $this->conf=$conf; $this->pi_setPiVarDefaults(); $this->pi_loadLL(); global $TYPO3_CONF_VARS; $parameters = unserialize($TYPO3_CONF_VARS['EXT']['extConf'][$this->extKey]); require(t3lib_extMgm::extPath($this->extKey)."sv1/Controlador/Controlador.class.php"); $oControlador = new Controlador($this,$version="v00",$confLocal = $conf,$confGlobal = $parameters ,$confFlex = null,"CONTENT_EXTENSION"); /* * Se carga la configuracion inicial */ $oControlador->actionEvent($_POST); $content.= $oControlador->getHtml($_GET); /*$GLOBALS['TSFE']->additionalHeaderData[$this->prefixId] = $oControlador->getHeader(false,true);*/ $content = '<form name="frmsolicitudes" method="post" id="frmsolicitudes" action="">' . '<div id="div_menu"> '.$content.' </div> </form>'; return $this->pi_wrapInBaseClass($content); }

La carpeta controlador se compone de:





La clase “Controlador.class.php” se compone de los siguientes métodos. Los cuales pueden ser diferentes de acuerdo a la clase.





La clase “Xajax_Controlador.class.php” se compone de los siguientes métodos, los cuales pueden ser diferentes dependiendo de la extensión.

La carpeta “Vista” está compuesta por los siguientes archivos:

El html, css y js deben cumplir la siguiente regla:

• Deben estar validados con W3C html 4.01. • Deben estar validados los estilos según la W3C. • Deben estar validados con TAW A (Accesibilidad uno). • Los estilos debe estar agrupados en clases. • En el JavaScript, al traer el valor de un elemento este deberá ser llamado por getelementById. • En caso de ser necesario crear dos hojas de estilo, una para pantalla y otra para impresión. • La estructura del sitio en html debe estar contenida en tablas. • Deben ser probados en el navegador Firefox, Opera e Internet Explorer.

Las plantillas html deben tener la siguiente estructura:

<html> <head> <title></title> <meta name="GENERATOR" content="Quanta Plus"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link rel="stylesheet" type="text/css" href="Controlador.css">

<script type='text/javascript' src='Controlador.js'> </script>

</head> <body>

  ############################## … … ESTRUCTURA Del html de la extension …  

</body> </html>

Las subpartes o pantallas del formulario se deben marcar en la plantilla html con el siguiente estándar.



CONTENIDO 

Para el detalle del contenido.



CONTENIDO ITERACTIVO. ....





La carpeta “Modelo” se compone sólo de la clase que contendrá los componentes del Modelo de acuerdo al MVC. Para nuestro ejemplo esta se llama “SqlModelo.class.php”.

Por cada conexión que se realice a la base datos se debe agregar un método en la clase “SqlModelo.class.php” que deberá retornar un arreglo de datos. A continuación se da un ejemplo.

function getDatosFotoPortada($idFoto = NULL){ $where_clause = ' deleted!="1" AND hidden !="1"'; $sql = 'SELECT * FROM tx_lzmantenedorgaleriaalbum_foto WHERE uid="'.$idFoto.'" AND '.$where_clause; $res = $GLOBALS['TYPO3_DB']->sql_query($sql); $line = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($res); $arrayDatosFoto['ancho'] = $line['ancho_foto']; $arrayDatosFoto['alto'] = $line['alto_foto']; return $arrayDatosFoto; }





La carpeta Otros contiene todas las clases adicionales que ocuparemos en nuestro desarrollo. Por ejemplo la clase forms es la clase que a través de métodos genera elementos formulario html (Combo Box, Tex tarea).

4. IMPLEMENTACION FORMULARIO APLICANDO MVC.

A continuación, se implementará un formulario que permite la inserción de dos campos en la base de datos (nombre y apellido), campos que fueron creados como ejemplo cuando se creó la extensión lz_extensionejemplo.

4.1 Controlador.

En la carpeta sv1Controlador (del MVC) crearemos la clase Controlador.class.php que tendrá el código que viene a continuación.

- Esta clase tiene la función que carga los valores iniciales del formulario (initForm), la función que carga el html del formulario (getHtml), la función que controla los eventos (actionEvent), el controlador correspondiente a la clase y la declaración de las variables respectivas.

<?php class Controlador { /** * @var object Contiene una instancia a la clase que almacena las consultas */ var $oSql; /** * @var object Contiene un instancia al plugins para herender las propiedades */ var $oPlugins;





/** * @var object Contiene un instancia al plugins para herender las propiedades */ var $oForm; /** * @var string Prefijo del directorio del servicio */ var $sv; /** * @var array Contiene la configuracion Local */ var $confLocal; /** * @var array Contiene la configuracion Global */ var $confGlobal; /** * @var array Contiene contenido extra al content */ var $addContent; /** * @var array Contiene la seccion por defecto del template */ var $posSeccionTemplate; /** * Constructor de la clases */ function Controlador($oPlugins,$version,$confLocal = null,$confGlobal = null,$confFlex = null, $posSeccionTemplate = null) { /* * Asigno los valores a las variables basica del sistema */ $this->sv = "sv1/"; $this->oPlugins = $oPlugins; $this->sRuta=t3lib_extMgm::siteRelPath($this->oPlugins->extKey).$this->sv; $this->addHeader= ""; $this->addContent = ""; /* * Asigno las variables de configuracion */ $this->confGlobal = $confGlobal; $this->confLocal = $confLocal; $this->confFlex = $confFlex; /* * Asigno los atributos que son instanciados */ require_once($this->sRuta.'Modelo/SqlModelo.class.php');





$this->oSql = new SqlModelo_Convenio_Iniciar($this->oPlugins->cObj->data['pages']); $this->posSeccionTemplate = $posSeccionTemplate; } /** * Metodo que carga los valores iniciales del formulario */ function initForm(){ } /** * Obtiene el html de la extension */ function getHtml($data=null) { $this->initForm(); $subpartArray = array(); $markerArray = array(); /** * Template Traspasar */ if($this->template == ""){ $this->templateHTML = 'EXT:'.$this->oPlugins->extKey.'/'.$this->sv.'/Vista/Controlador.html'; } else{ $this->templateHTML = $this->confLocal["template"]; } /* * Obtiene el Template */ $this->templateCode = $this->oPlugins->cObj->fileResource($this->templateHTML); switch ($this->posSeccionTemplate){ case "CONTENT_EXTENSION": $template['template'] = $this->oPlugins->cObj->getSubpart($this->templateCode,'###'.$this->posSeccionTemplate.'###'); //$subpartArray['###CONTENT_SUBPART###']=$this->oSql->getNombreFeUser($GLOBALS["TSFE"]->fe_user->user["uid"]); break; case "CONTENT_INGRESADO": $template['template'] = $this->oPlugins->cObj->getSubpart($this->templateCode,'###'.$this->posSeccionTemplate.'###'); break; } $content = $this->oPlugins->cObj->substituteMarkerArrayCached($template['template'],





$markerArray, $subpartArray); $content.=$this->addContent; return $content; } /** * Metodo que controla los Eventos * @param $_POST $_POST Contiene las variables del pasada desde el formulario */ function actionEvent ($_POST) { if ($_POST ['ingresar']){ $nombre=$_POST["nombre"]; $apellido=$_POST["apellido"]; $valorInset = $this->oSql->insertarUsuario($nombre,$apellido); if ($valorInset) $this->posSeccionTemplate= 'CONTENT_INGRESADO'; } } } ?>





4.2 Modelo.

En la carpeta sv1Modelo (del MVC) crearemos la clase SqlModelo.class.php, que contendrá el constructor de la clase y la función con la cual insertaremos el registro en la base de datos. Para la implementación de nuestro formulario el código es el siguiente (recuerde cambiar el nombre de la tabla por la que especificó al momento de crear el plugin.

<?php class SqlModelo_Convenio_Iniciar { var $pid; /** * Constructor de la clases */ function SqlModelo_Convenio_Iniciar($pid) { $this->pid = $pid; } function insertarUsuario($nombre,$apellido){ $sql = 'insert into tx_lzextensionprueba_extprueba (campo1, campo2) values("'.$nombre.'","'.$apellido.'")'; $resultset = $GLOBALS['TYPO3_DB']->sql_query($sql); $line = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($resultset); return $resultset; } } ?>

4.3 Vista.

En la carpeta sv1Vista (del MVC) crearemos la clase Controlador.html, que contendrá todo el código html que forma nuestro formulario. El código necesario para la implementación de nuestro formulario es el siguiente.

   <table width="600" border="0" cellpadding="0" cellspacing="0" align="center" summary="" class="espacioIzquierdo"> <td>Nombre</td> <td> <input type="text" name="nombre" id="nombre" /> </td> </tr> <tr> <td>Apellido</td> <td> <input type="text" name="apellido" id="apellido" /> </td> </tr> <tr> <td></td> <td> <input type="submit" name="ingresar" id="ingresar" value="Ingresar" /> </td> </tr> </table> <input type="hidden" name="que" id="que">   <p>correcto</p>





4.4 Implementación.

Finalmente creamos una página de prueba donde insertaremos como contenido el plugins de la extensión que hemos creado, y ya podemos ver nuestro formulario funcionando.

5. CONSIDERACIONES GENERALES.

El modelo debe poseer las tres capas de desarrollo.

No se aceptan procedimientos almacenados.

El motor de base de datos por defecto es MySQL.

Para conectarse al modelo de datos se deben utilizar las API de Typo3.

El código debe estar documentado según el formato phpDoc.

Las variables deben tener nombres significativos, y su prefijo debe ser el tipo que es.

Tipo de dato Prefijo

Entero i

Flotante f

Array a

Double d

String s

objeto o

Se recomienda utilizar el ide de Ecplise para php.

http://www.easyeclipse.org/site/distributions/php.html

El nombre de la extensión debe mantener el siguiente formato.

o <identificación del proyecto>_<identificación del módulo>_<identificación

funcionalidad>

Ejemplo:

ilz_multi_galfoto

red_multi_albunfoto

El nombre del plugins debe tener el siguiente formato:

o <<identificación del proyecto>_<identificación del módulo>_<identificación

funcionalidad>

Ejemplo:

ilz_multi_galfoto

red_multi_albunfoto

http://www.easyeclipse.org/site/distributions/php.html





Se debe utilizar la siguiente vía de la configuración (mas información en

http://wiki.typo3.org/index.php/Main_Page )

o GLOBAL: En el archivo ext_conf_template.txt

o Local: en el archivo ext_typoscript_setup.txt

o XML: Flexform.

Se debe disponer de una carpeta de servicio.

Se debe crear una extensión lz_<sistema>_versión_core que contenga el modelo de datos

creado según el estándar de Typo3.

Mayor información en http://typo3.org/documentation/document-library/core-

documentation/doc_core_api/current/view/.

Mayor información en http://wiki.typo3.org/index.php/Overview_Developer_Manuals.

http://typo3.org/documentation/document-library/core-documentation/doc_core_api/current/view/

http://typo3.org/documentation/document-library/core-documentation/doc_core_api/current/view/

http://wiki.typo3.org/index.php/Overview_Developer_Manuals





6. ANEXO A.

6.1 Modificando el ejemplo.

Ahora que ya sabemos cómo crear un formulario, modificaremos nuestro ejemplo agregándole dos campos más, mail y cuidad para completar el registro.

Para agregar los campos nos vamos a “Ext ManagerInstall extensions” y buscamos nuestra extensión. Para ello podemos utilizar el buscador o lo podemos hacer directamente en la lista de extensión que tenemos instaladas.

Hacemos click en el nombre de la extensión y seleccionamos “Edit in Kickstarter” en la combobox del esquina superior derecha.

A continuación crearemos una nueva tabla en la base de datos que contendrá las ciudades.

Para ello debemos hacer click en el símbolo más del ítem “New Database Tables”.





Le damos en nombre y el título a la nueva tabla.

Nos vamos al final de la página y creamos lo campos que tendrá la tabla.

Para ello le damos en nombre del campo, el título de este y el tipo de dato. Hacemos click en update.





Para agregar el email y la ciudad a la tabla que donde anteriormente guardábamos solo el nombre y el apellido debemos hacer click en “Extension Ejemplo” del ítem “New Database Tables”.

En la pantalla desplegada, debemos ir al final de la página y en “NEW FIELD” agregar el nombre del nuevo campo, el title de este y el tipo de dato. Para nuestro ejemplo los parámetros son los siguientes.





Hacemos click en “update” y podemos ver nuestro nuevo campo creado.

Ahora debemos crear el campo ciudad, el cual apuntara al campo código_ciudad de la tabla que hemos creado anteriormente.

Importante: el tipo de dato para este campo es Database relation, lo cual nos permite indicar a que tabla apunta nuestro campo.





Hacemos click en update y debemos indicar a que tabla apunta el campo código_ciudad que hemos creado.





Ahora debemos guardar los cambios en nuestra extensión.

Para ello hacemos click en Update, y luego en View Result.





En la pantalla desplegada hacemos click en “Update result” y luego en “WRITE”.

Aceptamos el mensaje





Vemos los cambios que se realizaran y hacemos click en “Make Update”.

Ahora crearemos una carpeta en nuestro sitio que permitirá ver e ingresar nuevos registros a la tabla donde tenemos almacenadas las ciudades.

Para ello vamos al menú de Typo3, “WebPage”, hacemos click con el botón secundario en New Typo3 Site (para nuestro ejemplo) y seleccionamos New.

A continuación hacemos click en “Page (inside)”.





En “Type” seleccionamos “SysFolder” y en Title le damos el nombre a la carpeta.

A continuación, nos vamos al menú “List”, pinchamos en la carpeta que hemos creado recién.

Debemos hacemos click en “Create New Record”.





Buscamos el título que le hemos dado a nuestra tabla ciudades. Hacemos click y podremos ingresar una nueva ciudad.





Guardamos los cambios, la nueva ciudad ha sido guardada.

Ahora cada vez que queramos ingresar una nueva ciudad solo debemos hacer click el icono de “New Record” como muestra la siguiente imagen.





A continuación, comenzaremos a modificar el código de nuestra extensión.

Primero que todo dentro de la carpeta sv1 crearemos una nueva carpeta, que la llamaremos Otros, carpeta que tendrá las clases que prestan funcionalidades adicionales al sistema.

Dentro de la carpeta crearemos la clase Form.class.php, que tendrá la función que permite llenar la combobox, código que se muestra a continuación.

<?php /** * Clase que permite Insertar Campo de Formularios * * Uso: * $frm= new DoForm(); * @package res.formulario * @author Victor Aravena [email protected] * @version 1.1 * @copyright Opensource */ class DoForm { /** * Muestra un select pasando una arreglo unidemensional o bidimensional * Usage: * $frm->select( array(array("1","v1"), array("2","v2"),array("3","v3"), array("4","v4")),"test","id_test", 4 ,""); * @param string|integer $array Arreglo bidemensional o unidemensional con los valores y la descripcion * @param string $nombre Nombre del Select * @param string $id Nombre id del select * @param string|integer $defecto Valor por defecto * @param string $extraTag Configuracion extra * @return string Codigo html generado del select */ function select($array,$nombre,$id,$defecto,$extraTag) { $i=0; $x=count($array); $salida='<select name="'.$nombre.'" id="'.$id.'" '.$extraTag.'>'; //$salida.="<option value='0' selected>"; //$salida.="----.-----</option>"; if ($x != "0"){ while ($i<$x){ $ck=''; if($array[$i][1]) {





if($array[$i][1]==$defecto) { $ck=' selected'; } } else { if($array[$i][0]==$defecto) { $ck=' selected'; } } if($array[$i][0]==$defecto){ $ck=' selected'; } $salida.="<option value='".$array[$i][0]."' $ck>"; if($array[$i][1]) { $salida.=$array[$i][1]."</option>"; } else { $salida.=$array[$i][0]."</option>"; } $i=$i+1; }//fin while } $salida=$salida."</select>"; return $salida; } } ?>

En nuestra clase Controlador.class.php que se encuentra en sv1Controlador, haremos las siguientes modificaciones.

Debemos declarar la variable extKey.

El controlador de la clase debe recibir como parámetro aConfigExt, además de los que ya recibe.





Agregamos la asignación del valor de nuestra nueva variable en nuestro controlador.

$this->extKey=$aConfigExt['extKey'];

En el constructor de la clase Controlador.class.php debemos agregar el parámetro que acabamos de declarar ($aConfigExt) en el método constructor. El código final es el siguiente:

function Controlador($aConfigExt, $oPlugins,$version,$confLocal = null,$confGlobal = null,$confFlex = null, $posSeccionTemplate = null)

Creamos la instancia a la clase Form.class.php.

require_once(t3lib_extMgm::extPath($this->extKey).'/sv1/Otros/Forms.class.php'); $this->oForm = new DoForm();

En el case CONTENT_EXTENSION de la función getHtml debemos agregar el código que nos permite llenar la combobox.

$markerArray['###CIUDAD###'] = $this->oForm->select($this->oSql->ciudad(), "codigo_ciudad", "codigo_ciudad",' ', '');

Este código debe copiarse después del siguiente código:

case "CONTENT_EXTENSION": $template['template'] = $this->oPlugins->cObj->getSubpart($this->templateCode,'###'.$this->posSeccionTemplate.'###');

En la función actionEvent, debemos obtener los valores de nuestros nuevos campos y pasárselos a la función que permite insertar el nuevo registro en la base de datos.

function actionEvent ($_POST) { if ($_POST ['ingresar']){ $nombre=$_POST["nombre"]; $apellido=$_POST["apellido"]; $email=$_POST["email"]; $codigociudad=$_POST["codigo_ciudad"]; $valorInset = $this->oSql->insertarUsuario($nombre,$apellido,$email,$codigociudad); if ($valorInset) { $this->posSeccionTemplate= 'CONTENT_INGRESADO'; } } }





En la carpeta sv1Modelo (del MVC) debemos modificar la clase SqlModelo.class.php. Para la implementación de nuestro formulario el código es el siguiente (recuerde cambiar el nombre de la tabla por la que especificó al momento de crear el plugin.

<?php class SqlModelo_Convenio_Iniciar { var $pid; /** * Constructor de la clases */ function SqlModelo_Convenio_Iniciar($pid) { $this->pid = $pid; } function insertarUsuario($nombre,$apellido,$email,$codigociudad){ $sql = 'insert into tx_lzextensionprueba_extprueba (campo1, campo2 , campo3, campo4) values("'.$nombre.'","'.$apellido.'","'.$ email.'","'.$ codigociudad.'")'; $resultset = $GLOBALS['TYPO3_DB']->sql_query($sql); $line = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($resultset); return $resultset; } } ?>

En la clase class.tx_lzextensionejemplo_pi1.php de la carpeta pi1 debemos realizar las siguientes modificaciones.

En la función main debemos agregar la siguiente línea de código.

$aConfigFlexForm['extKey']=$this->extKey;

Se debe editar la instancia al objeto Controlador del archivo class.tx_lzextensionejemplo_pi1.php. El código final debe quedar de la siguiente forma:

$oControlador = new Controlador($aConfigFlexForm, $this,$version="v00",$confLocal = $conf,$confGlobal = $parameters ,$confFlex = null,"CONTENT_EXTENSION");





En la clase SqlModelo.class.php debemos modificar la función que ingresar el registro a la base de datos y agregar la función que nos retorna el arreglo con los nombres de las ciudades. El código es el siguiente.

function ciudad(){

$sql = 'SELECT uid, nombre_ciudad FROM tx_lzextensionejemplo_ciudad';

$res = $GLOBALS['TYPO3_DB']->sql_query($sql);

$arrayDatos[0][0] = 0;

$arrayDatos[0][1] = "------ Seleccione Ciudad ------";

$contador = 1;

while ($lineFormulario = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($res)) {

$arrayDatos[$contador][0] = $lineFormulario["uid"];

$arrayDatos[$contador][1] = $lineFormulario["nombre_ciudad"];

$contador++;

}

$GLOBALS['TYPO3_DB']->sql_free_result($res);

return $arrayDatos;

}

}

?>

También debemos modificar la función insertarUsuario y agregar los nuevos parámetros correspondientes a “email” y “ciudad”:

function insertarUsuario($nombre,$apellido, $email, $ciudad){

$sql = 'insert into tx_lzextensionejemplo_extensionejemplo

(nombre, apellido, email, codigo_ciudad) ' .

'values("'.$nombre.'","'.$apellido.'","'.$email.'","'.$ciudad.'")';

$resultset = $GLOBALS['TYPO3_DB']->sql_query($sql);

$line = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($resultset);

return $resultset;

}





En la clase Controlador.html de la carpeta sv1Vista, agregaremos el código que permite mostrar los dos nuevos campos de nuestro formulario.

<tr> <td>Email</td> <td> <input type="text" name="email" id="email" /> </td> </tr> <tr> <td> Ciudad </td> <td > <p>###CIUDAD###</p> </td> </tr>

El código anterior se debe copiar antes del botón Ingresar. Debe copiarse ante del siguiente texto:

<tr> <td></td> <td> <input type="submit" name="ingresar" id="ingresar" value="Ingresar" /> </td> </tr>

Si vamos a la página donde tenemos insertado nuestro formulario, y podemos ver este con los cambios realizados.





7. ANEXO B.

7.1. Mostrar datos.

A continuación crearemos una extensión que permita mostrar los datos que hemos insertado en nuestra base de datos.

Para comenzar debemos ir al módulo Tools>Ext Manager>Menu y seleccionar la opción “Make new extensión”. Lo primero que haremos será darle el key identificador de nuestra extensión, que será “lz_exntensionmostrardatos”. Importante recordar que dos extensiones no podrán tener el mismo nombre.

En información general tendremos la siguiente configuración. Hacemos click en Update y los cambios son guardados.





En “Frontend Plugins”, asignamos el nombre que se mostrará en la lista de Plugins cuando se inserte nuestra extensión como Plugins de una página. Hacemos click en “Update” y los cambios son guardados.

En “Services” le damos el título “mvc” (que corresponde a nuestro Modelo Vista Controlador). Con ello se crea la carpeta “sv1” de la extensión. Con los servicios, podemos extender las funcionalidades de las extensiones, permitiendo desarrollar un código más robusto implementando el patrón de diseño MVC. Guardamos los cambios haciendo click en “Update”.

Una vez que tenemos todos los parámetros de configuración listos, hacemos click en “View result” y finalmente hacemos click en “WRITE”.





Aceptamos el mensaje y nuestra extensión ha sido creada con éxito.





Para instalar la extensión, hacemos click en “Install extensión”. La pantalla desplegada nos muestra los cambios que se harán en la base de datos. Hacemos click en “Make updates” y la extensión ha sido instalada.





Si vamos a Tool>Ext Manager>Menu>Loaded extensions, veremos la extensión.

Ahora crearemos el código que permitirá a la nueva extensión, mostrar los datos.

Ingresamos a nuestro EasyEclipse for PHP. Vamos a nuestra extensión y lo primero que haremos será crear las carpetas que las cuales estructuraremos el código de acuerdo al Patrón MVC.





Hacemos click derecho sobre la carpeta sv1, seleccionamos “NewFolder”, le damos el nombre a la carpeta, hacemos click en Finish y así hemos creado nuestra primera carpeta. Para crea la demás carpeta (Vista y Controlador) debemos realizar los mismos pasos.





A continuación, debemos crear las clases que darán las funcionalidades a nuestra extensión.

En la carpeta “sv1Controlador” crearemos la clase Controlador.class.php que permitirá cargar el template y mostrar los datos en pantalla. El código de la clase es el siguiente.

<?php class Controlador { var $oSql; var $oPlugins; var $sv; var $confLocal; var $confGlobal; var $addContent; var $posSeccionTemplate; var $extKey; /** * Constructor de la clases */ function Controlador( $oPlugins,$version,$confLocal = null,$confGlobal = null,$confFlex = null, $posSeccionTemplate = null) { /* * Asigno los valores a las variables basica del sistema */ $this->sv = "sv1/"; $this->oPlugins = $oPlugins; $this->sRuta=t3lib_extMgm::siteRelPath($this->oPlugins->extKey).$this->sv; $this->addHeader= ""; $this->addContent = ""; /* * Asigno las variables de configuracion */ $this->confGlobal = $confGlobal; $this->confLocal = $confLocal; $this->confFlex = $confFlex; /* * Asigno los atributos que son instanciados */ require_once($this->sRuta.'Modelo/SqlModelo.class.php'); $this->oSql = new SqlModelo(); /* * Creacion de Objeto que maneja los formularios */ $this->posSeccionTemplate = $posSeccionTemplate; }





/** * Metodo que carga los valores iniciales del formulario */ function initForm(){ } /** * Obtiene el html de la extension */ function getHtml($data=null) { $this->initForm(); $subpartArray = array(); $markerArray = array(); /** * Template Traspasar */ if($this->template == ""){ $this->templateHTML = 'EXT:'.$this->oPlugins->extKey.'/'.$this->sv.'/Vista/Controlador.html'; } else{ $this->templateHTML = $this->confLocal["template"]; } /* * Obtiene el Template */ $this->templateCode = $this->oPlugins->cObj->fileResource($this->templateHTML); switch ($this->posSeccionTemplate){ case "CONTENT_EXTENSION": $template['template'] = $this->oPlugins->cObj->getSubpart($this->templateCode,'###'.$this->posSeccionTemplate.'###'); $registro = $this->oSql->obtenerRegistros(); for ($i=0;$i<$registro['contador'];$i++){ $template['VER_REGISTROS'] = $this->oPlugins->cObj->getSubpart($this->templateCode,'###VER_REGISTROS###'); $markerArray['###NOMBRE###']= $registro[$i]['nombre']; $markerArray['###APELLIDO###']= $registro[$i]['apellido']; $markerArray['###EMAIL###'] = $registro[$i]['email']; $markerArray['###CIUDAD###']=$registro[$i]['nombre_ciudad']; $contentComentarios .= $this->oPlugins->cObj->substituteMarkerArrayCached($template['VER_REGISTROS'], $markerArray); }





$subpartArray['###VER_REGISTROS###']=$contentComentarios; break; } $content = $this->oPlugins->cObj->substituteMarkerArrayCached($template['template'], $markerArray, $subpartArray); $content.=$this->addContent; return $content; } } ?>

En la carpeta “sv1Modelo” crearemos la clase SqlModelo.class.php que contendrá el sql que retornara un arregle de datos con los registros que tenemos en nuestra base de datos. El código de esta clase es el siguiente.

<?php class SqlModelo { /** * Constructor de la clases */ function SqlModelo() { } function obtenerRegistros(){ $strSQL = "SELECT registro.nombre as nombre, registro.apellido, registro.email, ciudad.nombre_ciudad FROM tx_lzextensionejemplo_extensionejemplo registro, tx_lzextensionejemplo_ciudades ciudad WHERE registro.codigo_ciudad = ciudad.uid ORDER BY registro.nombre "; $resultset = $GLOBALS['TYPO3_DB']->sql_query($strSQL); $arrayRegistros = array(); if(!empty($resultset)){ $iContador = 0; while ($line = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($resultset)) { $arrayRegistros[$iContador]['nombre'] = $line["nombre"]; $arrayRegistros[$iContador]['apellido'] = $line["apellido"]; $arrayRegistros[$iContador]['email'] = $line["email"]; $arrayRegistros[$iContador]['nombre_ciudad']=$line["nombre_ciudad"]; $iContador++; } $arrayRegistros['contador']=$iContador; } else{ $arrayRegistros['contador']= "No hay registros"; } return $arrayRegistros; } } ?>

En la carpeta “sv1Vista” crearemos la clase Controlador.html, clase que contendrá el código que permite visualizar en pantalla los registros y la forma en que estos se mostraran. El código de la clase es el siguiente.

   <table class="tabla_principal" border="0" cellpadding="0" cellspacing="0" width="600px"> <tr> <td> Registros</td> </tr> <tr> <td> Nombre </td> <td > Apellido </td> <td > Email </td> <td> Ciudad </td> </tr>  <tr > <td> ###NOMBRE### </td> <td> ###APELLIDO### </td> <td> ###EMAIL### </td> <td> ###CIUDAD### </td> </tr>  </table>





Finalmente en la clase class.tx_lzexntensionmostrardatos_pi1.php de la carpeta pi1, agregaremos dentro del método main, la instancia a la clase Controlador.class.php de la carpeta sv1Controlador y llamaremos a la función que permite cargar el template. Las líneas de código son las siguientes.

function main($content,$conf) { $this->conf=$conf; $this->pi_setPiVarDefaults(); $this->pi_loadLL(); global $TYPO3_CONF_VARS; $parameters = unserialize($TYPO3_CONF_VARS['EXT']['extConf'][$this->extKey]); require(t3lib_extMgm::extPath($this->extKey)."sv1/Controlador/Controlador.class.php"); $oControlador = new Controlador($this,$version="v00",$confLocal = $conf,$confGlobal = $parameters ,$confFlex = null,"CONTENT_EXTENSION"); /* * Se carga la configuracion inicial */ $content.= $oControlador->getHtml($_GET); /*$GLOBALS['TSFE']->additionalHeaderData[$this->prefixId] = $oControlador->getHeader(false,true);*/ $content = '<form name="frmsolicitudes" method="post" id="frmsolicitudes" action="">' . '<div id="div_menu"> '.$content.' </div> </form>'; return $this->pi_wrapInBaseClass($content); }

Con esto hemos terminando de darle las funcionalidades a nuestra extensión.





Ahora iremos al backend de Typo3 y crearemos una página en la cual mostraremos los registros, que tendrá como contenido el plugins de nuestra extensión.

Para instalar el plugins en la nueva página debemos ir a al menú “WebPage”, hacemos click en nuestra página y hacemos click en “Create page content”

En la pantalla desplegada vamos a Plugins y hacemos click en la opción “General Plugin”.





En la siguiente pantalla, seleccionamos el combo box Plugin.

Buscamos el nombre del título que le dimos a nuestra extensión (para nuestro ejemplo: Mostrar datos), aceptamos el mensaje y así hemos instalado el plugins de nuestra extensión en la página.

Abrimos nuestro sitio en el navegador, nos vamos a la página que creamos y le instalamos el plugins de nuestra extensión y veremos todos los registros que hemos ingresado.

manual desarrollo extensiones typo3

Technology