Fabrik2

From Fabrik

Jump to: navigation, search

Contents

Cookie Jar

Mi piacerebbe aiutare ma non so da dove cominciare? Nella voce cookie jar abbiamo aggiunto un elenco di contenuti per la Guida, che non sono ancora stati scritti o comunque completati. Semplicemente fate un click sull'argomento del quale avete qualche esperienza e cominciate a scrivere!

Quando pensate di aver terminato la pagina, di averla completata o di averla semplicemente resa utile, dovete spostare il collegamento dal cookie jar a questa pagina. Se non avete confidenza con questo sistema inviate alla squadra di Fabrik una email, e noi saremo lieti di farlo per voi.

Questa pagina contiene tutte le pagine del wiki e ci piacerebbe fosse tradotta in :P. Non essere timido, se puoi donaci 2 minuti per iniziare, e modifica queste pagine, allora sarai grande!

Fabrik 2

Installation instructions

Please add information to Installation instructions in the cookie jar

Getting started

Please add information to Getting started in the cookie jar

Forms

Forms allow you to collect data from your users. When your form is set to record to a database table, it will also allow you to edit and view previously entered sets of data.

Please add information about forms to the cookie jar


Elements

Elements are the building blocks of both forms and tables. In forms they allow your users to enter data, and in tables they display the data already collected. A simple example of an element is the text field element. Fabrik comes with several elements, some of them highly customizable. These allow you to receive and validate different types of information and attain different goals. Your users can input and validate lots of different data such as text, dates, email, choice of database elements, radio box selections, etc. You can also use elements to perform CAPTCHA validations, save user information, geographic data, and many other things. If you can't find an element that does what you want yu can always ask for one or build one yourself.

There are a series of outstanding sections that are waiting for you to write in the cookie jar

JavaScript

The javaScript tab allows you to trigger code when your user interacts with the element.

action: the event that will trigger the code

code: js code that will run when the action occurs. the variable 'this' refers to the instance of the element js class e.g. for a field element this is the class fbField which can be found in /components/com_fabrik/plugins/elements/fabrikfield/javascript.js. All element plugin classes extend the FbElement class which can be found in /components/com_fabrik/views/form/element.js

Fabrik also provides some simple wysiwyg effects that you can apply to the element. To use these leave the 'code' field blank then fill in the following:

do: the effect to use that: what part of the form to apply the effect to is: when the element's value matches the condition (enter the value in the last field)

Example

Say we have an 'car accident report' form, the first group 'details' contains the main information about the accident.

Its last element is a radio button called 'add_location' and labelled 'Do you want to pin point the location of the accident'. It has two options 'yes' and 'no' (whose values are 1 and 0) this element default's to the 'no'.

Our form's second group is called 'location' and has further fields to define the accident's location. We want to hide the group when the form loads (as 'add_location' defaults to 'no'), show it when 'add_location' is 'yes' and hide it when 'add_location' is 'no'

So... enter the following events: 

 action: load 
 slideout 'location' when this == 0 

 action: click 
 slidein 'location; when this == 1 

 action: click 
 'location' when this == 0

Element Access Control

This table shows the various access setting and how they effect the element rendering when in the form view and details view:

element access
view access read only visible editable
details no yes yes no
details yes yes yes no
details no no no no
details yes no no no
form no yes yes no
form yes yes yes yes
form no no no no
form yes no yes yes

Groups

Groups are the glue that bind elements to a form, they can be considered like the html <fieldset> element. Forms can contain multiple groups and an element must be assigned to a group to appear in the form.

Please add information about groups to the cookie jar

Tables

Tables present the form's collected data.

Please add information about tables to the cookie jar

Pre-filters

Search

This will outline the various ways in which you can search data in Fabrik

Please add information about search to the cookie jar

Connections

Connections allow you to connect to different mySQL databases other than the one that Joomla is installed under.

Please add information about connections to the cookie jar

Visualizations

Visualizations take the data collected in your tables and presents them in a different format, for example plotting the data on a map, or showing it in a calendar.


Please add information about visualizations to the cookie jar

Designers

Please add information for designers to the cookie jar

Table templates

CSS Styles

The table view includes the following CSS files in this order. File in italics are included only if there exit. TEMPLATENAME is the name of the template table template selected.

  • components/com_fabrik/views/table/tmpl/TEMPLATENAME/template.css
  • media/com_fabrik/css/table.css
  • media/com_fabrik/css/custom.css
  • components/com_fabrik/views/table/tmpl/TEMPLATENAME/custom.css

Javascript scripts

The table view includes the js scripts in the following order if there exist.

  • components/com_fabrik/views/table/table.js
  • components/com_fabrik/views/table/tmpl/TEMPLATENAME/javascript.js

If the advanced search is activated then the following script with be included as well

  • media/com_fabrik/js/advanced-search.js

Template overall structure

default.php 

<?php 
foreach ($this->rows as $groupedby => $group) {
	foreach ($group as $this->_row) {
		echo $this->loadTemplate( 'row' ); 
 	}
}
?>

default_row.php renders each row of the table view - the simplest way to render it is to iterate over the headings 

<?php 
foreach ($this->headings as $heading=>$label) {
	$this->_row->data->$heading;
?>

To access a specific element you can do: 

$this->_row->data->tablename___elementname ;//replace 'tablename___elementname' with your element's full name

Some useful tags you may want to access include: 

$this->_row->data->fabrik_delete;// shows the row's delete button
 
$this->_row->data->fabrik_view;// shows the row's view link

Accessing to table information

Below is a list of variables that can be accessed in a table template. Technically these variables are set by the table view (see com_fabrik/views/table/view.html.php). 

* $this->table->id // id of the table (integer)            
* $this->table->label  // label of the table
* $this->table->intro  // introduction text
* $this->table->db_table_name // name of the corresponding database table if any
  • $this->params // joomla parameters
    • $this->params->get('show_page_title')
    • $this->params->get('page_title')
    • ...
  • $this->fabrik_userid
  • $this->group_by
  • Global actions (buttons such as Add, Subscribe to RSS, etc.)
    • Adding record
      • $this->showAdd
      • $this->addRecordLink
      • $this->addRecordId
    • Delete Record
      • $this->canDelete
      • $this->deleteButton
    • Emptying table
      • $this->emptyButton
    • CSV features
      • $this->showCSV // can export CSV ?
      • $this->showCSVImport // can import CSV ?
      • $this->csvImportLink
    • PDF display
      • $this->showPDF
      • $this->pdfLink
    • RSS Subscription
      • $this->showRSS
      • $this->rssLink
  • Navigation
    • $this->nav // the html code corresponding to the navigation (this html is produced by the file helpers/pagination.html)
    • $this->getModel()->nav // same name but this is a Pagination object
    • $this->getModel()->nav-> ...TBC....


  • Filtering
    • $this->filter_action
    • $this->filters
    • $this->assign( 'showFilters', (count($this->filters) ) > 0 ? 1 : 0 );
  • Calculations
    • $this->assignRef( 'calculations', $this->_getCalculations( $this->headings ) );
  • ...TBC...
  • $this->assign( 'emptyDataMessage', $msg );
  • $this->assignRef( 'groupheadings', $groupHeadings );
  • $this->assign( 'isGrouped', $table->group_by );
  • $this->assign( 'colCount', count($this->headings) );
  • $this->assignRef( 'grouptemplates', $model->grouptemplates );
  • $this->assignRef( 'params', $params );
  • $this->tablePicker
  • $this->pluginButtons = $model->getPluginButtons();

=== Accessing to the model

  • $this->getModel()

How To

Form templates

Customizing a form template

Two templates are associated for each given form (see the "templates" tab in the "form" section):

  • one for the "detailed view" (read only mode)
  • the other for the regular form view.

Some templates are provided by default but one can add new ones. Form templates are stored in the following directory

         /component/com_fabrik/views/form/tmpl

To create a new custom template, the easier way to proceed is to copy an existing one to a new directory and then to modify it. There is an example below. 

<?php 
$form = $this->form;
reset($this->groups);
$group =& current($this->groups);
$row = $group->elements;
 
//if your form has more than one group, get the next group with this code
$nextgroup = next($this->groups);
$nextrow = $nextgroup->elements;
 
echo $form->startTag;  //output the <form> tag
echo $form->intro; // output form's intro text
echo $this->plugintop; //output any content added via a form plugin
 
$active = ($form->error != '') ? '' : ' fabrikHide';
echo "<div class='fabrikMainError fabrikError$active'>" . $form->error . "</div>";?>
 
<div><?php echo $this->message ?></div>
 
<?php
// Here we are going to render an element whose name is 'image'. 
// Note we are using the short name and not the long name (e.g. 'tablename___elementname') 
// as we have already drilled down to the group's elements at the start of the template.
 
//Each element needs to be wrapped inside a container element with the class set as below	
?>
<div class="<?php echo $row['image']->containerClass;?>">
<?php echo $row['image']->element; ?>
</div>
 
<?php
// NOTE When using a form to edit table data, 
// you should ALWAYS have you form's primary key element included in your template
?>
 
<?php
	echo $this->hiddenFields;
	?>
	<?php echo $this->pluginbottom; ?>
	<div class="fabrikActions">
	<?php echo $form->resetButton;?> 
	<?php echo $form->submitButton;?>
	<?php echo $form->copyButton  . " " . $form->gobackButton?>
	</div>
 
<?php echo $form->endTag; ?>

In the above example the object $row['image'] has the following properties:

  • error : An error message that needs to be presented if the element has failed a validation
  • plugin : the name of the element plug-in
  • hidden : if the element is hidden or not
  • id : the full element name e.g. tablename___image
  • className : depreciated and not used
  • containerClass : the classname for the DOM object that surrounds the element (e.g. in the default template this is the <li> element)
  • element : the default 'widget' to show in the form, the output of this depends on whether you are in a form or detailed view and the access level associated with the element
  • label : the html containing the element's label
  • column : the css required to render the element in a column, this css should be applied to the container DOM object
  • element_ro : this contains the read only representation of the element, regardless of whether you are in a form or detailed view. Sometimes it may be the same as the 'element' property.
  • element_raw: Only appears when editing a record, contains the element's value that is stored in the database
  • value : Appears when both editing or adding a record. When adding it contains the element's default value, when editing this is synonymous with element_raw


Moving labels inside fields

To mimic the effect show at this page (http://www.blacksburg-law.com/) note not a fabrik form, you can do the following:

Create a new file in /media/com_fabrik/js/labels.js

Clone your form template and at the bottom add the following php code: 

<?php JHTML::script('labels.js', '/media/com_fabrik/js/');?>

this will load up the label.js file into your template.

Now create a new file in /media/com_fabrik/js/labels.js and add the following code: 

var Labels = new Class({
	initialize:function(){
		$$('.fabrikElementContainer').each(function(c){
		  var label = c.getElement('label');
		  if($type(label) !== false){
		    var input = c.getElement('input');
		    if($type(input) == false){
	        input = c.getElement('textarea');
		    }
		    if($type(input) !== false){
		    	 input.value = label.innerHTML;
		    	input.addEvent('click', this.toogleLabel.bindAsEventListener(this, [input, label.innerHTML]));
		    	input.addEvent('blur', this.toogleLabel.bindAsEventListener(this, [input, label.innerHTML]));
		    	label.innerHTML = '';
		    	c.getElement('.fabrikLabel').remove();
		    }
 
		  }
		}.bind(this))
	},
 
	toogleLabel: function(e, input, label)
	{
		new Event(e).stop();
		if(e.type == 'click'){
			if(input.getValue() == label){
				input.value = '';
			}
		}else{
			if(input.getValue() == ''){
				input.value = label;
			}
		}
	}
 
});
 
Labels.implement(new Events);
 
window.addEvent('domready', function(){
	new Labels();
});

This will work only on textarea and input elements



Email templates

Translation

Fabrik default language is English (en-GB). At the moment there are translations of the following languages: English, German, French, Italian, Spanish and Russian.

Install language:
Since Fabrik don't use automatic language installation you have to use FTP to upload the language files. In the installation zip-file there are two folders called language. One is in the root of the folder and the other one is in the administrator folder. If you can't find your language here you should look for it in Fabrik SVN.

Fabrik uses Joomla's JText class so all you have to do is to upload the language files into the corresponding folder in you Joomla directory.
For example: If your Joomla site is in German you un-zip the Fabrik installation folder and open up language/de-DE. Use an FTP application to upload these files to root/language/de-DE. Then go back to Fabrik's installation folder and open administrator/language/de-DE. Upload these files to root/administrator/language/de-DE.

How to translate:
Copy the Fabrik language files and rename them into your language.
For example: If your Joomla site is in Norwegian you copy the en-GB files that comes with Fabrik. Then change the language/country code from en-GB (Brittish English) to nb-NO (Norwegian).
Translate the files and upload them into Joomla's corresponding language folders.


Joomfish

Developers

Please add information for developers to the cookie jar

Mootools 1.111 documentation

Mootools 1.2 documentation

Neat tips

Stuff that doesn't go anywhere else but is still cool!

Creating an amazon affiliate link

Comparing two dates in javascript

Deciding in PHP if a date within an age range


How To

Here is a list of "How To" items, that refers to the fabrik forum, fabrik tutorials but organized in a logical way. Only the forum posts that provide substantial information are listed here.

  • Plugins
  • Frequenty Asked Questions
  • Completed
  • Hints, Tips and Tricks
  • Form templates
  • Table templates


Table

Detailed View

Form

Groups

Elements

Visualizations

Templates

Placeholders

Misc

Development

Integration with other components

JomSocial

Retrieved from "http://fabrikar.com/wiki/index.php/Fabrik2"
Personal tools