# j-Part

> Questo componente può gestire diversi contenuti in modo asincronico.Se l'elemento non contiene alcun contenuto, il componente scarica il contenuto secondo l'URL definito nella configurazione.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: it
Content-SHA256: 5c6afbf44cdef168d977c021e7048cd8f6a15f33d833b69d0ac0c18918a1e4ca
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Questo componente può gestire diversi contenuti in modo asincronico. __Se l'elemento non contiene alcun contenuto__ quindi il componente scarica il contenuto secondo il `url` definito nella configurazione.

- __NEW__ `path` può contenere `{String Array}`

__Configurazione__:

- `url {String}` richiesto, un indirizzo URL relativo
- `if {String}` richiesto, condizione, è paragonato al valore all'interno di `path` (__NEW__: supporta più percorsi divisi dal `comma`)
- `reload {String}` opzionale, un collegamento alla funzione `function(init) {}`, viene eseguito quando la parte è visibile (sempre)
- `hidden {String}` opzionale, un collegamento alla funzione, viene eseguito quando la parte è nascosta (sempre)
- `init {String}` opzionale, un collegamento alla funzione, viene eseguito quando la parte è visibile e in tempo
- `default {String}` opzionale, un breve alias per `DEFAULT(default)`
- `hide {Boolean}` opzionale, elemento auto-scuro se la condizione `if` non è valida (default: `true`)
- `cleaner {Number}` opzionale, tempo idle (in minuti) per il funzionamento della pulizia (default: `0`)
- `clean {String}` opzionale, un collegamento alla funzione, viene eseguito prima che la parte sia pulita
- `loading {Boolean}` opzionale, permette il carico tramite `SETTER('loading')` (default: `true`)
- `path {String}` opzionale, il componente sostituisce tutte le frasi `~PATH~` e `CLASS` per il valore del `path` nel modello scaricato
- `replace {String}` opzionale, un collegamento al metodo `function(content) { return content }` che può modificare il modello scaricato
- `absolute {Boolean}` opzionale, consente posizione assoluta (default `false`)
- `check {String}` opzionale, un collegamento alla funzione `function(next) { next(); }`, viene eseguito quando la parte vuole mostrare
- `invisible {Boolean}` consente di aggiungere la classe `invisible` quando la parte va a nascondere (default: `false`)
- `delay {Number}` un ritardo (in ms) per la rimozione della classe `invisible` e il nascondimento di `loading` (default: `500`)
- `autofocus {Boolean/String}` focalizza la prima input, textarea (default: `false`)
- `delayloading {Number}` un ritardo (in ms) per nascondere `loading` (default: `800`)
- `id {String}` un identificatore personalizzato per sostituire le frasi `~ID~` nel HTML importato (default: vuoto)

__Buono sapere 1__:

- Le frasi `CLASS` e `~PATH~` saranno sostituite automaticamente da `config.path` o `config.if`.
- Le frasi `~ID~` saranno sostituite automaticamente da `config.id`

__Bene di sapere 2__:

Il componente emette un `event` nel modulo: `parts.` + `config.if` per l'estensione delle parti. Questo può essere molto utile per alcuni sistemi di plugin.

__Buona conoscenza 3__:

Se il componente non è all'interno della portata, allora il valore del `config.if` sostituirà i caratteri `?` in tutte le chiavi di configurazione.

```js
ON('parts.YOURIFCONDITION', function(element, pagecomponent) {
	// It's executed only when the part is initialized
});
```

Utilizzare con `<ui-component name="part">`Quando il componente non è ancora caricato, jComponent Scarica il codice in prima utilizzazione dall'indirizzo `DEF.fallback` (Il Componentator La storia di Peter Širka.Fonte: il Componentator Ristorante dei componenti, licenza MIT.

```html example.html
<ui-component name="part" path="currentpart" config="if:home;url:/bla/bla/home.html"></ui-component>
<ui-component name="part" path="currentpart" config="if:services;url:/bla/bla/services.html;reload:services_reload"></ui-component>
<ui-component name="part" path="currentpart" config="if:contact;url:/bla/bla/contact.html;reload:contact_reload"></ui-component>

<pre><code>SET(&#39;currentpart&#39;, &#39;home&#39;);</code></pre>

<script>
	var currentpart = '';
</script>
```