# j-Markdown

> Questo componente contiene solo Markdown parser.

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

Questo componente contiene solo Markdown parser.

__Configurazione__:

- `highlight {Boolean}` consente un'alta illuminazione auto-sintax (default: `true`)
- `charts {Boolean}` consente di rendere i grafici Apex (default: `false`)
- `cdn {String}` un indirizzo URL CDN predefinito per le dipendenze di terze parti (predefinita: `DEF.cdn`)

__Impostazioni di Markdown__:

```js
var opt = {};
var text = 'YOUR_MARKDOWN_STRING';

console.log(text.markdown(opt));
```

- `opt.wrap = true` rimuove la produzione con `<div class="markdown">YOUR_MARKDOWN</div>`
- `opt.linetag = 'p'` è una nuova linea
- `opt.ul = true` consente elenchi non definiti
- `opt.code = true` permette i codici personalizzati
- `opt.images = true` per le immagini
- `opt.links = true` permette il collegamento
- `opt.formatting = true` consente di formattare il testo
- `opt.icons = true` consente i simboli Font-Awesome tramite `:home:` o `:cog:`
- `opt.tables = true` per le tabelle
- `opt.br = true` consente nuove linee tramite `<br>`
- Le linee `opt.emptynewline = true` vuote saranno rilasciate come linee vuote
- `opt.headlines = true` per le titoli
- `opt.hr = true` consente le interruzioni di pagina
- `opt.blockquotes = true` permette il blocco di `< blockqote`
- `opt.custom = function(line) { return line; }` per ogni linea lavorata
- `opt.html = function(line, type) { return line; }` per ogni linea post-processata
- `opt.sections = true` permette le sezioni `> section`
- `opt.footnotes = true` consente note di `#1: foot note description` e utilizzo in collegamenti `[link](#1)`
- `opt.urlify = true` converte gli indirizzi URL in link
- Le parole chiave di `opt.keywords = true` nel modulo `{keyword}(type)`
- `opt.noredraw = true` riproduzione di codice/video/sezione/parte di blocco (default: `false`)
- L'elemento `opt.element {jQuery}` HTML che verrà utilizzato come elemento predefinito in `FUNC.markdownredraw()`
- `opt.bookmarks {Boolean}` consente/disabilita la creazione di caratteri di titolo `id=""` (default: `true`)
- `opt.prefix {String}` è un prefix per i bookmark (default: `empty`)
- __NEW__: `opt.ol = true` consente elenchi ordinati

__Buono sapere__:

- Le immagini saranno con la classe `img-responsive`
- Le immagini con `![+Image description](URL)` saranno formattate come immagini in linea
- Le immagini con `![-Image description](URL)` saranno rilasciate come un'immagine in linea con la classe `gallery` invece di `img-responsive`.
- Tutti i collegamenti sono con l'attributo `_target="_blank"`
- registri di taglio `FUNC.markdownredraw(jQuery_selector, [markdown_options])` per la predisposizione degli elementi dinamici di taglia come il codice, i video o i grafici
- La sezione segreta è definita come il codice con la sintasi `secret`
- La classe `markdown-small` può ridurre le dimensioni delle lettere
- L'evento `ON('markdown', function(el, opt) {})` viene eseguito se il marchio è pre-renderato (`el {jQuery}` è l'elemento `<body` nella maggior parte dei casi)
- Registro di componenti `Thelpers.markdown([opt])`
- Ogni linea renderata contiene la classe `markdown-line` e l'attributo `data-line="line_number"`

__Sezione coerente:__

```html
::: Section name
Another markdown content
:::
```

## __NEW__: utilizzo in linea

```html
<ui-markdown config="code:true|false (default);small:true|false (default)">
	<script type="text/plain">
		YOUR MARKDOWN CONTENT
	</script>
</ui-markdown>
```

Utilizzare con `<ui-component name="markdown">`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="info"></ui-component>
<ui-component name="markdown" config="highlight:false"></ui-component>

<ui-bind path="markdown" config="html:Thelpers.markdown(value)" class="block"></ui-bind>

<hr />

<ui-markdown>
	<script type="text/plain">
# Hello world!

Inline markdown defined in `<ui-markdown>` element.
	</script>
</ui-markdown>

<script>
	var markdown = '# Hello `world`\nLorem ipsum dolor sit amet, **consectetur** adipisicing elit. Eius [1](#1), ~~illo~~.\n\n> This is a simple blockquote\n\n< And this one is section\n\n```javascript \nalert(\'Markdown Preview\');\n```\n\n::: Toggleable section\nHello world!\n:::\n\n```secret\nHello world\n```\n\n#1: footnote';

	$(document).on('mouseenter mouseleave click', '.markdown-footnote', function(e) {
		if (e.type === 'mouseenter' || e.type === 'click') {
			var el = $(this);
			var opt = {};
			opt.element = this;
			opt.offsetX = 10;
			opt.html = $('.markdown-footnotebody[data-id="{0}"]'.format(el.attrd('id'))).html();
			SETTER('info/show', opt);
		} else
			SETTER('!info/hide', true);
	});

</script>
```