Inspired by the Ez publish’s way to embed images inside rich text fields, this CakePHP code takes the same principle in the true CakePHP way, with two helpers to extend David Persson’s Media Plugin.

Growing number of web applications and multiple numbers of user accounts can be a headache for the end user. Luckily the big players have started to agree on standards that makes the personal information flow between these services.

Recently I have been working on my latest Cakephp app, and found Cakephp’s plugin architecture to be a great timesaver and helper. Totally I have 12 models, but only 3 in the regular app/model directory. The rest is located under the plugins:

• Authake (3 models) – handles users, user groups and roles
• Newsletter (5 models) – subscribers, groups, mails and reporting
• Comments (1 model) Build myself, and is plugable in any view since it is using the url as an relation

Both Authake and Newsletter needed some finishing and debugging, but if I was do build the same functionality myself I would have spent much more time.

Guidelines for building plugins

While taming these external plugins, you got a feel for what’s best praxis building plugins. As a short list I will emphasize these points:

• Use conventions! Admin functions should utilize the build in admin routes!
• Use conventions! Do NOT mock up to much with the baked views. Rather but your effort in writing smart, and good code in models, controllers, helpers and components. Avoid using icons instead of the edit, view and delete buttons/links!
• Comment code!
• Escape the messages with the __(“string”) function to make language translation or customization easier!
• When deploying a plugin I tent to move some views into the main view-folder in the app directory. At least I did that with the Newsletter-plugin (see above)
• Even though you are using SVN for your app, you can add a svn propedit svn:ignore plugins and check out other repositories in that directory

SmartMarkUp is a lightweight textedtor in where the compressed version weights only 10kb (without css and images.

How to use in CakePHP

Adding it to CakePHP is pretty easy: Just drop it in your “js” folder, and add a symbolic link of it in your “css” folder so you can add the css as well.


// Add the stylesheets
css(‘smarkup/skins/style.css’) ?>
css(‘smarkup/skins/default/style.css’) ?>

// Add the javascript
link(‘smarkup/smarkup.js’); ?>
link(‘smarkup/conf/html/conf.js’); ?>


Then you activate it with:

Follow the guide on their this page.

Moving your basic templates and CSS into an extension will ease the workflow in setting up new sites with Ez Publish.

First off create a folder in the extension folder (/ezpublish/extension) of your Ez distribution. To make it work as an design extension we just need a few files:

/gersh<br>&nbsp;&nbsp; &nbsp;/design<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;/gersh<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;/images<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;/override<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;/stylesheets<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;/templates<br>&nbsp;&nbsp; &nbsp;ezinfo.php<br>&nbsp;&nbsp; &nbsp;/settings<br>&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;design.ini.append.php

File listing “ezinfo.php”:

&lt;?php<br>class gershInfo<br>{<br>&nbsp;&nbsp;&nbsp; static function info()<br>&nbsp;&nbsp;&nbsp; {<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; return array( 'Name' =&gt; "Gersh Design Extenison",<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 'Version' =&gt; "1.0.0",<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 'Copyright' =&gt; "Copyright (C) 1999-2007 Gersh.no",<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 'License' =&gt; "GNU General Public License v2.0"<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; );<br>&nbsp;&nbsp;&nbsp; }<br>}<br>?&gt;

File listing “design.ini.append.php”:

&lt;?php /* #?ini charset="utf-8"?<br>[ExtensionSettings]<br>DesignExtensions[]=gersh<br>*/ ?&gt;

Make sure you activate your new extension in “ezpublish/settings/override/site.ini.append.php“:

[ExtensionSettings]<br>ActiveExtensions[]<br>ActiveExtensions[]=gersh

And add it as an additional site design list in “ezpublish/settings/siteaccess/<site-name>/site.ini.append.php“

[DesignSettings]<br>SiteDesign=ezwebin_site<br>AdditionalSiteDesignList[]<br>AdditionalSiteDesignList[]=gersh<br>AdditionalSiteDesignList[]=base

varName = (conditional expression) ? valueIfTrue : valueIfFalse;

So many times I have been searching for this way of setting av varible, and know it turns up it got a name:  Ternary operator.

Next time I have forgot the way of formating it, at least I know what to “Google” for.

Discovered it in ActionScript 3.0 Cookbook, which BTW is one of the best computer books I have ever bought.

Working with both Ajax and Flash tecnologies I often miss the great support Actionscript has to the XML format.

Reading the Adobe Air for JavaScript Developer – Pocket Guide I saw some examples of using flash objects in JavaScript. Curious if I also could use the XML parser, I did some testing.

And yes, you can use the parser. But before you can parse it with window.runtime.XML you have to take it via the old window.runtime.flash.xml.XMLDocument() function. 

And unfortunately you can call any function on it i.e. XMLlist.length()

Here is the JavaScript code:

&lt;script src="js/AIRAliases.js" type="text/javascript"&gt;&lt;/script&gt;<br>&lt;script type="text/javascript"&gt;<br>	// Var that holds the data loaded<br>	var xml_doc;<br>	// The function that starts the asynchronously reading of the file<br>	function doLoad() { <br>		var file = air.File.applicationDirectory.resolvePath('rss.xml' ); <br>		stream = new air.FileStream(); <br>		stream.addEventListener( air.ProgressEvent.PROGRESS, doProgress ); <br>		stream.openAsync( file, air.FileMode.READ ); <br>	} <br>	// Eventlistener for the fileloading<br>	function doProgress( event ) { <br>		var data = stream.readMultiByte( stream.bytesAvailable, "utf-8" ); <br>		xml_doc += data;<br>		if( event.bytesLoaded == event.bytesTotal ) { <br>			stream.close();<br>			// Call the parse function when fileloading is completed<br>			parseXML();<br>		} <br>	}<br>	function parseXML() { <br>		var result = new window.runtime.flash.xml.XMLDocument();<br>		result.ignoreWhite = true;<br>		result.parseXML(xml_doc);<br>		var myXML = new window.runtime.XML(result.lastChild);<br>		alert(myXML.channel.item[2].title);<br>	}<br>&lt;/script&gt; 

Why: Today most webservices have a growing support  for JSON, but still XML is the most widely spread format. Working with XML files in Javascript can be a little troublesome, and often you want to use an external library for the parsing.

Adobe recently made Flex opensource. That mean that you don’t have to use their Flex Builder in order to make Flex-apps.

This is a quick intro in how to use Flex with Textmate on mac.

Download the Flex SDK

You can download the Flex SDK from Adobe’s site. Place it whereevery you want, but be sure to make it available in your Path:

/Users/gerhard/.bashrc

export PATH; PATH="/Developer/SDKs/air_sdk/bin/:/Developer/SDKs/flex_sdk_3/bin/:/Developer/Tools:/Developer/Applications:/usr/local/bin:/usr/local/subversion/bin:$PATH"<br>alias flex="mxmlc"

I also added a alias for the compiler, located inside the bin/ dir of the SDK.

Download the TextMate bundle for AS3 and Flex

The ActionScript 3 Bundle and the Flex Bundle can be downloaded from TextMates Repository at: http://macromates.com/svn/Bundles/trunk/Review/Bundles/ (Use the SvnX app for mac to access these). Install this and you are ready to start developing in Flex.

Mini tutorial – your first Flex-app with TextMate

Create a new file in TextMate, and name it FlexTest1.mxml:

&lt;?xml version="1.0"?&gt; <br>&lt;!-- mxml/TriggerCodeExample.mxml --&gt; <br>&lt;mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"&gt;<br>    &lt;mx:Panel title="My Application" <br>        paddingTop="10" <br>        paddingBottom="10" <br>        paddingLeft="10" <br>        paddingRight="10" <br>    &gt; <br>        &lt;mx:TextArea id="textarea1"/&gt; <br>        &lt;mx:Button label="Submit" click="textarea1.text='Hello World';"/&gt; <br>    &lt;/mx:Panel&gt; <br>&lt;/mx:Application&gt; <br>

The ActionScript 3 bundle will provide you with a buildin “Build (mxmlc)” command, but I prefer just compiling the files direct with Terminal.app:

gersh:~/Desktop/Adobe Flex/HelleWorldFlex gerhard$ mxmlc FlexTest1.mxml<br>Loading configuration file /Developer/SDKs/flex_sdk_3/frameworks/flex-config.xml<br>/Users/gerhard/Desktop/Adobe Flex/HelleWorldFlex/FlexTest1<br>.swf (164508 bytes)<br>gersh:~/Desktop/Adobe Flex/HelleWorldFlex gerhard$ 

If you have installed the last version of flash-player you will be able to open the .swf file in Finder.

Here is a simple way of exporting data to excel documents. With utf-8 encoding you can use special nordic letters like ø, æ and å.

<span class="Apple-style-span" style="font-family: Arial; line-height: 14px; white-space: normal;"><div>&lt;?php</div><div>header("Expires: 0");</div><div>header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");</div><div>header("Cache-Control: no-store, no-cache, must-revalidate");</div><div>header("Cache-Control: post-check=0, pre-check=0", false);</div><div>header("Pragma: no-cache");</div><div>header("Content-type: application/vnd.ms-excel;charset:UTF-8");</div><div>header("Content-Disposition: attachment; filename=filename.xls"); </div><div>print "\n"; // Add a line, unless excel error..</div><div>?&gt;</div><div>&lt;table border="1"&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">	</span>&lt;tr&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">		</span>&lt;th&gt;header 1&lt;/th&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">		</span>&lt;th&gt;header 2&lt;/th&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">	</span>&lt;/tr&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">	</span>&lt;tr&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">		</span>&lt;td&gt;data 1&lt;/td&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">		</span>&lt;td&gt;data 2 - nordic letters æ, æ, å&lt;/td&gt;</div><div><span class="Apple-tab-span" style="white-space:pre">	</span>&lt;/tr&gt;</div><div>&lt;/table&gt;</div></span>

Its really all about the headers. For the body of the document, Excel is not very choosy, we just hand it a regular HTML table, and thats it. 

Want to use Subversion with your CakePHP project. This is how you do it:

For developing I got a local copy of my project. Unless you got Subversion installed on your webserver, you have to start importing the local one. Mine in located here:

/Users/gersh/Sites/cakephp/APPS/gersh

1. First you have to move your config file outside of your project tree since your project will have public access on Google Code. To do this you simply copy database.php out and rather include it by putting these lines inside your app/config/database.php file:
   

   (?php<br>include dirname(__FILE__) . '/../../database.php.inc';

2. Google Code has already created a regualar Subversion structure:
   /branches (empty)
   /tags (empty)
   /trunk (content of cakephp app folder goes here)
3. To import your project, open Terminal.app, and from inside of your /app folder run this command:
   

   svn import  https://gersh-no.googlecode.com/svn/trunk <br>  --username username -m "Initial import"

4. Now that your project is hosted at Google Code, you can use SvnX – a mac SVN client to checkout your project. Note that it is a bug in SvnX with importing from https protocol, so you have to do a svn list command. Just accept it permantly

   svn list https://projectname.googlecode.com/svn/trunk/

5. You might need to reset the permissions for your app/tmp directory in order to make the cache to work:
   

   chmod -R 777 tmp