You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2020/04/18 18:53:07 UTC

[royale-asjs] branch develop updated: markdown-example: highlight as3 and mxml

This is an automated email from the ASF dual-hosted git repository.

carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git


The following commit(s) were added to refs/heads/develop by this push:
     new 48597d9  markdown-example: highlight as3 and mxml
48597d9 is described below

commit 48597d9f2cb779a8014932583c8b8aff1233d87f
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sat Apr 18 20:53:01 2020 +0200

    markdown-example: highlight as3 and mxml
---
 .../src/main/royale/MainContent.mxml               | 29 ++++++++----
 .../jewel/royale-website/src/main/royale/hljs.as   |  8 +++-
 .../royale-website/src/main/royale/markdownit.as   | 55 ++++++++++++++++++++--
 3 files changed, 79 insertions(+), 13 deletions(-)

diff --git a/examples/jewel/royale-website/src/main/royale/MainContent.mxml b/examples/jewel/royale-website/src/main/royale/MainContent.mxml
index d715277..ddf19e9 100644
--- a/examples/jewel/royale-website/src/main/royale/MainContent.mxml
+++ b/examples/jewel/royale-website/src/main/royale/MainContent.mxml
@@ -35,24 +35,31 @@ limitations under the License.
 
             public function initComplete(event:Event):void
             {
-                md = new markdownit('commonmark', {
-                    html:true, 
+                md = new markdownit('commonmark'
+                , {
+                    html:false, 
                     xhtmlOut: true,
                     breaks: true,
                     linkify: true,
                     typographer: true,
-                    highlight: myHighlight
-                });
-                
+                    injected: true,
+                    highlight: hljs_highlight
+                }
+                );
+
                 service = new GitHubService();
                 service.addEventListener("dataReady", dataReadyHandler);
+
+                loadGithubMarkDown();
             }
 
-            public function myHighlight(str:String, lang:String):String { 
+            public function hljs_highlight(str:String, lang:String):String { 
                 if (lang && hljs.getLanguage(lang))
                 {
                     try {
+                        trace(lang, str, hljs.getLanguage(lang))
                         return '<pre class="hljs"><code>' + hljs.highlight(lang, str, true).value + '</code></pre>';
+                        // return '<pre class="hljs language-' + lang + '><code class="language-' + lang + ' ' + lang + '">' + hljs.highlightAuto(lang, str, true).value + '</code></pre>';
                         // return hljs.highlight(lang, str).value;
                     } catch (error:Error) 
                     {
@@ -65,13 +72,17 @@ limitations under the License.
 
             public function loadGithubMarkDown():void
             {
-                service.sourceCodeUrl = "https://raw.githubusercontent.com/apache/royale-docs/master/features/as3.md";
+                service.sourceCodeUrl = "https://api.github.com/repos/apache/royale-docs/contents/features/as3.md";
                 service.getContent();
             }
 
             public function dataReadyHandler(event:Event):void
             {
-                placeholder.html = md.render(event.target.jsonToString);
+                var content:String = event.target.sourceCode;
+                content = content.substring(content.indexOf("---", 2) + 4);
+                content = content.replace("```as3", "```actionscript");
+                content = content.replace("```mxml", "```xml");
+                placeholder.html = md.render(content);
             }
         ]]>
     </fx:Script>
@@ -81,7 +92,7 @@ limitations under the License.
     </j:beads>
 
     <j:ScrollableSectionContent width="100%" height="100%" isSelected="true">
-        <j:Button text="Load MarkDown from Github" click="loadGithubMarkDown()"/>
+        <!-- <j:Button text="Load MarkDown from Github" click=""/> -->
         <j:Label localId="placeholder" multiline="true"/>
     </j:ScrollableSectionContent>
 
diff --git a/examples/jewel/royale-website/src/main/royale/hljs.as b/examples/jewel/royale-website/src/main/royale/hljs.as
index f6e636c..b97ff40 100644
--- a/examples/jewel/royale-website/src/main/royale/hljs.as
+++ b/examples/jewel/royale-website/src/main/royale/hljs.as
@@ -26,7 +26,9 @@ package
 	{
 		/** 
          * <inject_html>
-		 * <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+		 * <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/highlight.min.js"></script>
+		 * <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/languages/actionscript.min.js"></script>
+		 * <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.18.1/languages/xml.min.js"></script>
          * <link rel="stylesheet" title="Atom One Dark" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css">
 		 * </inject_html>
 		 */
@@ -57,5 +59,9 @@ package
 		public static function highlight(languageName:String, code:String, ignore_illegals:Boolean = false, continuation:Array = null):Object {
 			return null;
 		}
+		
+		public static function highlightAuto(languageName:String, code:String, ignore_illegals:Boolean = false, continuation:Array = null):Object {
+			return null;
+		}
 	}
 }
\ No newline at end of file
diff --git a/examples/jewel/royale-website/src/main/royale/markdownit.as b/examples/jewel/royale-website/src/main/royale/markdownit.as
index ca73014..e5121c7 100644
--- a/examples/jewel/royale-website/src/main/royale/markdownit.as
+++ b/examples/jewel/royale-website/src/main/royale/markdownit.as
@@ -30,16 +30,65 @@ package
 		 * <script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/10.0.0/markdown-it.min.js"></script>
 		 * </inject_html>
 		 * 
-		 * presetName: 'commonmark', 'default', 'zero'
+		 * @param presetName String, MarkdownIt provides named presets as a convenience to quickly enable/disable active syntax rules and options for common use cases.
+		 * 
+		 * Available preset names:
+		 *  - "commonmark" - configures parser to strict CommonMark mode.
+		 *	- "default" - similar to GFM, used when no preset name given. Enables all available rules, but still without html, typographer & autolinker.
+		 *  - "zero" - all rules disabled. Useful to quickly setup your config via .enable(). For example, when you need only bold and italic markup and nothing else.
+		 * @param options Object, the options to configure
+		 * 
+		 * Available options:
+		 * 	- html - false. Set true to enable HTML tags in source. Be careful! That's not safe! You may need external sanitizer to protect output from XSS. It's better to extend features via plugins, instead of enabling HTML.
+		 *	- xhtmlOut - false. Set true to add '/' when closing single tags (<br />). This is needed only for full CommonMark compatibility. In real world you will need HTML output.
+		 *	- breaks - false. Set true to convert \n in paragraphs into <br>.
+		 *	- langPrefix - language-. CSS language class prefix for fenced blocks. Can be useful for external highlighters.
+		 *	- linkify - false. Set true to autoconvert URL-like text to links.
+		 *	- typographer - false. Set true to enable some language-neutral replacement + quotes beautification (smartquotes).
+		 *	- quotes - “”‘’, String or Array. Double + single quotes replacement pairs, when typographer enabled and smartquotes on. For example, you can use '«»„“' for Russian, '„“‚‘' for German, and ['«\xA0', '\xA0»', '‹\xA0', '\xA0›'] for French (including nbsp).
+		 *	- highlight - null. Highlighter function for fenced code blocks. Highlighter function (str, lang) should return escaped HTML. It can also return empty string if the source was not changed and should be escaped externaly. If result starts with <pre... internal wrapper is skipped.
+		 *
 		 */
 		public function markdownit(presetName:Object = 'default', options:Object = null) {}
 
-		public function render(s:String):String
+		/**
+		 * Render markdown string into html. It does all magic for you :).
+		 * 
+		 * @param s String, the markdown
+		 * @param env Object, the environment sandbox
+		 */
+		public function render(s:String, env:Object = null):String
+        {	
+			return null;
+        }
+
+		/**
+		 * Similar to MarkdownIt.render but for single paragraph content. Result will NOT be wrapped into <p> tags.
+		 * 
+		 * @param s String, the markdown
+		 * @param env Object, the environment sandbox
+		 */
+		public function renderInline(s:String, env:Object = null):String
+        {	
+			return null;
+        }
+
+		/**
+		 * Set parser options (in the same format as in constructor). Probably, you will never need it, but you can change options after constructor call.
+		 * 
+		 * @param options Object, the options to configure
+		 */
+		public function use(attrs:Object):Object
         {	
 			return null;
         }
 		
-		public function renderInline(s:String):String
+		/**
+		 * Set parser options (in the same format as in constructor). Probably, you will never need it, but you can change options after constructor call.
+		 * 
+		 * @param options Object, the options to configure
+		 */
+		public function set(options:Object):Object
         {	
 			return null;
         }