# j-Markdown

> Този компонент съдържа само Markdown parser.

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

Този компонент съдържа само Markdown parser.

__Конфигуриране__:

- `highlight {Boolean}` позволява автосинтезиране на високата светлина (предварително: `true`)
- `charts {Boolean}` позволява Apex графики (предварително: `false`)
- `cdn {String}` е стандартна URL адреса на CDN за зависимост от трета страна (предварително: `DEF.cdn`)

__Маркиране на настройките__:

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

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

- `opt.wrap = true` отвлича производството с `<div class="markdown">YOUR_MARKDOWN</div>`
- `opt.linetag = 'p'` е дефолтната нова линия
- `opt.ul = true` дава възможност за изчислени списъци
- `opt.code = true` позволява персонализирани кодове
- `opt.images = true` позволява изображения
- `opt.links = true` позволява връзки
- `opt.formatting = true` дава възможност за основен текст форматиране
- `opt.icons = true` позволява икони на Font-Awesome чрез `:home:` или `:cog:`
- `opt.tables = true` позволява таблици
- `opt.br = true` позволява нови линии чрез `<br>`
- `opt.emptynewline = true` Празни линии ще бъдат представени като празни линии
- `opt.headlines = true` позволява заглавия
- `opt.hr = true` позволява прекъсване на страницата
- `opt.blockquotes = true` позволява блок квоти `< blockqote`
- `opt.custom = function(line) { return line; }` - персонализиран парсер за всяка обработена линия
- `opt.html = function(line, type) { return line; }` - персонализиран парсер за всяка следпроцесирана линия
- `opt.sections = true` позволява разделите на `> section`
- `opt.footnotes = true` позволява нотифициране на `#1: foot note description` и използване в връзки на `[link](#1)`
- `opt.urlify = true` преобразува URL адресите в връзки
- `opt.keywords = true` Parse ключови думи във формата на `{keyword}(type)`
- `opt.noredraw = true` Скип пренасочване на кода / видео / секция / блокови части (предварително: `false`)
- `opt.element {jQuery}` HTML елемент, който ще бъде използван като подразбиране в `FUNC.markdownredraw()`
- `opt.bookmarks {Boolean}` позволява/невъзможни за създаване на букмейкъри заглавие `id=""` (предварително: `true`)
- `opt.prefix {String}` е префикс за букмейкъри (предварително: `empty`)
- __NEW__: `opt.ol = true` позволява поръчани списъци

__Добре е да се знае__:

- Снимките ще бъдат с клас `img-responsive`
- Снимките с `![+Image description](URL)` ще бъдат форматирани като инлайн
- Снимките с `![-Image description](URL)` ще бъдат представени като инлайн изображение с клас `gallery` вместо `img-responsive`
- Всички връзки са с `_target="_blank"` атрибут
- Регистриране на маркировките `FUNC.markdownredraw(jQuery_selector, [markdown_options])` за пренасочване на динамични елементи като код, видеоклипове или графики
- Секретната секция е дефинирана като код с синтез `secret`
- Класа `markdown-small` може да намали размера на шрифта
- събитие `ON('markdown', function(el, opt) {})` се изпълнява, ако марката е предварително предадена (`el {jQuery}` е елемент `<body` в повечето случаи)
- Комплектът за регистрация на `Thelpers.markdown([opt])`
- Всяка рендерирана линия съдържа клас `markdown-line` и атрибут `data-line="line_number"`

__Съвместими секции:__

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

## НОВА: Връзка с използване

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

Използвайте го с `<ui-component name="markdown">`Когато компонентът все още не е зареден, jComponent Изтегляне на първия адрес в `DEF.fallback` (След това Componentator Източник: Питър Шерка Componentator Съставни съставки, лиценз на 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>
```