Passo 1 - Le basi

Thank you for your contribution: 

Ornate StaircaseVediamo di raccogliere alcuni fatti circa il primo passo per il nostro componente Immobiliare. Un componente deve avere un nome univoco ed il modo più semplice di farlo è di usare all'inizio il vostro nome o il nome della vostra azienda.

  • Il nome leggibile per il componente è "Cocoate Real Estate".
  • Il nome leggibile dal computer per il componente è cocoaterealestate (Mentre scrivevo questo componente di esempio, ho imparato che è meglio evitare l'underscore nei nomi dei file).
  • Le cartelle dove si trova il componente sono chiamate com_cocoaterealestate
  • Ha una vista chiamata object. Questa vista dovrebbe visualizzare in seguito annunci di case.
  • Abbiamo bisogno della possibilità di creare una voce di menu per accedere al componente.
  • Vogliamo avere una voce di menu nel backend che visualizzi coming soon.

Frontend e Backend

Nell'"estensione vocale" il frontend si chiama site e il backend si chiama admin

Se avete una voce di menu sulla vostra pagina che porta al vostro componente e un utente clicca su questo link:

  • Joomla! valuta il percorso URL: /index.php?option=com_cocoaterealestate
  • Cerca nelle tabelle del database dei componenti, un componente chiamato cocoaterealestate.
  • Cerca una cartella chiamata com_cocoaterealestate nella cartella components del site.
  • In questa cartella cerca un file chiamato cocoaterealestate.php.
  • Interpreta questo file.

La stessa cosa succede nell'area admin. Se un manager o un amministratore fa clic sulla voce menu:

  • Joomla! valuta il percorso URL: /administrator/index.php?option=com_cocoaterealestate
  • Cerca nelle tabelle del database dei componenti, un componente chiamato cocoaterealestate.
  • Cerca una cartella chiamata com_cocoaterealestate nella cartella administrator/components dell'amministratore.
  • In questa cartella cerca un file chiamato cocoaterealestate.php.
  • Interpreta questo file.

Per costruire due applicazioni in un unico componente con lo stesso nome, dobbiamo avere una struttura. Per interpretarla nel modo giusto, avete bisogno di diversi file:

  • cocoaterealestate.xml – Il file XML con tutte le informazioni perl'installazione.
  • cocoaterealestate.php – Il punto di partenza del vostro componente.
  • controller.php – Il C nel MVC, il controller.
  • views/object/view.html.php – Il file che riceve i dati dal modello (la M nel MVC) e lo prepara per la vista.
  • views/object//tmpl/default.php – Un template predefinito per l'area del componente della pagina. E' possibile sovrascrivere questo template predefinito con il template installato di Joomla!.

Abbiamo bisogno della stessa struttura nell'interfaccia amministratore. Entrambe le applicazioni sono totalmente separate.

File e Installazione

Per ogni estensione è necessario un record nella tabella estensione del database. Senza questo record non esiste negli "occhi" del CMS Joomla! e non è possibile utilizzare l'estensione, anche quando tutti i file sono nel posto giusto. Il record del database di solito viene creato quando si installa un componente.

Ma come iniziare? Dovete scrivere prima il componente :)

Come sempre avete due possibilità.

Scoprire l'estensione

Da Joomla! 1.6 c'è un'opzione per scoprirlo nella Gestione Estensione. Potete posizionare i file del vostro componente nelle cartelle giuste e cliccare l'opzione per scoprirle nella gestione estensione. Leggerà il file .xml dei componenti e aggiornerà la tabella estensione. Il componente è pronto per l'uso.

I vostri file dovrebbero essere collocati in questo modo. Un file index.html deve essere posizionato in ogni cartella per ragioni di sicurezza.

/component/com_cocoaterealestate/cocoaterealestate.php

/component/com_cocoaterealestate/controller.php

/component/com_cocoaterealestate/index.html

/component/com_cocoaterealestate/view/object/view.html.php

/component/com_cocoaterealestate/view/object/index.html

/component/com_cocoaterealestate/view/object/tmpl/default.php

/component/com_cocoaterealestate/view/object/tmpl/default.xml

/component/com_cocoaterealestate/view/object/tmpl/index.html

/component/com_cocoaterealestate/view/index.html

/administrator/components/com_cocoaterealestate/cocoaterealestate.php

/administrator/components/com_cocoaterealestate/cocoaterealestate.xml

/administrator/components/com_cocoaterealestate/index.html

Installare l'estensione

L'altro modo è quello di installare l'estensione attraverso la Gestione Estensione di Joomla! In questo caso è necessario posizionare i file al di fuori di Joomla!, comprimerli in un archivio zip e caricarli nell'installer. Dopo l'installazione, il componente è pronto per l'uso.

I vostri file dovrebbero essere collocati in questo modo. Un file index.html deve essere posizionato in ogni cartella per ragioni di sicurezza.

/sito/cocoaterealestate.php

/site/controller.php

/site/index.html

/site/view/object/view.html.php

/site/view/object/index.html

/site/view/object/tmpl/default.php

/site/view/object/tmpl/default.xml

/site/view/object/tmpl/index.html

/site/view/index.html

/administrator/cocoaterealestate.php

/administrator/cocoaterealestate.xml

/administrator/index.html

Alla fine di questo capitolo troverete il componente di esempio allegato (com_coco_real_estate-0.0.1.zip).

Il codice

In totale abbiamo bisogno di 7 file con codice e il file index.html.

File: index.html

Se un visitatore naviga nel suo browser direttamente ad una cartella del componente, sarebbe possibile, a seconda della configurazione del server web, che possa vedere una directory della cartella. Per evitarlo dovete posizionare un file chiamato index.html in ogni cartella (Lista 1). Questo requisito è un punto controverso (The files of wrath) ma è comunque necessario per ottenere elenchi nella Gestione Estensione di Joomla!.

<!DOCTYPE html><title></title>

Lista 1: index.html

File: /administrator/cocoaterealestate.php

Questo è il file che viene eseguito quando si fa clic sul componente nell'area di amministrazione (Figura 1). Può contenere "tutto" :)

cocoate.com/node/10196Step1-Coming Soon

Figura 1: Output nel Backend

Coming soon!

Lista 2: /administrator/cocoaterealestate.php

File: /administrator/cocoaterealestate.xml

Il file .xml contiene i metadata e l'informazione su dove mettere i file. Potete vedere parte dei dati nella Figura 2.

cocoate.com/node/10196Step1-Extension Manager

Figura 2: Dati XML nella Gestione Estensione

<?xml version="1.0" encoding="utf-8"?>
<extension type="componente" version="1.7.0" method="aggiornamento">

    <name>Cocoate Real Estate</name>
    <!-- The following elements are optional and free of formatting constraints -->
    <creationDate>November 2011</creationDate>
    <author>Hagen Graf</author>
    <authorEmail>hagen@cocoate.com</authorEmail>
    <authorUrl>http://cocoate.com</authorUrl>
    <copyright>2006-2011 cocoate.com - All rights reserved</copyright>
    <license>GPL 2</license>
    <!--  The version string is stored in the components table -->
    <version>0.0.1</version>
    <!-- The description is optional and defaults to the name -->
    <description>Elenchi di case sul vostro sito web.</description>

    <!-- Note the folder attribute: This attribute describes the folder
        to copy FROM in the package to install therefore files copied
        in this section are copied from "site/" in the package -->
    <files folder="site">
        <filename>index.html</filename>
        <filename>cocoaterealestate.php</filename>
        <filename>controller.php</filename>
        <folder>views</folder>
    </files>

    <administration>
        <menu>Cocoate Real Estate</menu>
        <!-- Note the folder attribute: This attribute describes the folder
            to copy FROM in the package to install therefore files copied
            in this section are copied from "admin/" in the package -->
        <files folder="admin">
            <filename>index.html</filename>
            <filename>cocoaterealestate.php</filename>
        </files>
    </administration>
</extension>

Lista 3: /administrator/cocoaterealestate.xml

File: /site/cocoaterealestate.php

La dichiarazione defined('_JEXEC') or die; deve essere per motivi di sicurezza nella parte superiore di ogni file .php. Questa dichiarazione controlla se il file viene chiamato da una sessione di Joomla! (Lista 4).

// No direct access to this file
defined('_JEXEC') or die;

// Import of the necessary classes
jimport('joomla.application.component.controller');

// Get an instance of the controller prefixed by CocoateImmobiliare
$controller = JController::getInstance('CocoateImmobiliare');

// Perform the Request task
$controller->execute(JRequest::getCmd('task'));

// Redirect if set by the controller
$controller->redirect();

Lista 4: /sito/cocoaterealestate.php

File: /site/controller.php

Questo è il controller. Al momento non c'è nulla da controllare, così il file rimane vuoto (Lista 5)

defined('_JEXEC') or die;
jimport('joomla.application.component.controller');
class CocoateImmobiliareController extends JController
{
}

Lista 5: /sito/controller.php

File: /site/view/object/view.html.php

Le viste sono divise in vari punti di vista. Il nome della cartella è il nome della vista. Nel nostro caso avremo bisogno di una lista di tutte le case e una pagina dettagliata per un oggetto. Le viste sono separate in file per la raccolta dei dati necessaria dal modello (come vedremo più avanti) e il file di modello con il markup. Nella Lista 6 potete vedere la raccolta dei dati per la lista degli oggetti.

// No direct access to this file
defined('_JEXEC') or die;
jimport('joomla.application.component.view');
class CocoateImmobiliareVistaOggetto extends JView
{
    function display($tpl = null)
    {
        // Assign data to the view

        $this->item = 'Cocoate Immobiliare';

        // Display the view
        parent::display($tpl);
    }
}

Lista 6: /site/view/object/view.html.php

File: /site/view/object/tmpl/default.php

Questo è il file di modello con il markup (Lista 7). Questo file può essere copiato e sovrascritto dal principale modello di Joomla!.

// No direct access to this file
defined('_JEXEC') or die;
?>
<h1><?php echo $this->item; ?></h1>

Lista 7: /site/view/object/tmpl/default.php

File: /site/view/object/tmpl/default.xml

Questo è il file di configurazione per la Gestione voci di menu (Figura 3, Lista 8)

cocoate.com/node/10196Step1-Menu Item

Figura 3: Dati XML nella Gestione Menu

<?xml version="1.0" encoding="utf-8"?>
<metadata>
    <layout title="Cocoate Real Estate">
        <message>Object</message>
    </layout>
</metadata>

Lista 8: /site/view/object/tmpl/default.xml

Commenti

Ciao

Per quanto riguarda la figura 3 lista 8 essendo un tutorial consiglio di rendere più semplice trovare le cose.
Non è per nulla immediato capire che la figura si riferisce alla selezione raggiungibile da:
Menù -> Voci di menù
Pulsante "Nuovo"
bottone "selezione" della casella "Tipo di voce di menù"

Per il resto grazie per il lavoro fatto.

Prova a ritrovare il percorso nella tua versione italiana di Joomla!, magari ti aiuta ad arrivare al giusto percorso.