# j-Flow > j-Flow: identifikátory nemohou obsahovat char; NEW onpause {String} cesta k metodu fn(path, je), to se provádí, když je výstup / vstup přerušen Framework: jcomponent20 Product: jComponent 20 (jcomponent@20) Language: cs Content-SHA256: e0799a8a730974ba122138cae04107f9aa7aa3bc7f86d6e713722eebb39d8879 Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e Review: not-recorded - Identifikátory nesmí obsahovat `__` char __Konfigurace__: - `width {Number}` šířka Flow Designer, výchozí: `6000` - `height {Number}` výška Flow designer, výchozí: `6000` - Rozměry sítě `grid {Number}`, standardní: `25` - Vnitřní podložka `paddingX {Number}`, standardní: `6` - `curvedlines {Boolean}` umožňuje zakřivené linky, standardní: `false` - `infopath {String}` - cesta k variabilu / metodu, odpověď: `{ zoom: Number, selected: Object }` - `undopath {String}` je cesta k variabilnímu/metodu, odpověď je objekt - `redopath {String}` je cesta k variabilnímu/metodu, odpověď je objekt - Metoda `fn(dropmeta, grid)` - cesta k metodu `ondrop {String}` - `onmake {String}` je cesta k metodu `fn(el, com)`, která se provádí, když je složka vytvořena - `ondone {String}` je cesta k metodu `fn(el, com)`, která se provádí při vytváření komponenty - `onmove {String}` je cesta k metodu `fn(el, com/group, type)`, která se provádí, když se komponenta/skupina pohybuje - `onremove {String}` je cesta k metodu `fn(el, com)`, která se provádí, když je složka odstraněna - `onconnect {String}` je cesta k metodu `fn(meta)`, která se provádí, když jsou obě složky propojeny - `ondisconnect {String}` je cesta k metodu `fn(meta)`, která se provádí, když jsou dvě komponenty odpořeny. - __NEW__ `onpause {String}` je cesta k metodu `fn(path, is)`, která se provádí při přerušení výstupu / vstupu - `steplines {Boolean}` umožňuje krokové linky (předvolené: `false`) - Animační rádio `animationradius {Number}` v pixelů (předběžně: `5`) - `contextmenu {String}` je cesta k `function(e, type, component/meta)` (typ může být `map`, `component`, `connection`, `group`) - `dblclick {String}` - cesta k `function(component)` - `outputoffsetX {Number}` je standardní X offset pro výstupní bod (default: `10`) - `outputoffsetY {Number}` je standardní Y offset pro výstupní bod (default: `12`) - `inputoffsetX {Number}` je standardní X offset pro vstupní bod (default: `10`) - `inputoffsetY {Number}` je výchozí Y offset pro vstupní bod (předchozí: `12`) - `snapping {Number}` v pixelů (předvolené: `0` = zrušené) - `multiple {Boolean}` umožňuje více výběru složky (podmínkou: `true`) - `history {Number}` počítá kroky v historii undo/redo (předvolené: `100`) - `animationlimit {Number}` maximální počet bodů pro všechny animace (předvolené: `100`) - `animationlimitconnection {Number}` Maximální počet bodů na připojení (default: `5`) - `allowpause {Boolean}` umožňuje přestávku na výstupy/vstupy (předvolené: `true`) - `markers {Boolean}` přidává do připojení štítky (předvolené: `true`) __Příkazy__: - `flow.refresh` přepočítává pozice - `flow.selected.disconnect` vypne vybrané připojení - `flow.selected.remove` odstraňuje vybranou složku - `flow.selected.clear` odstraňuje vybranou součást nebo spojení - `flow.zoom` Připravuje se zoom, argument: `type` (Může být : `in`, `out`, `reset` nebo `percentage {Number}`Druhý volitelný argument: `percentage` - `flow.undo` se provádí krok - `flow.redo` se připravuje na krok - `flow.reset` Režisér - `flow.components.add` přidává novou složku, argument: `component_declaration` - `flow.components.find` nalezne složku, argument: `component_id` - `flow.clean` čistí data a neexistující připojení - `flow.traffic(componentid__outputid, { count: 3, speed: 3, limit: 20, delay: 50, reverse: false })` - animace - `reverse` animace může být aktivována přidáním `_` jako výchozí čár identifikátoru `_componentid__outputid` - __NEW__ `flow.groups.find` najde skupinu, argument: `group_id` - __NEW__ `flow.check` je nová rychlejší alternativa k příkazu `flow.refresh` - __NEW__ `flow.find` najde složku nebo skupinu, argument: `component_id` nebo `group_id` __Přidání nové složky__: - Součást automaticky vytváří ID součásti - `connections` Je to `{Object}` ```js // Component declaration var component = { x: 100, y: 50, html: 'Component test', outputs: ['1 output name', '2 output name'], // or // outputs: [{ id: 'A', name: 'A output name' }, { id: 'B', name: 'B output name', color: '#FF8E37' }], connections: { '0': [{ id: '0002', index: '2', disabled: false }] }, // Look to the connection object below // or // connections: { 'A': [{ id: '0002', index: 'B', disabled: false }] }, actions: { select: true, move: true, disabled: false, remove: true, connect: true } }; // Appends component CMD('flow.components.add', component); ``` ```js // Connection object // connections: { '0': [CONNECTION_OBJECT1, CONNECTION_OBJECT2, CONNECTION_OBJECT3] } { id: 'TARGET_ID_COMPONENT', index: '0', // An input index or index id, must be string!!! disabled: false // Optional, it's the connection disabled? Disabled connection can't be removed } ``` __Výstupní proud__: - Zpět na `Object`, které klíče jsou `ID` složek ```js { 'F1562743923216': { x: 1, y: 1, connections: [], ... }, 'F1562743965303': { x: 1, y: 1, connections: [], ... }, // Contains paused endpoints paused: { 'input__COMPONENTID__INDEXID': 1, 'output__COMPONENTID__INDEXID': 1 }, // Contains groups groups: [{ id: 'GroupID', name: 'Name', x: 100, y: 100, width: 100, height: 100, background: 'rgba(0,0,0,0.1)', color: '#000', border: 'rgba(0,0,0,0.1)' }, ...]; } ``` __Dobré vědět__: - Každá složka (v toku) obsahuje třídu `f-COMPONENTNAME` - třída `selectable` v prvku umožňuje kopírování textu a zabraňuje pohybu - `connections` podporuje `type:"transform"` s přímou linií Použijte ji s ``Pokud je součástka ještě nezačleněna, jComponent Stáhnout ji na první použití z adresy `DEF.fallback` a) The Componentator CDN dle předvolby. autor: Peter Širka. zdroj: Componentator Výrobce je autorizován, MIT licence. ```html example.html
```