# j-Panel

> Noua versiune a acestui component susține evaluarea dinamică a conținutului <script tip='text/html'>. exemplul de mai jos conține un script cu HTML și componenta evaluează conținutul dacă j-Pa

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

- Modul întunecat - Dark Mode

__Configurarea__:

- `title {String}` Titlul ferestrei
- Condiția `if {String}` pentru afișarea ferestrei, este comparată cu valoarea din interiorul `path`
- `icon {String}` Iconul total fără `ti-`
- `reload {String}` este conectat la o funcție globală și este executat dacă formularul este afișat
- `enter {Boolean}` este opțional, captă în mod automat cheia `enter` și efectuează transmiterea (default: `false`)
- `autofocus {Boolean/String}` opțional, poate fi concentrată o intrare. `String` === `jQuery selector` pentru intrarea
- `default {String}` opțional, un alias scurt pentru `DEFAULT(default, true)`
- `closebutton {Boolean}` opțional, poate ascunde butonul `x` (default: `false`)
- `width {Number}` opțional, o lățime de bază a panourilor (default: `300`)
- `bg {Boolean}` opțional, poate fi dezactivat `background` (default: `true`)
- `bgclose {Boolean}` opțional, dacă utilizatorul face clic pe fundal, atunci panourile vor fi închise (default: `false`)
- `zindex {Number}` opțional, poate afecta indexul z (default: `12`)
- `close {String}` opțional, calea/metoda este executată ca `path_to_method(com)` atunci când utilizatorul închide manual panourile prin butonul închis
- `scrollbar {Boolean}` opțional, permite scrollbar-ul personalizat (default: `true`)
- `scrollbarY {Boolean}` opțional, afișează un scroll-bar personalizat (default: `true`)
- `scrollbarshadow {Boolean}` opțional, permite o umbră în scrollbar (default: `false`)
- `menu {String}` opțional, un link la funcție (panelul va afișa un buton cu iconul de burger în barul de titlu)
- `container {String}` opțional, jQuery selector (acest container înseamnă un container pentru scrollbar)
- `margin {Number}` opțional, o marjă pentru `container` și `scrollbar` (acest lucru funcționează numai cu `container`)
- `closeicon {String}` opțional, iconul Font-Awesome (default: `ti ti-times`)
- __NEW__ `closeesc {Boolean}` închide formularul atunci când utilizatorul prestează cheia `ESC`

__bine să știi__:

Noua versiune a acestui component sprijină evaluarea dinamică a conținutului `<script type="text/html">`. exemplul de mai jos conține un script cu HTML și componenta evaluează conținutul dacă va fi afișat j-Panel (numai o dată).

```html
<ui-component name="panel" path="path" config="config">
	<script type="text/html">
		A CONTENT
	</script>
</ui-component>
```

Utilizați-l cu `<ui-component name="panel">`Când componenta nu este încă încărcată, jComponent Descărcați-l la prima utilizare de la adresa `DEF.fallback` (în cazul Componentator Autor: Peter Širka. sursă: Componentator Componente de stocare, MIT licență.

```html example.html
<ui-component name="panel" path="common.panel" config="if:user;title:Title of this panel" class="hidden">
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
</ui-component>

<script>
	var common = {};
	common.panel = 'user';
</script>
```