Le basi Creare un elenco Fabrik – Tables – New – dare un titolo (che apparirà) alla tabella su label – in Intoduction sarà visualizzato un testo che apparirà sopra la tabella – nella scheda Publishing: Published: Yes – nella scheda Access definire gli accessi – Scheda Dati. Su Connection selezioniamo la connessione del database che vogliamo usare – Create a new table. Dare un nome (senza spazi) alla tabella – Save – Nel momento in cui creiamo una tabella, Fabrik ha creato automaticamente un form (che possiamo vedere nell’elenco dei forms) e un gruppo (che vediamo nell’elenco dei gruppi) – nell’elenco degli elementi troviamo due elementi creati automaticamente. Quando gli elementi saranno tanti, possiamo filtrarli selezionando il gruppo che ci interessa Aggiungere alcuni elementi al nuovo form Fabrik – Elements – New – Name è un nome da dare senza spazi – label è il nome dell’elemento che potrà essere letto da tutti – in Hover text è possibile dare un suggerimento che apparirà in popup – scegliere il tipo di elemento (per esempio field) – Published: Yes – Show in table: Yes – se vogliamo aggiungere una validation allora andiamo su Validations; Aggiungi; selezionare il tipo di validazione – Scrivere il messaggio di errore in caso di mancanza di riempimento del campo – Save – possiamo creare nuovi elementi cliccando su New – diamo un nome e un label; scegliamo il tipo di elemento (per esempio text area) - possiamo definire l’altezza dell’elemento e indicare un numero massimo di caratteri per l’elemento Text area in Show max limit – Published: Yes – Show in table: Yes – eventualmente definire una Validation e quindi un messaggio in caso di mancato riempimento – Save – nel caso di file upload definiamo la dimensione massima dell’allegato; definire i tipi di estensione permessi; in Upload directory inserire un indirizzo in cui vogliamo siano salvati i files caricati (per esempio: images/stories/); in Allow sub folder selection: Hide in modo da evitare all’utente di scegliere il file da caricare da un menu a cascata; Link to file: Yes in modo da permettere agli utenti di cliccare su una ventuale foto caricata e vederla a dimensione intera; Incremental file uploads: Yes – Show media in table: Yes in modo da vedere il file caricato anche all’interno della tabella oltre che sul form – impostiamo altezza e larghezza (per esempio 800 e 800) del file da mostrare; su Thumbnail mettiamo Yes; specifichiamo la directory – Save Test Tables – View data della tabella creata – per aggiungere alcuni dati (da backend) cliccare su Add (dopo aver cliccato sul nome della tabella) – inseriamo i dati e carichiamo anche un file – Save (i dati inseriti) – vediamo i records inseriti nella tabella Form Fabrik – form – cliccare sul nome del form che vogliamo modificare – Introduction è un testo che appare in alto prima del form – Error message è un messaggio di errore che appare in caso di mancato riempimento di in campo (è un messaggio che appare oltre il messaggio dell’errore specifico impostato in Validation per il campo mancante. Un esempio potrebbe essere: Alcune parti del form che hai compilato non sono complete) – nella scheda Groups possiamo definire quali gruppi avranno accesso al form – su Options possiamo usare Usa opzioni globali – su Template usiamo label above – su Submission plugin possiamo inviare una mail, scrivere un messaggio di ringraziamento, reindirizzare a un’altra pagina. Se selezioniamo redirect possiamo scrivere un messaggio di ringraziamento per il form riempito oppure indicare la URL di una pagina. Dobbiamo specificare anche dove vogliamo far apparire il messaggio (se su front end, back end o su entrambi) e anche se vogliamo farlo apparire soltanto per la creazione di un nuovo form, per la sua modifica o per entrambi i casi – Save Il front end Menus – User menu – New – selezionare Fabrik – Form come tipo di menu – dare un titolo al menu – diamo un livello di accesso per il menu – su Parameters selezioniamo il nome del form che vogliamo collegare al menu – Save – per dare un menu alla tabella andiamo su menus – New – Fabrik – Table – dare un titolo e stabilire i livelli di accesso – Save – su Preview vediamo i menus – per evitare di mostrare su front end i link di importazione ed esportazione delle tabelle csv andiamo dentro la tabella (da back end per modificarla) – CSV options: selezioniamo Super Administrator – se clicchiamo su Preview possiamo vedere i cambiamenti fatti Tidying up Fabrik – Table – Elements – qui possiamo nascondere I campi che non vogliamo far vedere sulla tabella nel front end – per togliere i link che appaiono in genere alla destra di una tabella andiamo su Link to details (dentro Table settings) e mettiamo Yes (in questo modo gli elementi di una colonna della tabella diventeranno un link su cui è possibile cliccare) – save Digging deeper Unire alcuni dati Creare una nuova tabella (chiamata Tutorial Categories) con un elemento field per inserire la categoria – in Elements filtriamo gli elementi della nuova tabella (Tutorial Categories) – nascondiamo quelli che non vogliamo fare apparire – torniamo sulla prima tabella (Tutorials) in modo da aggiungere un nuovo elemento che unisca il contenuto di una colonna alle categorie – quindi clicchiamo su New – diamo come nome e label: category – tipo elemento: database join – costruiamo un elenco di menu a cascata che mostri i nomi delle categorie. Quindi andiamo su Render join as: Dropdownlist – Join type: Simple – Connection: site database – Table: selezioniamo il nome dell’ultima tabella che abbiamo creato (Tutorial Categories) – label: selezioniamo Category. Category è uno dei due elementi che abbiamo creato dentro la tabella selezionata. Quindi Fabrik carica gli elementi della tabella che selezioniamo (Tutorial categories) in modo da poterne selezionare uno – Published: yes – Show in table: yes – se vogliamo essere sicuri che una nuova categoria sia selezionata dall’interno del menu a cascata, allora andiamo su: Value of please select option: digitiamo 0 – Validations – Add – selezioniamo: Is not – nel campo Is not che appare digitiamo 0 in modo che l’utente che seleziona un valore dal menu a cascata, non selezioni 0 – Save – Aggiungiamo un paio di categorie alla nostra tabella (Tutorial categories), quindi clicchiamo su Tables – cerchiamo la tabella (Tutorial categories) e clicchiamo su View data – clicchiamo su Add per aggiungere alcuni nomi di categorie; quindi digitiamo i nomi e clicchiamo su Save per ogni nuova categoria creata – il prossimo passo è modificare la tabella precedente (Tutorials) così andiamo su Tables; View data della relativa tabella (Tutorials) – dobbiamo aggiungere delle categorie così clicchiamo sul nome e selezioniamo il nome di una categoria dal menu a cascata con le categorie che abbiamo inserito prima – Save – abbiniamo una categoria per ciascuno dei record presenti nella tabella – vogliamo che questa colonna (Category) appaia a sinistra della tabella. Per fare questo cambiamo l’ordine; quindi clicchiamo le freccette della colonna Order per cambiare l’ordine delle colonne oppure cambiamo l’ordine digitando il numero ordinale della colonna in cui vogliamo che appaia – salviamo l’ordine cliccando sul floppy disk. Impostiamo il nuovo elemento Category in alto in modo da farlo apparire come un filtro di una tabella. Quindi selezioniamo l’elemento Category; all’interno di Table settings su Filter type selezioniamo Field in modo da renderlo come un menu dropdown – Save. Raggruppamento di tabelle Come raggruppare e ordinare i dati in una tabella. In precedenza abbiamo abbinato una categoria per ogni tutorial in modo da poter raggruppare i nostri tutorials dentro le categorie. Poiché vogliamo raggruppare i nostri dati per categoria, allora andiamo sulla scheda Data in Order by (all’interno di Data) e selezioniamo: Categoria – Group by: Category – Poiché vogliamo ordinare per nome di tutorial all’interno di ogni raggruppamento per categoria, allora andiamo su Order by (all’interno di Group by) e selezioniamo Tutorial name – Save – se controlliamo il front end vediamo i vari records ordinati per categoria e all’interno di ciascuna categoria ordinati per nome di tutorial – se non vogliamo la paginazione (quindi vogliamo tutti i tutorials in una sola pagina perché non ci sono molti tutorial da mostrare), allora andiamo sulla Tabella tutorials – Show navigation: no – andiamo su Rows per page e lasciamo in bianco o impostiamo a 0. In questo modo una pagina mostrerà tutte le righe – per vedere ciò che è cambiato nel front end forse conviene uscire dal browser e rientrare anziché aggiornare semplicemente la pagina – Per avere un titolo all’inizio di ogni raggruppamento, allora andiamo su Data; Template (all’interno di Group by) – scriviamo il nome della categoria nel nostro titolo usando: {tablename___elementname} – nel nostro caso questo diventerebbe scrivendolo all’interno di Template: Category: {fab_tutorials___category} – ci sono 3 _ tra i 2 – se vediamo il front end vediamo che abbiamo un titolo che corrisponde al nome della categoria per ogni raggruppamento – ora che abbiamo il titolo della categoria, possiamo togliere la visualizzazione della colonna categoria. Quindi andiamo sull’elenco degli Elementi e relativamente a Category togliamo “show in table” – Per lasciare un po’ più di spazio tra una categoria e l’altra e rendere il titolo della categoria un po’ più grande: clicchiamo sul nome della tabella (all’interno dell’elenco delle tabelle) per modificarla – su Template digitiamo: <br /><h2>Category: {fab_tutorials___category} </h2> - aggiorniamo la pagina e vediamo i cambiamenti nel front end – Per togliere il pulsante Go sotto il filtro (e quindi filtrare la tabella senza il pulsante, ma al solo slezionare della categoria scelta che si vuole vedere) entriamo all’interno della tabella e clicchiamo su Filter Trigger: selezioniamo on change – Apply – se vediamo il front end vediamo i cambiamenti Gruppi di ripetizione Parleremo di come aggiungere dati che si ripetono. In Fabrik non è possibile aggiungere elementi che si ripetono a meno che non si trovino dentro gruppi diversi. Possono esistere gruppi che si ripetono. Groups – New – Dare un nome – Repeat group button: show – Save – ora che abbiamo creato un gruppo mettiamo un leemento in esso. Quindi andiamo in Elements – New – dare un nome, un label e selezionare il tpo di elemento. Selezioniamo Link come tipo di elemento – scrivere 50 su Options in Width – selezionare Yes su Smart Link se vogliamo collegare dei video o musica – Published: Yes – Save – ora che abbiamo creato un gruppo che si ripete e abbiamo aggiunto un elemento in esso, dobbiamo inserire il gruppo nel nostro form. Quindi andiamo su Forms – entriamo nel nostro form – nella scheda Groups selezioniamo il gruppo che abbiamo creato – Add – ora possiamo spostare in alto o in basso in modo da avere l’ordine che vogliamo dei gruppi che abbiamo inserito nel form – Save – Testiamo ciò che abbiamo fatto. Iniziamo a scegliere una riga dalla tabella e aggiungiamo alcune righe a essa. Quindi clicchiamo su Tables – View data della tabella interessata – apriamo il gruppo che abbiamo creato – possiamo specificare un label (è il nome su cui clicchiamo che apre il collegamento) e un indirizzo URL (nello scrivere la URL possiamo anche non specificare http:/ perché Fabrik lo aggiungerà automaticamente qualora manca – possiamo aggiungere un nuovo gruppo cliccando su Add group – scriviamo un nuovo label e URL e impostiamo il Gruppo di accesso (per esempio a Registered) – Save (in basso) – I gruppi ripetuti non creano nessun tipo di riga multipla. Ogni entrata di elemento è memorizzato nello stesso campo nella stessa riga Filtro delle tabelle Il tipo di elemento Access ci permette di applicare i permessi dei gruppi di accesso ai nostri contenuti. Nella scheda Publishing possiamo selezionare i gruppi cui permettiamo l’accesso in sola lettura e in lettura e scrttura (accesso pieno). Save – dopo aver creato l’elemento di accesso, ora vogliamo creare un filtro alla tabella. Quindi andiamo su Tables – Dati in relazione Creiamo 2 tabelle: scuole e studenti. Ogni studente appartiene a una scuola. Le tabelle delle scuole avranno un link che permette alle scuole di vedere gli studenti che frequentano la propria scuola – Creiamo la tabella scuola. Andiamo su Tables – New – diamo un nome alla tabella – sulla scheda Data selezioniamo il database su Connection e diamo un nome alla tabella su Create new table – Save – creiamo un elemento; quindi andiamo su Elements – New – diamo un nome e un label – lo assegniamo al gruppo scuole – Save – creiamo la nuova tabella Studenti; quindi andiamo su Tables – New – Published: Yes – nella scheda dati selezioniamo un database su Connection e diamo un nome alla tabella su Create new table – Save – ora creiamo un elemento; Elements – New – assegniamo un gruppo all’elemento creato. Assegniamo in questo caso il gruppo Studenti – selezioniamo il tipo di elemento: database join che è necessario per il nostro scopo – Render join as: drop down list – su Table selezioniamo la tabella della scuola (che è la tabella che vogliamo collegare) – il prossimo passo è aggiungere alcuni dati alla tabella scuola e a quella studenti – Entriamo dentro la tabella scuola – nella scheda dati abbiamo la parte Related data con alcune opzioni. Queste opzioni possono essere viste perché abbiamo creato un elemento join database dentro la tabella studenti (che punta alla tabella scuola) – Link to table: Yes – nel campo label possiamo specificare l’intestazione della colonna per il collegamento dei dati relazionati – Link to form: Yes. Questo aggiungerà una colonna alla tabella che permette agli utenti di inserire records di studenti alla scuola – su label scrivere l’intestazione della colonna aggiunta (per esempio Aggiungi studenti) – Save – ora se vediamo la tabella scuola vediamo due links: Vedi studenti e Aggiungi studenti. Vedi studenti riporta una vista filtrata degli studenti della scuola corrente. Aggiungi studenti aprirà il form Aggiungi studente con un elemento database join che collega al database della scuola corrente. User ajax Creiamo due tabelle: la prima contenente l’elemento display text. Quello che vogliamo è che ogni volta che cambiamo le informazioni extra contenute nella prima tabella, il contenuto della seconda tabella si aggiorni. Quindi andiamo su Table – New – Edit Published: yes – nella scheda Access definiamo i livelli di accesso – nella scheda Dati selezioniamo la connessione del database e il nome della tabella – Save – Elements – New – Relazioni One to many Creiamo due tabelle: classi e studenti – Tables – New – diamo un label – Published: yes – definiamo i livelli di accesso – diamo u nome alla tabella del database in Data – Save – seguendo la stessa procedura creiamo la seconda tabella – aggiungiamo degli elementi. Alla tabella classi aggiungiamo l’elemento label all’interno del gruppo Classi come elemento field – volendo possiamo definire l’ampiezza, ma dobbiamo sicuramente selezionare Yes in Show in table – Save – ora creiamo un join element alla tabella classe – selezioniamo la tabella Classi – selezioniamo label nel menu a cascata label – Show in table: yes – l’elemento database join memorizza i riferimenti da registrare in altre tabelle (quindi è bene distinguere i nomi di qualsiasi database join per esempio con: _id) – creiamo quindi un elemento di tipo database join che chiamiamo class_id e lo mettiamo dentro il gruppo studenti – Render joinas: drop down list - selezioniamo la tabella Classi – selezioniamo label dal menu a cascata label – Show in table: yes – Save – Ora aggiungiamo qualche dato alle due tabelle. Andiamo su Tables – View data – Add – inseriamo alcuni dati in label e selezioniamo la relativa class e salviamo per ogni dato inserito – Ora vogliamo unire la tabella classi e studenti insieme in modo che possiamo aggiungere classi e studenti dallo stesso form. Modifichiamo quindi la tabella classe andando su Tables – entriamo dentro la tabella Classi – selezioniamo la scheda Data – all’interno della sezione Join clicchiamo Add – selezioniamo Left join in Join type – nel menu a cascata from poiché non abbiamo creato un join, allora selezioniamo la tabella del database principale, quindi selezioniamo la tabella classe – nel menu a cascata To selezioniamo la tabella studenti poiché noi vogliamo unire dalla tabella classi alla tabella studenti – la From column contiene un elenco degli elementi trovati nella tabella selezionata in From. Quasi sempre all’interno di From column selezioniamo Fabrik internal id – in To column selezioniamo lo stesso elemento che si trova in ciò che abbiamo selzionato in From column. Nel nostro caso selezioniamo class_id dentro To column – Save – come possiamo vedere se andiamo su Groups vediamo che il creare un join ha creato automaticamente un nuovo gruppo con il suo set di elementi come vediamo in Elements – se volessimo modificare l’elemento classi d dovremmo cliccare sul link blu che appare nella pagina seguente al clic sull’elemento. Una volta che lo abbiamo scollegato possiamo modificare l’elemento come normale. Ogni cosa cambiata qui non sarà cambiata in automatico anche negli elementi genitori - ora diamo uno sguardo alla tabella della classe. Quindi andiamo su Tables –View data – se vogliamo vedere come sembra il form allora clicchiamo sul numero id – per il momento possiamo soltanto impostare che uno studente appartenga a una classe. Così modifichiamo il suo gruppo e aggiustiamolo. Quindi andiamo su Groups – apriamo il gruppo interessato – Repeat group button: Show – Save – Tables – View data – da qui possiamo inserire un pulsante per aggiungere gruppi. Poiché l gruppo è stato creato attraverso la tabella join ogni gruppo ripetuto sarà memorizzato nella tabella degli studenti. Se il gruppo non fosse creato attraverso una join allora registrerebbe ogni dato dei gruppi ripetuti nella stessa colonna (in una colonna soltanto) – ogni volta che aggiungiamo uno studente nel form, non vogliamo selezionare anche la classe perché è implicita nella modifica. Quindi aggiustiamo questo. Entriamo dentro l’elemento class_id – se scolleghiamo l’elemento class_id modidifichiamo soltanto l’elemento senza toccare gli elementi genitori. Quindi scolleghiamo l’elemento. Possiamo impostare questo elemento in modo da farlo diventare un campo oppure in modo da nasconderlo. Noi lo nascondiamo. Quindi flagghiamo Hidden – Save – Tables – View front end – clicchiamo sul numero dell’id – come ci aspettavamo vediamo ce l’elemento della classe è nascosto. Vediamo che gli gli studenti che aggiungiamo vengo indirizzati alla stessa classe – Siccome ci sono un sacco di dati duplicati, allora useremo il raggruppamento. Il raggruppamento divide la tabella in gruppi di tabelle, raggruppati per un valore dato. Quindi andiamo su Tables – entriamo nella tabella – selezioniamo la scheda Data – e in group by selezioniamo class_id – per elencare gli studenti in ordine alfabetico all’interno di ogni classe selezioniamo il campo nome all’interno di Order by – ciò che scriviamo all’interno del campo Template apparirà sopra ogni raggruppamento di dati. Noi scriviamo il placeholder: {tablename___elementname} – Save – diamo un’occhiata ai dati. Quindi andiamo su Tables – View data – per rimuovere dalla vista della tabella la colonna ID, entriamo dentro l’eelmento clas id e lo rimuoviamo dall’elenco – lo scolleghiamo per modificare e all’interno di Table settings; Link to details: yes – Save – selezioniamo il gruppo Classi e tutti gli elementi contenuti al suo interno – Remove from tables view – vediamo i risultati: Tables – View data – Per riuscire a mostrare tutti i records all’interno del raggruppamento, andiamo su Layout e in Template: selezioniamo default_grouped – salviamo la tabella – creiamo un articolo di menu. Menu – Menu principale – New – in tipo di menu selezioniamo Fabrik; Table – diamo un titolo al link – su Parameters Basic selezioniamo la tabella Classi – Save. Relazioni many to many Creiamo due tabelle: bnds e venues. Creiamo anche una tabella linkabile che mostra tutte bands che suonano in quali venues. Possono esserci una band che suona in più venues e una venues che mostra più bande. Questo è il motivo per il quale questa relazione è chiamata Many to many. Creiamo le tabelle. Quindi diamo un label, definiamo i livelli di accesso, il nome della Connection e della tabella, Published: yes – creiamo gli elementi alle due tabelle – Creiamo un campo di tipo field per memorizzare i nomi delle bande – definiamo l’ampiezza e Show in the table: yes – aggiungiamo un elemento field anche per il nome delle venues – Aggiungiamo alcuni record sia nella tabella bande che venues. Quindi Tables – View data – Add – inseriamo i nomi – Save – ora aggiungiamo una tabella linkabile che mostrerà quali bande suonano in quali venues. Quindi Table – New – diamo un label, definiamo i livelli di accesso e tutto il resto – Save – aggiungiamo due elementi database join alla tabella venues_bands. Questi creeranno dei link alle tabelle bands e venues. – Quindi: Elements – New – tipo di elemento: database join – Render join as: drop down list – label: name – aggiungiamo delle relazioni tra le due tabelle andando su Tables – View data e aggiungiamo dei dati – Creeremo una tabella join dalla tabella venues alla tabella bands. Quando questo accade un nuovo gruppo è creato che contiene una copia degli elementi venue_band ed è assegnato alla tabella / form venues. Per fare questo entriamo dentro la tabella venues - selezioniamo la scheda Data e all’interno di Joins premiamo il pulsante Add – from: Venues – To: venues_bands – from column: fabrik internal id – To column: venue id – Save – Table- View data – entriamo nel gruppo venue – bands – Repeat group button: Show – Save – Tables – View data – in seguito all’ultima variazione dei repeat group button, ora nel front end appariranno i pulsanti Add e Remove che aggiungono ed eliminano i gruppi; quando creiamo un gruppo creiamo anche gli elementi ad esso associati; quando eliminiamo un gruppo eliminiamo anche gli elementi ad esso associati – non è bello avere i campi venues ripetuti ogni volta così li nascondiamo. Ora il form sembra più pulito con i campi venues nascosti – ora duplichiamo alcuni dati di cui non abbiamo bisogno e accendiamo i gruppi venues – entriamo nel gruppo venue e in Group by selezioniamo id – Possiamo vedere che con la caratteristica Group by accesa, il front end mostra ciascuna categoria dentro la propria tabella – Ora selezioniamo il templatate groupedby e le cose cominceranno a sembrare un po’ più pulite. Creazione di un form di ricerca Creiamo un nuovo form – Forms – New – Copiamo alcuni elementi della tabella dentro il nuovo form di ricerca – selezioniamo alcuni elementi dal gruppo tasks (che deriva dalla tabella tasks precedentemente creata) – quindi selezioniamo gli elementi che vogliamo copiare – Copy – ora entriamo dentro la copia dell’elemento e lo modifichiamo – lo assegniamo al form di ricerca, quindi selezioniamo Group: form di ricerca – Apply – Rinominiamo il label del form di ricerca. Deve avere lo stesso label della tabella task altrimenti i valori inseriti nel form di ricerca non saranno filtrati – creiamo un menu per il nostro form di ricerca – ora vogliamo che il form di ricerca ridirezioni alla tabella task e imposti i suoi dati per essere usati per prefiltare i dati della tabella task – Fabrik – form – form di ricerca – Submission plug-ins – Add – selezioniamo redirect – dobiamo inserire la url della tabella nella pagina da reindirizzare. Il modo più sicuro per fare questo è copiare la url dal sito vero (andiamo sul nostro sito e clicchiamo sulla voce di menu che porta alla tabella cui vogliamo reindirizzare (quindi copiamo la url che appare nella barra degli indirizzi oppure tasto destro: Copia l’indirizzo del link) – a fianco a redirect possiamo selezionare frontend e new – Use as search data: yes – Save mySQL View come fonte di dati per l’unione di database Components – Banners – Category – usiamo phpmyadmin per creare una query SQL che costruisca la nostra view – structure – dalla colonna table selezioniamo quella che vogliamo e clicchiamo su Browse – User Profile Creare un profilo Come costruire un profilo utente cioè una tabella in cui qualsiasi utente ha soltanto un form associato con il suo user id quando si è loggato. Components – Fabrik – Tables – New – accesso agli utenti registrati e riempire le altre parti e salvare – Elementi – filtriamo gli elementi del gruppo – New per creare un nuovo elemento. Ne creiamo un paio – ora creiamo un elemento nascosto “user” che registrerà automaticamente l’user ID dell’utente, così sappiamo quale riga appartiene a chi. Quindi: New – diamo come nome per esempio userid e come label User – tipo elemento: user – flagghiamo hidden – Published: yes – Update on edit: no – aggiungiamolo al menu. Tipo menu: Fabrik – form. Diamo un titolo al menu e selezioniamo il livello di accesso: registrato – in Parameters in Row id digitiamo: -1 – key name: dare il lo stesso identico nome dato all’elemento user (il nome non il label) – Save – cliccando su Preview possiamo vedere il nostro nuovo form – Per sapere quale riga appartiene a quale utente andiamo sull’elemento user e modifichiamo User data. Selezioniamo name invece di ID – Show in table: yes – Save – se andiamo su Tables e View front end della tabella user vedremo che al posto dell’ID numerico ci sarà il nome Map element Aggiungeremo l’elemento mappa al nostro profilo. L’elemento map usa Google maps API per inserire una mappa dinamica e permettere la postazione del “pin” sulla mappa. Iniziamo ad aggiungere l’elemento. Elements – New – diamo come nome per esempio: dove ti trovi (o anche dove sei) - tipo elemento: Google map – l’elemento Google map si può scaricare dalla sezione plugins – Google map key: per conoscere cosa scrivere dobbiamo avere un login su Google e dobbiamo incollare la URL del nostro sito all’interno dell’apposito spazio e cliccare Generate API key per conoscere il codice da scrivere in Google map key – Map type: Normal – Control: Small zoom control – da scale control sino a use static map selezionare tutti Yes – per mostrare la mappa nella tabella Use static map: yes all’interno della sezione Table settings – larghezza e altezza: 75 - Published: yes – Show in table: yes – Save Visualizzazione della mappa Una visualizzazione è un modo per visualizzare un insieme di dati da una tabella. Quindi creeeremo una mappa che raccoglie tutti i punti in cui si trovano tutti gli utenti. Visualizzazioni – New – diamo un nome (label) e selezioniamo Google map come plugin – Tabella: selezioniamo la nostra tabella profilo – Google map key: inserire lo stesso cosice usato prima – Center map on: Last marker – da scale control sino a overview control tutti yes – la sezione Clustering ha il compito di visualizzare localizzazioni multiple in un singolo pin – icon: use default – Save – aggiungiamo un articolo di menu per la visualizzazione. Tipo di menu: Fabrik - Visualizzazione – dare un titolo e definire il livello di accesso – In Parameter e precisamente tipo di visualizzazione: selezionare google map – Select instance: Locations – Save Controllo di accesso Come permettere agli utenti registrati di modificare soltanto il proprio profilo e non anche quello degli altri utenti registrati. Entriamo nella tabella Profile – nella scheda Access impostiamo Edit Records e selezioniamo Administrator in modo da permettere la modifica soltanto agli amministratori – ma vogliamo anche che gli utenti siano in grado di modificare il proprio profilo. Facciamo questo impostando Or use field. Selezioniamo l’elemento ‘user’ che abbiamo creato. In questo modo gli amministratori saranno in grado di modificare tutti i profili, invece gli utenti registrati saranno in grado di modificare soltanto i propri records - Save Tabelle esistenti Prima di vedere come creare un doppio menu a cascata (come per stati e città per esempio), dobbiamo creare il contenuto dei due menu a cascata. Se importiamo le tabelle da un database esterno, allora usiamo navicat 8 oppure phpmyadmin. Una volta importata la tabella sul proprio database, andiamo su Tables – New – diamo un label e all’interno della scheda Data in Link to table, selezioniamo la tabella che abbiamo importato – Apply – in Order by scegliamo in base a cosa vogliamo ordinare – Save – New. Ora introduciamo la tabella delle città in fabrik – diamo un label (per esempio Città), nella scheda Data selezioniamo la tabella che vogliamo collegare – Apply – se andiamo su Elements vediamo che è stato creato un gruppo e un form con lo stesso label della tabella importata. Vediamo anche che per ogni colonna della tabella importata è stato creato il relativo elemento Cascading Dropdowns Nella precedente lezione abbiamo creato due tabelle (per città e stati). Ora possiamo aggiungere due nuovi dropdowns al nostro form Profilo. Come al solito all’interno di Elements filtriamo il gruppo cui vogliamo aggiungere l’elemento – New – stiamo creando l’elemento dal cui click cambia il contenuto del secondo menu a cascata. Nel nostro caso diamo il label Stati – tipo elemento: database join – selezioniamo la tabella – key: selezioniamo la chiave (colonna) condivisa tra le due tabelle (Stati e città). Nel nostro caso scegliamo la colonna Stati – label: selezioniamo la colonna che vogliamo vedere. Nel nostro caso selezioniamo la colonna name perché vogliamo visualizzare il nome intero dello stato – Published: yes – Save – Ora creiamo la parte delle città. New – tipo elemento: cascading dropdown (questo tipo di elemento si scarica dal sito Fabrik perché non è incluso nella versione FREE) – Published: yes – Save – nella sezione Opzioni delle’elemento troviamo: la tabella che vogliamo connettere, il valore che vogliamo memorizzare nella tabella e il testo label che vogliamo usare sul dropdown – la sezione Watch element è ciò che collega alla prima tabella. Quindi noi scegliamo Stati – Foreign key: selezioniamo la colonna condivisa con la prima tabella. Nel nostro caso Stati – Save – Possiamo collegare tante tabelle quante vogliamo. L’importante è che la prima sia un elemento database join oppure un semplice elemento dropdown. Tutti gli altri elementi a partire dal secondo devono essere sempre cascading dropdown Visualizzazioni L’elemento time_date è un elemento che registra la data e l’ora in cui le registrazioni avvengono. %Y mostrerà soltanto l’anno di registrazione. %Y-%m-%d mostrerà la data intera di registrazione. Possiamo scegliere il formato data sia per il form che per la tabella. Vediamo che time_date è un elemento di tipo data. Per applicare la caratteristica di conta dei record, dobbiamo selezionare Yes in Count records – Split on: time_date – Se la tabella è stata imostata per mostrare soltanto l’anno, allora verranno contati i records inseriti in ogni anno – Save Ora creiamo un grafico di visualizzazioni, quind andiamo su Visualizzazioni – New – diamo un label – Published: yes – Plugin: chart – Larghezza e altezza 300 e 300 – Element: Count: time_date – se selezioniamo show legend: yes allora dobbiamo dare anche un label alla leggenda – L’opzione sul colore esprime in quale colore mostrare il grafico di dati – Se usiamo un elemento di calcolo allora non dobbiamo specificare nessun Axis label - Save – assegniamo una voce di menu. Il tipo menu: Fabrik – Visualization – In parameters il tipo di visualizzazione è: chart – select instance: chart data – Apply Aggiungiamo alcuni dati alla tabella per popolare i calcoli. Tables – View data – Add – inserriamo i dati – Save Possiamo ridurre l’altezza del grafico e rimuovere gli spazi bianche tra il grafico e il titolo. Possiamo sostituire i label dell’asse del grafico. Entriamo dentro la visualizzazione e impostiamo come larghezza e altezza 300 e 150 px – Save – se entriamo dentro l’elemento time_date creato e modifichiamo heading label, possiamo mostrare il label che vogliamo sull’asse del grafico – Save Auto fill Installare un plugin Componenti – Fabrik – Plugin – Il plugin di auto riempimento automaticamente riempe una serie di campi da una scelta iniziale. Creiamo due tabelle: bands ed events. Tables – New … - Assegnare alcuni campi alla tabella bands. Nella tabella concerts aggiungiamo un elemento band come database join element. Dopo useremo questo elemento per il plugin di auto completamento. Questo campo sarà “un campo da osservare” per lanciare la funzione di auto riempimento. Elements – New – diamo un label e un nome – element type: database join – Tabel: bands – key: id – label: name – Published: yes – Show in table: yes – Ora aggiungiamo alcuni campi per essere popolati con la funzione dell’autoriempimento. Useremo per l’autoriempimento lo stesso tipo di elementi usato per i campi sorgente. Abbiamo appena aggiunto i campi che possiamo inserire con l’autoriempimento nel form concerts. Andiamo nel form concerts – scheda submission plugin – Do: Autofill – In: Both – on: Both – field to observe: selezioniamo l’elemento che quando I suoi dati vengono cambiati, lancerà l’autoriempimento – La funzione incrocerà alcuni dati nella tabella specificata sotto – Trigger: se lasciamo in bianco allora l’autoriempimento verrà lanciato non appena il database join element viene selezionato – il nostro auto riempimento proviene dalla tabella band, così la selezioniamo in Table – Il campo Map data accetta JSON stringhe che sono una serie di coppie key/values dentro parentesi graffe – Nel nostro caso la key è l’elemento bands___website – Save Aggiungiamo un campo al form Concerts per testarne il funzionamento. Forms – View data – Add – inserire un dato – Save – Tables – View data – Add Twitter Per impostare tweets su Twitter è necessario impostare un’applicazione twitter su http://dev.twitter.com – premiamo sul 2 per registrare la nostra applicazione – Application website non deve essere il sito web da dove svolgiamo il form in cui stiamo svolgendo l’applicazione twitter – applicatio type: browser – Callback URL: è l’URL che lancerà il plugin twitter, cioè l’URL da cui attualmente parte il tweet. Nel video è presente un’esempio di callback url. – Default access type: siccome noi vogliamo scrivere su twitter, allora dobbiamo selezionare Read & Write – Dobbiamo installare il plugin di twitter e creare un form per esso – Components – Fabrik – Plugins – dopo aver installato il plugin, creiamo il form. Forms – New – diamo nome twitter e nella scheda submission plugin; Add; selezioniamo Twitter – In: Both – On: Both – dall’applicazione twitter dobbiamo conoscere il consumer key e il secret consumer key – e inserire questi codici negli appositi campi – Save – se vogliamo inviare tweets sempre allo stesso conto Twitter, lo impostiamo da: Sign in with Twitter – per fare questo devo essere registrato a Twitter – Twitter ci ha inviato un set di informazioni che possiamo inserire nelle impostazioni di questo plugin – una volta creato il form, vogliamo creare un elemento messaggio che sarà postato su Twitter – Elements – diamo un nomee un label – tipo elemento: text area – Dobbiamo dire che vogliamo inviare il messaggio su Twitter: Forms – Twitter – submission plugin – slezioniamo il nome dell’elemento text area che abbiamo creato in Message Element – Save – creiamo un menu per vedere il nostro form. Quindi come tipo menu: scegliamo Fabrik – form Come far postare l’utente sul proprio conto e come usare un template specifico Fabrik – forms – entriamo nel nostro form - submission plugin – il message element deve essere deselezionato per far funzionare il template – per impostare il template possiamo usare i placeholder Per abilitare l’utente a postare col proprio conto twitter i dettagli del conto associato. Quindi clicchiamo su: or clear credentials – Save - Webservices Last.fm ha un sorprendente ammontare di dati disponibili. Last.fm – Apply for an API account – l’API key e l’altro codice ci serviranno – Download – all’interno di Params c’è una serie di filtri che possiamo applicare – Per prima cosa facciamo un lista che memorizzerà i dati di Last.fm. Lists – New – diamo un label ew il nome della tabella – Save – Add (sotto la colonna Elements per aggiungere elementi) – diamo nome last fm_id – Plugin: field – Hidden: yes – Save & New – creiamo un altro elemento con plugin field – Show in list: yes – Save & new – creiamo un altro elemento con plugin image – Show media in list: yes – Show in list: yes – branch master – webservice – plugins – fabrik list – web service – webservice.php – com_fabrik – modules web service.php – web service (forse) – rest.php (forse) – scarichiamo e installiamo il plugin web services – Lists – Last events – scheda Plugins – web service – il pulsante label contiene il testo che è mostrato a fianco l’elenco – Il Submit message appare dopo che la sincronizzazione è stata eseguita – Driver: rest join – L’end point è la URL che il web service interrogherà. Dovremmo ottenere questa url da last.fm. Prenderemo la parte della url incollata che contiene il filtro e le credenziali che inseriremo successivamente – nel sito last.fm clicchiamo Overview – copiare il codice sotto JSON Responses – lo incolliamo nella parte finale dell’End point – copiamo il codice API key (dal nostro account API) e lo incolliamo in: dopo aver premuto Select di Credentials – incolliamo il codice – Filter – Select – digitiamo key e value e inseriamo type: text – (da qui conviene guardare il video) – Il Foreign key permette di aggiornare i records memorizzati in Fabrik. Selezionare: last fm id – Update existing rows: se lezioniamo yes allora le righe si aggiorneranno anche quando il plugin è in svolgimento. Se clicchiamo no allora soltanto i nuovi dati saranno aggiunti all’elenco Fabrik – Data map abilita i campi web service nei loro elementi corrispondenti in Fabrik – Data map – Select – (conviene guardare il video) – Come creare un elemento plugin (corso per sviluppatori)