Javascript для перетворення Markdown / Textile в HTML (і, в ідеалі, повернення в Markdown / Textile)

Існує кілька хороших редакторів Javascript для Markdown / Textile (наприклад: http://attacklab.net/showdown/ , той, який я використовую зараз), але все, що мені потрібно, це функція Javascript, яка перетворює рядок із Markdown / Textile -> HTML і назад.

Який найкращий спосіб це зробити? (В ідеалі це було б зручно для jQuery - наприклад, $("#editor").markdown_to_html())

Редагувати: Інший спосіб сказати, що я шукаю реалізацію Javascript для Rails ' textilize()і markdown()текстових помічників

Для Markdown -> HTML існує Showdown

Сам StackOverflow використовує мову Markdown для питань та відповідей; ти намагався поглянути, як це працює?

Ну, схоже, він використовує PageDown, який доступний за ліцензією MIT

Питання Чи є якась бібліотека чи контроль Markdown Javascript? і його відповіді також можуть допомогти :-)

Повний редактор - це, звичайно, не зовсім те, про що ви просили; але вони повинні використовувати якусь функцію для перетворення коду Markdown в HTML; і, залежно від ліцензії цих редакторів, ви можете повторно використовувати цю функцію ...

Насправді, якщо ви уважно подивитесь на Showdown, у його джерелі коду (файл showdown.js) ви знайдете цю частину коментаря:

//
// Showdown usage:
//
//   var text = "Markdown *rocks*.";
//
//   var converter = new Showdown.converter();
//   var html = converter.makeHtml(text);
//
//   alert(html);
//
// Note: move the sample code to the bottom of this
// file before uncommenting it.
//

Це не синтаксис jQuery, але його слід легко інтегрувати у вашу програму ;-)

Щодо текстилю, здається, дещо важче знайти щось корисне :-(

З іншого боку, HTML -> Markdown, я думаю, все може бути трохи складніше ...

Що б я зробив - це зберігати як Markdown, так і HTML у своєму сховищі даних додатків (базі даних?), І використовувати один для редагування, а інший для візуалізації ... Це зайняло б більше місця, але це здається менш ризикованим, ніж "розшифровка" HTML. ..

Я вважав, що варто було б скласти тут список рішень для JavaScript, а також їх мінімізований (нестиснутий) розмір та сильні та слабкі сторони. Стислий розмір для зменшеного коду складатиме близько 50% від стисненого розміру. До чого це зводиться:

• Використовуйте showdown (28 КБ), якщо вам потрібна всебічна підтримка, і ви матимете відредаговані користувачем або довільні документи.
• Використовуйте підкачування (8 КБ ), якщо у вас є відредаговані / довільні документи, але вам не потрібні речі, такі як таблиці, списки визначень або виноски (наприклад, коментарі на веб-сайті, як StackExchange).
• Використовуйте моє власне зменшення (1,3 КБ), якщо вам потрібна досить висока якість та підтримка столу, але ви хочете вагу пір’я і не потребуєте кожного окремого кромкового випадку.
• Використовуйте одну з інших, якщо вам потрібні унікальні можливості, такі як безпека чи розширення.

Усі вони використовують ліцензію MIT, більшість із них - на npm.

• розбірки : 28KB. В основному золотий стандарт; це основа для виведення сторінки.

• підкатегорія : 8 КБ . Це те, що забезпечує StackExchange, тому ви самі можете переконатися, які функції він підтримує (він дуже надійний, але відсутній таблиці, списки визначень, виноски тощо). На додаток до сценарію конвертера 8 КБ, він також пропонує сценарії редактора та дезінфікуючого засобу, обидва з яких також використовує StackExchange.

• просадка : 1,3 КБ. Повне розкриття, я це написав. Ширший спектр функцій, ніж будь-який інший полегшений перетворювач; обробляє більшість, але не всі специфікації CommonMark. Не рекомендується для редагування користувачами, але дуже корисно для подання інформації у веб-програмах. Немає вбудованого HTML.

• уцінки-он : 104KB. Дотримується специфікації CommonMark; підтримує розширення синтаксису; виробляє безпечний вихід за замовчуванням. Швидкий; насправді може бути настільки ж надійним, як розборки, але дуже великим. Є основою для http://dillinger.io/ .

• з позначкою : 19KB. Всебічний; тестується набір модульних тестів; підтримує власні правила lexer.

• micromarkdown : 5KB. Підтримує багато функцій, але відсутні деякі загальні, такі як невпорядковані списки, *а також деякі загальні, які не є строго частиною специфікації, як огороджені блоки коду. Багато помилок, створює винятки для більшості довших документів. Я вважаю це експериментальним.

• нано-уцінка : 1.9KB. Обсяг функцій обмежений речами, якими користується більшість документів; більш міцний, ніж мікромаркдаун, але не ідеальний; використовує власний дуже базовий одиничний тест. Розумно надійний, але розбивається на багатьох крайніх випадках.

• mmd.js : 800 байт. Результат зусиль зробити якомога менший синтаксичний аналізатор, який досі функціонує. Підтримує невелику підмножину; документ повинен бути адаптований для нього.

• markdown-js : 54 КБ (недоступний для завантаження, зменшений; можливо, він буде зменшений до ~ 20 КБ). Виглядає досить вичерпно і включає тести, але я з цим не дуже обізнаний.

• Meltdown : 41KB (не доступно для завантаження мінімізовані, ймовірно Мінімізувати до ~ 15KB). плагін jQuery; Markdown Extra (таблиці, списки визначень, виноски).

• unified.js : варіюється, 5-100 КБ. Система на основі плагінів для перетворення між HTML, знижкою та прозою. Залежно від того, які плагіни вам потрібні (перевірка орфографії, виділення синтаксису, дезінфекція введення), розмір файлу буде різнитися. Можливо, використовується більше на стороні сервера, ніж на стороні клієнта.

Текстильна

Ви можете знайти , здавалося б , дуже тонкою реалізації Javascript текстильних тут , а інший там (може бути , не так добре, але є хороший приклад сторінки новонавернений-як-ви-типу).

Примітка: у першій реалізації, на яку я зробив посилання, є помилка: горизонтальні смуги відображаються неправильно. Щоб виправити це, можна додати такий файл у файл.

for(i=0;i<lines.length;i++) {
    // Add code :Start
    if (lines[i].match(/\s*-{4,}\s*/)){
      html+="<hr/>\n";
      continue;
    }
    // Add code :End
    if (lines[i].indexOf("[") == 0) {continue;}
    //...

Я використовую крихітний мінімалістичний сценарій - mmd.js , який підтримує лише підмножину можливостей Markdown, але це все одно може знадобитися, тому цей скрипт, розмір якого менше 1 кб, дивовижний і не буде надмірним.

Підтримувані функції

• Заголовки #
• Блок-цитати >
• Впорядковані списки 1
• Невпорядковані списки *
• Абзаци
• Посилання []()
• Зображення ![]()
• Вбудований наголос *
• Вбудований наголос **

Непідтримувані функції

• Довідки та посвідчення особи
• Втеча символів Markdown
• Вкладання

Легко використовувати Showdown з jQuery або без нього . Ось приклад jQuery:

// See http://mathiasbynens.be/notes/showdown-javascript-jquery for a plain JavaScript version as well
$(function() {
 // When using more than one `textarea` on your page, change the following line to match the one you’re after
 var $textarea = $('textarea'),
     $preview = $('<div id="preview" />').insertAfter($textarea),
     converter = new Showdown.converter();
 $textarea.keyup(function() {
  $preview.html(converter.makeHtml($textarea.val()));
 }).trigger('keyup');
});

Посилання Showdown Attacklab не працює, тому використовуйте https://github.com/coreyti/showdown для своїх потреб перетворення :)

Це не стосується всього запиту (це не редактор), але textile-js - це бібліотека рендеринга javascript: https://github.com/borgar/textile-js . Демонстрація доступна за адресою http://borgar.github.io/textile-js/

Це питання мені здалося інтригуючим, тому я вирішив щось розпочати (замінює лише теги strongта italicрозмітку). Провівши годину, намагаючись розробити рішення, використовуючи регулярні вирази, я відмовився і закінчив із наступним, що, здається, добре працює. Тим не менш, його, безсумнівно, можна додатково оптимізувати, і я не впевнений у тому, наскільки він буде стійким у реальному світі в такому вигляді:

function mdToHtml(str) {
    var tempStr = str;
    while(tempStr.indexOf("**") !== -1) {
        var firstPos = tempStr.indexOf("**");
        var nextPos = tempStr.indexOf("**",firstPos + 2);
        if(nextPos !== -1) {
            var innerTxt = tempStr.substring(firstPos + 2,nextPos);
            var strongified = '<strong>' + innerTxt + '</strong>';
            tempStr = tempStr.substring(0,firstPos) + strongified + tempStr.substring(nextPos + 2,tempStr.length);
        //get rid of unclosed '**'
        } else {
            tempStr = tempStr.replace('**','');
        }
    }
     while(tempStr.indexOf("*") !== -1) {
        var firstPos = tempStr.indexOf("*");
        var nextPos = tempStr.indexOf("*",firstPos + 1);
        if(nextPos !== -1) {
            var innerTxt = tempStr.substring(firstPos + 1,nextPos);
            var italicized = '<i>' + innerTxt + '</i>';
            tempStr = tempStr.substring(0,firstPos) + italicized + tempStr.substring(nextPos + 2,tempStr.length);
        //get rid of unclosed '*'
        } else {
            tempStr = tempStr.replace('*','');
        }
    }
    return tempStr;
}

Тестовий код:

    var s = "This would be *italicized* text and this would be **bold** text, This would be *italicized* text and this would be **bold** text, This would be *italicized* text and this would be **bold** text";
    alert(mdToHtml(s));

Вихід:

This would be <i>italicized</i>text and this would be <strong>bold</strong> text, This would be <i>italicized</i>text and this would be <strong>bold</strong> text, This would be <i>italicized</i>text and this would be <strong>bold</strong> text

EDIT: Нове у V 0.024 - Автоматичне видалення незакритих тегів розмітки

markdown-js - симпатичний синтаксичний аналізатор markdown, активний проект із тестами.

Чи заглядали ви в бібліотеку Eclipse WikiText, яка є частиною Mylyn. Він перетворить із багатьох вікі-синтаксису на xhtml та xdocs / DITA. Це виглядає якось круто.

http://help.eclipse.org/galileo/topic/org.eclipse.mylyn.wikitext.help.ui/help/Markup-Conversion.html

Хтось знайшов рішення проблеми HTML-> текстиль? Вся наша поточна документація у форматі M $ Word, і ми хотіли б додати її до Redmine Wiki для спільного обслуговування. Ми не знайшли жодного інструменту для перетворення. Ми знайшли розширення Open Office, яке створює текст у форматі mediawiki, але Redmine Wiki використовує підмножину текстилю.

Хтось небудь знає інструмент , який перетворює До текстилем з MediaWiki, Word, XDocs або HTML?

Для текстилю:

Нещодавно я зібрав конвертер HTML в текстиль: https://github.com/cmroanirgo/to-textile

Для зворотного текстилю до HTML я використовую та рекомендую https://github.com/borgar/textile-js , про які вже згадували інші відповіді.