A new Mango Blog Plugin: Code Coloring

Jan 30, 2009

The other night I released a few tweaks to the already existing plugin for MangoBlog that does some code formatting and coloring. Being that I was still unhappy with the results I started tweaking. It wasn't long before I ended up with a completly redone color formating plugin. So what started out as tweaks resulted in almost a total rewrite. The changes includes modifications to the plugin parsing logic and the addition of targeted color coding. I'm starting out by targeting HTML, CF, ActionScript and MXML. There is a LOT of room for improvement, but as you can see in my examples below, I think it's very powerful.

In this first release I am supporting ColdFusion and ActionScript and MXML. Average use html and quotes will get styles applied accross the board. In design mode, simply wrap your code output with the followign styles. The nice upgrade with this feature is the ability to add this code directly into the WIZYWIG editor; so in the end I'm also parsing &lt;code&gt;, not just <code>. This results in a MUCH nicer display while editing code. No having to turn off JavaScript to edit your posts. The plugin can be downloaded at the bottom of the page.

  • <code></code>
  • <code class="as3"></code>
  • <code class="coldfusion"></code>
  • <code class="mxml"></code>

ActionSript 3 Example:
[Autowire(bean="EnvironmentVO")]
public var Environment : EnvironmentVO;

public function DownloaderDelagate() {
      Swiz.addEventListener(Swiz.INIT_COMPLETE, onSwizComplete);
}

public function onSwizComplete(event : Event) {
      /*
            Do Stuff With this.Environment Here to Init Class
      */

}

ColdFUsion Example:
<cfset var query = ""/>
<cfset var retVar = structNew() />
<cfquery name="query" datasource="myDsn">
      SELECT *
      FROM dbo.myTable
            LEFT JOIN dbo.table2
                  ON table2.id = myTable.id
      WHERE name = 'joe'
</cfquery>

<cfset retVar.query = query />
<cfreturn retVar />

The Coldfusion parser will actualy parse the <CFQUERY> sql code as well to a small extend giving color definition to [case sensative]: SELECT,FROM,WHERE,ORDER BY,GROUP BY,LEFT JOIN,RIGHT JOIN,INNER JOIN,JOIN,ON,LIKE,BETWEEN,AND,OR.

MXML Code Example:
<mx:Canvas id="wraper" width="100%" height="100%">
      <mx:Image src="«image path>" height="60" width="55"
      <display:CustomComponent id="testing" input="randomStuff" />
</mx:Canvas>


Default Code Example:
<html>
<body style="background-color: white;">
      <div>Hello World</div>
      <p clear="all"><a href="http://www.google.com">This is my example</a></p>
      <form name="form1">
            <input type="text" name="firstName" size="25" />
      </form>
</body>
</htmL>

http://www.mangoblog.org
Download the latest Version of Code Coloring by EmpireGP Services

Comments

O?uz Demirkap?

O?uz Demirkap? wrote on 01/30/09 2:43 PM

Let us try! :) Thanks for the great work.
Brian Rinaldi

Brian Rinaldi wrote on 01/30/09 3:59 PM

That's interesting. I will have to check it out. I hacked my copy of Mango to allow me to click a link and turn off TinyMCE so I could add code blocks but this is definitely better...and I was lamenting today that my mxml and actionscript code were uncolored. thanks.
Mark Aplet

Mark Aplet wrote on 02/17/09 6:46 PM

That's great! Mango Blog needed a plugin like this to make it that much easier to maintain blog posts.
Marcos Placona

Marcos Placona wrote on 03/11/09 5:31 AM

Hi Russels, I think I found a bug with your plugin. there's more details here:

http://www.mangoblog.org/forums/messages.cfm?threadid=E87D64F2-3048-2A53-70197319AB6460AF&#top

Can you please contact me for further information.

Cheers
Russell Brown

Russell Brown wrote on 03/11/09 7:46 AM

Thanks, I'm looking into it now; I also responded to the post.
Bluma

Bluma wrote on 09/19/09 5:01 AM

Hello everyone. Those are my principles, and if you don't like them... well, I have others.
I am from Antigua and learning to read in English, please tell me right I wrote the following sentence: "Robin hood: prince of moments was frustrated against an vocally nice police of the able base."

Thank you so much for your future answers 8-). Bluma.
Daria

Daria wrote on 10/22/09 11:35 AM

why can't i get my code block to look right? http://www.universalhousewares.com/blog/post.cfm/test-code

Write your comment



(it will not be displayed)



Subscribe to this comment thread