Support Markdown in the TextEditor example, including local paths

The example still loads an HTML file from resources by default, but now
it's possible to give either a relative or absolute file path on the
command line to load an html, markdown or plain text file. Alternatively
you can use the file dialog to load any of these types. We assume that
any resources (such as images) with relative paths are to be loaded from
the directory where the source text file is.

Change-Id: I37bc2d6aa2306016453770dc2fd66efa41a16618
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
(cherry picked from commit 0672882cab3aa2fa9695b4d6b1b3e894c6fa6ebb)

7 files changed, 193 insertions, 6 deletions

diff --git a/examples/quickcontrols2/texteditor/creatorKateHighlighter.png b/examples/quickcontrols2/texteditor/creatorKateHighlighter.png
new file mode 100644
index 00000000..a9ad9ef9
--- /dev/null
+++ b/examples/quickcontrols2/texteditor/creatorKateHighlighter.png
diff --git a/examples/quickcontrols2/texteditor/documenthandler.cpp b/examples/quickcontrols2/texteditor/documenthandler.cpp
index 5def1b61..58711c52 100644
--- a/examples/quickcontrols2/texteditor/documenthandler.cpp
+++ b/examples/quickcontrols2/texteditor/documenthandler.cpp
@@ -53,6 +53,7 @@
 #include <QFile>
 #include <QFileInfo>
 #include <QFileSelector>
+#include <QMimeDatabase>
 #include <QQmlFile>
 #include <QQmlFileSelector>
 #include <QQuickTextDocument>
@@ -293,14 +294,21 @@ void DocumentHandler::load(const QUrl &fileUrl)
     const QUrl path = QQmlFileSelector::get(engine)->selector()->select(fileUrl);
     const QString fileName = QQmlFile::urlToLocalFileOrQrc(path);
     if (QFile::exists(fileName)) {
+        QMimeType mime = QMimeDatabase().mimeTypeForFile(fileName);
         QFile file(fileName);
         if (file.open(QFile::ReadOnly)) {
             QByteArray data = file.readAll();
-            QTextCodec *codec = QTextCodec::codecForHtml(data);
-            if (QTextDocument *doc = textDocument())
+            if (QTextDocument *doc = textDocument()) {
+                doc->setBaseUrl(path.adjusted(QUrl::RemoveFilename));
+                if (mime.inherits("text/markdown")) {
+                    emit loaded(QString::fromUtf8(data), Qt::MarkdownText);
+                } else {
+                    QTextCodec *codec = QTextCodec::codecForHtml(data);
+                    emit loaded(codec->toUnicode(data), Qt::AutoText);
+                }
                 doc->setModified(false);
+            }
 
-            emit loaded(codec->toUnicode(data));
             reset();
         }
     }
diff --git a/examples/quickcontrols2/texteditor/documenthandler.h b/examples/quickcontrols2/texteditor/documenthandler.h
index 1a34f0e0..3863eb49 100644
--- a/examples/quickcontrols2/texteditor/documenthandler.h
+++ b/examples/quickcontrols2/texteditor/documenthandler.h
@@ -152,7 +152,7 @@ Q_SIGNALS:
     void textChanged();
     void fileUrlChanged();
 
-    void loaded(const QString &text);
+    void loaded(const QString &text, int format);
     void error(const QString &message);
 
     void modifiedChanged();
diff --git a/examples/quickcontrols2/texteditor/einstein.png b/examples/quickcontrols2/texteditor/einstein.png
new file mode 100644
index 00000000..3611284d
--- /dev/null
+++ b/examples/quickcontrols2/texteditor/einstein.png
diff --git a/examples/quickcontrols2/texteditor/example.md b/examples/quickcontrols2/texteditor/example.md
new file mode 100644
index 00000000..169ff433
--- /dev/null
+++ b/examples/quickcontrols2/texteditor/example.md
@@ -0,0 +1,173 @@
+# Markdown in Qt Quick
+
+The Text, TextEdit and TextArea items support rich text formatted in HTML.
+Since Qt 5.14, they now support two dialects of Markdown as well:
+[The CommonMark Specification](https://spec.commonmark.org/0.29/) is the
+conservative formal specification, while
+[GitHub Flavored Markdown](https://guides.github.com/features/mastering-markdown/#GitHub-flavored-markdown)
+adds extra features such as task lists and tables.
+
+If you are viewing this document in the Qt Quick Controls Text Editor example,
+you can edit this document to explore Qt's rich text editing features.
+We have included some comments in each of the following sections to
+encourage you to experiment.
+
+## Font and Paragraph Styles
+
+Markdown supports **bold**, *italic*, ~~strikethrough~~ and `monospace` font
+styles.
+
+> A block quote is indented according to the convention for email quoting.
+
+    A block of code;
+    can be indented;
+    with 4 spaces or a tab;
+
+or
+
+```
+Block {
+    id: code
+    CanBe {
+        wrappedBy: "triple backticks"
+    }
+}
+```
+
+Block quotes can be nested, and block quotes can include indented code blocks.
+
+In [The CommonMark Specification](https://spec.commonmark.org/0.29/)
+John MacFarlane writes:
+
+> What distinguishes Markdown from many other lightweight markup syntaxes,
+> which are often easier to write, is its readability. As Gruber writes:
+
+> > The overriding design goal for Markdown's formatting syntax is to make it
+> > as readable as possible. The idea is that a Markdown-formatted document should
+> > be publishable as-is, as plain text, without looking like it's been marked up
+> > with tags or formatting instructions. (
+> > [http://daringfireball.net/projects/markdown/](http://daringfireball.net/projects/markdown/))
+
+> The point can be illustrated by comparing a sample of AsciiDoc with an
+> equivalent sample of Markdown. Here is a sample of AsciiDoc from the AsciiDoc
+> manual:
+
+>     1. List item one.
+>     +
+>     List item one continued with a second paragraph followed by an
+>     Indented block.
+>     +
+>     .................
+>     $ ls *.sh
+>     $ mv *.sh ~/tmp
+>     .................
+>     +
+>     List item continued with a third paragraph.
+>
+>     2. List item two continued with an open block.
+>     ...
+>
+
+## Hyperlinks
+
+Hyperlinks can be written with the link text first, and the URL immediately
+following: [Qt Assistant](http://doc.qt.io/qt-5/qtassistant-index.html)
+
+A plain url is automatically recognized: https://doc.qt.io/qt-5/qml-qtquick-text.html
+
+There are also "reference links" where the link text is first labeled
+and then the URL for the label is given elsewhere:
+[The Qt Creator Manual][creatormanual]
+
+## Images
+
+Inline images like this one ![red square](red.png) flow with the surrounding text.
+
+The code for including an image is just a link that starts with a bang.
+An image in its own paragraph is given its own space:
+
+![Albert Einstein image](einstein.png)
+
+## Lists
+
+Different kinds of lists can be included. Standard bullet lists can be nested,
+using different symbols for each level of the list. List items can have nested
+items such as block quotes, code blocks and images. Check boxes can be included
+to form a task list.
+
+- Disc symbols are typically used for top-level list items.
+  * Circle symbols can be used to distinguish between items in lower-level
+    lists.
+    + Square symbols provide a reasonable alternative to discs and circles.
+  * Lists can be continued...
+  * further down
+- List items can include images: ![red square](red.png)
+- and even nested quotes, like this:
+
+  The [Qt Documentation](https://doc.qt.io/qt-5/qml-qtquick-textedit.html#details)
+  points out that
+  > The TextEdit item displays a block of editable, formatted text.
+  >
+  > It can display both plain and rich text. For example:
+  >
+  >     TextEdit {
+  >          width: 240
+  >          text: "<b>Hello</b> <i>World!</i>"
+  >          font.family: "Helvetica"
+  >          font.pointSize: 20
+  >          color: "blue"
+  >          focus: true
+  >     }
+- List items with check boxes allow task lists to be incorporated:
+  * [ ] This task is not yet done
+  * [x] We aced this one!
+
+Ordered lists can be used for tables of contents, for example. Each number
+should end with a period or a parenthesis:
+
+1.  Markdown in Qt Quick
+    1)  Font and Paragraph Styles
+    5)  Hyperlinks
+    3)  Images ![red square](red.png)
+    2)  Lists
+    4)  Tables
+2.  Related work
+
+The list will automatically be renumbered during rendering.
+
+## Tables
+
+One of the GitHub extensions is support for tables:
+
+|             |Development Tools                   |Programming Techniques     |Graphical User Interfaces|
+|-------------|------------------------------------|---------------------------|-------------------------|
+|9:00 - 11:00 |Introduction to Qt                                                                      |||
+|11:00 - 13:00|Using Qt Creator                    |QML and its runtime        |Layouts in Qt            |
+|13:00 - 15:00|Qt Quick Designer Tutorial          |Extreme Programming        |Writing Custom Styles    |
+|15:00 - 17:00|Qt Linguist and Internationalization|                           |                         |
+
+# Related Work
+
+Some Qt Widgets also support Markdown.
+[QTextEdit](https://doc.qt.io/qt-5/qtextedit.html) has similar WYSIWYG
+editing features as TextEdit and TextArea: you can edit the rendered text
+directly. You can use
+[QTextDocument::toMarkdown](https://doc-snapshots.qt.io/qt5-dev/qtextdocument.html#toMarkdown)
+to rewrite the Markdown format, and save it back to a file.
+
+If you have the [KDE Kate Editor](https://kate-editor.org/) installed on your
+system, you probably also have the `markdown.xml` syntax highlighting
+definition file; that can be reused to add Markdown syntax highlighting to
+Qt Creator.
+
+![creator markdown highlighting from Kate](creatorKateHighlighter.png)
+
+Qt owes thanks to the authors of the [MD4C parser](https://github.com/mity/md4c)
+for making markdown import possible. The QTextMarkdownWriter class does not
+have such dependencies, and also has not yet been tested as extensively, so we
+do not yet guarantee that we are able to rewrite every Markdown document that
+you are able to read and display with Text or TextEdit. But you are free to
+write [bugs](https://bugreports.qt.io) about any troublesome cases that you
+encounter.
+
+[creatormanual]: https://doc.qt.io/qtcreator/ "Qt Creator Manual"
diff --git a/examples/quickcontrols2/texteditor/qml/texteditor.qml b/examples/quickcontrols2/texteditor/qml/texteditor.qml
index 6c95335b..b1485582 100644
--- a/examples/quickcontrols2/texteditor/qml/texteditor.qml
+++ b/examples/quickcontrols2/texteditor/qml/texteditor.qml
@@ -173,7 +173,7 @@ ApplicationWindow {
         id: openDialog
         fileMode: FileDialog.OpenFile
         selectedNameFilter.index: 1
-        nameFilters: ["Text files (*.txt)", "HTML files (*.html *.htm)"]
+        nameFilters: ["Text files (*.txt)", "HTML files (*.html *.htm)", "Markdown files (*.md *.markdown)"]
         folder: StandardPaths.writableLocation(StandardPaths.DocumentsLocation)
         onAccepted: document.load(file)
     }
@@ -383,8 +383,14 @@ ApplicationWindow {
         selectionStart: textArea.selectionStart
         selectionEnd: textArea.selectionEnd
         textColor: colorDialog.color
-        Component.onCompleted: document.load("qrc:/texteditor.html")
+        Component.onCompleted: {
+            if (Qt.application.arguments.length === 2)
+                document.load("file:" + Qt.application.arguments[1]);
+            else
+                document.load("qrc:/texteditor.html")
+        }
         onLoaded: {
+            textArea.textFormat = format
             textArea.text = text
         }
         onError: {
diff --git a/examples/quickcontrols2/texteditor/red.png b/examples/quickcontrols2/texteditor/red.png
new file mode 100644
index 00000000..9038fef7
--- /dev/null
+++ b/examples/quickcontrols2/texteditor/red.png