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 2018/09/19 23:11:12 UTC

[royale-asjs] branch develop updated: colorize the source code example thanks to Piotr wrapper of Highlight.js

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 415645e  colorize the source code example thanks to Piotr wrapper of Highlight.js
415645e is described below

commit 415645e24692524db4e10e3cc90ec8d5a5c3cdcd
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Thu Sep 20 01:11:02 2018 +0200

    colorize the source code example thanks to Piotr wrapper of Highlight.js
---
 .../src/main/resources/jewel-example-styles.css    |  8 ++++
 .../src/main/royale/AlertPlayGround.mxml           | 12 ++++-
 .../projects/Jewel/src/main/royale/JewelClasses.as |  2 +
 .../jewel/supportClasses/util/HighlightCode.as     | 55 ++++++++++++++++++++++
 4 files changed, 76 insertions(+), 1 deletion(-)

diff --git a/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css b/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css
index 3165eeb..dff8408 100644
--- a/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css
+++ b/examples/royale/JewelExample/src/main/resources/jewel-example-styles.css
@@ -78,4 +78,12 @@
     border: 1px dashed #cccccc;
     border-radius: 3px;
     padding: 14px;
+}
+
+.codeExample
+{
+    margin: 20px;
+    padding: 20px;
+    border-radius: 10px;
+    border: 0px solid;
 }
\ No newline at end of file
diff --git a/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml b/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml
index 9c749f8..4c271a0 100644
--- a/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml
@@ -84,6 +84,7 @@ limitations under the License.
 
             import org.apache.royale.collections.ArrayList;
             import vos.TabBarButtonVO;
+            import org.apache.royale.jewel.supportClasses.util.HighlightCode;
             
             private function changeHandler(event:Event):void
             {
@@ -104,6 +105,12 @@ limitations under the License.
 			public function dataReadyHandler(event:Event):void
 			{
                 sourceCodeTextHolder.text = event.target.data;
+                
+                COMPILE::JS
+                {
+                    var highlightCode:HighlightCode = new HighlightCode();
+                    highlightCode.highlightBlock(sourceCodeTextHolder.element);
+                }
 			}
 		]]>
 	</fx:Script>
@@ -145,7 +152,10 @@ limitations under the License.
         </j:SectionContent>
 
         <j:SectionContent id="sourceCodeTab">
-            <html:Pre id="sourceCodeTextHolder"/>
+            <html:Pre>
+                <html:Code id="sourceCodeTextHolder" className="xml codeExample">
+                </html:Code>
+            </html:Pre>
         </j:SectionContent>
 
     </j:TabBarContent>
diff --git a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
index 8cce289..0151b6b 100644
--- a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
+++ b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
@@ -93,6 +93,8 @@ package
         import org.apache.royale.jewel.supportClasses.combobox.ComboBoxList; ComboBoxList;
         import org.apache.royale.jewel.supportClasses.list.DataGroup; DataGroup;
 
+        import org.apache.royale.jewel.supportClasses.util.HighlightCode; HighlightCode;
+
         //import org.apache.royale.jewel.beads.views.JewelLabelViewBead; JewelLabelViewBead;
     }
 
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/supportClasses/util/HighlightCode.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/supportClasses/util/HighlightCode.as
new file mode 100644
index 0000000..661195b
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/supportClasses/util/HighlightCode.as
@@ -0,0 +1,55 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.royale.jewel.supportClasses.util
+{
+	public class HighlightCode
+	{
+		/** 
+         * Code created by Piotr Zarzycki in transpiledactionScript.com
+         * https://github.com/piotrzarzycki21/TranspiledActionScript/blob/examples/Examples/TranspiledActionScriptWebsite/src/utils/Highlight.as
+         * 
+		 * <inject_html>
+		 * <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.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>
+		 */
+		public function HighlightCode()
+		{
+		}
+
+		// COMPILE::JS		
+		// public function initHighlight():void
+		// {
+		// 	var hljs:Object = window["hljs"];
+		// 	//prevent renaming by compiler
+		// 	hljs["initHighlightingOnLoad"]();
+		// }
+		
+		COMPILE::JS	
+        /**
+         * block is the element (WrappedHTMLElement) inside the component (the <code> tag)
+         */
+		public function highlightBlock(block:Object):void
+		{
+			var hljs:Object = window["hljs"];
+			//prevent renaming by compiler
+			hljs["highlightBlock"](block);
+		}
+	}
+}
\ No newline at end of file