Joomla 1.5: desarrollo de componentes

Embed Size (px)

Citation preview

  • 1. 1/125Desarrollo de componentes, mdulos y plugins Joomla 1.5

2. 2/1251. Visin global 3. 3/125El cdigo se estructura en 2 carpetas:back_end y front_end Back_end Joomlaadministrator components com_reviews Front_end Joomla components com_reviews 4. 4/125Qu es eso de el front_end y el back_end? El front_end contiene el cdigo que ejecutan los usuariosque NO son administradores del sitio web El back_end contiene el cdigo que ejecuta eladministrador (o los administradores) del sitio web 5. 5/125Control de flujo En un componente se ejecuta una y otra vez el mismofichero En cada vez se invocan diferentes funciones La controladora gestiona el flujo El modelo gestiona el acceso a datos La vista gestiona la visualizacin en pantalla 6. 6/125Modificar permisos de directorio Debemos modificar los permisos de la carpeta de nuestrositio web para que el propio Joomla pueda escribir dentrode ella Si accedemos en modo administrador Ayuda Permisosde directorio... 7. 7/125 Modificar permisos de directorio Desde la shell, sobre nuestro directorio del sitio webescribimos: sudo chmod -R 777 marudesign/ Y ahora, refrescamos la pgina de permisos: 8. 8/1252. Iniciacin al desarrollo decomponentes 9. 9/125 Estructura del componente Prefijo com_. Si el componente se llama reviews, lascarpetas contenedoras se llamarn com_reviews Dos carpetas contenedoras. Una para el front end y otrapara el back end: componentescom_reviews y administratorcomponentscom_reviews Fichero main. El fichero principal del componente se llamarreviews.php y admin.reviews.php para el backend (El nombre coincide con el nombre delcomponente) Este fichero tiene que estar ubicado justo en la carpeta del componente. 10. 10/125Ejecutar el front end del componente index.php?option=com_ En joomla siempre se ejecuta el fichero index.php En el querystring, la variable option designa qucomponente ejecutar http:joomlaindex.php?option=com_reviews Esto invocar al fichero main del componente, queen nuestro caso escomponentscom_reviewsreviews.php Cualquier cosa que pongamos en este fichero mainse ejecutar 11. 11/125 Seguridad: Evitar invocacin directa Como vemos, joomla hace un routing de la pgina solicita,no escribimos directamente el fichero .php en la barra dedirecciones Cmo evitar que un usuario escriba directamente en labarra de direcciones la ruta de nuestro fichero .php? En la primera lnea debemos escribir este cdigo: De esta manera aseguramos que ha accedido va joomla! 12. 12/125Ejecutar el back end del componente administrator/index.php?option=com_ En joomla siempre se ejecuta el fichero index.php En el querystring, la variable option designa qucomponente ejecutar http:joomlaadministratorindex.php? option=com_reviews Esto invocar al fichero main del componente, queen nuestro caso es administrator componentscom_reviews admin.reviews.php Cualquier cosa que pongamos en este fichero mainse ejecutar 13. 13/125 Registrar el componente Registrar el componente implica agregar una lnea a latabla del sistema jos_components 14. 14/125Creacin de barras de herramientas Una barra de herramientas se divide en dos ficheros: toolbar.reviews.html.php Se encargar de mostrar/dibujar la barra deherramientas en formato HTML toolbar.reviews.phpDecide qu barra de herramientas mostrar, por si tenemos ms de una Por la simple existencia de estos ficheros, joomla asumeque tenemos una barra de herramientas asociada anuestro componente 15. 15/1253. Back-end 16. 16/125 Visin global Creacin de la tabla de datos Creacin del formulario bsico de creacin/edicin deregistros Procesamiento de los datos e insercin en la tabla Listado de los datos Edicin y borrado de datos 17. 17/125 Creacin de la tabla de datos Creamos la tabla en la que vamos a guardar datos En el ejemplo ser jos_reviews, donde se almacenan las opiniones de los restaurantes Se trata simplemente de lanzar un script: CREATE TABLE jos_reviews (... 18. 18/125Creacin de la clase tabla Asociado a la tabla tendremos una clase que maneja losdatos de esa tabla Hereda de JTable El fichero se tiene que llamar review.php porque aloja unanica fila de la tabla Situaremos este fichero bajo la carpeta Tables El nombre de la clase tiene que ser TableReview La clase contiene simplemente cada uno de los camposinicializados a null y exactamente con el mismo nombreque los campos de la tabla Hay que crear el constructor 19. 19/125Clase de la tabla 20. 20/125Formulario de insercin de datos Dos ficheros: admin.reviews.phpLgica del formulario admin.reviews.html.php Visualizacin HTML del formulario 21. 21/125 Formulario de insercin de datos: lgica fichero admin.reviews.php En funcin de la variable $task, que recupera del qs,realiza una accin u otra Para la creacin de nuevos registros, $task = add Carga el modelo: filas y las listas necesarias Invoca a la vista con los valores cargados, en nuestrocaso HTML_reviews::editReview que se aloja en el ficheroadmin.reviews.html.php 22. 22/125Formulario de insercin de datos: lgica 23. 23/125Formulario de insercin de datos: lgica Al final invocamos a la vistapara que muestre el formulario 24. 24/125Procesar los datos: detectar tarea save Desde el formulario de insercin de datos se redirigea: admin.reviews.php option=com_reviews task=save En su switch, debemos invocar a la funcinsaveReviews cuando task=save 25. 25/125Procesar datos: recuperar y guardar datosfuncin saveReview Los datos del nuevo registro llegan desde un formulario Cargamos esos datos en una nueva row Para ello hacemos: Creamos una instancia vaca de row Bindeamos cada uno de sus campos a los valoresque llegan en $_POST CUIDADO: Joomla limpia esos campos de caracteres espreos 26. 26/125Procesar datos: recuperar y guardar datosfuncin saveReview Los datos que contienen HTML, como quicktake y reviewlos cargamos en crudo. Para ello hacemos: Guardamos la fila en base de datos 27. 27/125Procesar datos: recuperar y guardar datosfuncion saveReview Al terminar, redirigimos el navegador: 28. 28/125 Listar todos los registros: visin global admin.reviews.php Capturar el task=showReviews Crear la funcin showReviews(), que ser lalgica de la visualizacin admin.reviews.html.php Crear el formulario de visualizacin bajo lafuncin showReviews() 29. 29/125 Listar todos los registros: capturar task En admin.reviews.php 30. 30/125Listar todos los registros: lgica Recuperamos todos losregistros Los cargamos en $rowsw Invocamos a la vista 31. 31/125 Listar todos los registros: visualizacin Simplemente es una table que rellenamos con un forrecorriendo cada uno de los elementos que hay en $rows 32. 32/125Listar todos los registros: visualizacin 33. 33/125 Editar un registro: visin global 1. En admin.reviews.php capturamos task = edit einvocamos al handler 2. Modificamos la funcin editReview que utilizamos parainsertar para que recupere los datos del registro a editar 34. 34/125Editar un registro: visin global 3. En la visualizacin de registros, creamos un link sobreel nombre que nos lleve a la edicin 35. 35/1254. Edicin de un registro: visin global 4. Modificamos el toolbar para que muestre los botones deguardar, aplicar y cancelar cuando el task es edit 36. 36/125 Eliminar registros 1. Capturamos el task = remove en admin.reviews.php: 37. 37/125Eliminar registros 2. Funcin handler removeReviews 38. 38/1254. Front-end 39. 39/125 Visin global El fichero reviews.php har de router Se encarga de recoger el task que llega del queryString einvocar a una funcin handler u otra reviews.php bsicamente es un mega switch, con unaentrada por cada posible task y una lista de funcioneshandler que gestionan la lgica de cada task Las operaciones bsicas sern: Listar todos los registros Ver en detalle un registro Aadir comentarios a un registro Ver los comentarios Crear enlaces amigables 40. 40/125Listar los registros 1. Capturamos el task En reviews.php, iniciamos el switch que recoge el task y en base al cual invoca a una funcin handler o a otra 41. 41/125Listar todos los registros 2. Funcin handler para el task Ya hemos capturado el task y ya hemos invocado a la funcin manejadora de esta tarea. Cdigo de la funcin manejadora 42. 42/125 Listar todos los registros 3. Vista en el fichero revies.html.php 43. 43/125Listar todos los registros: resultadoCada registro muestra su nombre y contiene un enlace para la vista en detalle 44. 44/125Mostrar un registro en detalle 1. Capturamos el task 45. 45/125 Mostrar un registro en detalle 2. Funcin handler de task=view Carga el registro en $row Invoca a la vista con $row como parmetro 46. 46/125Mostrar un registro en detalle 3. Vista, muestra el registro que recibe por parmetro 47. 47/125Mostrar un registro en detalle: resultado 48. 48/125Generar URLs amigables El objetivo es generar enlaces sencillos En lugar de esto: http://localhost/joomla/index.php?option=com_reviews&id=1&task=view&Itemid=1 Tener esto: http://www.dominio.com/reviews/view/1 Debemos codificar y decodificar URLs Para ello, activamos el SEF a travs del backend SEF=Search Engine Friendly 49. 49/125Generar URLs amigables: activar SEF 1. Backend/site/Globalconfiguration 50. 50/125Generar URLs amigables: activar SEF 2. Activar Search EngineFriendly URLs 3. Activar tambin Apachemod_rewrite, conseguimosque en la URL tampocoaparezca index.php 51. 51/125 Generar URLs amigables: activar SEF Renombrar fichero htaccess.txt por .htaccess Este fichero se encuentra en la carpeta raz del proyectojoomla 52. 52/125 Generar URLs amigables: activar SEF Activar mod_rewrite en Apache2:Tecleamos lo siguiente en la lnea de comandos:$ sudo a2enmod rewriteEl comando a2enmod (podra ser una abreviatura de Apache2 Enable Module) sirvepara activar mdulos que se encuentren en el directorio /etc/apache2/mods-availableylos pasa al directorio /etc/apache2/mods-enabled.Ahora lo que sigue es modificar nuestro host donde queremos que aplique el rewrite, enmi caso sera para todo lo que este dentro de mi localhost, entonces me voy aldirectorio /etc/apache2/sites-enabled/ y aqu debe de haber un archivo llamado 000-default, lo abrimos con vim o nano.$ sudo vim /etc/apache2/sites-enabled/000-defaultAqu buscamos en las lneas que digan AllowOverride None y las cambiamosporAllowOverride All. Incluso podemos definir que directorios queremos que aplique esrewrite y cuales no.Por ltimo tenemos que reiniciar Apache2:$ sudo /etc/init.d/apache2 force-reloadY eso es todo!!! 53. 53/125Generar URLs amigables: codificar Las tareas de codificar/decodificar URLs las realizaremosen el fichero router.php, que se aloja en la raz delcomponente (y se tiene que llamar forzozamente as) Dentro de este fichero debe haber una funcin que sellame BuildRoute(&$query) En nuestro ejemplo, ReviewsBuildRoute(...) $query es un array asociativo, con la queryStringparseada Vamos eliminando de ese array las opciones quesabemos manejar con unset y vamos insertando en$segments los valores Devolvemos $segments 54. 54/125Generar URLs amigables: codificar 55. 55/125Generar URLs amigables: codificar En todos los sitios en los que insertamos un link, hay quepasarlo como parmetro a la funcin JRoute::_ As, en reviews.html.php, en la funcin showReviews,ahora tenemos: 56. 56/125Generar URLs amigables: decodificar En el fichero router.php, aadimos la funcinParseRoute($segments) En nuestro caso ReviewsParseReoute($segments) Listo, ya podemos insertar URLs como http://www.oursite.com/reviews/view/1 57. 57/1255. Mdulos 58. 58/125Visin global Registrar el mdulo Recuperar y obtener parmetros Centralizacin del acceso a datos y visualizacin conhelpers Utilizacin de layouts Mostrar las ltimas reviews Mostrar una review al azar 59. 59/125 Registrar el mdulo INSERT INTO jos_modules (title, ordering, position,published, module, showtitle, params)VALUES (Restaurant Reviews, 1, left, 1, mod_reviews,1, style=simplenitems=3nrandom=1); 60. 60/125 Indicar en qu pginas se debe mostrar En el back-end, vamos a Extensions/Module manager Pinchamos el enlace de nuestro mdulo (Restaurantreviews) En Menu assignment, marcamos All Guardamos 61. 61/125Creacin de su estructura bsica Directorio del mdulo Joomla/modules/mod_reviews Fichero main dentro del directorio del mdulo mod_reviews.php Inicialmente, el cdigo del main puede ser as: 62. 62/125Resultado VACO 63. 63/125 Mostrar los 3 ltimos registrosRecuperamos los parmetrosdel mdulo Cargamos slo los 3 primeros registros 64. 64/125 Desarrollo de algunos Helpers y layouts Helper: Vamos acentralizar elacceso a datos enun clase quellamaremoshelper.php renderReview:muestra una nicareview. Crea el linky llama al layout deuna review 65. 65/125 Desarrollo de algunos Helpers y layouts Layouts _review.php: muestra una nica review default.php: muestra una lista de reviews bulleted.php: muestra una lista de reviewsponindole a cada una una vieta Cambiamos el main del mdulo para que tome los helpers y los layouts 66. 66/125 Desarrollo de algunos Helpers y layouts _review.php: Layout para una nica review. Este layout esel que invoca renderReview, que es la funcin del helperque muestra una nica review 67. 67/125 Desarrollo de algunos Helpers y layouts default.php: Layout por defecto para mostrar un listado dereviews Invoca sucesivamente a renderReview, que a su vezllamar a _review, que se encarga de mostra una solareview 68. 68/125 Desarrollo de algunos Helpers y layouts bulleted.php: layout para mostrar un listado de reviewscon una vieta acompaando a cada una 69. 69/125Desarrollo de algunos Helpers y layouts Modificamos el main del mdulo, mod_reviews.php, paraque use los helper y los layouts:1. Incluye el cdigo delhelper2. Invoca al mtodogetReviews del helperpara recuperar la listade registros Si no pasamos este parmetro, tomar default.php3. Incluye el cdigo dellayout bulleted.php 70. 70/125Desarrollo de algunos Helpers y layouts:resultado 71. 71/125 Desarrollo de algunos Helpers y layouts Podemos cambiar el mdulo para que muestre un registroal azar, hacindolo a travs de los parmetros del propiomdulo 72. 72/1256. Diseo MVC del proyecto 73. 73/125 Modelo: modelar una lista de reviews Crear la carpeta models bajo components/ com_reviews Una clase para recuperar una coleccin ModelReviewsAll, Model + + Hereda de JModel Cada clase modelo se encargar de recuperar los datos de base de datos El fichero se llamar all.php 74. 74/125Modelo: modelar una lista de reviews 75. 75/125 Modelo: Modelar una review Fichero review.php bajo models Hereda de JModel Sobreescribimos constructor para recuperar el id.Debemos invocar al constructor del padre Tiene un objeto _db que hereda del padre para ejecutarconsultas El mtodo getList para recuperar una review 76. 76/125Modelo: Modelar una review 77. 77/125 Vistas: Estructura de carpetas Carpetas de las vistas Carpeta views bajo components/com_reviews A su vez, una subcarpeta para cada tipo devisualizacin, en nuestro caso, una subcarpeta ally otra review Cada subcarpeta alojar la vista que se llamar view.html.php Adems, cada subcarpeta debe tener una nueva carpeta llamada tmpl, que alojar como mnimo la plantilla por defecto default.php 78. 78/125Vistas: Estructura de carpetas 79. 79/125Vistas: vista para ver todas las reviews Vista com_reviews/views/all/view.html.php Hereda de JView La clase se tiene que llamar ReviewViewAll Mtodo display: Recupera su modelo Invoca al mtodo getList, para obtener loselementos necesarios Para manipular los datos de la plantilla, utiliza el mtodo AssignRef Invoca al mtodo display del padre con la plantilladeseada 80. 80/125Vistas: vista para ver todas las reviews 81. 81/125Vistas: vista para ver todas las reviews Template com_reviews/views/all/default.php Se dedica simplemente a visualizar Maneja un objeto list, que habremos de habersuministrado desde la vista (con AssignRef) La lista es una lista de objetos review, que hemos cargadocon el modelo 82. 82/125Vistas: vista para ver una review com_reviews/views/review/view.html.php Hereda de Jview Mtodo display Recupera el modelo Dentro del modelo, carga el objeto para la visualizacin Mediante AssignRef, carga todos los objetos que manejar su template Invoca al mtodo display del padre 83. 83/125Vistas: vista para ver una review 84. 84/125Vistas: vista para ver una review El template o layout default.php se dedicar a mostrarmediante HTML uno a uno los campos de una review Mostramos un pequeo fragmento: 85. 85/125 Controladora Hereda de JController Fichero controller.php se coloca en la carpeta base delcomponente Debe contener un mtodo display, que se invocar encuanto se ejecute la controladora Contendr otros mtodos para realizar otras acciones El mtodo display... ...recupera la vista ...recupera el modelo ...establece el layout ...invoca a su vista::display() 86. 86/125Controladora 87. 87/125 Iniciar todo: Fichero main del componte Joomla invoca al fichero reviews.php, que es el ficheromain del componente Carga una instancia de controller Invoca el mtodo execute con lo que haya en elqueryString en task Si no hay task, ejecuta mtodo display Si en task hay algo, ejecutar el mtodo de la controladoraque se llame como ese algo 88. 88/125Iniciar todo: fichero main del componente 89. 89/125 Codificar/decodificar URLs Debemos retocar el fichero router.php para parsear ygenerar URLs amigables que se ajusten a este nuevoesquema La funcin ReviewsBuildRoute quedara as: 90. 90/125 Codificar/decodificar URLs La funcin ReviewsParseRoute quedara as: 91. 91/125 El mdulo: corregir links Ya slo nos falta corregir los enlaces del mdulomod_reviews El fichero helper.php, que crea un enlace, modificamos$link para que quede as: Actualizamos el enlace para que encajecon el nuevo esquema 92. 92/125Resultado Llegados a esta punto, el front-end funciona exactamenteigual pero con estructura MVC 93. 93/125 Reestructuracin del back-end Creamos controller.php bajo administrator/ components/com_reviews Contendr una funcin por cada task, de modo quedesaparece el mega switch Las funciones dejan de llamarse editReview, saveReview,removeReviews y pasan a ser edit, save, remove,... Con registerTask, registramos las tareas o task que va amanejar esta controladora 94. 94/125Reestructuracin del back-end 95. 95/125Reestructuracin del back-end Iniciar todo: Fichero main del componte Joomla invoca al fichero admin.reviews.php, que es elfichero main del componente Lo modificamos para que utilice la controladora Carga la visualizacin Carga la controladora Carga las tablas Recuperamos del queryString el task Cambiamos el mtodo default, para que no sea displaysino showReviews Ejecutamos el task de la controladora 96. 96/125Reestructuracin del back-endIniciar todo: fichero main del componente 97. 97/125 Paginacin: en la carga de registros... En el elemento que carga los registros... recuperamos la variable limit recuperamos la variable limitstart calculamos el nmero total de registros lanzamos la consulta con registro inicial y nmerode registros a recuperar Creamos un objeto JPagination con total, registro inicial y nmero de registros a cargar A la vista le pasamos las filas cargadas y el objetoJPagination 98. 98/125Paginacin: en la carga de registros... 99. 99/125 Paginacin: en la visualizacin... En la vista... Simplemente le pasamos el objeto de paginacin ya configurado Mostramos un footer en la tabla de visualizacin deregistros que muestre los botones de paginacin 100. 100/125Paginacin: en la visualizacin... 101. 101/1257. Plug-ins 102. 102/125Concepto de plug-in Un plug-in es un trozo de cdigo que se ejecuta cuandoocurre algn tipo de evento 103. 103/125Registrar un plug-in 104. 104/125 Fichero main del plugin El fichero main del plugin debe guardarse en Joomla/plugins/ content Podemos ponerle el nombre que queramos al fichero En el fichero main tendremos: Registrar el evento que queremos capturar, con la funcin que se ejecutar cuando tal evento se produzca Funcin que captura el evento Funciones auxiliares 105. 105/125Ejemplo 1: actuar sobre el texto de un artculojusto antes de que salga en pantalla Un cliente nos pide que cuando publique un artculo, o unanoticia,... o cualquier contenido, que si en el texto delartculo aparece el nombre de un restaurante,automticamente se reemplace por un hipervculo a lacrtica sobre ese restaurante Para eso, nuestra funcin, que se ejecuta justo antes deque salga en pantalla el artculo, buscar en su cuerpo, ensu texto si coincide con el nombre de un restaurante, yfabrica el enlace a su crtica, y modifica el texto de dichoartculo en memoria para que figure con el hipervnculoautomticamente 106. 106/125Ejemplo 2: cdigos de reemplazo En este nuevo ejemplo, el usuario quiere que si aparece elnombre de un restaurante, al final del artculo se incluya lainformacin bsica del restaurante: precio, direccin,telfono, tarjetas admitidas,... Para eso, el cliente tendr que escribir donde quiera queaparezca esta caja de informacin un comando queser {review nombre restaurante} As que, justo antes de que joomla muestre en pantalla elartculo, se ejecutar nuestra funcin, buscaremosmediante expresiones regulares esta llave abrir/llavecerrar con la palabra review en medio, y sustituimos esebloque por la informacin bsica del restaurante. 107. 107/125Ejemplo 2: cdigos de reemplazo 108. 108/125Ejemplo 3: Capturar el evento de bsqueda para aadir otros registros Cuando un usuario utiliza el cuadro de bsquedaintegrado en Joomla, el sistema slo busca en losartculos, en las noticias,... Si queremos que la bsqueda se realice tambin dentrode las reviews, debemos,... capturar el evento de bsqueda hacer una funcin que lo maneje buscar dentro de nuestras tablas mostrar los resultados 109. 109/125Ejemplo 3: Capturar el evento de bsqueda para aadir otros registros 110. 110/1258. Parmetros deconfiguracin de extensiones 111. 111/125Parmetros en los mdulos Creamos el fichero mod_reviews.xml justo al lado delfichero main de nuestro mdulo, bajoJoomla/modules/mod_reviews Este fichero tiene una seccin global y una seccin deparmetros La seccin global almacena informacin del mdulo: Nombre del mdulo Autor Fecha de creacin La seccin de parmetros guarda cada uno de losparmetros configurables 112. 112/125Parmetros en mdulos 113. 113/125 Parmetros en mdulos Ya podemos acceder al back-end y configura nuestromdulo 114. 114/125 Parmetros en mdulos En el mdulo, recuperamos los valores de los parmetros: 115. 115/125 Parmetros en plugins La cosa cambia un poco 116. 116/125Parmetros en componentes La cosa cambia un poco 117. 117/1259. Agregar campos al registro deusuarios 118. 118/125Descarga e instalacin Descargamos el plugin UserMeta de esta direccin: http://joomlacode.org/gf/project/usermeta/frs/ Desde el back-end de joomla/ extensiones/ instalar-desinstalar Localizamos el fichero .zip e instalamos NOTA: NO copiar el fichero .zip dentro del directorio dejoomla, sino en cualquier carpeta local de nuestro sistema 119. 119/125 Configuracin del plugin Utilizaremos el campo params de la tabla jos_user Desde el back-end, vamos al administrador de plugins, ybuscamos UserMeta 120. 120/125 Configuracin del plugin En la configuracin global/ sistema/ parmetros deusuario: 121. 121/125Agregamos los campos adicionales Archivo /plugins/system/usermeta/user.xml Modificaremos el primer grupo de parmetros, los que seguardan en jos_user Parmetros que se guardanParmetros que se guardanen jos_user en campo params en otra tabla 122. 122/125Agregamos campos adicionales Hemos agregado el campo telfono 123. 123/125Formulario de registro: mostramos los nuevos campos El formulario de registro se encuentra en joomla/ templates/ / html/ com_user/register/ default.php Hay plantillas que NO sobreescriben el formulario deregistro de joomla, de modo que NO existe esta ubicacin,sino que usan directamente el formulario del sistema, queest en joomla/ components/ com_user/ views/ register/tmpl/ default.php Es el caso de la plantilla ja_purity Si es as, copiamos todo el contenido de esa ubicacin delsistema y lo volcamos al lugar que le correspondera ennuestra plantilla, para NO modificar los archivos delsistema 124. 124/125Resultado 125. 125/125Resultado en BD Y efectivamente, si registramos un usuario, se almacenaen BD su telfono