buttonMode=”true” mouseChildren=”false” useHandCursor=”true”

Here’s an example of a Label which is used as a link:

< mx:Label text="Log out" buttonMode="true" mouseChildren="false" useHandCursor="true" click="logout()" />

It seems like it’s a pretty common problem and these two articles showed me the light of day, thanks dudes!

• http://frankieloscavio.blogspot.com/2007/08/mousechildren-and-buttonmode.html
• http://www.adobe.com/cfusion/communityengine/index.cfm?event=showdetails&productId=2&postId=1687

One of the things I have been working on is a FAQ section for a web portol. To implement this I have used the following components and controls:

1. A basepage
2. A standard mxml Tree contol ()
3. A custom ItemRenderer
4. A custom DataDescriptor
5. A function which is executed upon creation (creationComplete=”initTree()”)

The focus of this tutorial is however on Item 3, a custom ItemRenderer. So here goes…

Firstly the data structure that I am using is a standard xml file which has categories, an answer and a question, I have included an exmaple below:

< ? xml version="1.0" encoding="UTF-8"?>
< faq xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
< category>
< nameGuidance
< item>
< question>What is the meaning of life, the universe and everything?
< answer>42
< /item>

Secondly, the Tree control has a number of paramaters which need to be included to get the desired result:

< mx:Tree id="myTree"
styleName="faqList"
wordWrap="true"
itemClick="tree_itemClick(event);"
width="100%" height="100%"
top="20"
dataDescriptor="{new TreeDataDescriptor()}"
itemRenderer="renderers.TreeRenderer"
creationComplete="initTree()"
/>

I will try to cover the dataDescriptor, itemClick and creationComplete in other posts, but for the time being, the ItemRenderer works something like this:

• It is important to include the if (super.data) logic otherwise the application will through errors because it’s referring to an object with a null value.
• In the data method, I have set all parents (depth == 1) to have a bold style otherwise the nodes should just have normal font weight.
• In the updateDisplayList:
  1. I firstly remove the disclosure icons from all nodes
  2. Add some default text styling to nodes, which sets the selected node back to its original styling after it was selected
  3. Then if a 2nd level node is either highlighted (isItemHighligthed) or selected (isItemSelected) I change styling, display the disclosure icon and adjust the position of the disclosure icon
     (super.disclosureIcon.x = super.width – 50;).
• Note: The moving the position of the icon is relatively simple, but I had difficulty finding information on the web about how to do this, so I’m hoping this will help someone out ther. This particular example moves the disclsure icon 50px inside the right hand border of the Tree control

package com.g3global.ipp.view.components.renderers
{
import mx.collections.*;
import mx.controls.treeClasses.*;
import mx.controls.listClasses.ListBase;

}
}
}
}

So that’s about it. Unfortunately I can’t link to a working demo of this feature because it is part of a much bigger application which is being built for a client.

We have also released a new blog on blog.kindo.com, so if you would like to keep up to date with our latest news, then please visit it. Comments are more than welcome

Here are some snippets from two interesting posts on the Kindo blog

http://blog.kindo.com/2007/08/02/some-technical-details/en/

We’re having fun building the Kindo application and used a number of frameworks and components to achieve the finished result.

For the web framework we’re using Seagull which offers excellent integration with Flash through the AMF PHP request handling and easy integration with Ajax and Graphviz. For the Ajax interactions we use jquery exclusively, for Graphviz a heavily extended version of the PEAR lib of the same name. Working with the dot language has been interesting and a good opportunity to experiment with the subtleties of a genealogy graph.

http://blog.kindo.com/2007/09/04/welcome-to-the-beta-release/en/

A little while ago we released an Alpha to a small group of people, to gather valuable user feedback. Thanks to those great people, we’ve had our heads down improving Kindo, and as a result we’re releasing the Beta, and at the same time opening it up to a wider audience for more feedback.

I recently installed the Vanilla forum and set it up so that it would not allow public browsing, because the discussions there are top secret

I then installed the Feedpublisher extension to allow for RSS2 and ATOM feeds.

Problem

I encountered a major problem though, the rss feeds were not accessible because the forum did not allow public browsing. I also saw that on the vanilla community forum, this problem had been rasied, but no-one had offered a solution.
Also, when trying to access the feed through the browser, one gets an authentication pop up box requested a username and password. When one enters the username and password into the respective text fields the following error message is displayed:

A fatal, non-recoverable error has occurred
Technical information (for support personel):

The error occurred on or near: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '(u.Password = md5('foobar') or u.Password = 'foobar' )' at line 1


Solution

After quite a bit of playing around and testing, I found a relatively easy solution to the problem – typical a five minute fix for an error that keeps you busy for 2 hours!!!

Step 1


So firstly go to /extensions/Feedpublisher/default.php and make sure that the following section of code looks like this (line 60-73 )

}


Step 2

Then login to the admin section of the forum go to settings > categories > $category edit

Then you need to check the “unauthenticated�? option in the “Roles�? and hot save. Do this for each and every category, unless you don’t want a specific category to be displayed on the feed.

This method fixed my problem, so I would be interested to find out if anyone else has a better solution. Also let me know id it doesn’t work for you – I hope that’s not the case though.

The site which I am talking about is http://bd4d.com, which stands for By Designers 4 Designers is built using the seagull php framework with the new cms module

General comments

Media Temple Installation

During the live installation I encountered a few problems, most of which related to permissions of files on the server:

The main one however were the permissions of the /var/lib/php/session/ folder – it has to be writable

Plugins that I found really useful during development

There were two firefox plug-ins that I found very useful during development of the site:

Colorzilla – gives you # codes for colours on any webpage
IE tab – allows you to open up ie7 tabs within firefox, which is great for cross browser compliant xhtml/css

Thanks to the developers of these two add-ons

Paypal

The site has a payment gateway for listing jobs and events which has transaction processing done by Paypal.

In terms of project mistakes, this was one of the biggest we made. The support that James received from Paypal was extremely poor and the general documentation which they supply is often out of date and incorrect. I am amazed that they have become such a successful company, when it is so difficult to integrate their transaction processing into one’s site.

However after a lot of waiting for accounts to go live, numerous queries, emails, phone calls and a lot of frustration, we did eventually get the transactions working. It is working fine now, but it was definitely not worth all of that hassle.

I would be interested to here about other experiences from developers using Paypal – hopefully you had a better one than we did.

Site Features

Showcase

The section of the site that I am most proud of is the Showcase section, which has flash and movies of some really cool clips which the bd4d guys have done. The section allows comments to be made on each of the movies and I think it looks pretty slick – even if I say so myself

To get the section functioning, I used the following:

A comment manager which Dmitri initially developed and then I adapted that code to be used for the site.

To prevent spam on the site I used captcha package from the php pear library

And I used the following code in the template to hold the movies/flash files:

< object width="550" height="400" >
< param name="movie" value="{webRoot}/themes/bd4d/showcasemovies/
{oItem.media}" >
< param name="quality" value="high" >
< embed src="{webRoot}/themes/bd4d/showcasemovies/
{oItem.media}" quality="high" width="{oItem.width}" height="{oItem.height}" autostart="true">< / embed >
< / object >

Events

The Events calendar uses the default seagull events module as a basis, but there where a few enhancements made to fit the requirements of the site. The majority of the development of this section was done by James and I think that he did a pretty good job of it.

The calendar looks pretty slick and works really well, also the backend of the seagull events module provides a lot of flexibility for administrators wanting to manage events.

Job board

The Job board uses custom managers in the default module and as I have mentioned in my section about paypal, it allows members of the site to post jobs for a fee. The transaction processing handles straight paypal payments as well as credit card payments which are verified by paypal.

Conclusion

As I mentioned in the introduction this site took way longer than expected and there were a number of hard lessons which the whole team learnt. But at the end of the day, the site looks pretty good and works as expected, so in some way it can be seen as a success.

I used to just leave the .ico file in the document root and hoped that the browser would pick it up, but I have recently been told a much better way of ensuring that the correct image is displayed in the URL text field.

Place the file in the images folder and then refer to it in your the head of you html template by using the following code: < link rel="Shortcut Icon" type="image/x-icon" href="../images/favicon.ico" / > (remove spaces in code)

So, one definitely does learn something new everyday. Hat tip to Ali

Background

I developed the site using the Seagull php framework, using the publisher module (which has recently been superseded by the CMS module).

The publisher module requires a bit of hacking to make it run effectively, especially if the site requires content pages which have different layouts. But, overall the site works well and looks pretty good, even if I say so myself .

I have still had a number of difficulties, so for those of you who are planning on building a similar site, here are some of the things which I have learnt:

This is especially relevant if you are going to be using some of the following:

• Seagull php Framework
• Installing a site on a Media Temple Server
• Including a dynamic Google Map in a page using the api

Lessons learned

Tips for using the Seagull publisher module:

If you have various site sections which need to have different layouts, the best way of handling this is to create different content types for each different layout which is required.

Then create a different publisher template for that content type and specify the styling which you want for that particular section.

If you have any exceptions, then use a handler like this:

{if:isEqual(29,articleID)}

{end:}
{if:isEqual(30,articleID)}

{end:}
{if:isEqual(34,articleID)}

{end:}

I will endeavour to write a more in depth tutorial for this and put it on the Seagull wiki. Once I have done so, I will update this post.

Server Issues

The first issue which I encountered was trying to do an installation on a staging sub-domain on a Media Temple Dedicated Virtual Server, where php safe mode was turned on. I have written a post which is a guide on how to successfully remove these restrictions.

Browser Issues

As always, I encountered problems with cross browser compatibility. I discovered huge differences between IE6, IE7 and Firefox. The site looks best in Firefox, Safari and in IE6, but there are a few small differences on IE7.

I used this basic conditional block to include an IE hacks file for when a user views the site using IE.

< !--[if IE] >< style type="text/css" >@import "http://www.atalink.com/ themes/atalink/css/hacks/ie.css";< /style >< ![endif]-- > (Remove spaces)

Google Maps

Although this is not that difficult to implement, I found quite a useful site called:

Google Maps latitude, longitude Popup , which gives you the latitudes and longitude values for a specific location, which you use in the Google supplied javascript

Design

Although a designer may do a really good job and a client signs off a design, one has to be flexible enough to deal with client requests for changing of the layouts. Often the changes requested are quite valid and one should consider each request before just disagreeing.

Content

Again, I have been reminded about how important it is to have content ready and signed off, before beginning with development. It is amazing how much time can be wasted when you are waiting for pieces of content. Details about content should be agreed upon during initial agreements and no matter how difficult it may be, these agreements should be adhered to.

Conclusion

I have enjoyed working on this site and I have learnt a lot, in terms of development and in terms of communicating with clients.

I wanted to run an installation script on a sub-domain of a Dedicated-Virtual server hosted by Media Temple with a Plesk 7.5.4, but received the following php error message when I ran the script:

Warning: file_exists(): open_basedir restriction in effect.

Reason why the error occurs

The reason for this error is because, php safe mode is turned on and because the open_basedir is set for each sub-domain. After quite a lot of searching on the web, I eventually tried a few tutorials, but none of them were comprehensive enough to describe exactly how to solve the actual problem.

Solution

Follow these steps and you should solve the problem:

1. SSH into your server using the root login information
2. Once you have logged in, edit the php.ini file located /etc/ folder with a text editor. The line you are looking for is:
   a. Change this line safe_mode = on to safe_mode = off
   b. Or you can cut and paste this one-liner:
   perl -p -i -e ’s/^safe_mode\s*=\s*on/safe_mode = off/i;’ /etc/php.ini
3. Make sure that the open_basedir in the php.ini file looks like this:

   ; open_basedir, if set, limits all file operations to the defined
directory
; and below. This directive makes most sense if used in a per-
directory
; or per-virtualhost web server configuration file. This directive is
; *NOT* affected by whether Safe Mode is turned On or Off.
open_basedir = none

4. Then you need to edit the virtual hosts for the domain and for each sub-domain in the http.inc file, which is located in the /var/www/vhosts/$domain/conf folder.
   Add the following section of code to the domain Virtual Host, as well as to each sub-domain Virtual Host

   
< IfModule sapi_apache2.c >
php_admin_flag engine on
php_admin_flag safe_mode off
php_admin_value open_basedir none
< /IfModule >

   < IfModule mod_php5.c >
php_admin_flag engine on
php_admin_flag safe_mode off
php_admin_value open_basedir none
< /IfModule >


5. To complete the process, one needs to type the following two commands:

a. /etc/init.d/httpd stop
b. /etc/init.d/httpd start

Hit “Enter� after each command and you should be given an [ OK ] status in the command line.

Conclusion

This should solve your problem and if you have any comments, suggestions or improvements, please submit them.

]]> http://www.peeledcarrots.com/successfully-turning-off-php-safe-mode-removing-open_basedir-restrictions/feed/ 4 http://www.peeledcarrots.com/getting-to-grips-with-pear-quickform-and-smarty/ http://www.peeledcarrots.com/getting-to-grips-with-pear-quickform-and-smarty/#comments Thu, 26 Oct 2006 09:41:36 +0000 Stephen Blake http://soapbox.technovated.com/2006/10/26/getting-to-grips-with-pear-quickform-and-smarty/ Over the past few months, we have done a number of projects using the php Smarty package. Smarty is a fantastic templating engine which is quite easy to use and is extremely powerful. It also enforces the distinction between presentation logic and application logic and provides a great deal of flexibility when developing.

On our most recent project we decided to try and use the php PEAR Quickform module. This has also proved to be a easy to use, yet powerful form generator and processor.One thing which I think needs improving is that when forms are generated, the HTML templates are table based. I am sure that the developers of this package are trying to implement this feature on later realeases, but the package we are using doesn’t generate semantically correct HTML forms.

However, to overcome this sticking point, we combined the smarty and quickform packages to produce semantically correct HTML templates, which have validation and processing ability.

The form generation, validation form processing are extremely quick and provide an awesome amount of felxibility when it comes to both presentation and application logic.

It is truly awesome what can be acheived using open source code.
Go php!!!

For those of you who are intrested in learning about quickform and smarty-check these links out:

• Devarticle
• David Mintz
• Midnighthax
]]> http://www.peeledcarrots.com/getting-to-grips-with-pear-quickform-and-smarty/feed/ 2 http://www.peeledcarrots.com/the-value-of-semantically-correct-xhtml-without-using-tables/ http://www.peeledcarrots.com/the-value-of-semantically-correct-xhtml-without-using-tables/#comments Wed, 11 Oct 2006 10:25:57 +0000 Stephen Blake http://soapbox.technovated.com/2006/10/11/the-value-of-semantically-correct-xhtml-without-using-tables/ Ok, so I am going to use my revamping of the dating site as another topic for this post. As I identified in the previous post, we have inherited the code from a previous developer and are making improvements to the site.

The previous site was almost completely table based – yuck!! Dan Cederholm has a chapter in his book Web Standards Solutions, which is titled “Tables are evil?”. Now of course tables should be used when one is displaying tabular data, but in this case there is no tabular data on the site, maybe just some on the administrators CMS.

The “old” way of using tables for layouts is just so blotted and messy. Having tables within rows and doing styling within the code and not in the CSS, makes the site soooo difficult to manage and I am already seeing the benefits which the W3C have brought to website development.

So, some of the immediate benefits of not using tables, which I have been reminded of are the following:

• Much less code – which means smaller files – which in turn means less space on your web server
• Less code means less bandwidth and if you have a site with thousands of hits a day, this will have a huge impact on overall performance.
• The ability to access the site with portable devices-mobile phones, PDAs etc.
• It’s much easier to update layouts and styling via the CSS

I know that there are still loads of sites out there that are table based and which work perfectly. So I am not saying that it’s completely wrong to use them. It’s just that it’s so much easier not to use tables and there are lots of additional benefits which have become apparent in recent years.

]]> http://www.peeledcarrots.com/the-value-of-semantically-correct-xhtml-without-using-tables/feed/ 1