From 0e76f96d476397c5a9e64388a36e2ed74183d11e Mon Sep 17 00:00:00 2001
From: pandao <272383090@qq.com>
Date: Wed, 8 May 2019 01:18:20 +0800
Subject: [PATCH] Update README.md

---
 README.md | 211 ++++++++++++++++++++++++++++++++++++++++++++++--------
 1 file changed, 180 insertions(+), 31 deletions(-)

diff --git a/README.md b/README.md
index 8958a57..7422141 100644
--- a/README.md
+++ b/README.md
@@ -40,59 +40,208 @@
 - 支持 AMD / CMD 模块化加载（支持 [Require.js](https://pandao.github.io/editor.md/examples/use-requirejs.html) & [Sea.js](https://pandao.github.io/editor.md/examples/use-seajs.html)），并且支持[自定义扩展插件](https://pandao.github.io/editor.md/examples/define-plugin.html)；
 - 兼容主流的浏览器（IE8+）和 [Zepto.js](https://pandao.github.io/editor.md/examples/use-zepto.html)，且支持 iPad 等平板设备；
 
-#### Examples
+#### Download & install
+
+Download:
 
-[https://pandao.github.io/editor.md/examples/index.html](https://pandao.github.io/editor.md/examples/index.html)
+[Github download](https://github.com/pandao/editor.md/archive/master.zip)
 
-#### Download & install
+NPM install :
 
-[Github download](https://github.com/pandao/editor.md/archive/master.zip)
+```bash
+npm install editor.md
+```
 
 Bower install :
 
-```shell
+```bash
 bower install editor.md
 ```
 
-#### Usages
-
-HTML：
+#### Usages
+
+##### Create a Markdown editor
 
 ```html
-<link rel="stylesheet" href="editormd.min.css" />
-<div id="editormd">
+<link rel="stylesheet" href="editor.md/css/editormd.min.css" />
+<div id="editor">
+    <!-- Tips: Editor.md can auto append a `<textarea>` tag -->
     <textarea style="display:none;">### Hello Editor.md !</textarea>
 </div>
-```
-
-> Tip: Editor.md can auto append `<textarea>` tag;
-
-javascript:
-
-```html
 <script src="jquery.min.js"></script>
-<script src="editormd.min.js"></script>
+<script src="editor.md/editormd.min.js"></script>
 <script type="text/javascript">
     $(function() {
-        var editor = editormd("editormd", {
-            path : "../lib/" // Autoload modules mode, codemirror, marked... dependents libs path
+        var editor = editormd("editor", {
+            // width: "100%",
+            // height: "100%",
+            // markdown: "xxxx",     // dynamic set Markdown text
+            path : "editor.md/lib/"  // Autoload modules mode, codemirror, marked... dependents libs path
         });
-
-        /*
-        // or
-        var editor = editormd({
-            id   : "editormd",
-            path : "../lib/"
-        });
-        */
     });
 </script>
 ```
 
-Using modular script loader :
+If you using modular script loader:
 
 - [Using Require.js](https://github.com/pandao/editor.md/tree/master/examples/use-requirejs.html)
-- [Using Sea.js](https://github.com/pandao/editor.md/tree/master/examples/use-seajs.html)
+- [Using Sea.js](https://github.com/pandao/editor.md/tree/master/examples/use-seajs.html)
+
+##### Markdown to HTML
+
+```html
+<link rel="stylesheet" href="editormd/css/editormd.preview.css" />
+<div id="test-markdown-view">
+    <!-- Server-side output Markdown text -->
+    <textarea style="display:none;">### Hello world!</textarea>             
+</div>
+<script src="jquery.min.js"></script>
+<script src="editormd/editormd.js"></script>
+<script src="editormd/lib/marked.min.js"></script>
+<script src="editormd/lib/prettify.min.js"></script>
+<script type="text/javascript">
+    $(function() {
+	    var testView = editormd.markdownToHTML("test-markdown-view", {
+            // markdown : "[TOC]\n### Hello world!\n## Heading 2", // Also, you can dynamic set Markdown text
+            // htmlDecode : true,  // Enable / disable HTML tag encode.
+            // htmlDecode : "style,script,iframe",  // Note: If enabled, you should filter some dangerous HTML tags for website security.
+        });
+    });
+</script>    
+```
+
+> See the full example: [http://editor.md.ipandao.com/examples/html-preview-markdown-to-html.html](http://editor.md.ipandao.com/examples/html-preview-markdown-to-html.html)
+
+##### HTML to Markdown?
+
+Sorry, Editor.md not support HTML to Markdown parsing, Maybe In the future.
+
+#### Examples
+
+[https://pandao.github.io/editor.md/examples/index.html](https://pandao.github.io/editor.md/examples/index.html)
+
+#### Options
+
+Editor.md options and default values:
+
+```javascript
+{
+    mode                 : "gfm",          // gfm or markdown
+    name                 : "",             // Form element name for post
+    value                : "",             // value for CodeMirror, if mode not gfm/markdown
+    theme                : "",             // Editor.md self themes, before v1.5.0 is CodeMirror theme, default empty
+    editorTheme          : "default",      // Editor area, this is CodeMirror theme at v1.5.0
+    previewTheme         : "",             // Preview area theme, default empty
+    markdown             : "",             // Markdown source code
+    appendMarkdown       : "",             // if in init textarea value not empty, append markdown to textarea
+    width                : "100%",
+    height               : "100%",
+    path                 : "./lib/",       // Dependents module file directory
+    pluginPath           : "",             // If this empty, default use settings.path + "../plugins/"
+    delay                : 300,            // Delay parse markdown to html, Uint : ms
+    autoLoadModules      : true,           // Automatic load dependent module files
+    watch                : true,
+    placeholder          : "Enjoy Markdown! coding now...",
+    gotoLine             : true,           // Enable / disable goto a line
+    codeFold             : false,
+    autoHeight           : false,
+    autoFocus            : true,           // Enable / disable auto focus editor left input area
+    autoCloseTags        : true,
+    searchReplace        : true,           // Enable / disable (CodeMirror) search and replace function
+    syncScrolling        : true,           // options: true | false | "single", default true
+    readOnly             : false,          // Enable / disable readonly mode
+    tabSize              : 4,
+    indentUnit           : 4,
+    lineNumbers          : true,           // Display editor line numbers
+    lineWrapping         : true,
+    autoCloseBrackets    : true,
+    showTrailingSpace    : true,
+    matchBrackets        : true,
+    indentWithTabs       : true,
+    styleSelectedText    : true,
+    matchWordHighlight   : true,           // options: true, false, "onselected"
+    styleActiveLine      : true,           // Highlight the current line
+    dialogLockScreen     : true,
+    dialogShowMask       : true,
+    dialogDraggable      : true,
+    dialogMaskBgColor    : "#fff",
+    dialogMaskOpacity    : 0.1,
+    fontSize             : "13px",
+    saveHTMLToTextarea   : false,          // If enable, Editor will create a <textarea name="{editor-id}-html-code"> tag save HTML code for form post to server-side.
+    disabledKeyMaps      : [],
+    
+    onload               : function() {},
+    onresize             : function() {},
+    onchange             : function() {},
+    onwatch              : null,
+    onunwatch            : null,
+    onpreviewing         : function() {},
+    onpreviewed          : function() {},
+    onfullscreen         : function() {},
+    onfullscreenExit     : function() {},
+    onscroll             : function() {},
+    onpreviewscroll      : function() {},
+    
+    imageUpload          : false,          // Enable/disable upload
+    imageFormats         : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
+    imageUploadURL       : "",             // Upload url
+    crossDomainUpload    : false,          // Enable/disable Cross-domain upload
+    uploadCallbackURL    : "",             // Cross-domain upload callback url
+
+    toc                  : true,           // Table of contents
+    tocm                 : false,          // Using [TOCM], auto create ToC dropdown menu
+    tocTitle             : "",             // for ToC dropdown menu button
+    tocDropdown          : false,          // Enable/disable Table Of Contents dropdown menu
+    tocContainer         : "",             // Custom Table Of Contents Container Selector
+    tocStartLevel        : 1,              // Said from H1 to create ToC
+    htmlDecode           : false,          // Open the HTML tag identification 
+    pageBreak            : true,           // Enable parse page break [========]
+    atLink               : true,           // for @link
+    emailLink            : true,           // for email address auto link
+    taskList             : false,          // Enable Github Flavored Markdown task lists
+    emoji                : false,          // :emoji: , Support Github emoji, Twitter Emoji (Twemoji);
+                                           // Support FontAwesome icon emoji :fa-xxx: > Using fontAwesome icon web fonts;
+                                           // Support Editor.md logo icon emoji :editormd-logo: :editormd-logo-1x: > 1~8x;
+    tex                  : false,          // TeX(LaTeX), based on KaTeX
+    flowChart            : false,          // flowChart.js only support IE9+
+    sequenceDiagram      : false,          // sequenceDiagram.js only support IE9+
+    previewCodeHighlight : true,           // Enable / disable code highlight of editor preview area
+
+    toolbar              : true,           // show or hide toolbar
+    toolbarAutoFixed     : true,           // on window scroll auto fixed position
+    toolbarIcons         : "full",         // Toolbar icons mode, options: full, simple, mini, See `editormd.toolbarModes` property.
+    toolbarTitles        : {},
+    toolbarHandlers      : {
+        ucwords : function() {
+            return editormd.toolbarHandlers.ucwords;
+        },
+        lowercase : function() {
+            return editormd.toolbarHandlers.lowercase;
+        }
+    },
+    toolbarCustomIcons   : {               // using html tag create toolbar icon, unused default <a> tag.
+        lowercase        : "<a href=\"javascript:;\" title=\"Lowercase\" unselectable=\"on\"><i class=\"fa\" name=\"lowercase\" style=\"font-size:24px;margin-top: -10px;\">a</i></a>",
+        "ucwords"        : "<a href=\"javascript:;\" title=\"ucwords\" unselectable=\"on\"><i class=\"fa\" name=\"ucwords\" style=\"font-size:20px;margin-top: -3px;\">Aa</i></a>"
+    },
+    toolbarIconTexts     : {},
+    
+    lang : {  // Language data, you can custom your language.
+        name        : "zh-cn",
+        description : "开源在线Markdown编辑器<br/>Open source online Markdown editor.",
+        tocTitle    : "目录",
+        toolbar     : {
+            //...
+        },
+        button: {
+            //...
+        },
+        dialog : {
+            //...
+        }
+        //...
+    }
+}
+```
 
 #### Dependents
 
@@ -116,4 +265,4 @@ Using modular script loader :
 
 The MIT License.
 
-Copyright (c) 2015 Pandao
+Copyright (c) 2015-2019 Pandao